rene/banyaro
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix: Dark-Mode CSS-Syntax korrigiert — html.dark + @media getrennt (SW by-v956)

Browse source 
Ungültige Syntax (@media..., html.dark kombiniert) aufgelöst.
Zwei separate valide Blöcke: html.dark{} für JS-Klasse, @media{} als Fallback.
This commit is contained in:
rene 2026-05-14 19:15:46 +02:00
parent 10964c6509
commit e610613b58
4 changed files with 46 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

2
backend/static/js/app.js
View file

@ -3,7 +3,7 @@
Router, State-Management, Navigation, Initialisierung.
============================================================ */
const APP_VER = '955'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
const APP_VER = '956'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
const APP_VERSION = '1.5.1'; // ← semantische Version, wird bei make release gesetzt
const IS_STAGING = location.hostname === 'staging.banyaro.app';
// Cache-Bust-Parameter nach Update-Reload sofort entfernen

74
backend/static/landing.html
View file

@ -605,7 +605,19 @@
.fade-up.visible { opacity: 1; transform: none; }
/* Dark Mode */
@media (prefers-color-scheme: dark), html.dark {
/* Dark-Mode via JS-Klasse (html.dark) — Fallback für macOS 26 / Brave */
html.dark {
--bg: #141210;
--surface: #1e1a16;
--text: #ede8e2;
--text-secondary:#a89880;
--text-muted: #6b5e50;
--border: #2e2620;
--primary-light: #3a2510;
color-scheme: dark;
}
/* Dark-Mode via Media Query (Standard-Browser-Fallback) */
@media (prefers-color-scheme: dark) {
:root {
--bg: #141210;
--surface: #1e1a16;
@ -616,37 +628,37 @@
--primary-light: #3a2510;
color-scheme: dark;
}
body { background: #141210 !important; color: #ede8e2 !important; }
nav { background: #1a1612 !important; border-color: #2e2620 !important; }
nav a { color: #a89880 !important; }
nav .nav-brand { color: #C4843A !important; }
section { background: #141210 !important; }
section:nth-child(even) { background: #1a1612 !important; }
#fuer-beide { background: #1a1612 !important; }
#funktionen { background: #1a1612 !important; }
#welpen { background: #1a1612 !important; }
#stimmen { background: #141210 !important; }
#zuechter { background: #1a1208 !important; }
#warum { background: #141210 !important; }
#vergleich { background: #1a1612 !important; }
#preise { background: #141210 !important; }
#ueber { background: #1a1612 !important; }
.outcome-card { background: #1e1a16 !important; border-color: #2e2620 !important; }
.feature-card { background: #1e1a16 !important; border-color: #2e2620 !important; }
.testimonial-card { background: #1e1a16 !important; border-color: #2e2620 !important; }
.pricing-card { background: #1e1a16 !important; border-color: #2e2620 !important; }
.pricing-card.featured { border-color: #C4843A !important; }
.audience-card > div { background: #1e1a16 !important; border-color: #2e2620 !important; }
.feature-group-label { background: #3a2510 !important; color: #C4843A !important; }
h2, h3 { color: #ede8e2 !important; }
p { color: #a89880; }
table { background: #1e1a16 !important; }
th { background: #C4843A !important; }
td { border-color: #2e2620 !important; color: #ede8e2 !important; }
tr:nth-child(even) td { background: #141210 !important; }
footer { background: #0d0b09 !important; }
.section-intro { color: #a89880 !important; }
}
html.dark body { background: #141210 !important; color: #ede8e2 !important; }
html.dark nav { background: #1a1612 !important; border-color: #2e2620 !important; }
html.dark nav a { color: #a89880 !important; }
html.dark nav .nav-brand { color: #C4843A !important; }
html.dark section { background: #141210 !important; }
html.dark section:nth-child(even) { background: #1a1612 !important; }
html.dark #fuer-beide { background: #1a1612 !important; }
html.dark #funktionen { background: #1a1612 !important; }
html.dark #welpen { background: #1a1612 !important; }
html.dark #stimmen { background: #141210 !important; }
html.dark #zuechter { background: #1a1208 !important; }
html.dark #warum { background: #141210 !important; }
html.dark #vergleich { background: #1a1612 !important; }
html.dark #preise { background: #141210 !important; }
html.dark #ueber { background: #1a1612 !important; }
html.dark .outcome-card { background: #1e1a16 !important; border-color: #2e2620 !important; }
html.dark .feature-card { background: #1e1a16 !important; border-color: #2e2620 !important; }
html.dark .testimonial-card{ background: #1e1a16 !important; border-color: #2e2620 !important; }
html.dark .pricing-card { background: #1e1a16 !important; border-color: #2e2620 !important; }
html.dark .pricing-card.featured { border-color: #C4843A !important; }
html.dark .audience-card > div { background: #1e1a16 !important; border-color: #2e2620 !important; }
html.dark .feature-group-label { background: #3a2510 !important; color: #C4843A !important; }
html.dark h2, html.dark h3 { color: #ede8e2 !important; }
html.dark p { color: #a89880; }
html.dark table { background: #1e1a16 !important; }
html.dark th { background: #C4843A !important; }
html.dark td { border-color: #2e2620 !important; color: #ede8e2 !important; }
html.dark tr:nth-child(even) td { background: #141210 !important; }
html.dark footer { background: #0d0b09 !important; }
html.dark .section-intro { color: #a89880 !important; }
</style>
</head>
<body>

2
backend/static/sw.js
View file

@ -3,7 +3,7 @@
Offline-Cache + Push Notifications + Tile-Cache
============================================================ */
const CACHE_VERSION = 'by-v955';
const CACHE_VERSION = 'by-v956';
const CACHE_STATIC = `${CACHE_VERSION}-static`;
const CACHE_TILES = 'ban-yaro-tiles-v1'; // bleibt über SW-Updates erhalten
const CACHE_API = 'ban-yaro-api-v1'; // API-Response-Cache