Change evidence report
PR 1901 replaces the booking widget mobile daily carousel with one chronological semantic list. Exact-revision browser evidence now covers 320, 375 and 430 CSS pixels in both light and dark themes with long session, instructor and location labels, plus desktop daily and weekly states. All observed pages remain within their viewport and navigation controls measure 44 by 44 pixels.
9d8fdc955b1bf705f129ec5ac981fca02f88d911…e9a416393505b841607c5cb4987297afaeec03eaReviewer brief
At 320 CSS pixels the exact current base renders a 569 pixel horizontal snap carousel inside a 286 pixel viewport with no semantic list. The exact candidate renders two vertical UL list items at every mobile width and theme, preserves all content and Book actions, has no page overflow, keeps 44 by 44 pixel navigation controls, and preserves desktop daily and weekly modes.
The before image was rebuilt from current merge-base 9d8fdc955b1b. Every matrix and desktop after image was rebuilt from candidate code head e9a416393505 with the same deterministic two-session fixture. The fixture deliberately uses long class, instructor and location labels. Full immutable SHAs are recorded in Scope. No production data was used.
Claim map
Each material changed behavior or state maps to direct evidence or an explicit gap.
| Behavior or claim | Evidence | Status |
|---|---|---|
| Mobile daily sessions form one vertical chronological semantic list instead of a snap carousel | Exact current-base and candidate 320px light comparison plus UL and direct-LI runtime inspection | Covered |
| Long class, instructor and location labels stay within 320, 375 and 430px | Six exact-head captures, light and dark at every width; document scrollWidth equals clientWidth in all six | Covered |
| Session time, duration, type, instructor, facility, availability and booking action remain visible | Every matrix capture uses the same dense two-session fixture and retains both Book actions | Covered |
| Mobile calendar controls meet 44px targets | Day, Previous week and Next week each measure 44 by 44 pixels at 320, 375 and 430px in both themes | Covered |
| Desktop daily and weekly modes remain intact | Exact-head 1200px captures and runtime aria-pressed state for both modes; no horizontal overflow | Covered |
| Shared responsive behavior is defended automatically | BookingCalendar and WeekDayPicker suites: 68 passed, 0 failed, 320 assertions; Widgets typecheck passed | Covered |
Observed change
Evidence is grouped by the reviewer question each item addresses.
Booking widget, 320px light
ScreenshotSame exact two-session fixture at 320 by 900 CSS pixels. The base uses a 569px snap carousel inside 286px; the candidate exposes a semantic UL with two vertically separated rows and no page overflow.
Booking widget, 320px dark
ScreenshotThe semantic list remains within 320 CSS pixels. Root text computes to rgb(250, 250, 250) under the dark theme class.
Booking widget, 375px light
ScreenshotTwo list rows remain within the 375px document and retain all dense fixture content.
Booking widget, 375px dark
ScreenshotThe dark variant uses the same fixture, dimensions and controls without horizontal page overflow.
Booking widget, 430px light
ScreenshotRows expand to 364px while remaining vertical and retaining every session detail and action.
Booking widget, 430px dark
ScreenshotDark text and controls remain readable with the same 430px geometry.
Booking widget, desktop daily
ScreenshotAt 1200 by 900 CSS pixels, Day is aria-pressed, both sessions render as full-width rows and the document has no horizontal overflow.
Booking widget, desktop weekly
ScreenshotSwitching the same exact candidate to Week preserves the weekly grid, two session targets and the 1200px document boundary.
Measured behavior
TableAll measurements came from exact base and candidate Storybook builds with one deterministic fixture.
| Revision and state | Observed geometry or semantics | Result |
|---|---|---|
| Base 9d8fdc955b1b, 320 light | Carousel 569px scroll width / 286px client width; zero semantic UL matches | Horizontal carousel reproduced |
| Head e9a416393505, 320 light/dark | Document 320px; two 254px direct LI rows; root dark class toggles explicitly | Vertical semantic list, no overflow |
| Head e9a416393505, 375 light/dark | Document 375px; two 309px direct LI rows | Dense labels wrap, no overflow |
| Head e9a416393505, 430 light/dark | Document 430px; two 364px direct LI rows | Dense labels wrap, no overflow |
| Head e9a416393505, all six mobile states | Day, Previous week and Next week each 44 by 44px | Touch targets covered |
| Head e9a416393505, 1200 daily/weekly | Document 1200px; Day then Week aria-pressed; two sessions in each mode | Desktop modes preserved |
Confidence
68 passed, 0 failed, 320 assertions on the rebased candidate
bun run --filter @sauna-crm/widgets typecheck exited successfully
320, 375 and 430 CSS pixels in light and dark, all with two semantic rows, long labels, no document overflow and 44px controls
1200px daily and weekly captures, both aria-pressed transitions and two session targets observed without overflow
Limits
Localized content can exceed the deterministic fixture The fixture intentionally uses long English class, instructor and location labels. Automated tests also defend dense wrapping, but no finite screenshot matrix can represent every locale or user-authored string.