Skip to content

feat(homepage): scroll-spy active-state on fixed nav#72

Merged
skullcrushercmd merged 1 commit intomainfrom
feat/homepage-scroll-spy
Apr 27, 2026
Merged

feat(homepage): scroll-spy active-state on fixed nav#72
skullcrushercmd merged 1 commit intomainfrom
feat/homepage-scroll-spy

Conversation

@skullcrushercmd
Copy link
Copy Markdown
Contributor

Summary

  • Adds an 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).
  • The active link gets aria-current="page" and a .nav-link-active class (bold + underline + brand color), all others have those removed.
  • When scrolled past the last section, the last nav link stays active.
  • ~50 lines of JS appended to apps/homepage/public/script.js; ~9 lines of CSS in a <style> block in apps/homepage/public/index.html. No new dependencies.

Test plan

  • grep -F 'IntersectionObserver' apps/homepage/public/script.js returns matches.
  • grep -F 'nav-link-active' apps/homepage/public/{index.html,script.js} returns matches in both files.
  • node --check apps/homepage/public/script.js parses cleanly.
  • Manual scroll on the live homepage to confirm the active state advances through Features → Models → API.

Note: the local bun run -F anygpt-homepage dev step 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.

Copilot AI review requested due to automatic review settings April 27, 2026 01:37
Copy link
Copy Markdown

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 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".

Comment on lines +374 to +376
const scrollBottom = window.scrollY + window.innerHeight;
if (scrollBottom >= document.documentElement.scrollHeight - 4) {
setActive(sections[sections.length - 1].id);
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

P2 Badge 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 👍 / 👎.

Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot encountered an error and was unable to review this pull request. You can try again by re-requesting a review.

@skullcrushercmd skullcrushercmd merged commit 522f219 into main Apr 27, 2026
8 checks passed
@skullcrushercmd skullcrushercmd deleted the feat/homepage-scroll-spy branch April 27, 2026 03:16
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