feat: Like-Button jetzt auch auf Detailseite klickbar
- 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)
This commit is contained in:
@@ -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>"""
|
||||
|
||||
|
||||
Reference in New Issue
Block a user