fix: Breitere Lagen-Card, Map-Zoom, gemischte Sektionsübergänge

- Iran-Card deutlich breiter (720px), voller Lagebild-Text mit Überschriften
- Weiterlesen-Button entfernt, gesamter Inhalt sichtbar
- Mausrad-Zoom auf Leaflet-Karte aktiviert
- Sektionsübergänge: Chevron (Hero), Gradient-Fades, Diagonale Schnitte
  statt einheitlicher Wellen

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Dieser Commit ist enthalten in:
Claude Code
2026-04-06 18:26:59 +02:00
Ursprung 9c5ce933fb
Commit bfc545abda
3 geänderte Dateien mit 34 neuen und 44 gelöschten Zeilen

Datei anzeigen

@@ -101,9 +101,9 @@
</div>
</section>
<!-- Wave: Hero -> Demos -->
<div class="wave-divider wave-dark-to-light">
<svg viewBox="0 0 1440 80" preserveAspectRatio="none"><path d="M0,40 C360,80 720,0 1080,40 C1260,60 1380,50 1440,40 L1440,0 L0,0 Z" fill="#0A1832"/></svg>
<!-- Chevron: Hero -> Demos -->
<div class="divider divider-chevron">
<svg viewBox="0 0 1440 80" preserveAspectRatio="none"><path d="M0,0 L720,80 L1440,0 L1440,0 L0,0 Z" fill="#0A1832"/></svg>
</div>
<!-- Live Demos / Showcase -->
@@ -135,7 +135,6 @@
</div>
<div class="demo-excerpt" id="demo-excerpt">
<div class="excerpt-text" id="excerpt-text">Lagebild wird geladen...</div>
<button class="excerpt-toggle" id="excerpt-toggle" style="display:none">Weiterlesen</button>
</div>
<div class="demo-updated" id="demo-updated">Daten werden geladen...</div>
<a href="/lagen/iran-konflikt/" class="btn btn-primary btn-block">Vollständiges Lagebild öffnen</a>
@@ -147,7 +146,7 @@
<p class="placeholder-text">In Vorbereitung</p>
</div>
<!-- Placeholder 3 -->
<div class="carousel-card card-placeholder" data-index="2"data-index="1">
<div class="carousel-card card-placeholder" data-index="2">
<div class="demo-badge badge-soon">Demnächst</div>
<h3 class="demo-title placeholder-title">Weitere Lage</h3>
<p class="placeholder-text">In Vorbereitung</p>
@@ -168,10 +167,8 @@
</div>
</section>
<!-- Wave: Demos -> Problem -->
<div class="wave-divider wave-alt-to-base">
<svg viewBox="0 0 1440 60" preserveAspectRatio="none"><path d="M0,0 C480,60 960,0 1440,30 L1440,60 L0,60 Z" fill="#F0F3F7"/></svg>
</div>
<!-- Gradient: Demos -> Problem -->
<div class="divider divider-gradient-alt-to-base"></div>
<!-- Problem Statement -->
<section class="section section-base" id="problem">
@@ -203,9 +200,9 @@
</div>
</section>
<!-- Wave: Problem -> Solution -->
<div class="wave-divider wave-base-to-alt">
<svg viewBox="0 0 1440 60" preserveAspectRatio="none"><path d="M0,30 C360,0 720,60 1080,20 C1260,5 1380,15 1440,30 L1440,60 L0,60 Z" fill="#F0F3F7"/></svg>
<!-- Diagonal: Problem -> Solution -->
<div class="divider divider-diagonal">
<svg viewBox="0 0 1440 60" preserveAspectRatio="none"><path d="M0,60 L1440,0 L1440,60 Z" fill="#F0F3F7"/></svg>
</div>
<!-- Solution / Workflow -->
@@ -234,10 +231,8 @@
</div>
</section>
<!-- Wave: Solution -> Features -->
<div class="wave-divider wave-alt-to-base">
<svg viewBox="0 0 1440 60" preserveAspectRatio="none"><path d="M0,20 C240,60 480,0 720,40 C960,60 1200,10 1440,30 L1440,60 L0,60 Z" fill="#F0F3F7"/></svg>
</div>
<!-- Gradient: Solution -> Features -->
<div class="divider divider-gradient-alt-to-base"></div>
<!-- Features -->
<section class="section section-base" id="features">
@@ -290,9 +285,9 @@
</div>
</section>
<!-- Wave: Features -> Trust -->
<div class="wave-divider wave-base-to-dark">
<svg viewBox="0 0 1440 80" preserveAspectRatio="none"><path d="M0,40 C480,80 960,0 1440,50 L1440,80 L0,80 Z" fill="#0A1832"/></svg>
<!-- Diagonal: Features -> Trust -->
<div class="divider divider-diagonal-dark">
<svg viewBox="0 0 1440 60" preserveAspectRatio="none"><path d="M0,60 L1440,0 L1440,60 Z" fill="#0A1832"/></svg>
</div>
<!-- Trust / Unser Versprechen -->
@@ -332,10 +327,8 @@
</div>
</section>
<!-- Wave: Trust -> CTA -->
<div class="wave-divider wave-dark-to-base">
<svg viewBox="0 0 1440 60" preserveAspectRatio="none"><path d="M0,0 C360,50 720,10 1080,40 C1260,55 1380,30 1440,20 L1440,60 L0,60 Z" fill="#0A1832"/></svg>
</div>
<!-- Gradient: Trust -> CTA -->
<div class="divider divider-gradient-dark-to-base"></div>
<!-- Contact CTA -->
<section class="section section-base" id="contact">