diff --git a/docs/branch-review-records/81997d38c381bb8080a941b3ba8e54540b842a4341cf4b38c4b6f6a3b91ce316.record.md b/docs/branch-review-records/81997d38c381bb8080a941b3ba8e54540b842a4341cf4b38c4b6f6a3b91ce316.record.md new file mode 100644 index 0000000000..8573b0b878 --- /dev/null +++ b/docs/branch-review-records/81997d38c381bb8080a941b3ba8e54540b842a4341cf4b38c4b6f6a3b91ce316.record.md @@ -0,0 +1 @@ +| 2026-08-18 | claude/patient-factsheets-search-regression-8iyvnd | 1d16190bf74bd92faf272f17eab426ed08f37776 | src/components/mode-home-template.tsx,tests/mode-home-main-align.test.ts (correction to prior record's src/components/mode-home-template.tsx claim) | approved | corrected the min-height calc flagged by frontend-ui-reviewer (prior record understated verification: missed a broken tests/mode-home-main-align.test.ts and a live 40px phone scroll-overflow regression); full npm run test now green (661 files, 7079 passed, 4 skipped), tests/mode-home-main-align.test.ts run directly (5 passed), typecheck/eslint/prettier clean, live check of document.documentElement.scrollHeight vs window.innerHeight on /factsheets /differentials /dsm shows zero overflow | diff --git a/docs/branch-review-records/c7d5291702bbc1acdbe61d91c20665e02df1aa60d3560900cd46e5c272b72d0a.record.md b/docs/branch-review-records/c7d5291702bbc1acdbe61d91c20665e02df1aa60d3560900cd46e5c272b72d0a.record.md new file mode 100644 index 0000000000..ff6749e856 --- /dev/null +++ b/docs/branch-review-records/c7d5291702bbc1acdbe61d91c20665e02df1aa60d3560900cd46e5c272b72d0a.record.md @@ -0,0 +1 @@ +| 2026-08-18 | claude/patient-factsheets-search-regression-8iyvnd | 8b2ac1cd1cffcb92a13d66341e5d82d3f8067aa8 | src/lib/search-command-surface.ts,src/components/mode-home-template.tsx | approved | test:focused (283 passed), typecheck clean, eslint clean, prettier clean, live Playwright verification at 390x844 against /factsheets, /dsm, /differentials | diff --git a/src/components/mode-home-template.tsx b/src/components/mode-home-template.tsx index 70865572ed..2bf9e1cb31 100644 --- a/src/components/mode-home-template.tsx +++ b/src/components/mode-home-template.tsx @@ -140,8 +140,26 @@ export function ModeHomeHero({ export type ModeHomeMainAlign = "center" | "start" | "startOnPhone"; const MODE_HOME_MAIN_ALIGN_CLASS: Record = { - // Short empty homes — centre in the visible canvas. - center: "justify-center pt-[clamp(1.25rem,4vh,2.25rem)] sm:pt-[clamp(1.75rem,5vh,3.25rem)]", + // Short empty homes — centre in the visible canvas. `justify-center` alone + // has no visible effect on phone: `
`'s immediate parent + // (`mobile-composer-reserve-pad` in GlobalSearchShell) is a plain block + // element, not a flex container, so `
`'s `flex-1` never fires there + // and the box shrinks to its own content height instead of stretching to + // fill the viewport — there is nothing to centre within. The sm+ rule + // already carries an explicit `min-h` for the same reason, but its formula + // (`100dvh - shell-header-h`) is NOT safe to reuse verbatim below sm: on + // phone, `mobile-composer-reserve-pad` also adds real top/bottom padding + // (`--phone-overlay-chrome-h`, `--mobile-composer-reserve`) that is zero at + // sm+ but not on phone. Subtracting only the header there under-accounts + // for that padding and pushes the document past the viewport (~40px + // overflow, live-verified) — so both padding terms are subtracted here too. + // `--mobile-composer-reserve` is a live CSS var, not a baked-in constant: + // this composes correctly if its value ever changes for a route that + // adopts `center`, at the cost of animating alongside it exactly as the + // reserve pad's own padding does — that's the correct behaviour, not jank, + // since the available space genuinely is changing too. + center: + "justify-center pt-[clamp(1.25rem,4vh,2.25rem)] sm:pt-[clamp(1.75rem,5vh,3.25rem)] max-sm:min-h-[calc(100dvh-var(--phone-overlay-chrome-h)-var(--mobile-composer-reserve))]", // Tall results / content — keep the top reachable on every breakpoint. start: "justify-start pt-3 sm:pt-4", // Content-rich homes that still fit after sm — top-align on phone only. diff --git a/src/lib/search-command-surface.ts b/src/lib/search-command-surface.ts index 506782033a..c7da653a39 100644 --- a/src/lib/search-command-surface.ts +++ b/src/lib/search-command-surface.ts @@ -153,6 +153,16 @@ const searchCommandSurfaceByMode: Partial { expect(modeHomeSource).toMatch(/export type ModeHomeMainAlign/); expect(modeHomeSource).toMatch(/MODE_HOME_MAIN_ALIGN_CLASS/); expect(modeHomeSource).toMatch(/withoutJustifyUtilities/); - expect(modeHomeSource).toMatch(/center: "justify-center/); + // `\s*` (not a literal space) tolerates Prettier moving a long value onto + // its own line — this only asserts the value itself starts with the + // right justify-* utility, not source-line adjacency to the key. + expect(modeHomeSource).toMatch(/center:\s*"justify-center/); expect(modeHomeSource).toMatch(/start: "justify-start/); expect(modeHomeSource).toMatch(/startOnPhone: "justify-start/); // Must strip responsive/prefixed justify utilities, not only bare ones.