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
+20 -24
View File
@@ -1,26 +1,24 @@
--- ---
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>
<section class="hero">
<p class="eyebrow">Start here</p>
<h1>Ship the<br /><em>system.</em></h1>
<p>{introduction}</p> <p>{introduction}</p>
</section> </ChapterHero>
<section class="grid">
<SectionGrid>
<article class="card"> <article class="card">
<b>01</b><h2>Models</h2><p>Capability and effort are separate knobs.</p><a <b>01</b><h2>Models</h2><p>Capability and effort are separate knobs.</p><a
href={`${base}models/`}>Open chapter →</a href={`${base}models/`}>Open chapter →</a
@@ -51,13 +49,11 @@ const introduction =
href={`${base}skills-review/`}>Open desk →</a href={`${base}skills-review/`}>Open desk →</a
> >
</article> </article>
</section> </SectionGrid>
<nav class="links">
<a href={`${base}full-guide/`}>Full field guide</a> <a slot="footer-links" href={`${base}full-guide/`}>Full field guide</a>
<a href={`${base}docs/operations-guide.md`}>Operations guide</a> <a slot="footer-links" href={`${base}docs/operations-guide.md`}>Operations guide</a>
</nav> <span slot="footer-text">
<footer>
Each chapter stands alone; the order follows a real task becoming a reliable change. Each chapter stands alone; the order follows a real task becoming a reliable change.
</footer> </span>
</main> </ChapterLayout>
</BaseLayout>