Marco/einfach-produktiv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(navbar): reset scroll to top when navigating home via logo

Browse Source 
Since the Navbar lives in the root layout and never unmounts across
navigations, Next.js's default Link scroll behavior left the previous
page's scroll offset in place instead of resetting to top — landing
users wherever that old offset happened to fall in Home's layout
(often around the Werkzeuge section) instead of at the top.
This commit is contained in:
Marco
2026-07-21 11:15:37 +00:00
parent 8273989d01
commit a72aea1070
1 changed files with 16 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/components/Navbar.tsx
+16 -1
View File
@@ -170,10 +170,25 @@ export function Navbar() {
// whenever pathname becomes "/" (covers both the initial load and a
// client-side transition landing here), a short delay lets layout
// settle first.
//
// The no-hash branch below matters just as much: since the Navbar lives
// in the root layout (never unmounts across navigations), Next.js's
// default Link scroll behavior treats "/" as already-visible and leaves
// the current scrollY untouched instead of resetting to top (see
// next/dist/docs .../link.md's "maintain scroll position" default).
// Landing on Home from a page scrolled halfway down (e.g. clicking the
// logo from a scrolled /shop) then visually "lands" wherever that old
// offset happens to fall in Home's layout — often right around the
// Werkzeuge section — instead of at the top. Forcing scrollTo(0, 0) here
// makes a plain logo/Home navigation always start at the top, exactly
// like the same-page click handler below already does.
useEffect(() => {
if (pathname !== "/") return;
const hash = window.location.hash.slice(1);
if (!anchorIds.includes(hash)) return;
if (!anchorIds.includes(hash)) {
window.scrollTo(0, 0);
return;
}
const timer = setTimeout(() => {
const el = document.getElementById(hash);
if (el) {