Changeset 535f955 in Klonkt for src/views/pages

Timestamp:

06/19/2026 09:49:35 AM (3 months ago)

Author:

roboburr <roboburr@…>

Branches:

main

Children:

247988e

Parents:

8cdb377

Message:

feat: post likes + favourites page for logged-in users

• New post_likes table (unique per post+user).
• ♥ like button on the post (shared partial, htmx toggle via POST /posts/:id/like); shows the like count. Anonymous → button links to login.
• /favorieten page (requireAuth) shows your liked posts (solo: own site, hub: across all sites with correct links). Link in account menu (sheet + topnav).

Co-Authored-By: Claude <noreply@…>

Location:

src/views/pages

Files:

• favorites.ejs (added)
• post.ejs (modified) (2 diffs)

src/views/pages/post.ejs

@@ -31 +31 @@
       <% } %>
     </div>
+    <% if (post.status === 'published') { %>
+      <div class="post-like-row">
+        <%- include('../partials/like-button', { post: post, likedByMe: (typeof likedByMe !== 'undefined' && likedByMe), likeCount: (typeof likeCount !== 'undefined' ? likeCount : 0), loggedIn: !!user, loginNext: _base + '/' + post.slug }) %>
+      </div>
+    <% } %>
   </header>
 
@@ -250 +255 @@
 .post-content { font-family: var(--font-body, serif); font-size: 1.1rem; line-height: 1.7; color: var(--ink); }
 .post-content p { margin: 1.2em 0; }
+.post-like-row { margin-top: 1rem; }
+.like-btn {
+  display: inline-flex; align-items: center; gap: 0.45rem;
+  padding: 0.4rem 0.85rem; border: 1px solid var(--rule); border-radius: 999px;
+  background: var(--paper-2); color: var(--ink); font: inherit; font-size: 0.95rem;
+  cursor: pointer; text-decoration: none; transition: border-color 120ms, color 120ms, background 120ms;
+}
+.like-btn:hover { border-color: var(--accent); }
+.like-btn .like-heart { font-size: 1.1rem; line-height: 1; }
+.like-btn.is-liked { border-color: var(--accent); color: var(--accent); }
+.like-btn.is-liked .like-heart { color: var(--accent); }
+.like-btn .like-count { font-variant-numeric: tabular-nums; }
 .post-content h2 { font-family: var(--font-display, serif); font-size: 1.6rem; margin: 2rem 0 1rem; }
 .post-content h3 { font-family: var(--font-display, serif); font-size: 1.3rem; margin: 1.5rem 0 0.75rem; }