Browse Source
Light theme (data-theme="gitcitadel"): - bg: #f5f2fb (cool lavender canvas), bg-light: #ede8f5 - brand: #5c3d8f (deep grape-purple), accent: #7c5cbf - link: #5535a0 / hover #3d2278, focus-ring: #7c9eff Dark theme mirrors gitcitadel-online/static/css/main.css exactly: - bg: #1e1e1e / #2d2d2d, text: #f0f0f0 / #c0c0c0 - primary/link: #7c9eff, hover: #9bb3ff, visited: #a58fff (lavender-purple) unfold.yaml: theme_color/theme_bg_color updated; d_tag TODO removed. assets/theme/local/.gitignore: allow theme.css + theme-dark.css in this branch. Co-authored-by: Cursor <cursoragent@cursor.com>gitcitadel
4 changed files with 107 additions and 14 deletions
@ -1,2 +1,2 @@
@@ -1,2 +1,2 @@
|
||||
icons |
||||
theme.css |
||||
# theme.css and theme-dark.css are tracked in this branch (gitcitadel brand assets) |
||||
|
||||
@ -0,0 +1,75 @@
@@ -0,0 +1,75 @@
|
||||
/* |
||||
* GitCitadel dark color scheme. |
||||
* Loaded only when data-color-scheme="dark" and config theme_stylesheet_dark is set. |
||||
* Palette mirrors gitcitadel-online/static/css/main.css exactly: |
||||
* bg-primary #2d2d2d, bg-secondary #1e1e1e, accent #7c9eff, hover #9bb3ff, visited #a58fff. |
||||
*/ |
||||
html[data-color-scheme="dark"] { |
||||
/* Backgrounds */ |
||||
--color-bg: #1e1e1e; /* --bg-secondary from gitcitadel-online */ |
||||
--color-bg-light: #2d2d2d; /* --bg-primary */ |
||||
--color-bg-primary: #3a3a3a; /* Slightly lifted surface */ |
||||
/* Text */ |
||||
--color-text: #f0f0f0; /* --text-primary */ |
||||
--color-text-mid: #c0c0c0; /* --text-secondary */ |
||||
--color-text-contrast: #1e1e1e; |
||||
/* Accents — periwinkle/lavender from gitcitadel-online */ |
||||
--color-primary: #7c9eff; /* --accent-color / --link-color */ |
||||
--color-secondary: #9bb3ff; /* --link-hover */ |
||||
--color-primary-strong: #6b8bef; |
||||
--color-border: #404040; /* --border-color */ |
||||
--color-border-soft: #333333; |
||||
--color-text-light: var(--color-text-mid); |
||||
--color-footer-bg: #1e1e1e; |
||||
--color-footer-text: var(--color-text); |
||||
--color-footer-link: var(--color-primary); |
||||
--color-highlight-mark-fg: #1e1e1e; |
||||
--color-link: #7c9eff; |
||||
--color-link-hover: #9bb3ff; |
||||
--color-link-visited: #a58fff; /* --link-visited: lavender-purple */ |
||||
--color-focus-ring: #9bb3ff; |
||||
--color-shadow: color-mix(in srgb, #000 32%, transparent); |
||||
--brand-color: #f0f0f0; |
||||
--accent-color: var(--color-secondary); |
||||
--article-reading-pane-bg: color-mix(in srgb, var(--color-bg) 30%, var(--color-bg-light) 70%); |
||||
--article-reading-prose-color: color-mix(in srgb, var(--color-text-mid) 35%, var(--color-text) 65%); |
||||
} |
||||
|
||||
html[data-color-scheme="dark"] a:visited { |
||||
color: var(--color-link-visited); |
||||
} |
||||
|
||||
html[data-color-scheme="dark"] .article-main p, |
||||
html[data-color-scheme="dark"] .article-main ul, |
||||
html[data-color-scheme="dark"] .article-main ol, |
||||
html[data-color-scheme="dark"] .article-main li { |
||||
font-weight: 450; |
||||
} |
||||
|
||||
html[data-color-scheme="dark"] .home-aside-highlights__item-inner { |
||||
border-left: 2px solid var(--color-primary); |
||||
padding-left: 0.5rem; |
||||
background: color-mix(in srgb, var(--color-bg-light) 55%, transparent); |
||||
} |
||||
|
||||
html[data-color-scheme="dark"] .home-aside-highlights__quote { |
||||
color: #d8d4ee; |
||||
} |
||||
|
||||
html[data-color-scheme="dark"] .home-aside-highlights__item-inner:hover, |
||||
html[data-color-scheme="dark"] .home-aside-highlights__item-inner:has(.home-aside-highlights__hit:focus-visible) { |
||||
background: #3a3a3a; |
||||
} |
||||
|
||||
/* Reply toasts: override base article.css for dark. */ |
||||
html[data-color-scheme="dark"] .reply-toast--success { |
||||
border-color: #3a8a55; |
||||
background: color-mix(in srgb, var(--color-bg) 70%, #2f7a4b 30%); |
||||
color: var(--color-text); |
||||
} |
||||
|
||||
html[data-color-scheme="dark"] .reply-toast--error { |
||||
border-color: #b03030; |
||||
background: color-mix(in srgb, var(--color-bg) 70%, #a12b2b 30%); |
||||
color: var(--color-text); |
||||
} |
||||
@ -0,0 +1,20 @@
@@ -0,0 +1,20 @@
|
||||
/* |
||||
* GitCitadel light theme. |
||||
* Accent palette mirrors gitcitadel-online: periwinkle blue (#7c9eff) / lavender-purple (#a58fff). |
||||
* Light backgrounds use a cool lavender undertone; brand accent is a deep grape-purple. |
||||
*/ |
||||
[data-theme="gitcitadel"] { |
||||
--color-bg: #f5f2fb; /* Very light lavender canvas */ |
||||
--color-bg-light: #ede8f5; /* Soft lavender, slightly deeper */ |
||||
--color-text: #1a1530; /* Deep purple-navy — strong contrast */ |
||||
/* ≥4.5:1 on --color-bg and usable on --color-bg-light for secondary copy */ |
||||
--color-text-mid: #3d3458; |
||||
--color-text-contrast: #f5f2fb; |
||||
|
||||
--brand-color: #5c3d8f; /* Deep grape-purple */ |
||||
--accent-color: #7c5cbf; /* Medium violet (between brand and link) */ |
||||
--color-link: #5535a0; /* Periwinkle-to-violet (WCAG AA on light bg) */ |
||||
--color-link-hover: #3d2278; |
||||
--color-focus-ring: #7c9eff; /* Matches gitcitadel-online --focus-color */ |
||||
--color-shadow: color-mix(in srgb, var(--color-text) 10%, transparent); |
||||
} |
||||
Loading…
Reference in new issue