Calendar grid: week header labels overlap at 768, block times are cut, 50 overlapping entries unreadable, low-contrast text, CLS #134

Closed
opened 2026-09-25 22:17:51 +00:00 by kayg · 4 comments
Owner

Severity: medium (owner: job/calendar-grid; not fixed here)

Problems in the Calendar grid (hostile real data: 50 overlapping log entries in one day, an entry that crosses midnight, an RTL entry)

  1. Week header overlap at 768: the weekday label and the day number overlap ("20Mon", "22Wed"; span.num over span.wd). /home/kayg/Developer/calternal/target/breakit/run1/cal-week_768-paper.png.
  2. Clipped times: in event blocks the time line ("14:00 – 15:00", "– 01:30") is cut by the block without an ellipsis at 768–1440 (108 hits), also for the midnight-crossing and the RTL entry. /home/kayg/Developer/calternal/target/breakit/run1/cal-day_320-paper.png.
  3. 50 overlapping entries become ~10px slivers in Day and Week; titles are unreadable and nothing says "+N more". /home/kayg/Developer/calternal/target/breakit/run1/cal-week_768-paper.png.
  4. Contrast (estimated, composited over the theme paper): block time text span.b-time 4.29:1 (paper) — needs 4.5; mini-month days outside the month button.d.out 2.93:1; week header span.wd/span.num 3.95:1 at 320; the Day view zone label 3.54:1.
  5. Layout shift on load: CLS 0.11–0.18 on Week and Day at 1024–1920 (the grid jumps when the data arrives or when it scrolls to "now").

Expected

No overlapping or cut text; readable collision layout (or "+N"); 4.5:1 text; CLS < 0.1.

Found by the break-it sweep (#117). Re-run: cd apps/web && bun run build && bun e2e/breakit.mjs --keep <dir> (script on branch job/breakit-fixes). Screenshots: /home/kayg/Developer/calternal/target/breakit (run 1 in run1/, fix checks in verify/).

**Severity:** medium (owner: job/calendar-grid; not fixed here) ## Problems in the Calendar grid (hostile real data: 50 overlapping log entries in one day, an entry that crosses midnight, an RTL entry) 1. **Week header overlap at 768:** the weekday label and the day number overlap ("20Mon", "22Wed"; `span.num` over `span.wd`). `/home/kayg/Developer/calternal/target/breakit/run1/cal-week_768-paper.png`. 2. **Clipped times:** in event blocks the time line ("14:00 – 15:00", "– 01:30") is cut by the block without an ellipsis at 768–1440 (108 hits), also for the midnight-crossing and the RTL entry. `/home/kayg/Developer/calternal/target/breakit/run1/cal-day_320-paper.png`. 3. **50 overlapping entries** become ~10px slivers in Day and Week; titles are unreadable and nothing says "+N more". `/home/kayg/Developer/calternal/target/breakit/run1/cal-week_768-paper.png`. 4. **Contrast (estimated, composited over the theme paper):** block time text `span.b-time` 4.29:1 (paper) — needs 4.5; mini-month days outside the month `button.d.out` 2.93:1; week header `span.wd`/`span.num` 3.95:1 at 320; the Day view zone label 3.54:1. 5. **Layout shift on load:** CLS 0.11–0.18 on Week and Day at 1024–1920 (the grid jumps when the data arrives or when it scrolls to "now"). ## Expected No overlapping or cut text; readable collision layout (or "+N"); 4.5:1 text; CLS < 0.1. Found by the break-it sweep (#117). Re-run: `cd apps/web && bun run build && bun e2e/breakit.mjs --keep <dir>` (script on branch `job/breakit-fixes`). Screenshots: `/home/kayg/Developer/calternal/target/breakit` (run 1 in `run1/`, fix checks in `verify/`).
Author
Owner

The calendar-grid job resumed from dev at 7c1d6c82ea (branch HEAD 9d92f8a2ca). The prior agent committed the initial fixes and sweep checks. I am verifying the five reported defects in the finished grid and will include the gate results in the final report.

The calendar-grid job resumed from dev at 7c1d6c82ea98ac3772117a534fbb923825a60bab (branch HEAD 9d92f8a2cab59cf8cbca4857c986631ef27e26ef). The prior agent committed the initial fixes and sweep checks. I am verifying the five reported defects in the finished grid and will include the gate results in the final report.
Author
Owner

The #117 break-it sweep independently reproduced the low-contrast calendar text at 320px in the paper theme. The contrast detector measured weekday and date labels at 3.95:1 (required 4.5:1), and the month-view weekend labels at 3.40:1. A week-view “+3” chip measured 4.30:1.

Screenshots:

  • /home/kayg/Developer/calternal/target/breakit/cont-breakit-117/full/cal-week_320-paper.png
  • /home/kayg/Developer/calternal/target/breakit/cont-breakit-117/full/cal-month_320-paper.png

Calendar UI is outside the #117 job’s permitted fix areas, so this is evidence for this existing issue rather than a branch change.

The #117 break-it sweep independently reproduced the low-contrast calendar text at 320px in the paper theme. The contrast detector measured weekday and date labels at 3.95:1 (required 4.5:1), and the month-view weekend labels at 3.40:1. A week-view “+3” chip measured 4.30:1. Screenshots: - `/home/kayg/Developer/calternal/target/breakit/cont-breakit-117/full/cal-week_320-paper.png` - `/home/kayg/Developer/calternal/target/breakit/cont-breakit-117/full/cal-month_320-paper.png` Calendar UI is outside the #117 job’s permitted fix areas, so this is evidence for this existing issue rather than a branch change.
Author
Owner

The corrected #117 sweep also reproduced the existing calendar overlap/clipping at 768px in the paper theme:

  • On Home/week, date numbers 20 and 22 overlap the Mon and Wed weekday labels.
  • Month view reports Sep clipped by the Sep 1 cell.
  • Out-of-month day buttons measured 2.93:1 against the paper surface.

Screenshots: /home/kayg/Developer/calternal/target/breakit/cont-breakit-117/full-final/home_768-paper.png, cal-week_768-paper.png, and cal-month_768-paper.png.

The corrected #117 sweep also reproduced the existing calendar overlap/clipping at 768px in the paper theme: - On Home/week, date numbers `20` and `22` overlap the `Mon` and `Wed` weekday labels. - Month view reports `Sep` clipped by the `Sep 1` cell. - Out-of-month day buttons measured 2.93:1 against the paper surface. Screenshots: `/home/kayg/Developer/calternal/target/breakit/cont-breakit-117/full-final/home_768-paper.png`, `cal-week_768-paper.png`, and `cal-month_768-paper.png`.
Author
Owner

Merged into dev and deployed to calternal.kayg.org at 6440a5f (gates: fmt, svelte-check 0 errors, 398 web tests, clippy, workspace tests all pass).

Merged into dev and deployed to calternal.kayg.org at 6440a5f (gates: fmt, svelte-check 0 errors, 398 web tests, clippy, workspace tests all pass).
kayg closed this issue 2026-09-26 10:25:38 +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#134
No description provided.