netcracker/ai-for-dummies
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(pages): switch summary to ChapterLayout

Browse Source 
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
1 changed files with 52 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/summary.astro
+52 -56
View File
@@ -1,63 +1,59 @@
--- ---
import BaseLayout from '../layouts/BaseLayout.astro'; import ChapterLayout from '../layouts/ChapterLayout.astro';
import chaptersStylesheet from '../../chapters.css?url'; import ChapterHero from '../components/blocks/ChapterHero.astro';
import SectionGrid from '../components/blocks/SectionGrid.astro';
const base = import.meta.env.BASE_URL; const base = import.meta.env.BASE_URL;
const introduction = 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.'; '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=""> <ChapterLayout title="AI For Dummies — Route map" description="">
<link slot="styles" rel="stylesheet" href={chaptersStylesheet} /> <a slot="top-previous" href={`${base}full-guide/`}>← AI FOR DUMMIES</a>
<main> <span slot="top-center">00 / ROUTE MAP</span>
<header class="top"> <a slot="top-next" href={`${base}skills-review/`}>review desk ↗</a>
<a href={`${base}full-guide/`}>← AI FOR DUMMIES</a>
<span>00 / ROUTE MAP</span> <ChapterHero eyebrow="Start here">
<a href={`${base}skills-review/`}>review desk ↗</a> <span slot="title">Ship the<br /><em>system.</em></span>
</header> <p>{introduction}</p>
<section class="hero"> </ChapterHero>
<p class="eyebrow">Start here</p>
<h1>Ship the<br /><em>system.</em></h1> <SectionGrid>
<p>{introduction}</p> <article class="card">
</section> <b>01</b><h2>Models</h2><p>Capability and effort are separate knobs.</p><a
<section class="grid"> href={`${base}models/`}>Open chapter →</a
<article class="card"> >
<b>01</b><h2>Models</h2><p>Capability and effort are separate knobs.</p><a </article>
href={`${base}models/`}>Open chapter →</a <article class="card">
> <b>02</b><h2>Agents & trees</h2><p>Bound roles, handoffs, and worktrees.</p><a
</article> href={`${base}agents/`}>Open chapter →</a
<article class="card"> >
<b>02</b><h2>Agents & trees</h2><p>Bound roles, handoffs, and worktrees.</p><a </article>
href={`${base}agents/`}>Open chapter →</a <article class="card">
> <b>03</b><h2>Skills</h2><p>Capture repeatable decisions.</p><a href={`${base}skills/`}
</article> >Open chapter →</a
<article class="card"> >
<b>03</b><h2>Skills</h2><p>Capture repeatable decisions.</p><a href={`${base}skills/`} </article>
>Open chapter →</a <article class="card">
> <b>04</b><h2>Rules</h2><p>Connect guidance to enforcement.</p><a href={`${base}rules/`}
</article> >Open chapter →</a
<article class="card"> >
<b>04</b><h2>Rules</h2><p>Connect guidance to enforcement.</p><a href={`${base}rules/`} </article>
>Open chapter →</a <article class="card">
> <b>05</b><h2>Practice</h2><p>Compare prompts and skill-enabled runs.</p><a
</article> href={`${base}hands-on/starter/`}>Open lab →</a
<article class="card"> >
<b>05</b><h2>Practice</h2><p>Compare prompts and skill-enabled runs.</p><a </article>
href={`${base}hands-on/starter/`}>Open lab →</a <article class="card">
> <b>06</b><h2>Review desk</h2><p>Browse original files and improved drafts.</p><a
</article> href={`${base}skills-review/`}>Open desk →</a
<article class="card"> >
<b>06</b><h2>Review desk</h2><p>Browse original files and improved drafts.</p><a </article>
href={`${base}skills-review/`}>Open desk →</a </SectionGrid>
>
</article> <a slot="footer-links" href={`${base}full-guide/`}>Full field guide</a>
</section> <a slot="footer-links" href={`${base}docs/operations-guide.md`}>Operations guide</a>
<nav class="links"> <span slot="footer-text">
<a href={`${base}full-guide/`}>Full field guide</a> Each chapter stands alone; the order follows a real task becoming a reliable change.
<a href={`${base}docs/operations-guide.md`}>Operations guide</a> </span>
</nav> </ChapterLayout>
<footer>
Each chapter stands alone; the order follows a real task becoming a reliable change.
</footer>
</main>
</BaseLayout>