Files
ai-for-dummies/plans/astro-refactor/task-09-chapter-blocks.md
T
Marcos Paulo aae4d42229 docs: add .agents workspace and the Astro refactor plan
Adds the agent-facing workspace and a 20-task plan for migrating the site
to Astro. Nothing here implements the refactor; these are briefs, rules and
templates that the task agents read.

- .agents/ holds context, rules, checklists, skills, specialist agents,
  component/page/config templates and gate scripts. It is vendor-neutral so
  MiniMax, Gemini and Codex can all read it; CLAUDE.md just points at
  AGENTS.md.
- .husky/ plus .lintstagedrc.json wire the three gate tiers. gate.sh locks on
  the shared git-common-dir so parallel worktrees serialise, and guards the
  assertion count in scripts/verify.mjs against a coverage drop.
- plans/astro-refactor/ carries the phase graph, per-task briefs and the
  model-routing recommendation.

These files must be tracked before fanning out: a worktree only checks out
tracked files, so an untracked plan is invisible to every agent working in one.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-09-05 01:18:27 +00:00

1.3 KiB

Task 09 — Chapter blocks

Agent: component-builder · Model: MiniMax-M3 Depends on: 07 · Parallel with: 08, 10, 11 · Blocks: 13, 14 Worktree: .agents/scripts/worktree.sh start 09 chapter-blocks

Goal

The shared furniture of /models/, /agents/, /skills/, /summary/, /rules/ — five pages that today duplicate the same markup five times.

Scope

src/components/blocks/ChapterHero.astro, SectionGrid.astro, ComparisonTable.astro, TopBar.astro, SiteFooter.astro. src/layouts/ChapterLayout.astro.

Source

chapters.css is already the shared layer; the duplication is in the five HTML files. Diff them against each other first — what differs is props, what matches is the component.

Watch for

  • TopBar carries aria-current="page". Preserve it; it is the only indication of location for assistive tech.
  • The tables in /models/ and /rules/ scroll horizontally on narrow screens (overflow-x:auto, min-width on the inner element). Keep that — dropping it makes the tables unreadable on a phone, and audit-ui.mjs asserts related responsive tokens.

Done when

  • All five pages' markup expressible with these components
  • Rendered text identical to current pages
  • Zero JS
  • Checklist complete; npm run gate green