wehub-resource-sync
e30e75b5d4
Code Quality / Oxlint + Oxfmt (push) Waiting to run
Code Quality / Template Sync (push) Waiting to run
Code Quality / Build Changed Packages (push) Waiting to run
Code Quality / Test Changed Packages (push) Waiting to run
Deploy Expo Example / Deploy Production (push) Waiting to run
Deploy Ink Example / Deploy Production (push) Waiting to run
Python Tests / pytest (assistant-stream, 3.10) (push) Waiting to run
Python Tests / pytest (assistant-stream, 3.12) (push) Waiting to run
Python Tests / pytest (assistant-ui-sync-server-api, 3.10) (push) Waiting to run
Python Tests / pytest (assistant-ui-sync-server-api, 3.12) (push) Waiting to run
Deploy Shadcn Registry / Deploy Production (push) Waiting to run
Template Metrics / LOC + Bundle Size (push) Waiting to run
Changesets / Create Version PR (push) Has been cancelled
573 lines
14 KiB
CSS
573 lines
14 KiB
CSS
:root {
|
|
--docs-header-height: 48px;
|
|
}
|
|
|
|
#nd-docs-layout {
|
|
--fd-banner-height: var(--docs-header-height);
|
|
--fd-layout-width: 9999px;
|
|
}
|
|
|
|
html:has(#nd-docs-layout) {
|
|
scroll-padding-top: calc(var(--docs-header-height) + 6rem);
|
|
|
|
@media (min-width: 768px) {
|
|
scroll-padding-top: calc(var(--docs-header-height) + 2.5rem);
|
|
}
|
|
|
|
@media (min-width: 1280px) {
|
|
scroll-padding-top: calc(var(--docs-header-height) + 2rem);
|
|
}
|
|
}
|
|
|
|
@media (min-width: 1280px) {
|
|
#nd-page[data-full="true"] {
|
|
max-width: 70%;
|
|
justify-self: center;
|
|
}
|
|
}
|
|
|
|
/* When container is narrow (e.g. assistant panel open), use full width */
|
|
@container (max-width: 1200px) {
|
|
#nd-page[data-full="true"] {
|
|
max-width: 100%;
|
|
}
|
|
}
|
|
|
|
#nd-page[data-full="true"] ~ #nd-toc {
|
|
justify-self: start;
|
|
}
|
|
|
|
#nd-page {
|
|
padding-inline: 1rem !important;
|
|
padding-top: 1rem !important;
|
|
padding-bottom: 1.5rem !important;
|
|
}
|
|
|
|
/* When container is narrow, let content fill the column instead of capping at 900px */
|
|
@container (max-width: 1500px) {
|
|
#nd-page {
|
|
max-width: 100% !important;
|
|
}
|
|
}
|
|
|
|
#nd-toc > .sticky {
|
|
top: calc(var(--docs-header-height) + 1rem) !important;
|
|
}
|
|
|
|
#nd-sidebar {
|
|
--fd-background: transparent;
|
|
background: transparent !important;
|
|
border-inline-end: none !important;
|
|
}
|
|
|
|
:is(#nd-sidebar, #nd-sidebar-mobile) {
|
|
& :is(a, button):not([data-sidebar-control]):not(.sidebar-tabs-container *) {
|
|
padding-block: 0.375rem !important;
|
|
padding-inline-end: 0.625rem !important;
|
|
border-radius: 0.375rem !important;
|
|
font-size: 0.875rem !important;
|
|
background: transparent !important;
|
|
transition:
|
|
color 0.15s ease,
|
|
background-color 0.15s ease !important;
|
|
|
|
&:hover {
|
|
color: var(--fd-foreground) !important;
|
|
background: var(--fd-accent) !important;
|
|
}
|
|
}
|
|
|
|
& a[data-active="true"]:not(.sidebar-tabs-container *) {
|
|
color: var(--fd-foreground) !important;
|
|
font-weight: 500 !important;
|
|
background: var(--fd-accent) !important;
|
|
|
|
&::before {
|
|
display: none !important;
|
|
}
|
|
}
|
|
|
|
/* Sidebar separator */
|
|
& p.inline-flex {
|
|
margin-top: 1.5rem !important;
|
|
font-size: 0.75rem !important;
|
|
font-weight: 500 !important;
|
|
letter-spacing: 0 !important;
|
|
text-transform: none !important;
|
|
color: var(--fd-muted-foreground) !important;
|
|
|
|
&:first-child {
|
|
margin-top: 0 !important;
|
|
}
|
|
}
|
|
|
|
& svg:not(.sidebar-tabs-container *) {
|
|
width: 1rem !important;
|
|
height: 1rem !important;
|
|
opacity: 0.7;
|
|
flex-shrink: 0;
|
|
|
|
&[data-icon] {
|
|
width: 0.875rem !important;
|
|
height: 0.875rem !important;
|
|
}
|
|
}
|
|
|
|
& .border-t {
|
|
border-top: none !important;
|
|
}
|
|
}
|
|
|
|
/* Sidebar section tabs - tighten gap between tabs and page tree */
|
|
#nd-sidebar .sidebar-tabs-container {
|
|
margin-bottom: -0.25rem;
|
|
}
|
|
|
|
#nd-sidebar [class*="before:bg-fd-border"] {
|
|
--tw-border-opacity: 0.4;
|
|
}
|
|
|
|
#nd-subnav {
|
|
display: none !important;
|
|
}
|
|
|
|
#nd-sidebar-mobile {
|
|
display: none !important;
|
|
}
|
|
|
|
[data-toc-popover] {
|
|
width: 100vw !important;
|
|
margin-inline-start: calc(-1 * var(--fd-sidebar-width, 0px)) !important;
|
|
left: 0 !important;
|
|
|
|
& header {
|
|
border-bottom: none !important;
|
|
background: var(--fd-background) !important;
|
|
}
|
|
}
|
|
|
|
[data-toc-popover-trigger],
|
|
[data-toc-popover-content] {
|
|
padding-inline: 1rem !important;
|
|
}
|
|
|
|
@media (min-width: 768px) {
|
|
[data-toc-popover-trigger],
|
|
[data-toc-popover-content] {
|
|
padding-inline: 1.5rem !important;
|
|
}
|
|
}
|
|
|
|
[data-toc-popover-trigger] {
|
|
color: var(--fd-muted-foreground) !important;
|
|
font-size: 0.875rem !important;
|
|
|
|
& svg[role="progressbar"] {
|
|
display: none !important;
|
|
}
|
|
}
|
|
|
|
.prose {
|
|
font-size: 0.875rem !important;
|
|
line-height: 1.7 !important;
|
|
|
|
& :where(p):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
|
|
margin-top: 1.25rem !important;
|
|
margin-bottom: 1.25rem !important;
|
|
}
|
|
|
|
& :where(h2):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
|
|
font-size: 1.25rem !important;
|
|
font-weight: 500 !important;
|
|
letter-spacing: -0.02em !important;
|
|
margin-top: 2.5rem !important;
|
|
margin-bottom: 1rem !important;
|
|
line-height: 1.4 !important;
|
|
}
|
|
|
|
& :where(h3):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
|
|
font-size: 1rem !important;
|
|
font-weight: 500 !important;
|
|
letter-spacing: -0.01em !important;
|
|
margin-top: 2rem !important;
|
|
margin-bottom: 0.75rem !important;
|
|
line-height: 1.5 !important;
|
|
}
|
|
|
|
& :where(h4):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
|
|
font-size: 0.875rem !important;
|
|
font-weight: 600 !important;
|
|
margin-top: 1.5rem !important;
|
|
margin-bottom: 0.5rem !important;
|
|
line-height: 1.5 !important;
|
|
}
|
|
|
|
& :where(ul, ol):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
|
|
margin-top: 1rem !important;
|
|
margin-bottom: 1rem !important;
|
|
}
|
|
|
|
& :where(li):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
|
|
margin-top: 0.25rem !important;
|
|
margin-bottom: 0.25rem !important;
|
|
}
|
|
|
|
&
|
|
:where(code):not(:where(pre code)):not(
|
|
:where([class~="not-prose"], [class~="not-prose"] *)
|
|
) {
|
|
font-size: 0.8125rem !important;
|
|
padding: 0.125rem 0.375rem !important;
|
|
border-radius: 0.375rem !important;
|
|
border: none !important;
|
|
background: var(--muted) !important;
|
|
font-weight: 500 !important;
|
|
}
|
|
|
|
& [class~="not-prose"] :where(code):not(:where(pre code)) {
|
|
font-size: 0.75rem !important;
|
|
padding: 0.0625rem 0.25rem !important;
|
|
border-radius: 0.375rem !important;
|
|
border: none !important;
|
|
background: var(--muted) !important;
|
|
font-weight: 500 !important;
|
|
}
|
|
|
|
& :where(pre):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
|
|
margin-top: 1.25rem !important;
|
|
margin-bottom: 1.25rem !important;
|
|
border-radius: 0.5rem !important;
|
|
}
|
|
|
|
&
|
|
:where(blockquote):not(
|
|
:where([class~="not-prose"], [class~="not-prose"] *)
|
|
) {
|
|
font-style: normal !important;
|
|
font-weight: 400 !important;
|
|
color: var(--muted-foreground) !important;
|
|
margin-top: 1.25rem !important;
|
|
margin-bottom: 1.25rem !important;
|
|
padding-left: 1rem !important;
|
|
border-left-width: 2px !important;
|
|
border-left-color: var(--border) !important;
|
|
}
|
|
|
|
&
|
|
:where(a):not(:where([class~="not-prose"], [class~="not-prose"] *)):not(
|
|
[data-card]
|
|
) {
|
|
text-decoration: underline !important;
|
|
text-underline-offset: 2px !important;
|
|
text-decoration-color: var(--fd-muted-foreground) !important;
|
|
}
|
|
|
|
& :where(.prose-no-margin):has(table) {
|
|
margin-top: 0rem !important;
|
|
margin-bottom: 0rem !important;
|
|
}
|
|
|
|
& :where(table):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
|
|
margin-top: 0rem !important;
|
|
margin-bottom: 0rem !important;
|
|
width: 100% !important;
|
|
border-collapse: separate !important;
|
|
border-spacing: 0 !important;
|
|
background: var(--muted) !important;
|
|
border-radius: 0.75rem !important;
|
|
overflow: hidden !important;
|
|
|
|
& thead {
|
|
background: transparent !important;
|
|
}
|
|
|
|
& th {
|
|
padding: 0.5rem 0.75rem !important;
|
|
text-align: left !important;
|
|
font-weight: 500 !important;
|
|
color: var(--muted-foreground) !important;
|
|
border: none !important;
|
|
}
|
|
|
|
& td {
|
|
padding: 0.5rem 0.75rem !important;
|
|
border: none !important;
|
|
vertical-align: top !important;
|
|
}
|
|
|
|
& tr {
|
|
border: none !important;
|
|
}
|
|
|
|
& tbody tr {
|
|
background: var(--background) !important;
|
|
}
|
|
|
|
& tbody tr:first-child td:first-child {
|
|
border-top-left-radius: 0.5rem !important;
|
|
}
|
|
|
|
& tbody tr:first-child td:last-child {
|
|
border-top-right-radius: 0.5rem !important;
|
|
}
|
|
|
|
& tbody tr:last-child td:first-child {
|
|
border-bottom-left-radius: 0.5rem !important;
|
|
}
|
|
|
|
& tbody tr:last-child td:last-child {
|
|
border-bottom-right-radius: 0.5rem !important;
|
|
}
|
|
|
|
& code {
|
|
font-size: 0.75rem !important;
|
|
padding: 0.0625rem 0.25rem !important;
|
|
}
|
|
}
|
|
|
|
& :where(hr):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
|
|
margin-top: 2rem !important;
|
|
margin-bottom: 2rem !important;
|
|
border-color: var(--border) !important;
|
|
}
|
|
|
|
&
|
|
:where(h2 + p, h3 + p, h4 + p):not(
|
|
:where([class~="not-prose"], [class~="not-prose"] *)
|
|
) {
|
|
margin-top: 0 !important;
|
|
}
|
|
|
|
&
|
|
:where(h2 + ul, h3 + ul, h4 + ul, h2 + ol, h3 + ol, h4 + ol):not(
|
|
:where([class~="not-prose"], [class~="not-prose"] *)
|
|
) {
|
|
margin-top: 0.5rem !important;
|
|
}
|
|
|
|
& :where(img):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
|
|
margin-left: auto !important;
|
|
margin-right: auto !important;
|
|
border-radius: 0.75rem !important;
|
|
}
|
|
}
|
|
|
|
figure.shiki {
|
|
margin-top: 1.25rem !important;
|
|
margin-bottom: 1.25rem !important;
|
|
border-radius: 0.75rem !important;
|
|
border: 1px solid var(--border) !important;
|
|
box-shadow: none !important;
|
|
background: var(--background) !important;
|
|
overflow: hidden;
|
|
|
|
/* Header with title */
|
|
& > div:first-child:has(figcaption) {
|
|
height: 2.25rem !important;
|
|
padding-inline: 0.875rem !important;
|
|
border-bottom: none !important;
|
|
background: var(--background) !important;
|
|
}
|
|
|
|
& figcaption {
|
|
font-family: var(--font-mono), ui-monospace, monospace !important;
|
|
font-size: 0.8625rem !important;
|
|
font-weight: 500 !important;
|
|
color: var(--muted-foreground) !important;
|
|
}
|
|
|
|
/* Copy button position (no title) */
|
|
& > div:first-child:not(:has(figcaption)) {
|
|
top: 0.5rem !important;
|
|
right: 0.5rem !important;
|
|
}
|
|
|
|
/* Copy button */
|
|
& button[aria-label*="Copy"] {
|
|
width: 1.75rem !important;
|
|
height: 1.75rem !important;
|
|
padding: 0 !important;
|
|
border-radius: 0.375rem !important;
|
|
background: transparent !important;
|
|
color: var(--muted-foreground) !important;
|
|
opacity: 0.5;
|
|
transition: all 0.15s ease !important;
|
|
|
|
&:hover {
|
|
background: var(--background) !important;
|
|
color: var(--foreground) !important;
|
|
opacity: 1;
|
|
}
|
|
|
|
& svg {
|
|
width: 0.875rem !important;
|
|
height: 0.875rem !important;
|
|
}
|
|
}
|
|
|
|
&:hover button[aria-label*="Copy"] {
|
|
opacity: 1;
|
|
}
|
|
|
|
/* Code region */
|
|
& > div[role="region"] {
|
|
padding-top: 0.875rem !important;
|
|
padding-bottom: 0.875rem !important;
|
|
font-size: 0.8125rem !important;
|
|
line-height: 1.65 !important;
|
|
background: var(--muted) !important;
|
|
}
|
|
|
|
/* Code region top corners, when a title header sits above it */
|
|
&:has(figcaption) > div[role="region"] {
|
|
border-top-left-radius: 0.5rem !important;
|
|
border-top-right-radius: 0.5rem !important;
|
|
}
|
|
|
|
& pre {
|
|
--padding-left: 0.875rem !important;
|
|
--padding-right: 0.875rem !important;
|
|
}
|
|
|
|
/* Line numbers */
|
|
& [data-line-numbers] .line {
|
|
padding-left: calc(0.875rem + 2.25rem) !important;
|
|
}
|
|
|
|
/* Highlighted lines */
|
|
& .highlighted {
|
|
background: oklch(0.7 0.12 250 / 0.1) !important;
|
|
|
|
.dark & {
|
|
background: oklch(0.5 0.15 250 / 0.15) !important;
|
|
}
|
|
}
|
|
|
|
/* Diff styles */
|
|
& .diff.add {
|
|
background: oklch(0.85 0.12 145 / 0.2) !important;
|
|
|
|
.dark & {
|
|
background: oklch(0.45 0.12 145 / 0.2) !important;
|
|
}
|
|
}
|
|
|
|
& .diff.remove {
|
|
background: oklch(0.85 0.15 25 / 0.2) !important;
|
|
|
|
.dark & {
|
|
background: oklch(0.45 0.15 25 / 0.2) !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
/* Content inside tabs */
|
|
[role="tabpanel"] {
|
|
& > :first-child {
|
|
margin-top: 0 !important;
|
|
}
|
|
& > :last-child {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
}
|
|
|
|
[role="tabpanel"]:has(> figure.shiki:only-child) {
|
|
padding: 0 !important;
|
|
}
|
|
|
|
/* A Callout (or any not-prose block) inside a tab owns its own link styling.
|
|
The tab's [&_a] color/weight would otherwise bleed in, turning callout links
|
|
foreground-white and medium-weight. Let them inherit, like .prose does. */
|
|
[role="tabpanel"] :where([class~="not-prose"], [class~="not-prose"] *) a {
|
|
color: inherit;
|
|
font-weight: inherit;
|
|
}
|
|
|
|
/* Steps component */
|
|
.steps-container {
|
|
counter-reset: step;
|
|
}
|
|
|
|
.step-number {
|
|
counter-increment: step;
|
|
}
|
|
|
|
.step-number::before {
|
|
content: counter(step);
|
|
}
|
|
|
|
/* PreviewCode component - remove nested SampleFrame styling */
|
|
.preview-code-preview > .not-prose {
|
|
margin: 0 !important;
|
|
}
|
|
|
|
.preview-code-preview > .not-prose > div {
|
|
border: none !important;
|
|
border-radius: 0 !important;
|
|
height: auto !important;
|
|
}
|
|
|
|
.preview-code-block {
|
|
background: var(--muted) !important;
|
|
border-radius: 0.75rem !important;
|
|
border: none !important;
|
|
|
|
& pre {
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
background: transparent !important;
|
|
counter-reset: line !important;
|
|
}
|
|
|
|
& code {
|
|
display: block !important;
|
|
background: transparent !important;
|
|
}
|
|
|
|
/* Override Shiki theme background */
|
|
& .shiki {
|
|
background: transparent !important;
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
/* Dark mode: apply shiki-dark CSS variables */
|
|
:is(.dark *) & span {
|
|
color: var(--shiki-dark) !important;
|
|
font-style: var(--shiki-dark-font-style) !important;
|
|
font-weight: var(--shiki-dark-font-weight) !important;
|
|
text-decoration: var(--shiki-dark-text-decoration) !important;
|
|
}
|
|
|
|
& .line {
|
|
display: inline-block !important;
|
|
width: 100% !important;
|
|
padding-left: 2.5rem !important;
|
|
padding-right: 0.5rem !important;
|
|
position: relative !important;
|
|
}
|
|
|
|
& .line::before {
|
|
content: counter(line) !important;
|
|
counter-increment: line !important;
|
|
position: absolute !important;
|
|
left: 0.5rem !important;
|
|
width: 1.5rem !important;
|
|
text-align: right !important;
|
|
color: var(--muted-foreground) !important;
|
|
opacity: 0.5 !important;
|
|
font-size: 0.8125rem !important;
|
|
line-height: inherit !important;
|
|
user-select: none !important;
|
|
}
|
|
}
|
|
|
|
/* Override fumadocs line numbers to be right-aligned */
|
|
figure.shiki pre[data-line-numbers] span.line::after,
|
|
.shiki pre[data-line-numbers] span.line::after,
|
|
pre.shiki[data-line-numbers] span.line::after,
|
|
[data-line-numbers] span.line::after {
|
|
width: 1.5rem !important;
|
|
text-align: right !important;
|
|
left: 0.5rem !important;
|
|
}
|