chore: bump form input font-size to 16px to prevent iOS focus-zoom #6

Merged
brendan merged 1 commits from chore/nanodrop-ios-input-no-zoom into main 2026-05-11 03:12:45 +00:00
Owner

Final retrofit (5 of 5) in the cross-project iOS focus-zoom chore. Sibling PRs already merged: authd #11, buchinese #5, inventory #18, movement #15.

Change

public/style.css — bump font-size: 13px16px inside the input[type="text"], input[type="password"], input[type="file"] block (one line). Mirrors movement PR #15 (Approach A2 minimum-diff) — nanodrop has no <textarea>/<select> so the universal selector adds no extra coverage.

Why

iOS Safari auto-zooms when the user taps a text-entry input whose computed font-size is below 16px. Standing rule lives in ~/.claude/CLAUDE.md under "Web form input font-size".

Coverage

All text-entry inputs in src/views/*.ts are covered:

  • login.ts username <input type="text"> — covered.
  • login.ts <input type="password"> — covered.
  • upload.ts <input type="file"> — exempt (no soft keyboard); harmlessly bumped along.
  • upload.ts .share-box <input type="text" readonly> — covered via inheritance; iOS does not focus-zoom readonly inputs anyway.

No <textarea> or <select> exist in the codebase.

Tests

Added one CSS-shape regression test in tests/integration/style.test.ts asserting the rule body declares font-size ≥16px. npm test: 126/126 passing. npm run build: clean.

Verification

Needs manual iOS verification by user post-merge.

Final retrofit (5 of 5) in the cross-project iOS focus-zoom chore. Sibling PRs already merged: authd #11, buchinese #5, inventory #18, movement #15. ## Change `public/style.css` — bump `font-size: 13px` → `16px` inside the `input[type="text"], input[type="password"], input[type="file"]` block (one line). Mirrors movement PR #15 (Approach A2 minimum-diff) — nanodrop has no `<textarea>`/`<select>` so the universal selector adds no extra coverage. ## Why iOS Safari auto-zooms when the user taps a text-entry input whose computed `font-size` is below 16px. Standing rule lives in `~/.claude/CLAUDE.md` under "Web form input font-size". ## Coverage All text-entry inputs in `src/views/*.ts` are covered: - `login.ts` username `<input type="text">` — covered. - `login.ts` `<input type="password">` — covered. - `upload.ts` `<input type="file">` — exempt (no soft keyboard); harmlessly bumped along. - `upload.ts` `.share-box <input type="text" readonly>` — covered via inheritance; iOS does not focus-zoom readonly inputs anyway. No `<textarea>` or `<select>` exist in the codebase. ## Tests Added one CSS-shape regression test in `tests/integration/style.test.ts` asserting the rule body declares `font-size` ≥16px. `npm test`: 126/126 passing. `npm run build`: clean. ## Verification Needs manual iOS verification by user post-merge.
brendan added 1 commit 2026-05-11 03:12:37 +00:00
Final retrofit in the cross-project iOS focus-zoom chore (after authd PR
#11, buchinese PR #5, inventory PR #18, movement PR #15). Enforces the
standing rule in ~/.claude/CLAUDE.md: text-entry inputs must compute to
font-size >= 16px so iOS Safari does not auto-zoom on focus.
brendan merged commit 4df874b695 into main 2026-05-11 03:12:45 +00:00
Sign in to join this conversation.