Files
aliasvault/docs/src/css/custom.css
2026-06-18 10:02:00 +02:00

74 lines
2.4 KiB
CSS

/**
* AliasVault documentation theme.
*
* Identity is shared with the main website and the aliasvault.client web app:
* - Primary colour ramp: orange (#f49541 / #d68338), matching
* tailwind.config.js `primary` in AliasVault.Client.
* - Typography: Inter.
* - Dark mode by default, on the same gray-800/900 surfaces as the app.
*/
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');
:root {
--ifm-color-primary: #d68338;
--ifm-color-primary-dark: #c5762f;
--ifm-color-primary-darker: #b8702f;
--ifm-color-primary-darkest: #9a5d26;
--ifm-color-primary-light: #f49541;
--ifm-color-primary-lighter: #f6a752;
--ifm-color-primary-lightest: #f8b963;
--ifm-font-family-base: 'Inter', ui-sans-serif, system-ui, -apple-system,
'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif,
'Apple Color Emoji', 'Segoe UI Emoji';
--ifm-font-family-monospace: ui-monospace, SFMono-Regular, Menlo, Monaco,
Consolas, 'Liberation Mono', 'Courier New', monospace;
--ifm-code-font-size: 92%;
--ifm-heading-font-weight: 700;
--ifm-navbar-link-hover-color: var(--ifm-color-primary-light);
--docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
/* Wider overall layout than the old just-the-docs theme. */
--ifm-container-width-xl: 1520px;
}
/* Dark mode — orange links stay bright, surfaces match the app. */
[data-theme='dark'] {
--ifm-color-primary: #f49541;
--ifm-color-primary-dark: #f2882a;
--ifm-color-primary-darker: #d68338;
--ifm-color-primary-darkest: #b8702f;
--ifm-color-primary-light: #f6a752;
--ifm-color-primary-lighter: #f8b963;
--ifm-color-primary-lightest: #fbcb74;
--ifm-background-color: #1f2937;
--ifm-background-surface-color: #111827;
--ifm-navbar-background-color: #111827;
--ifm-footer-background-color: #0b1220;
--ifm-color-content-secondary: #d1d5db;
--ifm-toc-border-color: #374151;
--ifm-table-border-color: #374151;
--docusaurus-highlighted-code-line-bg: rgba(255, 255, 255, 0.08);
}
[data-theme='dark'] .menu {
background-color: var(--ifm-background-surface-color);
}
/* Slightly roomier reading column on large screens. */
@media (min-width: 997px) {
.theme-doc-markdown {
max-width: 100%;
}
}
.navbar__title {
font-weight: 700;
}
/* Code-copy and admonitions inherit the brand accent automatically via
--ifm-color-primary, so no per-component overrides are needed. */