ui: theme tokens split into light.css/dark.css linked via prefers-color-scheme; dark favicon variant; fix missing dark-mode tokens

2026-10-20 21:02:55 +00:00 · 2026-08-01 04:12:09 +02:00
parent 1f3e058484
commit 4d71433a6a
11 changed files with 115 additions and 73 deletions
@@ -0,0 +1,57 @@
+:root {
+  color-scheme: light;
+
+  /* accents */
+  --green: #1aad4b;
+  --green-glow: rgba(26, 173, 75, 0.7);
+  --yellow: #e5b400;
+  --red: #e5484d;
+  --ok-soft: #c7ecd3;
+  --ok-ink: #0a5c22;
+  --fail-soft: #ffd6d6;
+  --fail-ink: #9c0000;
+  --err: #a00;
+
+  /* surfaces */
+  --bg: #f2f2f2;
+  --card: #fafafa;
+  --surface: #fff;
+  --surface-muted: #e5e5e5;
+  --status-up-bg: #d9f2e0;
+  --status-degraded-bg: #fff3b8;
+  --status-down-bg: #2b2b2b;
+  --status-unknown-bg: #e4e4e4;
+  --down-chip-bg: #2a2a2a;
+  --down-chip-ink: #eee;
+  --down-chip-border: #555;
+  --dark-surface: #111;
+  --code-bg: #1a1d1a;
+  --code-ink: #e9f7ea;
+  --code-border: #2a2e2a;
+
+  /* text */
+  --ink: #111;
+  --ink-invert: #f2f2f2;
+  --muted: #777;
+  --muted-2: #888;
+  --muted-3: #999;
+  --muted-4: #555;
+  --muted-5: #bbb;
+  --muted-dot: #ccc;
+  --white: #fff;
+  --on-accent: #111;
+
+  /* lines & shadows */
+  --border-ink: #111;
+  --border: 2px solid var(--border-ink);
+  --border-muted: #bbb;
+  --shadow-color: #888;
+  --shadow: 0.35rem 0.35rem 0 var(--shadow-color);
+  --shadow-lg: 0.55rem 0.55rem 0 var(--shadow-color);
+  --overlay: rgba(0, 0, 0, 0.35);
+  --sheen: rgba(255, 255, 255, 0.75);
+  --sheen-strong: rgba(255, 255, 255, 0.9);
+
+  --radius: 0.5rem;
+  --mono: "JetBrains Mono", ui-monospace, "Cascadia Code", Menlo, monospace;
+}