From 679dbdd862341af69729e6d1e420b60fc782ad53 Mon Sep 17 00:00:00 2001
From: rene <mail@motocamp.de>
Date: Sun, 26 Apr 2026 11:18:48 +0200
Subject: [PATCH] =?UTF-8?q?Datenschutz-Hinweis:=20wegklickbar=20(localStor?=
 =?UTF-8?q?age),=20Notes=20Mobile-sichtbar=20=E2=80=94=20SW=20by-v429?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 backend/static/js/app.js         |  2 +-
 backend/static/js/pages/diary.js | 20 +++++++++++++++-----
 backend/static/js/pages/notes.js | 25 ++++++++++++++++++-------
 3 files changed, 34 insertions(+), 13 deletions(-)

diff --git a/backend/static/js/app.js b/backend/static/js/app.js
index 5376d6c..245bbf3 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 = '407'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
+const APP_VER = '408'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
 
 const App = (() => {
 
diff --git a/backend/static/js/pages/diary.js b/backend/static/js/pages/diary.js
index 9758d7c..b54a42e 100644
--- a/backend/static/js/pages/diary.js
+++ b/backend/static/js/pages/diary.js
@@ -761,14 +761,18 @@ window.Page_diary = (() => {
       return;
     }
 
-    // Datenschutz-Hinweis: Einträge sind privat
-    const privacyNotice = `
-      <div style="font-size:var(--text-xs);color:var(--c-text-muted);background:var(--c-surface-2);
-                  border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);
-                  display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-3)">
+    // Datenschutz-Hinweis: einmalig anzeigen, per Klick wegklicken
+    const privacyNotice = localStorage.getItem('by_diary_privacy_ack') ? '' : `
+      <div id="diary-privacy-notice" style="font-size:var(--text-xs);color:var(--c-text-muted);
+                  background:var(--c-surface-2);border-radius:var(--radius-md);
+                  padding:var(--space-2) var(--space-3);display:flex;align-items:center;
+                  gap:var(--space-2);margin-bottom:var(--space-3);cursor:pointer"
+           title="Klicken zum Schließen">
         <svg class="ph-icon" aria-hidden="true" style="width:14px;height:14px;flex-shrink:0">
           <use href="/icons/phosphor.svg#lock-simple"></use></svg>
         Deine Tagebucheinträge sind privat — nur du kannst sie sehen.
+        <svg class="ph-icon" aria-hidden="true" style="width:12px;height:12px;margin-left:auto;flex-shrink:0;opacity:0.5">
+          <use href="/icons/phosphor.svg#x"></use></svg>
       </div>`;
 
     // Gruppieren nach Jahr-Monat (Anzeigereihenfolge: chronologisch absteigend)
@@ -790,6 +794,12 @@ window.Page_diary = (() => {
 
     listEl.innerHTML = html;
 
+    // Datenschutz-Hinweis wegklicken
+    listEl.querySelector('#diary-privacy-notice')?.addEventListener('click', () => {
+      localStorage.setItem('by_diary_privacy_ack', '1');
+      listEl.querySelector('#diary-privacy-notice')?.remove();
+    });
+
     // Events an Karten binden
     listEl.querySelectorAll('[data-entry-id]').forEach(card => {
       const id = parseInt(card.dataset.entryId);
diff --git a/backend/static/js/pages/notes.js b/backend/static/js/pages/notes.js
index c1ea9d9..d9ce75d 100644
--- a/backend/static/js/pages/notes.js
+++ b/backend/static/js/pages/notes.js
@@ -139,14 +139,19 @@ window.Page_notes = (() => {
           <span class="notes-count">${_notes.length} Notiz${_notes.length !== 1 ? 'en' : ''}</span>
         </div>
 
-        <!-- Datenschutz-Hinweis -->
-        <div style="font-size:var(--text-xs);color:var(--c-text-muted);background:var(--c-surface-2);
-                    border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);
-                    display:flex;align-items:center;gap:var(--space-2)">
-          <svg class="ph-icon" aria-hidden="true" style="width:14px;height:14px;flex-shrink:0">
+        <!-- Datenschutz-Hinweis (einmalig, wegklickbar) -->
+        ${localStorage.getItem('by_notes_privacy_ack') ? '' : `
+        <div id="notes-privacy-notice" style="font-size:var(--text-xs);color:var(--c-text-secondary);
+                    background:var(--c-surface-2);border-radius:var(--radius-md);
+                    padding:var(--space-3) var(--space-3);display:flex;align-items:center;
+                    gap:var(--space-2);cursor:pointer;border:1px solid var(--c-border-light)"
+             title="Klicken zum Schließen">
+          <svg class="ph-icon" aria-hidden="true" style="width:16px;height:16px;flex-shrink:0;color:var(--c-primary)">
             <use href="/icons/phosphor.svg#lock-simple"></use></svg>
-          Alle Notizen sind privat — nur du kannst sie lesen.
-        </div>
+          <span>Alle Notizen sind privat — nur du kannst sie lesen.</span>
+          <svg class="ph-icon" aria-hidden="true" style="width:12px;height:12px;margin-left:auto;flex-shrink:0;opacity:0.4">
+            <use href="/icons/phosphor.svg#x"></use></svg>
+        </div>`}
 
         <!-- KI-Panel -->
         ${kiEnabled ? _kiPanelHtml() : ''}
@@ -350,6 +355,12 @@ window.Page_notes = (() => {
   // ----------------------------------------------------------
   function _bindEvents() {
 
+    // Datenschutz-Hinweis wegklicken
+    _container.querySelector('#notes-privacy-notice')?.addEventListener('click', () => {
+      localStorage.setItem('by_notes_privacy_ack', '1');
+      _container.querySelector('#notes-privacy-notice')?.remove();
+    });
+
     // Filter-Chips
     _container.querySelectorAll('.notes-chip').forEach(btn => {
       btn.addEventListener('click', () => {