Repository navigation
fix(website): make the mobile menu reachable without a sticky header - #21
Conversation
Brings in dtczelo's commit unchanged so the pull request closes as merged. The follow-up commit keeps the header in normal flow. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The shared layer rule put the header on the same level as the page, so the page painted over the open mobile menu and none of its links could be tapped. With the header out of that rule it falls back to SiteHeader's sticky position, and the header has no background, so page content would show through it while scrolling. Keep the header in normal flow and let SiteHeader's own z-index place it above the page. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Codex Review SummaryThis comment shows the latest Codex review activity on this pull request.
ℹ️ About Codex in GitHubYour team has set up Codex to review pull requests in this repo. Reviews are triggered when you
Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings. |
|
Navigate logical layers of code changes, visualize relationships, and explore their blast radius. 🧰 Additional context used📚 Code guidelines (3)No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configuration
📒 Files selected for processing (1)
Included review availability: This review used your included allowance. 0 included reviews remain after this review. Your included PR review attempts over the past 7 days set your current allowance at 1 review per hour. 📜 Recent review details⏰ Context from checks skipped due to timeout. (4)
🧰 Additional context used📓 Path-based instructions (7)For frontend, UI, CSS, accessibility, browser-proof, or web-design changes in `packages/website`, run `bun run agentic:guidance` first, then follow `packages/website/DESIGN.md` and the website token system.📄 CodeRabbit inference engine (CLAUDE.md) Files:
Before frontend, UI, CSS, accessibility, browser-proof, or web-design work in `packages/website`, consult `DESIGN.md`, `gp-tokens.css`, and relevant UI primitives, and run `bun run agentic:guidance`.📄 CodeRabbit inference engine (AGENTS.md) Files:
Never expose `DATABASE_URL` or database credentials to the public website deploy, Keystatic content, generated JSON, browser bundles, or future Vercel projects; credentials belong only on private Fly services.📄 CodeRabbit inference engine (CLAUDE.md) Files:
Prefer semantic HTML, native controls, platform CSS, and browser primitives; preserve landmarks, headings, accessible names, focus states, touch targets, and empty/error/loading states.📄 CodeRabbit inference engine (CLAUDE.md) Files:
Use var(--gp-*) CSS custom properties for all colors, sizes, and spacing; never hardcode hex colors except for data-visualization colors Use var(--gp-font-display) (Spectral) only for display and headlines; var(--gp-font-body) (Manrope) for...📄 CodeRabbit inference engine (packages/website/CLAUDE.md) Files:
Use semantic HTML elements (button, a) instead of divs with onclick; add label for on every input; use cursor: pointer on actionables; ensure one main landmark per page; maintain stable layout with no load-time shift📄 CodeRabbit inference engine (packages/website/CLAUDE.md) Files:
Keep implementation within the smallest applicable package boundary and do not expand beyond issue acceptance criteria.📄 CodeRabbit inference engine (AGENTS.md) Files:
🔇 Additional comments (1)
📝 SummarySummary by CodeRabbit
WalkthroughThe layout now positions ChangesHeader stacking
Priority: ➖ Normal Estimated code review effort: 1 (Trivial) | ~5 minutes Change: Bug fix Merge Risk: ⚪ Minimal · up to The mobile menu remains above page content, with no actionable merge-blocking risk introduced by this change. 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
Warning MCP server "posthog" is unavailable: the server marks every selected tool as able to make changes, and CodeRabbit only uses read-only tools. MCP server "posthog" is unavailable: the server marks every selected tool as able to make changes, and CodeRabbit only uses read-only tools. I’m a rabbit, hopping by, Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Summary
On phones the open menu rendered behind the page, so none of its four links could be tapped. This carries the contributor's fix from #9 unchanged and adds one rule so the header keeps scrolling away with the page as it does today.
GpLayout.astroput the header and the page on the same level. The page comes later in the document, so it painted over the open menu. Taking the header out of that rule (the commit from fix(website): remove global z-index override for header #9) fixes the layering.position: stickyfromSiteHeader.astro. The header has no background, so page content would show through the logo and nav while scrolling. The second commit keeps the header in normal flow. Itsz-index: 20now comes fromSiteHeader.astroalone.DESIGN.mddescribes a sticky header. Returning to that needs a header background and is a separate design decision, so it is left out here.Verification
bun run ui:check: 0 hard, 0 warn./, reachable menu links went from 0 of 4 to 4 of 4. The header computesposition: relative; z-index: 20and scrolls away with the page.Merge with a merge commit, not a squash, so the commit from #9 stays in the history and that pull request closes as merged.
Fixes PRD-1115
🤖 Generated with Claude Code