4 Commits

Include renames

Author	SHA1	Message	Date
TudorandClaude Opus 5	8d50afef1e	fix(design): meet AA on tinted surfaces, and stop the footer inverting in dark ... Full audit across home, search, rankings, admissions, compare, and primary / secondary / special / no-data school pages, in both themes, measuring computed styles rather than reading CSS. Contrast: the status hues were specced against --bg-primary, but they are used as chip text on their own tint, which sits on cards and secondary surfaces rather than the page ground. Measured in the wild they were 3.85–4.44:1 — under AA — on Ofsted badges, delta chips, report-card chips and metric values, i.e. most of the product's actual signal. Darkened the light hues (#0e6e66 → #0b625a, #9a5b00 → #7f4a00) and lifted the dark teal (#3fb3a4 → #4fc0b0) so each clears AA on its own tint, which is the worst case rather than the easy one. Chart and series ramps follow. The footer was painting itself with a text token and lettering itself with a background token: `background: var(--text-primary); color: var(--bg-secondary)`. That reads correctly in one theme and inverts in the other — in dark mode it became a light slab at the bottom of a dark page, with amber section headings at 1.98:1. Added --surface-sunken and its on-* companions, which stay dark in BOTH themes (deliberately not --surface-inverse, whose whole job is to flip), and moved the footer onto them. Section headings were also using a status hue purely as decoration; they are now a muted on-surface token. The "Open full map" pill was a fixed white background with a themed text colour, so in dark mode it rendered light violet on white at 1.84:1. Both sides are token-driven now. Tabular numerals are now the default for .main rather than per-component opt-in, with prose opting back out — a handful of figures (miniNatPill, compareRowVal, factVal) had been missed by the class-name-based pass. Added a two-theme AA gate over home, rankings and admissions. It waits for `transition: color` to settle first: an earlier measurement pass read mid-transition values and reported seven failures that did not exist at rest. Worth stating plainly — most of what a naive audit flags here is its own artifact, and the check has to account for that to be worth having. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>	2026-08-06 15:38:31 +01:00
TudorandClaude Opus 5	8ab0ac0a04	feat(design): adopt the Cohort identity — new palette, type, mark and dark theme ... Implements the direction agreed from the identity board: Route C ("Cohort") with the paper ground from C1, the Schibsted Grotesk / Literata pairing from C2, and the iris accent from C3. Dark theme is in scope from the start rather than retrofitted. The audit found three things wrong beyond taste: * No brand asset set. og:image was absent entirely, so every link shared into a class WhatsApp group rendered as a bare grey card. apple-touch-icon pointed at an SVG, which iOS ignores, and the manifest shipped no PNGs, so Android installs had no icon. The header mark and the favicon had also drifted into two different logos. * No colour discipline. --primary and --trend-down were the same coral, so the main CTA and "below average" shared a hue. 58 distinct hex values were spread across component CSS, and the chart palette was still Chart.js's stock demo colours. * A dark theme that was declared but never built — themeColor announced a dark variant with no dark styling behind it. What changed: Colour now has exactly three jobs that never borrow each other's hues: brand (iris) for interactive and identity, status (teal/amber) for above/below a comparison point, and phase for categories. Teal/amber rather than green/red keeps the above/below signal readable for every form of colour blindness. Every chromatic literal in component CSS is now a token, and the JS-painted surfaces (Chart.js, Leaflet) read the tokens through lib/theme so they follow the theme instead of ignoring it. The mark is the five-bar cohort spread — the same object as the distribution strip inside a school row, built from opacity steps so it inverts cleanly. components/Logo.tsx is the single source; the favicon, apple-icon and share card all derive from its geometry. globals.css drops 123 dead global classes left over from the vanilla-JS app (only the btn family, .skip-link and .main were still referenced), along with the noise overlay. It also gains prefers-reduced-motion support, which was missing entirely, and a type scale so the 54 ad-hoc font sizes have somewhere to converge. Verified: tsc clean, 159 unit tests pass, production build succeeds and prerenders /icon.svg, /apple-icon and /opengraph-image. Three e2e journeys added for the asset set, the themeColor/background match, and the dark theme actually repainting — all silent failures that nothing on the page reveals. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>	2026-08-06 12:13:04 +01:00
TudorandClaude Opus 5	e098ad4bd1	fix(detail): restore the shell's mobile header/nav CSS ... The server/client split moved the header and sticky nav markup into SchoolDetailShell, but their responsive rules stayed behind in schoolSections.module.css. CSS Modules hash class names per file, so those rules stopped matching entirely: on mobile the header details block never collapsed ("Show all details" e2e journey failed), the toggle itself never appeared, and the section-nav mobile swap (menu button in, link row out) never applied. Ports the stranded blocks into SchoolDetailShell.module.css verbatim: the 768px header block (stacked header, wrapped meta pills, details toggle + collapse) and the 640px section-nav blocks (scroll-fade mask, bottom-sheet panel, control swap). Adds a jest guard that every class a components/school component references is defined in the stylesheet that component imports — it fails on the three classes that had no rule at all here (headerDetailsOpen, atEnd, sectionNavBackLabel). Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>	2026-08-06 10:31:12 +01:00
TudorandClaude Opus 5	752eb07310	refactor(detail): render sections on the server behind a client shell ... page.tsx now composes the sections and passes them through SchoolDetailShell as children, so ~1,300 lines of static markup stop shipping as client JavaScript. The shell keeps what is genuinely interactive: back link, header reveal, hero map, compare CTA, sticky nav and scroll-spy. The scroll-spy already located sections via document.getElementById, so it works unchanged against server-rendered children. Charts needed a client wrapper: next/dynamic with ssr:false is illegal in a Server Component, so components/school/charts.tsx is the boundary that keeps Chart.js (64 KB gz) lazy and browser-only. Measured on this build: - school route client chunk: 8 KB gz (33 KB raw) - total static JS across all chunks: 380.6 -> 350.7 KB gz - section markup is absent from every client chunk ("Got their first choice", "Ofsted reports", "Most deprived" etc. all return 0 hits); shell strings still present, as expected - shared baseline unchanged at 172 KB gz -- out of scope, as designed The 14 characterization tests pass byte-identical to the commit that introduced them. Only the render helper changed. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>	2026-08-02 21:39:21 +01:00