Light Mode: Kontrast-Fixes für Hero + Locations
User meldete schlechte Lesbarkeit im Light Mode. Probleme: 1. Hero-H1 Gradient (Gold→Weiß→Bordeaux) verschwand auf cremefarbenem Light-Background. Fix: Light-Mode-Override mit kräftigem Bordeaux→Dunkelrot Gradient (#8b1538 → #4a0e1a), ohne Text-Shadow. 2. Hero-Untertitel '.where' (Gold-Akzent) auf hellem BG zu blass. Fix: Light-Mode-Override mit Bordeaux. 3. Section-Titel-Akzentbalken (Gold→transparent) unsichtbar auf hellem BG. Fix: Light-Mode-Override mit Akzent→bg-3 Gradient + Opacity 0.7. 4. Location-Card Kategorie-Tags (Akzentfarbe auf hellem BG) teils grenzwertig. Fix: font-weight 700→800 + Light-Mode-Override mit color-mix 80% cat-color + 20% dunkelbraun für mehr Tiefe. Visuell verifiziert per Browser-Snapshot im Light Mode.
This commit is contained in:
+19
-1
@@ -196,6 +196,13 @@
|
||||
text-shadow: 0 0 40px rgba(212,160,23,0.3);
|
||||
line-height: 1;
|
||||
}
|
||||
[data-theme="light"] .hero h1 {
|
||||
background: linear-gradient(135deg, var(--bordeaux) 0%, #4a0e1a 100%);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
text-shadow: none;
|
||||
}
|
||||
.hero .sub {
|
||||
font-size: clamp(16px, 2.2vw, 22px);
|
||||
color: var(--text-strong);
|
||||
@@ -209,6 +216,9 @@
|
||||
margin: 8px 0 16px;
|
||||
font-weight: 700;
|
||||
}
|
||||
[data-theme="light"] .hero .where {
|
||||
color: var(--bordeaux);
|
||||
}
|
||||
.hero-meta {
|
||||
display: inline-flex;
|
||||
flex-wrap: wrap;
|
||||
@@ -249,6 +259,10 @@
|
||||
background: linear-gradient(90deg, var(--accent) 0%, transparent 100%);
|
||||
border-radius: 1px;
|
||||
}
|
||||
[data-theme="light"] .section-title .bar {
|
||||
background: linear-gradient(90deg, var(--accent) 0%, var(--bg-3) 80%);
|
||||
opacity: 0.7;
|
||||
}
|
||||
.section-subtitle {
|
||||
color: var(--text-muted);
|
||||
font-size: 14px;
|
||||
@@ -435,9 +449,13 @@
|
||||
color: var(--cat-color);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
font-weight: 700;
|
||||
font-weight: 800;
|
||||
margin-top: 1px;
|
||||
}
|
||||
[data-theme="light"] .loc-card .meta {
|
||||
/* Dunklere Variante der Akzentfarbe für besseren Kontrast auf hellem Card-Hintergrund */
|
||||
color: color-mix(in srgb, var(--cat-color) 80%, #1a0e0a);
|
||||
}
|
||||
.loc-card .addr {
|
||||
font-size: 13px;
|
||||
color: var(--text-muted);
|
||||
|
||||
Reference in New Issue
Block a user