From d8185591f1c8434d29122265f9fa7310eda5a7f4 Mon Sep 17 00:00:00 2001
From: Tim Rijkse <trijkse@gmail.com>
Date: Thu, 15 Jan 2026 10:48:31 +0100
Subject: [PATCH] fix: better scroll top appearance for site header and cap
 negative scroll position

---
 js/components/site-header.js | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/js/components/site-header.js b/js/components/site-header.js
index 8e914a1..5e70ef7 100644
--- a/js/components/site-header.js
+++ b/js/components/site-header.js
@@ -11,6 +11,7 @@ class SiteHeader extends HTMLElement {
     this.prevScrollPos = 0;
     this.headerOffset = 0;
     this.collapsibleHeight = 0;
+    this.upwardScroll = 0;
     this.handleScroll = this.handleScroll.bind(this);
   }
 
@@ -25,7 +26,7 @@ class SiteHeader extends HTMLElement {
   }
 
   handleScroll() {
-    const currentScrollPos = window.scrollY;
+    const currentScrollPos = Math.max(0, window.scrollY);
     const isScrollingDown = currentScrollPos > this.prevScrollPos;
     const delta = currentScrollPos - this.prevScrollPos;
 
@@ -34,14 +35,18 @@ class SiteHeader extends HTMLElement {
     }
 
     if (isScrollingDown) {
+      this.upwardScroll = 0;
       this.headerOffset = Math.min(
         this.collapsibleHeight,
         Math.max(0, this.headerOffset + delta)
       );
       this.classList.remove("reveal");
     } else if (delta < 0) {
-      this.headerOffset = 0;
-      this.classList.add("reveal");
+      this.upwardScroll += Math.abs(delta);
+      if (this.upwardScroll >= 20) {
+        this.headerOffset = 0;
+        this.classList.add("reveal");
+      }
     }
 
     this.collapsible.style.transform = `translateY(-${this.headerOffset}px)`;