fix(detail): give Results Over Time chart more height on desktop

The trend chart was capped at 280px tall on desktop, squishing the lines together and making them hard to read. Raise the base .chartContainer height to 380px in both the primary and secondary detail views. Mobile is unaffected: the base value is already overridden to height:auto by the existing max-width:768px query, where PerformanceChart's own .chartWrapper carries the canvas height. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_0146VHeLAWjDVE2B5uU67jCB
Merge pull request 'feat(analytics): load Umami heatmap recorder' (#77 ) from feat/umami-heatmap-recorder into main
2026-07-21 22:05:10 +01:00 · 2026-07-21 15:06:04 +00:00 · 2026-07-21 16:03:18 +01:00
3 changed files with 16 additions and 2 deletions
@@ -85,6 +85,14 @@ export default function RootLayout({
          data-performance="true"
          strategy="afterInteractive"
        />
+        {/* Heatmap / session recorder — same data-domains guard so staging
+            (same image, different host) never feeds the heatmap. */}
+        <Script
+          src="https://analytics.schoolcompare.co.uk/recorder.js"
+          data-website-id="d7fb0c95-bb6c-4336-8209-bd10077e50dd"
+          data-domains="schoolcompare.co.uk,www.schoolcompare.co.uk"
+          strategy="afterInteractive"
+        />
      </head>
      <body className={`${dmSans.variable} ${playfairDisplay.variable}`}>
        <div className="noise-overlay" />
@@ -855,7 +855,10 @@
 /* Charts Section */
 .chartContainer {
    width: 100%;
-    height: 280px;
+    /* Taller on desktop so the trend lines have vertical room to separate
+       and read clearly. Mobile overrides this to height:auto below (the
+       max-width:768px query), so this only affects desktop. */
+    height: 380px;
    position: relative;
 }

@@ -490,7 +490,10 @@
 /* ── Charts & Map ────────────────────────────────────── */
 .chartContainer {
    width: 100%;
-    height: 280px;
+    /* Taller on desktop so the trend lines have vertical room to separate
+       and read clearly. Mobile overrides this to height:auto below (the
+       max-width:768px query), so this only affects desktop. */
+    height: 380px;
    position: relative;
 }
Author	SHA1	Message	Date
TudorandClaude Opus 4.8	32f8a02862	fix(detail): give Results Over Time chart more height on desktop PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m6s Details PR Checks / Backend Smoke (pull_request) Successful in 7s Details PR Checks / Build Backend (no push) (pull_request) Successful in 11s Details PR Checks / Build Frontend (no push) (pull_request) Successful in 47s Details PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s Details PR Checks / AI Code Review (Claude) (pull_request) Successful in 13s Details The trend chart was capped at 280px tall on desktop, squishing the lines together and making them hard to read. Raise the base .chartContainer height to 380px in both the primary and secondary detail views. Mobile is unaffected: the base value is already overridden to height:auto by the existing max-width:768px query, where PerformanceChart's own .chartWrapper carries the canvas height. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_0146VHeLAWjDVE2B5uU67jCB	2026-07-21 22:05:10 +01:00
tudor	7e3096c881	Merge pull request 'feat(analytics): load Umami heatmap recorder' (#77 ) from feat/umami-heatmap-recorder into main Stage (build -> staging -> E2E gate) / Build Backend (FastAPI) (push) Successful in 15s Details Stage (build -> staging -> E2E gate) / Build Frontend (Next.js) (push) Successful in 54s Details Stage (build -> staging -> E2E gate) / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s Details Stage (build -> staging -> E2E gate) / Deploy to Staging (push) Successful in 1s Details Stage (build -> staging -> E2E gate) / E2E Journeys against Staging (push) Successful in 47s Details Reviewed-on: #77	2026-07-21 15:06:04 +00:00
TudorandClaude Opus 4.8	1f80571b1f	feat(analytics): load Umami heatmap recorder PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m4s Details PR Checks / Backend Smoke (pull_request) Successful in 7s Details PR Checks / Build Backend (no push) (pull_request) Successful in 11s Details PR Checks / Build Frontend (no push) (pull_request) Successful in 47s Details PR Checks / Build Pipeline (no push) (pull_request) Successful in 10s Details PR Checks / AI Code Review (Claude) (pull_request) Failing after 42s Details Adds the Umami session recorder (recorder.js) that powers heatmaps, alongside the existing analytics tracker. Loaded via next/script with the same data-domains guard as the main tracker so it only fires on the production hostnames — staging runs the same image under a different host and must not feed the heatmap. Cookieless: recorder.js uses Umami's server-side session model (no cookie or local storage on the device), so it adds no new PECR consent trigger. Verified with tsc --noEmit and next build. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_0146VHeLAWjDVE2B5uU67jCB	2026-07-21 16:03:18 +01:00