From 184aae52252e650cb45acbf9a9368a2d89b7ca2d Mon Sep 17 00:00:00 2001
From: Joseph Dale Banares <daleban.dev@gmail.com>
Date: Sat, 3 Oct 2026 13:12:44 +0800
Subject: [PATCH] docs(site): land on the install section when arriving from
 another page

---
 site/components/landing/How.tsx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/site/components/landing/How.tsx b/site/components/landing/How.tsx
index e745a33..e2ed4d7 100644
--- a/site/components/landing/How.tsx
+++ b/site/components/landing/How.tsx
@@ -98,6 +98,7 @@ export function How({ demo, receipt, repair }: { demo: LaidOutDiagram; receipt:
   const [shown, setShown] = useState(0);
   const runway = useRef(0);
   const stickTop = useRef(0);
+  const arrived = useRef(false);
 
   useEffect(() => {
     const mm = gsap.matchMedia();
@@ -112,6 +113,11 @@ export function How({ demo, receipt, repair }: { demo: LaidOutDiagram; receipt:
         s.style.top = `${stickTop.current}px`;
       };
       layout();
+      // The runway arrives after the browser (or Next, from another page) has scrolled to the hash, pushing a
+      // target below it a runway further down: go there again.
+      const target = !arrived.current && location.hash && document.getElementById(decodeURIComponent(location.hash.slice(1)));
+      arrived.current = true;
+      if (target && p.compareDocumentPosition(target) & Node.DOCUMENT_POSITION_FOLLOWING) target.scrollIntoView();
       setPinned(true);
       const draw = (progress: number) => {
         if (fill.current) fill.current.style.transform = `scaleX(${progress})`;