mAi
a221367c46
Architektur: - shared/theme.js — Logik (data-theme attr auf <html>, localStorage, prefers-color-scheme fallback, data-theme-lock opt-out) - shared/toggles.js — fixed top-right Pill mit Sun/Moon SVG + DE/EN Button (auto-injected, hängt sich an i18n.js's [data-i18n-toggle] Pattern) - shared/css/theme.css — neutrale Light-Defaults (cream bg, AA-konforme grays) - templates/base.html — Anti-FOUC inline IIFE im <head>, theme.css linked vor inline <style>, scripts in body - tools/contrast-audit.py — neue --light/--dark/--both Modi, parsed [data-theme="light"] + shared fallback Pilot auf 4 Sites: - ichbinotto.de (Octopus rot/teal) - paragraphenraiter.de (Gold) - kilitaer.de (Olive) - deinesei.de (Indigo) Audit-Ergebnis: - Dark mode: 0/59 Verstöße (regression-frei) - Light mode: 14/59 Sites brauchen per-site overrides für sub-AA Akzent-Vars (Shift-2 follow-up) Out of Scope (Shift-2): - Rollout auf restliche 55 Sites - Per-Site Light-Palette-Verfeinerung wo neutral-Default nicht trägt - Per-Site Opt-Out (data-theme-lock) für aesthetisch dark-only Satire-Sites Design-Doc: docs/plans/theme-toggle.md
30 lines
830 B
CSS
30 lines
830 B
CSS
/*
|
|
* Onepager neutral light-mode defaults.
|
|
*
|
|
* Linked into every site via <link rel="stylesheet" href="/shared/css/theme.css">
|
|
* BEFORE the per-site <style> block, so site-specific [data-theme="light"]
|
|
* overrides win on cascade.
|
|
*
|
|
* Variables targeted are the common set used across templates and custom sites.
|
|
* Sites with custom palettes (gold, olive, octopus, etc.) supply their own
|
|
* [data-theme="light"] block to override these defaults.
|
|
*/
|
|
[data-theme="light"] {
|
|
--bg: #faf9f6;
|
|
--bg-elevated: #ffffff;
|
|
--bg-card: #ffffff;
|
|
--bg-surface: #ffffff;
|
|
--text: #1a1a1a;
|
|
--text-dim: #4a4a4a;
|
|
--text-dimmed: #4a4a4a;
|
|
--text-muted: #6b6b6b; /* AA on white: 4.85:1 */
|
|
--text-secondary: #4a4a4a;
|
|
--border: rgba(0, 0, 0, 0.08);
|
|
|
|
color-scheme: light;
|
|
}
|
|
|
|
[data-theme="dark"] {
|
|
color-scheme: dark;
|
|
}
|