Calendar: preview titles need two-line truncation #103

Closed
opened 2026-09-25 17:23:02 +00:00 by kayg · 1 comment
Owner

Evidence

A production-server Playwright capture used a real long Log entry title at 1440 × 900. Computed title height was 73 px at 18.2 px line-height (four lines). CSS reported line-clamp=none and overflow=visible. The title wraps, so it was not clipped in this capture, but it grows beyond the required two lines. Screenshot: /home/kayg/Developer/calternal/target/popover-audit/screenshots/calendar-preview-1440-paper.png.

Other linked note/file names in the same preview use one-line ellipsis at ItemPreview.svelte:355–360, which also differs from the owner’s two-line truncation rule.

Root cause

packages/ui/src/components/calendar/ItemPreview.svelte:276–285 styles .title with overflow-wrap:anywhere but no line clamp or overflow truncation. The list .name rule separately enforces white-space:nowrap and one-line ellipsis.

Expected

Long preview titles wrap to two lines then truncate with an ellipsis, never clip. Keep the complete name available to assistive technology and apply the same policy to preview linked names.

## Evidence A production-server Playwright capture used a real long Log entry title at 1440 × 900. Computed title height was 73 px at 18.2 px line-height (four lines). CSS reported line-clamp=none and overflow=visible. The title wraps, so it was not clipped in this capture, but it grows beyond the required two lines. Screenshot: /home/kayg/Developer/calternal/target/popover-audit/screenshots/calendar-preview-1440-paper.png. Other linked note/file names in the same preview use one-line ellipsis at ItemPreview.svelte:355–360, which also differs from the owner’s two-line truncation rule. ## Root cause packages/ui/src/components/calendar/ItemPreview.svelte:276–285 styles .title with overflow-wrap:anywhere but no line clamp or overflow truncation. The list .name rule separately enforces white-space:nowrap and one-line ellipsis. ## Expected Long preview titles wrap to two lines then truncate with an ellipsis, never clip. Keep the complete name available to assistive technology and apply the same policy to preview linked names.
Author
Owner

Merged into dev at 19676b44 after Claude's screenshot review (shared overlay glass, lighter in both themes). Deploy status on #203.

Merged into dev at 19676b44 after Claude's screenshot review (shared overlay glass, lighter in both themes). Deploy status on #203.
kayg closed this issue 2026-09-26 20:39:10 +00:00
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#103
No description provided.