mirror of
https://github.com/litruv/Docs-Viewer.git
synced 2026-09-10 10:09:46 +10:00
litruv
10e9f7ac2f
Replace the classic DOM shell with slate widgets, markdown→slate rendering, and a CI index build that uses build-docs.cjs.
90 lines
1.9 KiB
CSS
90 lines
1.9 KiB
CSS
/* Article / highlight extras for docs-viewer (import alongside the viewer). */
|
|
|
|
.md-collapse {
|
|
margin: 0;
|
|
}
|
|
|
|
/* Depth rhythm for nested heading collapses (OG markdown-content h2/h3). */
|
|
.md-collapse[data-heading="3"] .slate-collapse-header {
|
|
margin: 2rem 0 0.75rem;
|
|
}
|
|
|
|
.md-collapse[data-heading="3"] .slate-collapse-title-text {
|
|
font-size: 1.5rem;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.md-collapse[data-heading="4"] .slate-collapse-header,
|
|
.md-collapse[data-heading="5"] .slate-collapse-header,
|
|
.md-collapse[data-heading="6"] .slate-collapse-header {
|
|
margin: 1.5rem 0 0.5rem;
|
|
}
|
|
|
|
.md-collapse[data-heading="4"] .slate-collapse-title-text,
|
|
.md-collapse[data-heading="5"] .slate-collapse-title-text,
|
|
.md-collapse[data-heading="6"] .slate-collapse-title-text {
|
|
font-size: 1.15rem;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.md-heading-flash {
|
|
animation: docs-heading-flash 1.1s ease;
|
|
}
|
|
|
|
@keyframes docs-heading-flash {
|
|
0% {
|
|
background: color-mix(in srgb, var(--accent, #2196f3) 35%, transparent);
|
|
}
|
|
100% {
|
|
background: transparent;
|
|
}
|
|
}
|
|
|
|
/* highlight.js-ish tokens (minimal, theme via currentColor) */
|
|
.hljs {
|
|
color: inherit;
|
|
background: transparent;
|
|
}
|
|
.hljs-comment,
|
|
.hljs-quote {
|
|
opacity: 0.55;
|
|
font-style: italic;
|
|
}
|
|
.hljs-keyword,
|
|
.hljs-selector-tag,
|
|
.hljs-built_in,
|
|
.hljs-name,
|
|
.hljs-tag {
|
|
color: var(--docs-syntax-keyword, #c6a0f6);
|
|
}
|
|
.hljs-string,
|
|
.hljs-title,
|
|
.hljs-section,
|
|
.hljs-attribute,
|
|
.hljs-literal,
|
|
.hljs-template-tag,
|
|
.hljs-template-variable,
|
|
.hljs-type,
|
|
.hljs-addition {
|
|
color: var(--docs-syntax-string, #a6da95);
|
|
}
|
|
.hljs-deletion,
|
|
.hljs-selector-attr,
|
|
.hljs-selector-pseudo,
|
|
.hljs-meta {
|
|
color: var(--docs-syntax-meta, #ed8796);
|
|
}
|
|
.hljs-doctag,
|
|
.hljs-number,
|
|
.hljs-regexp {
|
|
color: var(--docs-syntax-number, #f5a97f);
|
|
}
|
|
.hljs-symbol,
|
|
.hljs-variable,
|
|
.hljs-template-variable,
|
|
.hljs-link,
|
|
.hljs-selector-id,
|
|
.hljs-selector-class {
|
|
color: var(--docs-syntax-symbol, #8aadf4);
|
|
}
|