Changeset 7eee449 in Klonkt

Timestamp:

06/26/2026 04:23:22 PM (2 months ago)

Author:

Robin Genis <roboburr@…>

Branches:

main

Children:

1c85964

Parents:

bca83f3

Message:

style(fedi): white bg behind feed/following avatars (transparent PNG logos)

A federated account avatar that is a transparent PNG (e.g. a logo) showed the
accent-tinted circle behind it; give the avatar img a white bg per the rule.

Location:

src/views/pages

Files:

• following.ejs (modified) (1 diff)
• newspaper.ejs (modified) (1 diff)

src/views/pages/following.ejs

@@ -56 +56 @@
   .tl-foll { display: flex; align-items: center; gap: .6rem; padding: .45rem .6rem; border-radius: 12px; background: color-mix(in srgb, var(--ink, #000) 4%, transparent); }
   .tl-foll-av { flex: 0 0 36px; width: 36px; height: 36px; border-radius: 50%; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; background: color-mix(in srgb, var(--accent, #888) 20%, transparent); color: var(--accent, #555); }
-  .tl-foll-av img { width: 100%; height: 100%; object-fit: cover; }
+  .tl-foll-av img { width: 100%; height: 100%; object-fit: cover; background: #fff; }
   .tl-foll-meta { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
   .tl-foll-meta a { color: var(--ink, inherit); text-decoration: none; font-weight: 600; }

src/views/pages/newspaper.ejs

@@ -82 +82 @@
     background: color-mix(in srgb, var(--accent, #888) 22%, transparent); color: var(--accent, #555);
     box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent, #888) 18%, transparent); }
-  .tl-avatar img { width: 100%; height: 100%; object-fit: cover; }
+  .tl-avatar img { width: 100%; height: 100%; object-fit: cover; background: #fff; }
   .tl-id { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
   .tl-author { font-weight: 700; color: var(--ink, inherit); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }