atagen

malice

public
Star0
Watch0

Commit 31606c86aa9f

tarball

atagen <boss@atagen.co>2026-10-27 09:49 UTC

1 file changed+3-4
web: keep the receipt gutter fixed and grow the hover toolbar upward

Rows only reserved room for seen-by avatars once someone had read them, so long messages rewrapped every time a receipt arrived or moved on. The hover toolbar hung down from the row's top edge, and once quick reaction groups made it several rows tall it reached below the newest message, growing the scroll height while pinned to the bottom. That moved the row out from under the pointer and back, so it shook. It now grows upward from the row.
Modified file: web/src/lib/MessageRow.svelte+3 additions−4 deletions
@@ -386,7 +386,6 @@
386386 class:editing
387387 class:mentioned={mentionsMe || keywordHit}
388388 class:system={!interactive}
389- class:has-readers={interactive && readers.length > 0}
390389 class:selected
391390 data-item={itemId}
392391 data-event={event.event_id}
@@ -683,7 +682,7 @@
683682 }
684683 .avatar-spacer { flex: none; width: 34px; padding-top: 2px; text-align: center; }
685684 .hover-time { opacity: 0; font-size: 10.5px; color: var(--muted); }
686- .msg-body { min-width: 0; flex: 1; transition: padding-right var(--pop); }
685+ .msg-body { min-width: 0; flex: 1; }
687686 .msg-head { display: flex; align-items: baseline; gap: 8px; }
688687 .federation-lag { display: inline-flex; align-items: center; gap: 3px; color: var(--danger); font-size: 11px; font-weight: 650; }
689688 .federation-lag > span:last-child { display: inline-grid; place-items: center; min-width: 24px; height: 18px; padding: 0 4px; border: 1px solid currentColor; border-radius: 999px; }
@@ -761,13 +760,13 @@
761760 .reactors-key { display: block; color: var(--muted); font-size: 11px; }
762761 .reaction.mine { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 16%, transparent); }
763762 .reaction:disabled { cursor: default; opacity: 0.85; }
764- .msg.has-readers .msg-body { padding-right: 72px; }
763+ .msg:not(.system) .msg-body { padding-right: 72px; }
765764 .readby { position: absolute; right: 12px; bottom: 4px; display: flex; align-items: center; }
766765 .readby > :global(* + *) { margin-left: -4px; }
767766 .readby :global(.mxc-avatar), .readby :global(.mxc-fallback) { box-shadow: 0 0 0 1.5px var(--bg); }
768767 .readby .more { margin-left: 3px; font-size: 10.5px; color: var(--muted); }
769768 .actions {
770- position: absolute; top: -12px; right: 10px; z-index: 2;
769+ position: absolute; bottom: calc(100% - 18px); right: 10px; z-index: 2;
771770 display: flex; align-items: flex-start; gap: 2px;
772771 padding: 2px;
773772 background: var(--bg-soft);