Revert "Ereignis-Timeline: Lagebericht-Stempel zusammenfassen, Bar-Cap entfernen"

This reverts commit cae9c5467a.

src/static/css/style.css

@@ -2691,22 +2691,16 @@ a.dev-source-pill:hover {
     height: 4px;
     background: var(--border);
 }
-/* Bar mit Lagebericht im gleichen Bucket: dezente goldene Top-Linie auf der Fuellung */
+.ht-bar-snap-cap {
-.ht-bar.has-snapshot .ht-bar-fill::before {
-    content: '';
     position: absolute;
-    top: 0;
+    top: -8px;
-    left: 0;
+    left: -2px;
-    right: 0;
+    right: -2px;
-    height: 3px;
+    height: 6px;
     background: var(--accent);
-    border-radius: 2px 2px 0 0;
+    border-radius: 2px;
+    box-shadow: var(--glow-accent);
 }
-.ht-bar.has-snapshot.snapshot-only .ht-bar-fill::before {
-    /* Nur Snapshot, keine Artikel: kleiner goldener Strich auf Achse */
-    height: 4px;
-}
-.ht-bar-fill { position: relative; }
 .ht-bars:has(.ht-bar.active) .ht-bar:not(.active) { opacity: 0.45; }
 
 /* Aktiver Bar: dezenter Marker oben */
@@ -2839,24 +2833,17 @@ a.dev-source-pill:hover {
     bottom: -7px;
     left: 50%;
     transform: translateX(-50%);
-    min-width: 14px;
+    width: 14px;
     height: 14px;
-    padding: 0 2px;
     background: var(--bg-card);
     border: 1px solid var(--accent);
-    border-radius: 7px;
+    border-radius: 50%;
     color: var(--accent);
     display: flex;
     align-items: center;
     justify-content: center;
     z-index: 4;
 }
-.ht-snapshot-line-count {
-    font-size: 9px;
-    font-weight: 700;
-    font-family: var(--font-mono);
-    line-height: 1;
-}
 
 /* "Heute"-Linie (nur bei taeglicher/woechentlicher/monatlicher Granularitaet aktiv) */
 .ht-today-line {

src/static/js/app.js

@@ -1165,30 +1165,19 @@ const App = {
         });
         html += '</div>';
 
-        // Lagebericht-Linien quer durch die Achse (deduplikiert nach Achsen-Position)
+        // Lagebericht-Linien quer durch die Achse (klickbar, oeffnet Snapshot)
         html += '<div class="ht-snapshot-lines">';
-        const snapshotsByPos = {};
+        const snapshots = entries.filter(e => e.kind === 'snapshot');
-        entries.filter(e => e.kind === 'snapshot').forEach(snap => {
+        snapshots.forEach(snap => {
             const ts = new Date(snap.timestamp || 0).getTime();
             if (rangeEnd === rangeStart) return;
             const pos = ((ts - rangeStart) / (rangeEnd - rangeStart)) * 100;
             if (pos < 0 || pos > 100) return;
-            const posKey = Math.round(pos * 2) / 2;
+            const dateStr = new Date(snap.timestamp).toLocaleDateString('de-DE', { day: '2-digit', month: 'short', timeZone: TIMEZONE });
-            if (!snapshotsByPos[posKey]) snapshotsByPos[posKey] = { pos: posKey, snapshots: [] };
+            html += `<div class="ht-snapshot-line" style="left:${pos}%;" data-snapshot-id="${snap.data.id}" onclick="App.openSnapshotFromTimeline(${snap.data.id}, event)" title="Lagebericht ${UI.escape(dateStr)}">`;
-            snapshotsByPos[posKey].snapshots.push(snap);
+            html += `<div class="ht-snapshot-line-cap" aria-hidden="true">
-        });
+                <svg viewBox="0 0 12 12" width="12" height="12" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><path d="M3 2h6v8l-3-2-3 2z"/></svg>
-        Object.values(snapshotsByPos).forEach(group => {
+            </div>`;
-            const count = group.snapshots.length;
-            const first = group.snapshots[0];
-            const dateStr = new Date(first.timestamp).toLocaleDateString('de-DE', { day: '2-digit', month: 'short', timeZone: TIMEZONE });
-            const titleAttr = count === 1
-                ? `Lagebericht ${dateStr}`
-                : `${count} Lageberichte ${dateStr}`;
-            const capInner = count === 1
-                ? '<svg viewBox="0 0 12 12" width="12" height="12" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><path d="M3 2h6v8l-3-2-3 2z"/></svg>'
-                : `<span class="ht-snapshot-line-count">${count}</span>`;
-            html += `<div class="ht-snapshot-line" style="left:${group.pos}%;" data-snapshot-id="${first.data.id}" onclick="App.openSnapshotFromTimeline(${first.data.id}, event)" title="${UI.escape(titleAttr)}">`;
-            html += `<div class="ht-snapshot-line-cap" aria-hidden="true">${capInner}</div>`;
             html += `</div>`;
         });
         html += '</div>';
@@ -1240,12 +1229,15 @@ const App = {
             if (isActive) barClass += ' active';
 
             html += `<div class="${barClass}" style="left:${pos}%;" onclick="App.openTimelineDetail(${idx})" data-idx="${idx}">`;
-            // Saeule selbst (gefuellt zur Hoehe). has-snapshot setzt golden Top-Border via CSS.
+            // Saeule selbst (gefuellt zur Hoehe)
             if (articleCount > 0) {
                 html += `<div class="ht-bar-fill" style="height:${heightPct}%;"></div>`;
             } else {
                 html += `<div class="ht-bar-fill ht-bar-fill--empty"></div>`;
             }
+            if (snapshotCount > 0) {
+                html += `<div class="ht-bar-snap-cap" aria-hidden="true"></div>`;
+            }
             // Hover-Vorschaukarte
             html += `<div class="ht-hover-card">
                 <div class="ht-hover-card-head">${UI.escape(bucket.label)} &middot; ${articleCount + snapshotCount} Eintr${(articleCount + snapshotCount) === 1 ? 'ag' : 'äge'}</div>`;