Calendar short Log titles clip under hidden time row #1061

Open
opened 2026-10-04 14:55:25 +00:00 by kayg · 1 comment
Owner

Summary

Short Calendar Log entries clip their title under the merged 7b UI. The 3 b-block is only about 21.5 CSS px tall, but the hidden b-time-row is laid out first and consumes about 15 px. The title then starts at y=834.36 and ends at y=848.92 while the block ends at y=836.28. overflow: clip hides nearly all of the title.

This is a regression against production 6074f71d1: its Calendar markup puts the title before the time metadata, so the one-title-line floor can show the title. The regression comes from the merged Calendar markup ordering, not a stale assertion. DESIGN §39 and the existing calendar-doc-stack workflow expect the short Log title to remain readable.

Reproduction

Run apps/web/e2e/calendar-doc-stack.mjs on the merged 7b build with a real Journal Log at the current time. On the 390 px, light case, the workflow fails its existing title visibility assertion. The captured diagnostic geometry was:

  • block: top 814.80, bottom 836.28, height 21.48 px
  • hidden time row: bottom 832.36 px
  • title: top 834.36, bottom 848.92, height 14.56 px
  • Calendar viewport: 844 px high

Production source at 6074f71d1 lays out .b-title before .b-meta; the merged source lays out .b-time-row before .b-title.

Expected

A short Log shows its title within the block's one-line floor. Hidden metadata does not push the title outside that floor. Keep the full accessible name and the sticky title/time behavior for taller Logs.

Scope

Non-blocking visual regression. Keep the E2E assertion. Fix the Calendar layout and add focused coverage for a short Log at phone, tablet and desktop widths.

## Summary Short Calendar Log entries clip their title under the merged 7b UI. The 3 b-block is only about 21.5 CSS px tall, but the hidden `b-time-row` is laid out first and consumes about 15 px. The title then starts at y=834.36 and ends at y=848.92 while the block ends at y=836.28. `overflow: clip` hides nearly all of the title. This is a regression against production `6074f71d1`: its Calendar markup puts the title before the time metadata, so the one-title-line floor can show the title. The regression comes from the merged Calendar markup ordering, not a stale assertion. DESIGN §39 and the existing `calendar-doc-stack` workflow expect the short Log title to remain readable. ## Reproduction Run `apps/web/e2e/calendar-doc-stack.mjs` on the merged 7b build with a real Journal Log at the current time. On the 390 px, light case, the workflow fails its existing title visibility assertion. The captured diagnostic geometry was: - block: top 814.80, bottom 836.28, height 21.48 px - hidden time row: bottom 832.36 px - title: top 834.36, bottom 848.92, height 14.56 px - Calendar viewport: 844 px high Production source at `6074f71d1` lays out `.b-title` before `.b-meta`; the merged source lays out `.b-time-row` before `.b-title`. ## Expected A short Log shows its title within the block's one-line floor. Hidden metadata does not push the title outside that floor. Keep the full accessible name and the sticky title/time behavior for taller Logs. ## Scope Non-blocking visual regression. Keep the E2E assertion. Fix the Calendar layout and add focused coverage for a short Log at phone, tablet and desktop widths.
Author
Owner

Correction to the first summary paragraph: read ‘The .block.actual is only about 21.5 CSS px tall’ (not ‘3 b-block’).

Correction to the first summary paragraph: read ‘The .block.actual is only about 21.5 CSS px tall’ (not ‘3 b-block’).
Sign in to join this conversation.
No labels
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference
kayg/calternal#1061
No description provided.