From 4f2271f5c1eaf1d68db51fc1bac0da81602d3f2f Mon Sep 17 00:00:00 2001 From: Ale Date: Mon, 7 Sep 2026 15:27:06 +0200 Subject: [PATCH 1/2] fix(home): rotate the hero capability line on mobile too The rotator script bailed out on viewports <= 760px, so phones only ever saw the first phrase ("discover other agents"). The guard arrived in an unrelated bulk commit (a5974e7) with no stated reason. Remove it, keep the prefers-reduced-motion guard, and cap the word box to the line width so the longest phrases can never push past a 320px screen. Verified with Puppeteer at 320/375/430/768/1280px: every width now cycles through the phrases with no overflow. Co-Authored-By: Claude Fable 5.1 Claude-Session: https://claude.ai/code/session_01GbidwFjD4MpULTG4Rsmd2w --- src/pages/index.astro | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/src/pages/index.astro b/src/pages/index.astro index 35178bf3..601a8cad 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -2771,7 +2771,9 @@ const featuredBlurbs: Record = { white-space: normal; line-height: 1.25; } - .rotator { display: block; margin: 0.18em auto 0; } + /* Never let a long phrase push wider than the line; the JS width is + capped to the line so the word stays centered and fully visible. */ + .rotator { display: block; margin: 0.18em auto 0; max-width: 100%; } } /* Box hugs the current word (auto width) — no dead space — and clips the vertical slide. Width eases between words so it never jumps. */ @@ -3158,13 +3160,18 @@ const featuredBlurbs: Record = { var reduce = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches; // Size the box to the current word so it hugs it (no dead space). - function fit() { box.style.width = word.offsetWidth + 'px'; } + function fit() { + var max = box.parentElement ? box.parentElement.clientWidth : Infinity; + box.style.width = Math.min(word.offsetWidth, max) + 'px'; + } // Wait for fonts, then lock the initial width. if (document.fonts && document.fonts.ready) { document.fonts.ready.then(fit); } fit(); window.addEventListener('resize', fit); - var compact = window.matchMedia && window.matchMedia('(max-width: 760px)').matches; - if (reduce || compact) return; + // Rotate on every viewport. Mobile used to bail out here, which froze the + // line on "discover other agents" for phones; the sr-only copy still lists + // every phrase, so nothing about accessibility changes by rotating. + if (reduce) return; var i = 0; setInterval(function () { From 1ee12f0cabd6fe5d4ebb19a7ddcedd6ea5dadf24 Mon Sep 17 00:00:00 2001 From: Ale Date: Mon, 7 Sep 2026 18:10:45 +0200 Subject: [PATCH 2/2] chore(plain): restamp index twin after hero rotator fix The hero change was JS/CSS only (no copy changed), so the machine-UI twin's content is still accurate. Update its plain-source-sha256 stamp to the new source hash so check:plain passes. Fork PRs can't use the plain-sync bot, and regen-plain.mjs needs a Gemini key. Co-Authored-By: Claude Fable 5.1 Claude-Session: https://claude.ai/code/session_01GbidwFjD4MpULTG4Rsmd2w --- src/pages/plain/index.astro | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/plain/index.astro b/src/pages/plain/index.astro index 58ff3b6c..97f254a1 100644 --- a/src/pages/plain/index.astro +++ b/src/pages/plain/index.astro @@ -1,7 +1,7 @@ --- // Auto-generated by scripts/regen-plain.mjs. Edit the marketing source and re-run. // plain-source: src/pages/index.astro -// plain-source-sha256: 15afa2149ff0d10f89e71a2218af4464b93917a277c989f6c39de66bfbba637c +// plain-source-sha256: 6292db0499aac89ff3bc9dd344c4d39caf53ed95e59acae6692b4946f8869918 import PlainLayout from '../../layouts/PlainLayout.astro'; ---