fixed scroll to bottom anchors

holepunchto · Feb 29, 2024 · e9b9505 · e9b9505
1 parent 7904152
commit e9b9505
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 5 deletions.
diff --git a/building-blocks/hypercore.md b/building-blocks/hypercore.md
@@ -579,6 +579,6 @@ Emitted when the core has been fully closed.
 
 Emitted when a new connection has been established with a peer.
 
-#### **`core.on('peer-remove')`** {#core.onpear-remove}
+#### **`core.on('peer-remove')`** {#core.onpeer-remove}
 
 Emitted when a peer's connection has been closed.
diff --git a/lib/app-router.js b/lib/app-router.js
@@ -18,13 +18,19 @@ customElements.define('app-router', class AppRouter extends HTMLElement {
         this.dataset.load = element.tagName.toLowerCase()
         await element.load(page, opts)
 
-        if (pathname.startsWith('/documentation') && !!opts.header) {
+        const isDocumentationPage = pathname.startsWith('/documentation')
+        if (isDocumentationPage && !!opts.header) {
           const anchor = opts.header
           if (anchor) {
-            this.routes['/documentation'].shadowRoot.getElementById(anchor).scrollIntoView()
-            const headerHeight = 170
+            const element = this.routes['/documentation'].shadowRoot.getElementById(anchor)
+            element.scrollIntoView()
+            const elementY = Math.floor(element.getBoundingClientRect().y)
+            const pearHeaderHeight = 170
             const extraScroll = 80
-            window.scrollBy(0, -1 * (headerHeight + extraScroll))
+            const isUnderPearHeader = elementY < pearHeaderHeight + extraScroll
+            if (isUnderPearHeader) {
+              window.scrollBy(0, -1 * (pearHeaderHeight + extraScroll - elementY))
+            }
           }
         }