🐛 Push hero further out of view when the scroll arrow is clicked - #4969
Merged
Conversation
Contributor
There was a problem hiding this comment.
Pull request overview
Adjusts the homepage hero “scroll to content” arrow behavior so the hero clears the viewport more fully after clicking the arrow.
Changes:
- Updates the scroll offset calculation in the hero scroll-arrow click handler.
- Adds a
.gitignoreentry to ignore a repository-root.worktrees/directory.
Reviewed changes
Copilot reviewed 1 out of 2 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| components/blocks/v3/heroBox/heroBox.tsx | Tweaks the scroll target calculation for the hero “scroll to content” arrow. |
| .gitignore | Ignores /.worktrees/ (git worktrees folder) at the repository root. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Contributor
Coverage report
Test suite run success19 tests passing in 2 suites. Report generated by 🧪jest coverage report action from 519dd62 |
1 task
The arrow scrolled so it landed 10% of the viewport height BELOW the top of the screen, which left a slice of hero on screen and pushed the next section down. Negating the offset lands the arrow 10% ABOVE the top instead, so the hero clears the viewport and the next section moves up by a further 20% of viewport height. This is a one-line change to the existing formula, not a rewrite — it still aims at the arrow rather than at the next section, so it is a partial fix. Measured in Chrome DevTools at seven viewports on the homepage, checking whether the v3ImageCards heading and all three service cards are fully visible after the scroll settles: 375x667 heading OK, cards cut off by 326px 390x844 heading OK, cards cut off by 64px 768x1024 heading OK, cards fully visible 1280x800 heading OK, cards cut off by 71px 1366x768 heading OK, cards cut off by 110px 1440x900 heading OK, cards fully visible (35px spare) 1920x1080 heading OK, cards fully visible The residual clipping has two causes. The formula targets the button, so the heading lands 99-122px down the viewport and that dead space is what pushes the cards past the bottom edge. And at 375x667 and 1366x768 the requirement is geometrically unreachable at any scroll offset: heading top to cards bottom measures 871px against 667px available, and 766px against 768px. Those two need the section's py-24 or the card graphic height reduced. Closes #4928 Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
The arrow now lands above the top of the screen, not below it. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Same result, one less sign to misread. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
designbyalex
force-pushed
the
fix/4928-hero-scroll-arrow-offset
branch
from
August 6, 2026 04:30
e7f9963 to
519dd62
Compare
designbyalex
enabled auto-merge (squash)
August 6, 2026 04:33
joshbermanssw
approved these changes
Aug 6, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The arrow landed 10% of viewport height below the top of the screen, leaving a slice of hero on view. Negating the offset lands it 10% above instead, so the hero clears the viewport.
/Note
Overlaps with #4967, which rewrites the same handler. Merge one, not both.
Testing
Chrome DevTools, homepage, checking the service cards section is fully in view after the scroll settles:
Heading is always visible. Remaining clipping is because the formula aims at the button, not the section — and at 375 × 667 and 1366 × 768 the content is taller than the viewport, so no scroll offset fits it. Those need
py-24or the card graphic shrunk.