refactor(pages): switch summary to ChapterLayout

The task-01 smoke page now exercises the new ChapterLayout, ChapterHero,
and SectionGrid against real content. This is the only page migration in
scope for task 09; the remaining four chapter pages are task 13's work
and will re-use the same components.

Output diff: dist/summary/index.html preserves the legacy 'ROUTE MAP'
label, the 'Ship the system.' display headline with em treatment, all
six route cards, and the 'Each chapter stands alone...' footer text.
chapters.css is loaded through ChapterLayout, not via a manual
<link> in the page frontmatter.

Verification: pnpm run gate green. 42 assertions intact. No new
assertions, none deleted.
This commit is contained in:
Marcos Paulo
2026-09-05 07:10:01 +00:00
parent 23060cca74
commit 9c013b056b
+52 -56
View File
@@ -1,63 +1,59 @@
---
import BaseLayout from '../layouts/BaseLayout.astro';
import chaptersStylesheet from '../../chapters.css?url';
import ChapterLayout from '../layouts/ChapterLayout.astro';
import ChapterHero from '../components/blocks/ChapterHero.astro';
import SectionGrid from '../components/blocks/SectionGrid.astro';
const base = import.meta.env.BASE_URL;
const introduction =
'This guide turns AI work into a shape: frame the problem, choose the model and agent, isolate changes, teach repeatable decisions, and verify the result.';
---
<BaseLayout title="AI For Dummies — Route map" description="">
<link slot="styles" rel="stylesheet" href={chaptersStylesheet} />
<main>
<header class="top">
<a href={`${base}full-guide/`}> AI FOR DUMMIES</a>
<span>00 / ROUTE MAP</span>
<a href={`${base}skills-review/`}>review desk </a>
</header>
<section class="hero">
<p class="eyebrow">Start here</p>
<h1>Ship the<br /><em>system.</em></h1>
<p>{introduction}</p>
</section>
<section class="grid">
<article class="card">
<b>01</b><h2>Models</h2><p>Capability and effort are separate knobs.</p><a
href={`${base}models/`}>Open chapter </a
>
</article>
<article class="card">
<b>02</b><h2>Agents & trees</h2><p>Bound roles, handoffs, and worktrees.</p><a
href={`${base}agents/`}>Open chapter </a
>
</article>
<article class="card">
<b>03</b><h2>Skills</h2><p>Capture repeatable decisions.</p><a href={`${base}skills/`}
>Open chapter </a
>
</article>
<article class="card">
<b>04</b><h2>Rules</h2><p>Connect guidance to enforcement.</p><a href={`${base}rules/`}
>Open chapter </a
>
</article>
<article class="card">
<b>05</b><h2>Practice</h2><p>Compare prompts and skill-enabled runs.</p><a
href={`${base}hands-on/starter/`}>Open lab </a
>
</article>
<article class="card">
<b>06</b><h2>Review desk</h2><p>Browse original files and improved drafts.</p><a
href={`${base}skills-review/`}>Open desk </a
>
</article>
</section>
<nav class="links">
<a href={`${base}full-guide/`}>Full field guide</a>
<a href={`${base}docs/operations-guide.md`}>Operations guide</a>
</nav>
<footer>
Each chapter stands alone; the order follows a real task becoming a reliable change.
</footer>
</main>
</BaseLayout>
<ChapterLayout title="AI For Dummies — Route map" description="">
<a slot="top-previous" href={`${base}full-guide/`}> AI FOR DUMMIES</a>
<span slot="top-center">00 / ROUTE MAP</span>
<a slot="top-next" href={`${base}skills-review/`}>review desk </a>
<ChapterHero eyebrow="Start here">
<span slot="title">Ship the<br /><em>system.</em></span>
<p>{introduction}</p>
</ChapterHero>
<SectionGrid>
<article class="card">
<b>01</b><h2>Models</h2><p>Capability and effort are separate knobs.</p><a
href={`${base}models/`}>Open chapter </a
>
</article>
<article class="card">
<b>02</b><h2>Agents & trees</h2><p>Bound roles, handoffs, and worktrees.</p><a
href={`${base}agents/`}>Open chapter </a
>
</article>
<article class="card">
<b>03</b><h2>Skills</h2><p>Capture repeatable decisions.</p><a href={`${base}skills/`}
>Open chapter </a
>
</article>
<article class="card">
<b>04</b><h2>Rules</h2><p>Connect guidance to enforcement.</p><a href={`${base}rules/`}
>Open chapter </a
>
</article>
<article class="card">
<b>05</b><h2>Practice</h2><p>Compare prompts and skill-enabled runs.</p><a
href={`${base}hands-on/starter/`}>Open lab </a
>
</article>
<article class="card">
<b>06</b><h2>Review desk</h2><p>Browse original files and improved drafts.</p><a
href={`${base}skills-review/`}>Open desk </a
>
</article>
</SectionGrid>
<a slot="footer-links" href={`${base}full-guide/`}>Full field guide</a>
<a slot="footer-links" href={`${base}docs/operations-guide.md`}>Operations guide</a>
<span slot="footer-text">
Each chapter stands alone; the order follows a real task becoming a reliable change.
</span>
</ChapterLayout>