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>
1.8 KiB
Task 18 — Motion pass
Agent: motion-designer · Model: Gemini (perceptual judgement)
Depends on: 15, 16 · Parallel with: 19
Worktree: .agents/scripts/worktree.sh start 18 motion
Goal
Audit the motion that exists, add only motion that earns its place, and make
prefers-reduced-motion correct everywhere.
Order of work — audit first
The audit is worth more than the additions.
- Inventory every
transition,animation,@keyframes,transforminsrc/. - Flag anything animating a layout property (
width,height,top,left,margin). Those force reflow every frame and fail the 200ms INP budget. The Stylelint config already blocks new ones; find the ported ones. - Confirm every animated element has a reduced-motion path, then test it under DevTools emulation. Reduced means reduced, not broken — end states must still be correct.
Then, sparingly
Candidates, each needing a written purpose:
- tab panel change in the guide (state change — justified)
- review-desk detail swap on selection (state change — justified)
- vote widget tally update (feedback — justified)
transform and opacity only. 150–250ms. cubic-bezier(.2,0,0,1). One thing
moves at a time — no staggered card cascades; this design has a point of view
and staggering reads as a template.
View transitions — optional, decide explicitly
Astro's <ClientRouter /> is the only sanctioned motion dependency. If adopted,
verify: JS-disabled navigation, browser back/forward, the review desk's six
query params, and reduced motion. If any fails, do not ship it.
Done when
- Zero animations on layout properties
- Every animation has a one-line written purpose
- Reduced-motion tested under emulation; end states correct
- Before/after captures attached;
npm run gategreen