From a8be33266226c51f74a2e14bb6bb3bb73cd12967 Mon Sep 17 00:00:00 2001
From: Hermes Agent <hermes@v2202605360184461552.supersrv.de>
Date: Wed, 17 Jun 2026 22:04:06 +0200
Subject: [PATCH] feat: Like-Button jetzt auch auf Detailseite klickbar
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Detailseite: 👍 als interaktiver Button (statt statischer Text)
- JS-Fetch-Handler auf /api/like/<id>, Cookie-Dedup
- CSS: .detail-like-btn mit Hover/Liked-Styles (BSN-Blau)
- Gleiche Logik wie Übersichtskarten (1 Like pro Browser)
---
 app.py | 31 +++++++++++++++++++++++++++++--
 1 file changed, 29 insertions(+), 2 deletions(-)
diff --git a/app.py b/app.py
index 7a03c15..f987c67 100644
--- a/app.py
+++ b/app.py
@@ -2833,7 +2833,10 @@ def public_detail(sub_id: int):
     .detail-card {{ padding:1.2rem; }}
     .site-header {{ padding:0.8rem 1rem; }}
   }}
-</style>
+
+  .detail-like-btn:hover {{ border-color:#20228a; color:#20228a; background:rgba(32,34,138,0.05); }}
+  .detail-like-btn.liked {{ background:#20228a; color:#fff; border-color:#20228a; font-weight:600; }}
+  .detail-like-btn:active {{ transform:scale(0.94); }}</style>
 </head>
 <body>
 <header class="site-header">
@@ -2854,7 +2857,7 @@ def public_detail(sub_id: int):
     {"".join([f'<div class="detail-content">{content}</div>' if content else ''])}
     <div style="display:flex;align-items:center;gap:1rem;margin-top:1.5rem;padding-top:1rem;border-top:1px solid #f0ede6;">
       <span style="font-size:0.8rem;color:#999;">👁 {row['views'] or 0} Aufrufe</span>
-      <span style="font-size:0.8rem;color:#999;">👍 {row['likes'] or 0}</span>
+      <button id="detail-like-btn" data-id="{sub_id}" class="detail-like-btn">👍 {row['likes'] or 0}</button>
     </div>
   </article>
 </main>
@@ -2864,6 +2867,30 @@ def public_detail(sub_id: int):
 <div style="text-align:center;padding:1rem 1.5rem 2.5rem;font-size:0.7rem;color:#aaa;max-width:720px;margin:0 auto;">
   Beitrags-ID: <strong style="color:#20228a;">#{sub_id}</strong> \u2014 Bei Fragen oder Löschwunsch bitte diese ID angeben.
 </div>
+<script>
+(function(){{
+  var btn = document.getElementById('detail-like-btn');
+  if (!btn) return;
+  btn.addEventListener('click', function() {{
+    if (this.classList.contains('liked')) return;
+    this.disabled = true;
+    var id = this.getAttribute('data-id');
+    fetch('/api/like/' + id, {{method:'POST'}})
+      .then(function(r) {{ return r.json(); }})
+      .then(function(data) {{
+        if (!data.already) {{
+          btn.classList.add('liked');
+          btn.textContent = '👍 ' + data.likes;
+          btn.style.background = '#20228a';
+          btn.style.color = '#fff';
+          btn.style.borderColor = '#20228a';
+        }}
+        btn.disabled = false;
+      }})
+      .catch(function() {{ btn.disabled = false; }});
+  }});
+}})();
+</script>
 </body>
 </html>"""
 
