Transcript: a message's hover action row sits centered between it and the next message

Closed
TE
4d ago
+147-85

Ask

Leo, 2026-10-31, on the cmux NEXT agent chat transcript: "when i hover this little whatever time ago copy sound ellipsis thing should be centered in between the two things you're saying in between so padding after == padding before that kinda thing all around"

Problem

A message's action row (a prompt's age and copy row; a turn's footer with Worked for, copy, read aloud, the menu and its age) stood 4px under its message (--cv-meta-gap) and then 8px (a prompt's, the row's message gap) or 16px (a footer's, the turn gap) over the next message. So the row hugged the message above and floated far from the one below.

Change

One spacing token on both sides of every meta row: --cv-meta-gap is now the message gap (var(--cv-message-gap), 8px), above and below.

  • A prompt's action row: 8px under the bubble (was 4), then the row's 8px message gap. Its space is still reserved while hidden, so hovering moves nothing.
  • A turn's footer: the reply keeps the meta gap over it (now 8), and the footer row ends at the same --cv-meta-gap (was the 16px turn gap). An empty footer (hover-only controls) keeps its 24px line plus the gap, so its controls are centered too when they show.
  • The chat's last footer (over the composer, or over another agent's line / a queued item, which sit after the running line) keeps the 16px turn gap, so the end of a turn still moves nothing (the running line reserves that height).
  • model.ts estimates follow (META_GAP = MESSAGE_GAP; a footer is its line and the meta gap, the last one the turn gap), so first layout matches the drawn rows.
  • harnessStatus.css used --cv-meta-gap as its grid row gap; it now names its own 4px so that surface does not change.
  • Nothing is removed: every action stays.

Spacing totals: reply ā†’ next prompt goes from 4 + 24 + 16 = 44px to 8 + 24 + 8 = 40px; a prompt's row band from 4 + 24 + 8 = 36px to 40px. The same-assistant continuation footer was already 8px below; it is now centered too. A running line's words under a reply move from 16px to 20px under it.

Tests

  • webviews/test/agent-pane-transcript-spacing.test.ts (Chromium): new test measures, for a prompt's action row and a turn's footer, the gap above == the gap below (within 1px), and that hovering the prompt changes neither gap. The rhythm test's bounds follow the new numbers.
  • webviews/test/transcript-continuation-spacing.test.ts: footer ā†’ the person's prompt is now 8px (centered), another agent's line keeps 16px.
  • rowEstimates.test.ts, continuationSpacing.test.ts: estimates follow (a non-last footer 32px, the last 40px; a prompt's meta 8 + 24).

Risk

Low: CSS tokens and their matching estimates in the agent chat transcript. Turn spacing is 4px tighter and a prompt's band 4px taller. Overlap: #29124 (open) derives --cv-status-gap from --cv-meta-gap; after this lands its status room is computed from the 8px gap.

Spec: leo-workspace design/chat-transcript.md (transcript rhythm) is updated to match.

Agent session: agent session

šŸ¤– Generated with Claude Code