Marcos Paulo
43 lines
1.8 KiB
Markdown
43 lines
1.8 KiB
Markdown
# Task 15e — Retire responsive.css
|
|
|
|
**Agent**: `design-system-keeper` · **Model**: `agy` (Gemini 3.1 Pro — vision)
|
|
**Depends on**: 15d, 16 · **Blocks**: 20 **Worktree**:
|
|
`.agents/scripts/worktree.sh start 15e responsive-css`
|
|
|
|
## Goal
|
|
|
|
`responsive.css` is 30 KB and mostly served `/full-guide/`. Once 15d and 16 have
|
|
landed, port what the Astro pages still need into component styles or
|
|
`tokens.css`, prove the remainder dead, and delete it.
|
|
|
|
**Proof is screenshots, not reading.** A rule that looks unused because no
|
|
selector matches at 1600 px may be the only thing holding the 560 px layout
|
|
together.
|
|
|
|
## Method
|
|
|
|
1. Build. Screenshot every migrated route at 560 / 800 / 1100 / 1600 px.
|
|
2. Remove `responsive.css` from the build entirely.
|
|
3. Screenshot again. Every diff is a rule you must port.
|
|
4. Port it into the owning component's `<style>`, or — if it is a real token —
|
|
into `tokens.css`, which **you own**. No other agent may add tokens.
|
|
5. Repeat until the diffs are empty.
|
|
|
|
## Constraints
|
|
|
|
- Allowed breakpoints are 560 / 800 / 1100 / 1600 / 2200 px.
|
|
`.agents/scripts/check-tokens.mjs` rejects others.
|
|
- Do not delete the file while any legacy page still loads it. Check which
|
|
routes have actually been migrated at the time you run; 20 is the cutover.
|
|
- No raw hex, no `font-size: Npx` outside `tokens.css`.
|
|
- You are also the owner of the ~190 accumulated `/* token-gap: ... */` markers.
|
|
Resolving them is **not** in this brief — do not start. Report the count so it
|
|
can be scheduled.
|
|
|
|
## Done when
|
|
|
|
- [ ] Screenshot diffs empty at all four widths without `responsive.css`
|
|
- [ ] Ported rules live with the component that needs them, or in `tokens.css`
|
|
- [ ] `responsive.css` deleted, and nothing references it
|
|
- [ ] `pnpm run gate` green; 42 assertions intact
|