feat: Light Mode mit Theme-Toggle

Fügt vollständigen Light Mode hinzu – umschaltbar per ☀️/🌙-Button
im Header, Auswahl wird in localStorage persistiert.

- index.css: Light-Mode-Variablen unter [data-theme="light"], neue Tokens --border-subtle, --shadow-card, --card-shine
- App.tsx: Theme-State + useEffect setzt data-theme auf <html>
- App.module.css: Toggle-Button gestylt, Header-Background auf CSS-Var umgestellt
- Komponenten-CSS: Hardcodierte rgba-Werte auf CSS-Variablen migriert

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Ronny
2026-04-06 12:50:04 +02:00
parent 2127ebceeb
commit f56ecb724b
8 changed files with 113 additions and 38 deletions
+3 -3
View File
@@ -40,7 +40,7 @@
font-size: 13px;
font-weight: 500;
cursor: pointer;
border: 1px solid rgba(255,255,255,0.1);
border: 1px solid var(--border-subtle);
background: transparent;
color: var(--text-secondary);
transition: all 0.15s;
@@ -58,7 +58,7 @@
flex-wrap: wrap;
gap: 6px;
padding: 4px 0;
border-top: 1px solid rgba(255,255,255,0.05);
border-top: 1px solid var(--border-subtle);
margin-top: -8px;
}
@@ -68,7 +68,7 @@
font-size: 12px;
font-weight: 600;
cursor: pointer;
border: 1px solid rgba(255,255,255,0.08);
border: 1px solid var(--border-subtle);
background: transparent;
color: var(--text-muted);
transition: all 0.15s;