feat(homepage): scroll-spy active-state on fixed nav#72
Conversation
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: ab2304128c
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| const scrollBottom = window.scrollY + window.innerHeight; | ||
| if (scrollBottom >= document.documentElement.scrollHeight - 4) { | ||
| setActive(sections[sections.length - 1].id); |
There was a problem hiding this comment.
Clear active nav when no section is in the spy band
The scroll-spy callback only updates state when a section is intersecting or when the page is at the bottom, so when users scroll back into the hero area (above #features) the previously active link remains highlighted even though no tracked section is in the middle band. This produces an incorrect active state after upward scrolling and contradicts the intended “active section in viewport band” behavior; add an else path here to unset the active link when visible is empty and bottom fallback does not apply.
Useful? React with 👍 / 👎.
Summary
IntersectionObserver(vanilla JS, no deps) to the marketing homepage so the fixed top nav highlights the link whose section is in the viewport's middle band (rootMargin: -40% 0px -40% 0px).aria-current="page"and a.nav-link-activeclass (bold + underline + brand color), all others have those removed.apps/homepage/public/script.js; ~9 lines of CSS in a<style>block inapps/homepage/public/index.html. No new dependencies.Test plan
grep -F 'IntersectionObserver' apps/homepage/public/script.jsreturns matches.grep -F 'nav-link-active' apps/homepage/public/{index.html,script.js}returns matches in both files.node --check apps/homepage/public/script.jsparses cleanly.Note: the local
bun run -F anygpt-homepage devstep from the recipe couldn't bind to :3091 in the sandbox (express install constraints across the workspace at this revision), so verification fell back to file-grep + node syntax check, both passing.