feat: Stats-Bar ueber Karussell, Pfeil-Navigation, Count-Up

- Stats (Artikel/Quellen/Faktenchecks) als prominente Bar ueber dem
  Karussell mit Count-Up-Animation und gruener Live-Pulse-Anzeige
- Pfeil-Buttons links/rechts fuer Karussell-Navigation
- Text-Card breiter (860px)
- Stats nicht mehr in der Card

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Dieser Commit ist enthalten in:
Claude Code
2026-04-06 18:39:28 +02:00
Ursprung 128d26056d
Commit 747ea0f5e4
3 geänderte Dateien mit 64 neuen und 25 gelöschten Zeilen

Datei anzeigen

@@ -112,31 +112,36 @@
<h2 class="section-title">Sehen Sie den Monitor in Aktion</h2>
<p class="section-subtitle">Echte Lagebilder, erstellt vom AegisSight Monitor. Live und ohne Bearbeitung.</p>
<!-- Live Stats Bar -->
<div class="live-stats-bar">
<div class="live-stat">
<span class="live-stat-value" id="stat-articles">...</span>
<span class="live-stat-label">Artikel</span>
</div>
<div class="live-stat">
<span class="live-stat-value" id="stat-sources">...</span>
<span class="live-stat-label">Quellen</span>
</div>
<div class="live-stat">
<span class="live-stat-value" id="stat-factchecks">...</span>
<span class="live-stat-label">Faktenchecks</span>
</div>
<div class="live-stat-updated" id="demo-updated">Daten werden geladen...</div>
</div>
<!-- 3D Carousel -->
<div class="carousel-viewport">
<button class="carousel-arrow carousel-prev" aria-label="Vorherige Lage">&#8249;</button>
<button class="carousel-arrow carousel-next" aria-label="Nächste Lage">&#8250;</button>
<div class="carousel-track" id="carousel">
<!-- Iran Card -->
<div class="carousel-card card-live active" data-index="0">
<div class="demo-badge">LIVE</div>
<h3 class="demo-title">Iran-Konflikt</h3>
<div class="demo-stats" id="demo-stats-iran">
<div class="demo-stat">
<span class="stat-value" id="stat-articles">...</span>
<span class="stat-label">Artikel</span>
</div>
<div class="demo-stat">
<span class="stat-value" id="stat-sources">...</span>
<span class="stat-label">Quellen</span>
</div>
<div class="demo-stat">
<span class="stat-value" id="stat-factchecks">...</span>
<span class="stat-label">Faktenchecks</span>
</div>
</div>
<div class="demo-excerpt" id="demo-excerpt">
<div class="excerpt-text" id="excerpt-text">Lagebild wird geladen...</div>
</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>
</div>
<!-- Placeholder 2 -->