Queue-North-Website/src
Scarlett 231f07c62d fix(ui): header CTA clipped at iPad portrait, and reCAPTCHA cut off at 320px
Two real defects, found by rendering the site rather than reading it. Neither
was among the twenty issues filed for Batches 10 and 11.

#214 (P1) — at exactly 768px, iPad portrait, the header's "Request
Consultation" CTA measured x 676-778 against a 768px viewport: 10px sliced off,
with no scrollbar to reveal it because html/body carry overflow-x:hidden. At
that width the burger menu is already hidden, so the primary conversion action
was simply unreachable. The nav's five gap-6 gaps were the slack; gap-4 at md
(gap-6 from lg) frees 40px, keeping the CTA on screen at md rather than
deferring it to lg and leaving 768-1023px with no CTA at all.

#215 (P2) — Google's reCAPTCHA checkbox iframe is a fixed 304px that cannot be
resized. At 320px it measured x 41-345, so 25px of branding and the privacy and
terms links were clipped. Scaled to 0.85 below 360px with the wrapper height
reduced to match, since transform does not affect layout and the form would
otherwise gain dead space.

Also adds scripts/qa-browser.mjs, which found them. It measures horizontal
scroll, broken images, elements past the right edge, CLS and LCP across pages
and viewports. Written because seven of the ten issues in Batches 10 and 11
misstated their own evidence, and two of those would have made the site worse
if actioned.

Two false positives in the tool itself, both fixed before trusting it:
- Lazy images below the fold read as broken. It now scrolls the page AND chases
  each un-loaded image individually, and reports observed HTTP failures apart
  from never-rendered images.
- `--paths / --viewports 320` swallowed "320" as a path. Argument collection now
  stops at the next flag.

Verified against a local production build: 5 paths x 5 viewports, zero findings.
Before the fix the same run reported the CTA overflow at 768 on four pages and
the reCAPTCHA overflow at 320 on /contact.

Not yet live — this needs a release and a deploy.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
2026-08-18 04:05:37 -05:00
..
components fix(ui): header CTA clipped at iPad portrait, and reCAPTCHA cut off at 320px 2026-08-18 04:05:37 -05:00
data feat(seo): publish privacy policy, remove street address, prerender all routes (batch 0.9.3) 2026-08-01 01:45:52 -05:00
hooks fix: close issues #12 #15 #17 #18 — CSP nonce, API retry, input debounce, caching verified (batch 0.6.1) 2026-05-17 16:10:10 -05:00
lib feat(seo): publish privacy policy, remove street address, prerender all routes (batch 0.9.3) 2026-08-01 01:45:52 -05:00
pages fix(a11y): visible focus indicator, aria-expanded, and six Label-in-Name failures 2026-08-18 02:31:13 -05:00
App.jsx fix: header CTA visibility, scroll-to-top, 404 page (#104 #89 #88) (batch 9.1) 2026-05-17 21:37:42 -05:00
entry-server.jsx feat(seo): publish privacy policy, remove street address, prerender all routes (batch 0.9.3) 2026-08-01 01:45:52 -05:00
index.css fix(ui): header CTA clipped at iPad portrait, and reCAPTCHA cut off at 320px 2026-08-18 04:05:37 -05:00
main.jsx feat(seo): publish privacy policy, remove street address, prerender all routes (batch 0.9.3) 2026-08-01 01:45:52 -05:00
router.jsx feat(seo): publish privacy policy, remove street address, prerender all routes (batch 0.9.3) 2026-08-01 01:45:52 -05:00
routes.jsx feat(seo): publish privacy policy, remove street address, prerender all routes (batch 0.9.3) 2026-08-01 01:45:52 -05:00