Content pages open on the warm band; story timeline wraps #25

Merged

martin merged 2 commits from claw/warm-first-bands-2c9e into main

2026-09-19 04:32:39 +00:00

martin commented

2026-09-19 04:32:38 +00:00

Owner

Flips the page-band order from #24 and lands the latest story-timeline rework.

Warm-first bands

The shared page hero is white, so #24's white-first order ran straight into it with no edge. Every content page now opens on the warm band (--bb-page) under the hero and alternates to white; the dark footer anchors the foot.

Page	Bands
About	story warm · office white · management warm · broking white · quote warm
Products	grid warm · Claims / Technical banners white
News	featured warm · All News white
Contact	details + form warm · highlights white · map warm
Detail pages	article warm · more-from white

The story section is shared with the homepage, so About takes the warm band through a .bb-about-page scope and the homepage is unchanged. The "Page bands" comment in ballantyne.css documents the new order.

Story timeline

Points keep their fixed width, but past the container the timeline wraps onto another row instead of scrolling sideways, so the whole story is on screen at once. A year with several points takes one column per point, repeating the year muted on the later ones. The admin hint text is updated to match.

Verification

npm run type-check green.
All 10 public routes return 200 on the dev server.
Screenshotted About and Products at 1440px.

🤖 Generated with Claude Code

Flips the page-band order from #24 and lands the latest story-timeline rework. ## Warm-first bands The shared page hero is white, so #24's white-first order ran straight into it with no edge. Every content page now opens on the warm band (`--bb-page`) under the hero and alternates to white; the dark footer anchors the foot. | Page | Bands | |---|---| | About | story **warm** · office **white** · management **warm** · broking **white** · quote **warm** | | Products | grid **warm** · Claims / Technical banners **white** | | News | featured **warm** · All News **white** | | Contact | details + form **warm** · highlights **white** · map **warm** | | Detail pages | article **warm** · more-from **white** | The story section is shared with the homepage, so About takes the warm band through a `.bb-about-page` scope and the homepage is unchanged. The "Page bands" comment in `ballantyne.css` documents the new order. ## Story timeline Points keep their fixed width, but past the container the timeline wraps onto another row instead of scrolling sideways, so the whole story is on screen at once. A year with several points takes one column per point, repeating the year muted on the later ones. The admin hint text is updated to match. ## Verification - `npm run type-check` green. - All 10 public routes return 200 on the dev server. - Screenshotted About and Products at 1440px. 🤖 Generated with [Claude Code](https://claude.com/claude-code)

martin added 2 commits

2026-09-19 04:32:38 +00:00

feat: content pages open on the warm band, then alternate d664d63d2a

The shared page hero is white, so a white first band ran straight into it with
no edge. Every content page now starts on --bb-page under the hero and
alternates to white from there; the dark footer anchors the foot.

On About the story section is shared with the homepage, so it takes the warm
band through a .bb-about-page scope rather than changing the homepage.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

feat: the story timeline wraps onto rows instead of scrolling 7fb4a89d41

Every point keeps its fixed width, but past the container the timeline now
wraps onto another row rather than scrolling sideways, so the whole story is on
screen at once. Each row draws its own rule. A year with several points takes
one column per point, repeating the year in the muted tone on the later ones so
the grid stays uniform.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>