docs: 15e cannot delete responsive.css before the cutover

2026-09-05 23:34:29 +00:00
parent 0bca43cbfd
commit aefbd206f9
1 changed files with 41 additions and 0 deletions
@@ -82,3 +82,44 @@ read the legacy files, so deleting `responsive.css` and breaking every mobile
 layout passes it cleanly. Before you claim done, diff the **built** CSS
 (`dist/_astro/*.css`) against `main` and enumerate every declaration that
 disappeared. Each one is either present elsewhere or a regression.
 ## Attempt 1 stopped short — and the goal as written is not reachable yet
 Preserved as `rejected/15e-attempt-1` (`d2312d7`). Start by reading that diff:
 it ported rules into `ChapterHero`, `FleetDiagram`, `RouteTable`, `WorktreeMap`,
 `LanguageToggle`, `ReadingProgress`, `agents.astro`, `full-guide.astro` and
 `tokens.css`, and it added `pixelmatch`, `pngjs` and `postcss` plus a working
 screenshot-compare harness. Reuse all of it. It never finished the comparison
 loop and never committed on its own.
 It also deleted `responsive.css` while **`full-guide/index.html` still links
 it**. That page is the live site until task 20 cuts over; deleting the
 stylesheet strips it. `src/components/islands/GuideSelector.astro` still
 references it too.
 So the "delete it" checkbox in this brief cannot be honestly ticked before the
 cutover. Do not tick it, and do not delete the file. **The deliverable is
 everything up to the deletion:**
 - Every rule `responsive.css` provides to an Astro route lives with the
  component that needs it, or in `tokens.css`.
 - No `.astro` file and no Astro layout links `responsive.css` any more.
 - `full-guide/index.html` still links it, unchanged, and still renders exactly
  as it does today.
 - A list, in this file, of the rules that remain in `responsive.css` solely for
  the legacy page — that list is the deletion checklist task 20 will execute.
 Amend the "Done when" boxes to match before you start, and say in your final
 report that the file is intentionally still present.
 ### One rule to port properly while you are in there
 `.route-meter span` animates `height: var(--score)` — a layout property, which
 task 18 was meant to eliminate. 18 changed it in `responsive.css` and that
 change was reverted (`0bca43c`) because it belongs in the component, not in a
 legacy file. When you port this rule, port it as
 `transform: scaleY(var(--score)); transform-origin: bottom` with `height: 100%`.
 `--score` is set inline as a percentage (`--score:92%`) by `GuideSelector.astro`
 and `full-guide.astro`; a percentage in `scaleY()` is valid and was verified
 rendering correctly at `matrix(1, 0, 0, 0.92, 0, 0)`. Leave the legacy
 `responsive.css` copy of the rule alone.