| /* figures: integration */ | |
| /* namespace name builder (features/namespace.md, js/fig-integration.js) */ | |
| .md-typeset .nj-integration-ns { | |
| --nj-int-line: color-mix(in srgb, currentColor 30%, var(--md-default-bg-color)); | |
| display: block; | |
| width: auto; | |
| max-width: none; | |
| margin: 1.5rem 0; | |
| padding: .9rem 1rem; | |
| text-align: left; | |
| border: 1px solid var(--nj-int-line); | |
| border-radius: 8px; | |
| } | |
| .md-typeset .nj-integration-ns__strip { | |
| display: flex; | |
| flex-wrap: wrap; | |
| align-items: flex-start; | |
| gap: .5rem .15rem; | |
| } | |
| .md-typeset .nj-integration-ns__seg { | |
| display: inline-flex; | |
| flex-direction: column; | |
| align-items: center; | |
| min-width: 0; | |
| } | |
| .md-typeset .nj-integration-ns__seg code { | |
| padding: .25em .5em; | |
| border: 1.5px solid var(--nj-int-line); | |
| border-radius: 6px; | |
| background: var(--md-default-bg-color); | |
| color: var(--md-default-fg-color); | |
| font-size: .8rem; | |
| font-weight: 600; | |
| word-break: normal; | |
| } | |
| .md-typeset .nj-integration-ns__seg small { | |
| max-width: 10rem; | |
| margin-top: .25rem; | |
| color: var(--md-default-fg-color--light); | |
| font-size: .58rem; | |
| line-height: 1.25; | |
| text-align: center; | |
| overflow-wrap: anywhere; | |
| } | |
| .md-typeset .nj-integration-ns__seg--sep code { | |
| border-color: transparent; | |
| padding-inline: .1em; | |
| } | |
| .md-typeset .nj-integration-ns__seg--abi code { | |
| border-color: var(--md-typeset-a-color); | |
| background: color-mix(in srgb, var(--md-typeset-a-color) 12%, var(--md-default-bg-color)); | |
| color: var(--md-typeset-a-color); | |
| } | |
| .md-typeset .nj-integration-ns__seg--tag code { | |
| border-style: dashed; | |
| border-color: var(--md-typeset-a-color); | |
| color: var(--md-typeset-a-color); | |
| } | |
| .md-typeset .nj-integration-ns__seg--ver code { | |
| background: color-mix(in srgb, currentColor 8%, var(--md-default-bg-color)); | |
| } | |
| .md-typeset .nj-integration-ns figcaption { | |
| max-width: none; | |
| margin: .8rem 0 0; | |
| font-size: .75rem; | |
| text-align: left; | |
| color: var(--md-default-fg-color--light); | |
| } | |
| .md-typeset .nj-integration-ns__controls { | |
| margin-top: 1rem; | |
| padding-top: .8rem; | |
| border-top: 1px solid var(--nj-int-line); | |
| font-size: .7rem; | |
| } | |
| .md-typeset .nj-integration-ns__version select { | |
| min-height: 2rem; | |
| margin-left: .3rem; | |
| padding: 0 .4rem; | |
| border: 1px solid var(--nj-int-line); | |
| border-radius: 6px; | |
| background: var(--md-default-bg-color); | |
| color: var(--md-default-fg-color); | |
| font: inherit; | |
| } | |
| .md-typeset .nj-integration-ns__list { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fill, minmax(min(100%, 21rem), 1fr)); | |
| gap: 0 1rem; | |
| margin: .7rem 0 0; | |
| padding: 0; | |
| border: 0; | |
| } | |
| .md-typeset .nj-integration-ns__list legend { | |
| padding: 0; | |
| margin-bottom: .3rem; | |
| font-weight: 600; | |
| } | |
| .md-typeset .nj-integration-ns__opt { | |
| display: grid; | |
| grid-template-columns: 1.1rem 1fr; | |
| align-items: center; | |
| gap: 0 .55rem; | |
| min-height: 2.2rem; | |
| padding: .15rem 0; | |
| cursor: pointer; | |
| } | |
| .md-typeset .nj-integration-ns__meta { | |
| grid-column: 2; | |
| display: flex; | |
| flex-wrap: wrap; | |
| gap: 0 .45rem; | |
| } | |
| .md-typeset .nj-integration-ns__opt input { | |
| grid-row: 1 / span 2; | |
| width: 1.1rem; | |
| height: 1.1rem; | |
| margin: 0; | |
| accent-color: var(--md-typeset-a-color); | |
| } | |
| .md-typeset .nj-integration-ns__opt input:focus-visible { | |
| outline: 2px solid var(--md-accent-fg-color); | |
| outline-offset: 2px; | |
| } | |
| .md-typeset .nj-integration-ns__opt code { | |
| font-size: .64rem; | |
| overflow-wrap: anywhere; | |
| } | |
| .md-typeset .nj-integration-ns__hint { | |
| color: var(--md-typeset-a-color); | |
| font-family: var(--md-code-font-family); | |
| font-size: .64rem; | |
| } | |
| .md-typeset .nj-integration-ns__since { | |
| color: var(--md-default-fg-color--light); | |
| font-size: .6rem; | |
| } | |
| .md-typeset .nj-integration-ns__opt.is-unavailable { | |
| cursor: not-allowed; | |
| opacity: .5; | |
| } | |
| @media screen and (max-width: 44.984375em) { | |
| .md-typeset .nj-integration-ns__opt { | |
| min-height: 2.75rem; | |
| } | |
| } | |
| /* roadmap lanes and release timeline (scripts/figures/integration.py, release_timeline.py) */ | |
| .md-typeset svg.nj-fig--lanes { min-width: 44rem; max-width: 46rem; } | |
| .md-typeset svg.nj-fig--timeline { min-width: 44rem; max-width: 52rem; } | |
| .nj-fig .nj-int-lane { fill: color-mix(in srgb, var(--md-typeset-a-color) 10%, var(--md-default-bg-color)); stroke: var(--md-typeset-a-color); stroke-width: 1.5; } | |
| .nj-fig .nj-int-lane--future { fill: none; stroke-dasharray: 6 4; } | |
| .nj-fig .nj-int-lanetext { fill: var(--md-typeset-a-color); font-size: 15px; font-weight: 700; } | |
| .nj-fig .nj-int-text { fill: currentColor; font-size: 13px; } | |
| .nj-fig .nj-int-mute { fill: currentColor; fill-opacity: .7; font-size: 12.5px; } | |
| .nj-fig .nj-int-macro { fill: currentColor; font-family: var(--md-code-font-family), monospace; font-size: 12.5px; } | |
| .nj-fig .nj-int-val { fill: currentColor; font-family: var(--md-code-font-family), monospace; font-size: 13px; font-weight: 600; } | |
| .nj-fig .nj-int-row { fill: color-mix(in srgb, currentColor 4%, var(--md-default-bg-color)); } | |
| .nj-fig .nj-int-track { fill: color-mix(in srgb, currentColor 14%, var(--md-default-bg-color)); stroke: color-mix(in srgb, currentColor 45%, var(--md-default-bg-color)); stroke-width: 1.2; } | |
| .nj-fig .nj-int-track--on { fill: var(--md-typeset-a-color); stroke: var(--md-typeset-a-color); } | |
| .nj-fig .nj-int-knob { fill: var(--md-default-bg-color); stroke: color-mix(in srgb, currentColor 45%, var(--md-default-bg-color)); stroke-width: 1.2; } | |
| .nj-fig .nj-int-knob--on { stroke: var(--md-typeset-a-color); } | |
| .nj-fig .nj-int-axis { stroke: color-mix(in srgb, currentColor 45%, var(--md-default-bg-color)); stroke-width: 1.5; } | |
| .nj-fig .nj-int-grid { stroke: color-mix(in srgb, currentColor 14%, var(--md-default-bg-color)); stroke-width: 1; } | |
| .nj-fig .nj-int-minor { fill: var(--md-typeset-a-color); stroke: var(--md-default-bg-color); stroke-width: 1.5; } | |
| .nj-fig .nj-int-patch { fill: var(--md-default-bg-color); stroke: var(--md-typeset-a-color); stroke-width: 1.5; } | |
| .nj-fig .nj-int-major { fill: currentColor; fill-opacity: .7; font-size: 13px; font-weight: 600; } | |
| .nj-fig .nj-int-label { fill: currentColor; font-size: 12px; font-weight: 600; text-anchor: middle; } | |
| .nj-fig .nj-int-year { fill: currentColor; fill-opacity: .7; font-size: 12px; text-anchor: middle; } | |
| .nj-fig .nj-int-leader { stroke: color-mix(in srgb, currentColor 30%, var(--md-default-bg-color)); stroke-width: 1; } | |
| .nj-fig .nj-int-hit { fill: transparent; } | |
| /* roadmap: value pills (3.x default -> 4.0 value) */ | |
| .nj-fig .nj-int-pill { fill: color-mix(in srgb, currentColor 8%, var(--md-default-bg-color)); stroke: color-mix(in srgb, currentColor 35%, var(--md-default-bg-color)); stroke-width: 1.2; } | |
| .nj-fig .nj-int-pill--v4 { fill: var(--md-typeset-a-color); stroke: var(--md-typeset-a-color); } | |
| .nj-fig .nj-int-val--v4 { fill: var(--md-default-bg-color); } |