Alternate white and warm bands down every content page #24

Merged
martin merged 2 commits from claw/page-bands-7f3a into main 2026-09-19 03:58:22 +00:00
Owner

Extends the homepage's white / warm-band rhythm to every other content page, and lands the in-flight story-timeline work that was sitting in the tree.

Bands

Each page opens white under the dark hero and alternates from there:

Page Bands
About story white · office warm · management white · broking warm · quote white
Products grid white · Claims / Technical banners warm
News featured white · All News warm
Contact details + form white · highlights warm · map white
News / event / product detail article white · more-from warm
Events, legal single block, white

Three off-palette grounds are gone: the broking team's #f3f6fc, contact's --bb-contact-bg (token deleted), and --bb-cream as a page ground on the detail pages. The rule is documented as a "Page bands" comment at the top of ballantyne.css.

The products index loses its navy ground, so the card titles, descriptions, dividers and "Learn more" labels are recolored from white-on-navy to navy/muted-on-white.

Divider rules and inter-block margins are removed where a band edge now separates the blocks — the same approach the homepage already takes.

Story timeline

Timeline points move to a fixed width on a horizontal scroll rail with scroll-driven edge fades, instead of each point taking an equal share of the container. Drops the navy facts band under the About hero, along with aboutPage.highlights in the model, validation, defaults and admin editor.

Verification

  • npm run type-check green.
  • Screenshotted at 1440px and 390px: about, products, news, events, contact, and the news / product / event detail pages.
  • No local next build — it would clobber .next under the running dev server. The builder's Docker build is the gate and fails closed.

🤖 Generated with Claude Code

Extends the homepage's white / warm-band rhythm to every other content page, and lands the in-flight story-timeline work that was sitting in the tree. ## Bands Each page opens white under the dark hero and alternates from there: | Page | Bands | |---|---| | About | story **white** · office **warm** · management **white** · broking **warm** · quote **white** | | Products | grid **white** · Claims / Technical banners **warm** | | News | featured **white** · All News **warm** | | Contact | details + form **white** · highlights **warm** · map **white** | | News / event / product detail | article **white** · more-from **warm** | | Events, legal | single block, **white** | Three off-palette grounds are gone: the broking team's `#f3f6fc`, contact's `--bb-contact-bg` (token deleted), and `--bb-cream` as a page ground on the detail pages. The rule is documented as a "Page bands" comment at the top of `ballantyne.css`. The products index loses its navy ground, so the card titles, descriptions, dividers and "Learn more" labels are recolored from white-on-navy to navy/muted-on-white. Divider rules and inter-block margins are removed where a band edge now separates the blocks — the same approach the homepage already takes. ## Story timeline Timeline points move to a fixed width on a horizontal scroll rail with scroll-driven edge fades, instead of each point taking an equal share of the container. Drops the navy facts band under the About hero, along with `aboutPage.highlights` in the model, validation, defaults and admin editor. ## Verification - `npm run type-check` green. - Screenshotted at 1440px and 390px: about, products, news, events, contact, and the news / product / event detail pages. - No local `next build` — it would clobber `.next` under the running dev server. The builder's Docker build is the gate and fails closed. 🤖 Generated with [Claude Code](https://claude.com/claude-code)
The timeline gave every point an equal share of the container, so a year
holding several points squeezed its copy to a word a line. Points now sit at a
fixed width on a horizontal rail with scroll-driven edge fades, so the 13th
milestone reads like the 1st.

Drops the navy facts band under the About hero, along with aboutPage.highlights
in the model, validation, defaults and admin editor.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
The homepage already ran white / --bb-page bands all the way down; the rest of
the site did not. About was near-white with one off-palette #f3f6fc, contact a
flat blue-grey, products navy, and the detail pages --bb-cream.

Each page now opens white under the dark hero and alternates from there:

  about     story | office | management | broking | quote
  products  grid | claims banners
  news      featured | all news
  contact   details + form | highlights | map
  detail    article | more-from

Splits contact, products, news and the three detail pages into real sections so
each block can carry its own ground, and drops the divider rules and inter-block
margins the tone change now replaces. Retires --bb-contact-bg.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
martin merged commit efd57fb22e into main 2026-09-19 03:58:22 +00:00
martin deleted branch claw/page-bands-7f3a 2026-09-19 03:58:22 +00:00
Sign in to join this conversation.
No reviewers
No labels
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
martin/ballantyne-www!24
No description provided.