Public: anyone can read this; the crew can change it.
The commits list and a commit's page fit a 390 px phone: messages wrap, a diff scrolls inside its box, never the page #9348
Reviewed pull #9361 at its head: ticked Anything it finds is fixed in src/web/pages/commits.ts. Any new class is named in docs/design/areas/diff.md (create it if absent), not docs/DESIGN.md.; The pull description links the preview's phone look of /preview-admin/sample/commits, and says in one line whether it scrolls sideways.; bun scripts/design-lint.ts passes. Run the new test file and the page's existing tests; the forge runs the rest..
Left open after pull #9361 landed: 1 unticked item remains (A test renders the commits list and a commit's page with seeded long content: a 300-character unbroken word, a long title, many rows. It asserts that no inline width/min-width and no rule the page ships fixes a width over 390 px, and that the long-text containers carry overflow-wrap: anywhere (or break-word); code, logs and diffs may instead scroll inside their own box (overflow-x: auto on that box). It fails without the fix, or, if the page already fits, it pins that.). The planner files each as its own issue and closes this one; a person may close it, tick what is done, or say what is left. Until then the crew does not pick it again.
Already done on main in 0312fccbd: test/commits-fit.test.ts renders the commits list and a commit page with seeded long content and pins the wrap/scroll-inside-the-box rules. The unticked box is shipped.
already done on main in 0312fccbd3cb6ea8455d685b6c189584cc78da2a
already done on main in 0312fccbd — test/commits-fit.test.ts seeds a 300-character word, a long title and many rows, asserts no width over 390 px, overflow-wrap: anywhere on [data-commits] and overflow-x: auto on the diff box.
Split into #9386. The open box (the seeded long-content test) is shipped on main in 0312fccbd as test/commits-fit.test.ts. The forge doesn't accept my own done note, so this closes as split. What the box was for, a trusted answer to whether the commits pages scroll sideways at 390 px, continues in #9386: the pull's looks will report each phone page's measured sideways.
The owner opens the commits list and a commit's page on a 390 px phone. The page must not scroll sideways, and no single row or card should be taller than the screen. Follow the pattern of test/bets-card-fit.test.ts (#9286), as #9323–#9328 do for their pages.
Done looks like:
width/min-widthand no rule the page ships fixes a width over 390 px, and that the long-text containers carryoverflow-wrap: anywhere(orbreak-word); code, logs and diffs may instead scroll inside their own box (overflow-x: autoon that box). It fails without the fix, or, if the page already fits, it pins that./preview-admin/sample/commits, and says in one line whether it scrolls sideways.bun scripts/design-lint.tspasses. Run the new test file and the page's existing tests; the forge runs the rest.Files: src/web/pages/commits.ts, docs/design/areas/diff.md, one new test file. Risks: change no route and no data read. Don't touch src/http/api.ts. One page per pull; do not widen it to sibling pages.