netcracker/ai-for-dummies
3
0
Fork 0
Code Issues Pull Requests Actions 2 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 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>
<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>
</section>
<section class="grid">
</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
@@ -51,13 +49,11 @@ const introduction =
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>
</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.
</footer>
</main>
</BaseLayout>
</span>
</ChapterLayout>