Skip to content

fix(home): rotate the hero capability line on mobile too - #238

Merged
Alexgodoroja merged 2 commits into
pilot-protocol:mainfrom
artemiia:fix/hero-rotator-mobile
Sep 7, 2026
Merged

fix(home): rotate the hero capability line on mobile too#238
Alexgodoroja merged 2 commits into
pilot-protocol:mainfrom
artemiia:fix/hero-rotator-mobile

Conversation

@artemiia

@artemiia artemiia commented Sep 7, 2026

Copy link
Copy Markdown
Contributor

Problem

On phones the hero line "With Pilot your agent can …" never rotated. It stayed on "discover other agents" forever, while desktop cycled through all 13 phrases.

Cause

The rotator script in src/pages/index.astro measured the viewport once and returned before starting its interval whenever the width was 760px or less:

var compact = window.matchMedia && window.matchMedia('(max-width: 760px)').matches;
if (reduce || compact) return;

That guard arrived in a5974e7 ("site: ship solution funnels and enterprise pages"), an unrelated bulk commit, with no stated reason. Nothing else in the markup or CSS depended on it.

Fix

  • Remove the mobile guard. The prefers-reduced-motion guard stays, and the sr-only copy still lists every phrase, so accessibility is unchanged.
  • Cap the animated word box to the line's width, both in CSS (max-width: 100% on .rotator under 560px) and in the JS fit() sizing function, so the longest phrases can never push past a 320px screen.

Verification

Puppeteer check counting distinct phrases seen over a few seconds, live site vs. this branch:

Width Live This branch Overflow
320 1 9 no
375 1 9 no
430 1 9 no
768 4 9 no
1280 4 9 no

npm run build passes (440 pages).

🤖 Generated with Claude Code

https://claude.ai/code/session_01GbidwFjD4MpULTG4Rsmd2w

Ale and others added 2 commits September 7, 2026 15:27
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 <[email protected]>
Claude-Session: https://claude.ai/code/session_01GbidwFjD4MpULTG4Rsmd2w
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 <[email protected]>
Claude-Session: https://claude.ai/code/session_01GbidwFjD4MpULTG4Rsmd2w
@Alexgodoroja
Alexgodoroja merged commit fee59cc into pilot-protocol:main Sep 7, 2026
3 checks passed
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