- Full-width hero with CSS grid: site title/tagline (left) + hand-coded
SVG workbench illustration (right), stacks on mobile
- Featured excerpt section with terracotta left border and inline
diagram from 'Your Build Cache Is Lying to You'
- Rage series as 2-column card grid at container width (1100px):
each card shows number, title, description, reading time or
'Coming soon' badge
- All posts as 2-column grid at reading width (720px)
- Three-tier width system: hero (100%), series (--width-container),
all-posts (--width-prose)
- Responsive: collapses to single column below 768px
- Updated tests to verify multi-column layout, SVG illustration,
card grid structure, and responsive breakpoints (41 tests, all pass)
- Fixed author name from 'Ken Hiatt' to 'Ken Chau'
- Rage series items now dynamically link to published posts
(4 linked with reading times, 2 still 'Coming soon')
- Published items show reading time and have hover states
- Series items matched to posts by slug lookup
🤖 Generated with Amplifier
Co-Authored-By: Amplifier <240397093+microsoft-amplifier@users.noreply.github.com>
Two diagrams in the warm palette (paper bg, terracotta accent):
1. Floor and Ceiling: before/after comparison showing AI raises the
floor (what's functional) while the ceiling (excellence, judgment)
stays where it is. The gap between them IS the argument.
2. Lagged Failure Timeline: decision → invisible degradation →
failure surfaces 12-18 months later → misattributed to market
conditions. Makes the delay visible as a four-node flow.
Both use SVG primitives (rect, line, text, circle) following the
diagram design spec: warm palette, Inter for labels, Source Serif
for descriptions, terracotta for accents.
🤖 Generated with Amplifier
Co-Authored-By: Amplifier <240397093+microsoft-amplifier@users.noreply.github.com>
- New lint check: 'doesn't just X. They Y' pattern (Claude rhetorical crutch)
- Fixed last instance in judgment essay: 'doesn't just lose income. They lose'
→ 'loses the acknowledgment... The income is secondary.'
- Updated voice-check skill dimension 2 with the pattern description
- Updated AGENTS.md with the new check
- Tightened regex to avoid false positives on legitimate 'isn't only' framing
🤖 Generated with Amplifier
Co-Authored-By: Amplifier <240397093+microsoft-amplifier@users.noreply.github.com>
The Astro BASE_URL (/crashtestdev) lacked a trailing slash, causing
post URLs to render as /crashtestdevposts/... instead of
/crashtestdev/posts/... Breaking article card navigation and RSS feed
links.
Applied the same .replace(/\/?$/, '/') normalization pattern already
used in BaseLayout.astro to:
- ArticleCard.astro (card link hrefs)
- NavBar.astro (isActive path matching)
- rss.xml.ts (item link generation)
Also adds final-verification.test.mjs with 31 tests covering:
- Clean build output structure
- Index page cards, shadows, hover states, URL format
- Post page NavBar active state, PostHeader centering
- Three typography voices (prose/structure/evidence)
- Code block breakout width, warm background, terracotta border
- Design token color compliance
- Responsive behavior (nav stacking, title shrinking, gutter respect)
- RSS feed validity and URL correctness
This replaces the smoke test index with a real page that:
- Imports getCollection, BaseLayout, NavBar, ArticleCard, getReadingTime
- Fetches all posts and sorts descending by date
- Maps posts to ArticleCard components with title, date, type, summary, slug, readingTime
- Styles .post-list with prose max-width, space-6/space-12 margins, flex column, space-2 gap
Generated with [Amplifier](https://github.com/microsoft/amplifier)
Co-Authored-By: Amplifier <240397093+microsoft-amplifier@users.noreply.github.com>
Copy two existing blog posts from content/posts/ (old Gatsby location)
to src/content/posts/ with updated frontmatter:
- localize-react-without-bloating-the-bundle.md
- speeding-up-webpack-typescript-incremental-builds-by-7x.md (was .mdx)
Frontmatter changes: removed path/heroImage fields, added type/tags/summary,
simplified date to YYYY-MM-DD format. Body content preserved verbatim.
- Created src/content.config.ts with Astro defineCollection using glob loader, pattern '**/*.{md,mdx}', base './src/content/posts', and Zod schema with 5 fields (title, date, type, tags, summary)
- Created src/content/posts/ directory for content storage
- Created src/utils/reading-time.ts with getReadingTime function (split whitespace, 200 WPM, Math.max(1, Math.ceil))
- All 23 new tests pass, all 61 total tests pass, npm run build succeeds
Generated with Amplifier
Co-Authored-By: Amplifier <240397093+microsoft-amplifier@users.noreply.github.com>
- Import BaseLayout, NavBar, and PostHeader components
- PostHeader with title 'Speeding Up Webpack Typescript Incremental Builds by 7x',
date 2019-08-16, type post, readingTime 12
- Three typography voices in prose-width container:
- Prose voice: Source Serif 4 at 18px (font-prose)
- Structure voice: Inter at 14px in secondary color (font-structure)
- Evidence voice: JetBrains Mono with code-text color, surface-code bg,
rounded-md, accent-primary left border (font-evidence)
- Add build verification test (tests/verify-smoke-page.mjs)
- npm run build succeeds clean
Built the PostHeader.astro component per the design spec. It accepts props {title, date, type, readingTime}, formats dates with toLocaleDateString, renders a centered header with content type badge, h1 title, and meta line with date/reading time. Has responsive typography stepping down at 719px and 479px breakpoints. All 39 tests pass and npm run build succeeds.
Generated with Amplifier
Co-Authored-By: Amplifier <240397093+microsoft-amplifier@users.noreply.github.com>
Created NavBar.astro component with:
- Site name link 'Crash Test Dev' and Posts nav link with active state detection
- aria-label='Site navigation' and aria-current='page' accessibility attributes
- Responsive stacking at 599px breakpoint
- Design token-based styling (structure font, border-subtle, etc.)
- Updated index.astro to include NavBar in nav slot
- Added comprehensive build-output tests (24 assertions)
Generated with Amplifier
Co-Authored-By: Amplifier <240397093+microsoft-amplifier@users.noreply.github.com>
- Created src/layouts/BaseLayout.astro as the site's base layout component
- Imports tokens.css and fonts.css for design system and typography
- Accepts Props {title: string, description?: string}
- Computes page title (appends ' — Crash Test Dev' unless title is already 'Crash Test Dev')
- Reads import.meta.env.BASE_URL for RSS link generation
- HTML structure: doctype, html lang=en, head with charset/viewport/description meta, computed title, RSS link alternate
- Body: skip-to-content link, named nav slot, main#main-content with default slot
- Global styles: CSS reset, body typography, link styles, skip-link, main container, ::selection
- Updated src/pages/index.astro to use BaseLayout with inline style placeholders demonstrating tokens/fonts
- Added tests/check-base-layout.mjs build-output test with 23 assertions, all passing
Create src/styles/tokens.css with complete design token system including:
- Surface, text, accent, code, border, focus colors
- State colors (success, warning, error, info)
- Shadow definitions
- Typography families with full fallback stacks
- Typography scale (xs through 3xl) and line heights
- Spacing scale (0 through 12)
- Border radius tokens
- Layout constraints (prose, code, container widths)
- Motion tokens with reduced-motion media query
All values sourced from .design/specs/design-tokens-2026-05-26.md.
Includes verification test with 56 assertions across all categories.
Ken
Ken