From bf27c9ccdce93c900a6231632f4e3c116be1512e Mon Sep 17 00:00:00 2001 From: AliceDarkest Date: Mon, 29 Jun 2026 19:43:14 +0200 Subject: [PATCH] Fix: Login-Overlay im Light-Mode lesbar (Orange-Panel statt weiss-auf-weiss) Das Overlay nutzt im Dark-Mode dunkle Surface-Toene mit Glow. Im Light-Mode sind diese weiss -> das rechte Panel verschwand (weiss auf weiss). Per [data-theme="light"]-Overrides bekommt es jetzt ein kraeftiges Orange-Panel (accent-2 -> accent) mit weissem Text, Emblem und Ghost-Button. Dark-Mode bleibt unveraendert. Co-Authored-By: Claude Opus 4.8 (1M context) --- CHANGELOG.md | 1 + src/main/resources/static/css/auth.css | 15 +++++++++++++++ 2 files changed, 16 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 39bed26..8ef191c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -26,6 +26,7 @@ Konto-Löschung sowie ein app-weiter Farb-Relaunch auf das ### Behoben - **Konto-Löschung repariert:** „Profil löschen" warf einen 500er (fehlendes `@Transactional` bei einer abgeleiteten Delete-Query) und löschte nichts. Jetzt werden Konto **plus** Spielstände, Achievements und Profilbild-Datei in einer Transaktion entfernt — erfüllt die in der Datenschutzerklärung zugesicherte Löschung (Art. 17 DSGVO). - Impressum-„Zurück"-Link loggte eingeloggte Nutzer scheinbar aus; jetzt login-abhängig (eingeloggt → Dashboard, sonst → Startseite). Gleiche Logik auf den Rechtsseiten. +- Login-Overlay im **Light-Mode** war weiß-auf-weiß/verwaschen; jetzt kräftiges Orange-Panel mit weißem Text (Dark-Mode unverändert). ### Sicherheit - Neue Rechtsseiten öffentlich erreichbar (`permitAll` für `/impressum`, `/nutzungsbedingungen`, `/datenschutz`, `/richtlinien`). diff --git a/src/main/resources/static/css/auth.css b/src/main/resources/static/css/auth.css index 7888cd3..04c3266 100644 --- a/src/main/resources/static/css/auth.css +++ b/src/main/resources/static/css/auth.css @@ -110,6 +110,21 @@ } .ghost-btn:hover { transform:translateY(-2px); background:var(--surface-2); box-shadow:0 0 22px var(--glow-s); } +/* ---- Light-Mode: Overlay als kräftiges Orange-Panel mit weißem Text ---- + (im Dark-Mode ist das Overlay ein dunkles Panel mit Glow; im Light-Mode + wären die Surface-Töne weiß -> Panel verschwände. Daher hier farbig.) */ +[data-theme="light"] .overlay { + background: + radial-gradient(600px 340px at 28% 6%, rgba(255,255,255,.18), transparent 60%), + linear-gradient(150deg, var(--accent-2), var(--accent) 48%); +} +[data-theme="light"] .overlay-panel { color:#fff; } +[data-theme="light"] .overlay-panel h3 { color:#fff; text-shadow:0 1px 12px rgba(0,0,0,.22); } +[data-theme="light"] .overlay-panel p { color:#fff; opacity:.96; } +[data-theme="light"] .overlay-panel .o-emblem { background:#fff; filter:drop-shadow(0 0 10px rgba(0,0,0,.25)); } +[data-theme="light"] .ghost-btn { color:#fff; border-color:rgba(255,255,255,.9); box-shadow:none; } +[data-theme="light"] .ghost-btn:hover { background:rgba(255,255,255,.18); box-shadow:none; } + .mobile-switch { display:none; text-align:center; margin-top:1.2rem; color:var(--muted); font-size:.84rem; } .mobile-switch a { color:var(--accent); font-weight:700; text-decoration:none; cursor:pointer; }