chore(web): drop zoom: 1.2 hack from index.css #212

New issue

Closed

opened 2026-04-21 10:29:42 +00:00 by claude-desktop · 1 comment

claude-desktop commented

2026-04-21 10:29:42 +00:00

Collaborator

User story

As a dashboard operator, I want the html { zoom: 1.2 } workaround removed from apps/web/src/styles/index.css, so that the app relies purely on design-token-sized typography without a global scale factor that interacts poorly with accessibility zoom, screenshot tooling, and Playwright viewport assertions.

Dependencies

Blocked by #209 — once every text-[Npx] literal flows through the font-size tokens, bumping token values is the right scaling lever. Keeping zoom on top becomes pure debt.

Acceptance criteria

Remove the html { zoom: 1.2 } block in apps/web/src/styles/index.css (approx. lines 71-79) along with its explanatory comment.
If the app reads too small after removal, bump the --ch-font-size-* token values in design/tokens.json + regenerate tokens.css (this is now a token-level decision, not a global zoom).
Visual smoke on every page — any component that still looks wrong indicates a residual text-[Npx] literal that #209 missed; file a follow-up rather than re-adding zoom.
bun run build clean, Playwright Monitor e2e still passes.

Out of scope

Further typography tuning beyond the remove-and-resize pass.
Re-introducing zoom under any alias or media query — the point of this ticket is to delete the hack permanently.

References

Styling audit report (2026-04-21) — section 8 (cost to remove the zoom hack).
apps/web/src/styles/index.css:71-79 — the block to remove.

## User story As a dashboard operator, I want the `html { zoom: 1.2 }` workaround removed from `apps/web/src/styles/index.css`, so that the app relies purely on design-token-sized typography without a global scale factor that interacts poorly with accessibility zoom, screenshot tooling, and Playwright viewport assertions. ## Dependencies - **Blocked by #209** — once every `text-[Npx]` literal flows through the font-size tokens, bumping token values is the right scaling lever. Keeping `zoom` on top becomes pure debt. ## Acceptance criteria - [ ] Remove the `html { zoom: 1.2 }` block in `apps/web/src/styles/index.css` (approx. lines 71-79) along with its explanatory comment. - [ ] If the app reads too small after removal, bump the `--ch-font-size-*` token values in `design/tokens.json` + regenerate `tokens.css` (this is now a token-level decision, not a global zoom). - [ ] Visual smoke on every page — any component that still looks wrong indicates a residual `text-[Npx]` literal that #209 missed; file a follow-up rather than re-adding `zoom`. - [ ] `bun run build` clean, Playwright Monitor e2e still passes. ## Out of scope - Further typography tuning beyond the remove-and-resize pass. - Re-introducing `zoom` under any alias or media query — the point of this ticket is to delete the hack permanently. ## References - Styling audit report (2026-04-21) — section 8 (cost to remove the zoom hack). - `apps/web/src/styles/index.css:71-79` — the block to remove.

claude-desktop added the

area:dashboard

type:chore

labels

2026-04-21 10:29:58 +00:00