From f76191c9296b1d5110d0360dfb106e9276cdc859 Mon Sep 17 00:00:00 2001 From: Adam Soltys Date: Sat, 10 Oct 2026 07:15:12 -0700 Subject: Feed: a slow picture keeps loading in place instead of turning into a link. A feed row waits up to 8 s for its pictures, then freezes as it is; a picture still downloading at that moment (Juraj's 3.5 MB PNG from blossom.primal.net, on a phone) was frozen as its bare URL, and only showed when the post was opened. Now a picture that was merely slow is drawn in a fixed 4:3 box (fitted inside, so nothing moves when it lands) and keeps loading; only a picture that refused to load (an error, not a timeout — mediaFailed) is still a link. tools/slow-image-test.js (a picture served after 11 s; on the old code it was a link). MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01Vps2H27rhbG9ZqseGfMrc3 --- src/style.css | 2 ++ 1 file changed, 2 insertions(+) (limited to 'src/style.css') diff --git a/src/style.css b/src/style.css index 8d41124..dad0520 100644 --- a/src/style.css +++ b/src/style.css @@ -691,6 +691,8 @@ html:has(#app .chat-card), body:has(#app .chat-card) { overflow: hidden; } its width/height, keeps the frame to the picture) */ .note-img { display: block; max-width: min(100%, calc(min(560px, 70vh) * var(--ar, 100))); max-height: min(560px, 70vh); border-radius: 10px; margin-top: 6px; object-fit: contain; } .note-img.clickable { cursor: zoom-in; } +/* a picture still loading when its row was frozen: a fixed box, fitted inside */ +.note-img.note-img-late { width: 100%; max-width: 100%; aspect-ratio: 4 / 3; height: auto; background: rgba(127,127,127,.08); } /* The row under a post: reply, boost, quote, react, zap — spread across the post's full width so each is a comfortable target, quiet until one carries a count or you've used it. */ -- cgit v1.2.3