Even word spacing in the three homepage cards #40

Merged

iec-admin merged 1 commit from claw/pillar-text-even-8a4d into main

2026-10-13 05:55:19 +00:00

iec-admin commented

2026-10-13 05:55:16 +00:00

Contributor

Follow-up to #37.

What changed

.bb-pillar__desc (the text in the three "People / Technology / Insurance" cards on the homepage) sets text-align: left. It was picking up the site-wide justify; with hyphens off (#35) the narrow cards opened wide gaps between words. The Products grid taglines already opt out the same way.

Walkthrough

Story: as a site visitor, the three homepage cards read with even word spacing.

Driven in a browser (Playwright) against npm run dev on this branch, 2026-10-12, at 1440px, with the production card text set into the page:

Card	Live today	This branch
People	justify, widest gap 26px	left, 4px
Technology	justify, widest gap 15px	left, 4px
Insurance	justify, widest gap 10px	left, 4px

The section screenshot shows the three cards ragged-right with no stretched lines. The quotes below are untouched: two columns, justified.

Reference: no reference system applies; this matches the existing treatment of the Products grid taglines.

QA Execution

2026-10-12, local: npx tsc --noEmit exit 0; npm run build exit 0; the browser run above.

Not done in this PR

The homepage quotes are still justified in narrow columns, so their wide gaps remain (the client asked for justified quotes).
Other narrow justified text elsewhere on the site was not reviewed.

🤖 Generated with Claude Code

Follow-up to #37. ## What changed `.bb-pillar__desc` (the text in the three "People / Technology / Insurance" cards on the homepage) sets `text-align: left`. It was picking up the site-wide justify; with hyphens off (#35) the narrow cards opened wide gaps between words. The Products grid taglines already opt out the same way. ## Walkthrough Story: as a site visitor, the three homepage cards read with even word spacing. Driven in a browser (Playwright) against `npm run dev` on this branch, 2026-10-12, at 1440px, with the production card text set into the page: | Card | Live today | This branch | |---|---|---| | People | justify, widest gap 26px | left, 4px | | Technology | justify, widest gap 15px | left, 4px | | Insurance | justify, widest gap 10px | left, 4px | The section screenshot shows the three cards ragged-right with no stretched lines. The quotes below are untouched: two columns, justified. Reference: no reference system applies; this matches the existing treatment of the Products grid taglines. ## QA Execution 2026-10-12, local: `npx tsc --noEmit` exit 0; `npm run build` exit 0; the browser run above. ## Not done in this PR - The homepage quotes are still justified in narrow columns, so their wide gaps remain (the client asked for justified quotes). - Other narrow justified text elsewhere on the site was not reviewed. 🤖 Generated with [Claude Code](https://claude.com/claude-code)

iec-admin added 1 commit

2026-10-13 05:55:16 +00:00

fix: even word spacing in the three homepage cards (#37 ) 92c0b689ba

Justified with no hyphens, the narrow cards opened gaps of up to 26px
between words. The card text now sets ragged-right, as the Products grid
taglines already do.

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