From 0a3ad2207e05b38eb320a9cdcbeea5ad2060138d Mon Sep 17 00:00:00 2001
From: rene <mail@motocamp.de>
Date: Fri, 24 Apr 2026 08:33:32 +0200
Subject: [PATCH] Badges: Chat-Punkt am Avatar, Notif-Punkt am Burger,
 Aktuelles aus Sidebar, SW by-v327

---
 backend/static/index.html | 20 +++++++++++---------
 backend/static/js/app.js  | 22 ++++++++++------------
 backend/static/sw.js      |  2 +-
 3 files changed, 22 insertions(+), 22 deletions(-)

diff --git a/backend/static/index.html b/backend/static/index.html
index 2ec490a..6fa08ec 100644
--- a/backend/static/index.html
+++ b/backend/static/index.html
@@ -145,10 +145,7 @@
         <svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#chat-circle-dots"></use></svg> Nachrichten
         <span class="sidebar-item-badge" id="chat-badge" style="display:none">0</span>
       </div>
-      <div class="sidebar-item" data-page="notifications">
-        <svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#bell"></use></svg> Aktuelles
-        <span class="sidebar-item-badge" id="notif-badge" style="display:none">0</span>
-      </div>
+
 
       <span class="sidebar-section-label">Community</span>
       <div class="sidebar-item" data-page="poison">
@@ -228,13 +225,18 @@
            style="width:18px;height:18px;color:var(--c-text-muted)">
         <use href="/icons/phosphor.svg#user"></use>
       </svg>
-      <span id="notif-nav-badge" class="hidden"
-            style="position:absolute;top:-3px;right:-3px;min-width:16px;height:16px;
-                   border-radius:8px;background:var(--c-danger);color:#fff;font-size:10px;
-                   font-weight:700;line-height:16px;text-align:center;padding:0 3px;
+      <span id="chat-nav-badge" class="hidden"
+            style="position:absolute;top:-3px;right:-3px;width:10px;height:10px;
+                   border-radius:50%;background:var(--c-danger);
+                   pointer-events:none;z-index:1"></span>
+    </button>
+    <button class="header-menu-btn" id="header-menu-btn" aria-label="Menü" style="position:relative">
+      <svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#list"></use></svg>
+      <span id="notif-nav-badge" class="hidden"
+            style="position:absolute;top:4px;right:4px;width:10px;height:10px;
+                   border-radius:50%;background:var(--c-danger);
                    pointer-events:none;z-index:1"></span>
     </button>
-    <button class="header-menu-btn" id="header-menu-btn" aria-label="Menü"><svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#list"></use></svg></button>
   </header>
 
   <!-- HAUPT-INHALTSBEREICH -->
diff --git a/backend/static/js/app.js b/backend/static/js/app.js
index 14d3253..f626c5e 100644
--- a/backend/static/js/app.js
+++ b/backend/static/js/app.js
@@ -3,7 +3,7 @@
    Router, State-Management, Navigation, Initialisierung.
    ============================================================ */
 
-const APP_VER = '314'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
+const APP_VER = '315'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
 
 const App = (() => {
 
@@ -471,16 +471,12 @@ const App = (() => {
     if (!state.user) return;
     try {
       const { count } = await API.notifications.unreadCount();
+      // Sidebar-Badge (Zahl) — entfernt aus Sidebar, aber ID bleibt für Kompatibilität
       const badge = document.getElementById('notif-badge');
-      if (badge) {
-        badge.textContent = count;
-        badge.style.display = count > 0 ? '' : 'none';
-      }
+      if (badge) { badge.textContent = count; badge.style.display = count > 0 ? '' : 'none'; }
+      // Burger-Punkt
       const navBadge = document.getElementById('notif-nav-badge');
-      if (navBadge) {
-        navBadge.textContent = count;
-        navBadge.classList.toggle('hidden', count === 0);
-      }
+      if (navBadge) navBadge.classList.toggle('hidden', count === 0);
     } catch { /* ignorieren */ }
   }
 
@@ -489,10 +485,12 @@ const App = (() => {
     try {
       const convs = await API.chat.conversations();
       const total = convs.reduce((s, c) => s + (c.unread_count || 0), 0);
+      // Sidebar-Badge (Zahl)
       const badge = document.getElementById('chat-badge');
-      if (!badge) return;
-      badge.textContent = total;
-      badge.style.display = total > 0 ? '' : 'none';
+      if (badge) { badge.textContent = total; badge.style.display = total > 0 ? '' : 'none'; }
+      // Avatar-Punkt
+      const navBadge = document.getElementById('chat-nav-badge');
+      if (navBadge) navBadge.classList.toggle('hidden', total === 0);
     } catch { /* ignorieren */ }
   }
 
diff --git a/backend/static/sw.js b/backend/static/sw.js
index b0cca5a..906279e 100644
--- a/backend/static/sw.js
+++ b/backend/static/sw.js
@@ -3,7 +3,7 @@
    Offline-Cache + Push Notifications + Tile-Cache
    ============================================================ */
 
-const CACHE_VERSION = 'by-v326';
+const CACHE_VERSION = 'by-v327';
 const CACHE_STATIC  = `${CACHE_VERSION}-static`;
 const CACHE_TILES   = 'ban-yaro-tiles-v1';  // bleibt über SW-Updates erhalten