Changeset 47a0d29 in Klonkt for src/views/pages/post.ejs

Timestamp:

06/24/2026 11:49:19 AM (3 months ago)

Author:

Robin Genis <roboburr@…>

Branches:

main

Children:

55bc7f9

Parents:

c16e0a5

Message:

style(activitypub): polish fediverse section into clean comment cards

Dedicated markup/classes (no list numbers), circular avatar, name + muted handle
+ time, subtle rounded card per reply, pill-style stat counters. Adapts to
light/dark via color-mix on theme tokens.

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

File:

• src/views/pages/post.ejs (modified) (1 diff)

src/views/pages/post.ejs

@@ -82 +82 @@
       </p>
       <% if (fediverse.replies.length) { %>
-        <ol class="fedi-replies">
+        <ul class="fedi-replies">
           <% fediverse.replies.forEach(function(r) { %>
             <li class="fedi-reply">
-              <div class="comment-avatar">
+              <div class="fedi-avatar">
                 <% if (r.actor_icon) { %><img src="<%= r.actor_icon %>" alt="" loading="lazy">
-                <% } else { %><span class="comment-avatar-fallback"><%= (r.actor_name || '?').charAt(0).toUpperCase() %></span><% } %>
+                <% } else { %><span class="fedi-avatar-fallback"><%= (r.actor_name || '?').charAt(0).toUpperCase() %></span><% } %>
               </div>
-              <div class="comment-body">
-                <div class="comment-meta">
-                  <a class="comment-author" href="<%= r.actor_url %>" rel="nofollow noopener" target="_blank"><%= r.actor_name %></a>
+              <div class="fedi-main">
+                <div class="fedi-line">
+                  <a class="fedi-name" href="<%= r.actor_url %>" rel="nofollow noopener" target="_blank"><%= r.actor_name %></a>
                   <span class="fedi-handle"><%= r.actor_handle %></span>
-                  <% if (r.published || r.created_at) { %><span class="comment-time"><%= formatDateTime(r.published || r.created_at) %></span><% } %>
+                  <% if (r.published || r.created_at) { %><time class="fedi-time"><%= formatDateTime(r.published || r.created_at) %></time><% } %>
                 </div>
-                <div class="comment-content"><%- r.content %></div>
+                <div class="fedi-text"><%- r.content %></div>
               </div>
             </li>
           <% }); %>
-        </ol>
+        </ul>
       <% } %>
     </section>