Lagebild: Tab-Navigation wiederhergestellt (Revert Scroll-Narrative)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Dieser Commit ist enthalten in:
Claude Code
2026-03-07 16:05:00 +01:00
Ursprung 06c99fe4db
Commit 15f076b06f
3 geänderte Dateien mit 301 neuen und 164 gelöschten Zeilen

Datei anzeigen

@@ -66,22 +66,28 @@
</div>
</section>
<!-- Control Bar: Timeline + Section Nav -->
<div class="control-bar" id="control-bar">
<!-- Control Bar: Timeline + Tabs -->
<div class="control-bar">
<div class="container">
<div class="timeline-wrapper">
<div class="timeline-strip" id="timeline-strip"></div>
<div class="timeline-dropdown" id="timeline-dropdown"></div>
</div>
</div>
<div class="tab-nav" id="tab-nav">
<button class="tab-btn active" data-tab="lagebild">Lagebild</button>
<button class="tab-btn" data-tab="quellen">Quellen <span class="tab-badge" id="tab-badge-quellen"></span></button>
<button class="tab-btn" data-tab="karte">Karte</button>
<button class="tab-btn" data-tab="faktenchecks">Faktenchecks <span class="tab-badge" id="tab-badge-faktenchecks"></span></button>
</div>
</div>
</div>
<!-- Main Content: All sections visible (Scroll-Narrative) -->
<!-- Main Content -->
<main class="lagebild-main">
<!-- Section: Lagebild -->
<div class="container">
<section id="section-lagebild" class="content-section">
<div class="content-card">
<!-- Tab: Lagebild -->
<div class="tab-panel active" id="panel-lagebild">
<section class="content-card">
<div class="card-header">
<h2 id="lagebild-date-title">Lagebild</h2>
<span class="card-timestamp" id="lagebild-timestamp"></span>
@@ -94,43 +100,49 @@
</div>
</div>
<div class="card-footer" id="inline-sources"></div>
</div>
</section>
</div>
<!-- Section: Karte (full-width) -->
<section id="section-karte" class="content-section section-karte">
<div class="container">
<div class="section-heading">
<h2>Karte</h2>
<p class="section-description">Geografische Einordnung der Meldungen</p>
</div>
</section>
</div>
<div id="map-container"></div>
</section>
<!-- Section: Faktenchecks -->
<div class="container">
<section id="section-faktenchecks" class="content-section">
<div class="content-card">
<!-- Tab: Quellen -->
<div class="tab-panel" id="panel-quellen">
<section class="content-card">
<div class="card-header">
<h2>Quellen &amp; Quellenberichte</h2>
<p class="card-description">Alle vom AegisSight Monitor aggregierten Quellen und Artikel</p>
</div>
<div class="card-body">
<div id="sources-cited" class="sources-section"></div>
<h3 class="section-subtitle" id="articles-heading">Alle Artikel</h3>
<div id="articles-content"></div>
</div>
</section>
</div>
<!-- Tab: Karte -->
<div class="tab-panel" id="panel-karte">
<section class="content-card">
<div class="card-header">
<h2>Karte</h2>
<p class="card-description">Geografische Einordnung der Meldungen</p>
</div>
<div class="card-body">
<div id="map-container" style="height:500px;border-radius:4px;overflow:hidden;"></div>
</div>
</section>
</div>
<!-- Tab: Faktenchecks -->
<div class="tab-panel" id="panel-faktenchecks">
<section class="content-card">
<div class="card-header">
<h2>Faktenchecks</h2>
<p class="card-description">KI-gestützte Verifizierung aller zentralen Aussagen gegen unabhängige Quellen</p>
</div>
<div class="card-body" id="factchecks-content"></div>
</div>
</section>
</section>
</div>
<!-- Section: Artikel -->
<section id="section-artikel" class="content-section">
<div class="content-card">
<div class="card-header">
<h2 id="articles-heading">Artikel</h2>
<p class="card-description">Alle vom AegisSight Monitor aggregierten Artikel</p>
</div>
<div class="card-body" id="articles-content"></div>
</div>
</section>
<!-- CTA -->
</div>
</main>
@@ -174,4 +186,4 @@
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script src="lagebild.js"></script>
</body>
</html>
</html>