Skip to content

fix(www): tidy layout, dark-mode selection and landing copy - #421

Open
simonvanlierde wants to merge 6 commits into
mainfrom
fix/www-ui-review
Open

simonvanlierde wants to merge 6 commits into
mainfrom
fix/www-ui-review

Conversation

@simonvanlierde

Copy link
Copy Markdown
Contributor

Page text now lines up with the header and footer, and the landing copy says only what the platform does today.

  • Phones keep the same 1rem side gutter as the header and footer. Read pages narrow from 44rem to 40rem, about 80 characters a line, and their intros lose the extra indent.
  • Selected text stays readable in dark mode. The highlight mixed the primary colour into white, which put near-white text on a near-white background.
  • Motivation headings use the serif subhead like every other h3, and the hero title no longer breaks "circular-economy" at the hyphen.
  • The 404 page says what probably went wrong and links to the records.
  • The site says "components" instead of "parts", and the hero figure shows the date it was counted. The third motivation beat now says contributor insight is coming in a later release.

- Keep the 1rem side gutter below 760px, so body text starts where the header and footer do
- Drop the inline padding on read-page intros, which set the title 6px right of the body
- Give the first read-page heading the same space above it as the rest
- Narrow the read-page column from 44rem to 40rem, about 80 characters a line
The selection colour mixed the primary into white, so dark mode put near-white text on a near-white highlight. Mix it into the page ground instead.
… whole

- The three motivation headings are phrases, so they take the subhead role instead of mono, which is kept for measurements
- The hero title no longer breaks "circular-economy" at its hyphen on phones
… exists

- count components, not parts, in the hero figure, stats panel and teardown caption, and date
  the hero figure since it is fixed at build time
- the method lede says a finished record becomes browsable, not published
- the method paragraph keeps to what a record is for; the motivation section owns the
  as-designed versus as-found argument
- the third motivation beat names what contributors get back and says it comes in a later
  release
- the looping method phase is marked "repeats", since its name already says per component
…inly

- describe the current behaviour instead of what an earlier value did
- say why the first read-page heading keeps its top margin
- make the 404 explanation read as two parallel possibilities
@codecov

codecov Bot commented Oct 11, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ All tests successful. No failed tests found.

📢 Thoughts on this report? Let us know!

const html = await render();
expect(html).toContain('Open product data for circular-economy research');
const title = html.match(/<h1[^>]*>([\s\S]*?)<\/h1>/)?.[1] ?? '';
expect(title.replace(/<[^>]+>/g, '').trim()).toBe(

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants