From 3e7ff12614c97a31cb0e48a34de12b3354a8f92e Mon Sep 17 00:00:00 2001
From: Vinta Chen <vinta.chen@gmail.com>
Date: Sun, 22 Mar 2026 14:17:17 +0800
Subject: [PATCH] Fix sticky top button behavior

---
 website/static/main.js       | 24 ++++++++++++++++++++++--
 website/templates/index.html |  4 +++-
 2 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/website/static/main.js b/website/static/main.js
index 5c765f5..97b56e2 100644
--- a/website/static/main.js
+++ b/website/static/main.js
@@ -312,20 +312,40 @@ if (searchInput) {
 
 // Back to top
 var backToTop = document.querySelector('.back-to-top');
+var resultsSection = document.querySelector('#library-index');
+var tableWrap = document.querySelector('.table-wrap');
+var stickyHeaderCell = backToTop ? backToTop.closest('th') : null;
+
+function updateBackToTopVisibility() {
+  if (!backToTop || !tableWrap || !stickyHeaderCell) return;
+
+  var tableRect = tableWrap.getBoundingClientRect();
+  var headRect = stickyHeaderCell.getBoundingClientRect();
+  var hasPassedHeader = tableRect.top <= 0 && headRect.bottom > 0;
+
+  backToTop.classList.toggle('visible', hasPassedHeader);
+}
+
 if (backToTop) {
   var scrollTicking = false;
   window.addEventListener('scroll', function () {
     if (!scrollTicking) {
       requestAnimationFrame(function () {
-        backToTop.classList.toggle('visible', window.scrollY > 600);
+        updateBackToTopVisibility();
         scrollTicking = false;
       });
       scrollTicking = true;
     }
   });
+
+  window.addEventListener('resize', updateBackToTopVisibility);
+
   backToTop.addEventListener('click', function () {
-    window.scrollTo({ top: 0, behavior: 'smooth' });
+    if (!resultsSection) return;
+    resultsSection.scrollIntoView({ behavior: 'smooth', block: 'start' });
   });
+
+  updateBackToTopVisibility();
 }
 
 // Restore state from URL
diff --git a/website/templates/index.html b/website/templates/index.html
index bcdebf9..fddc5cd 100644
--- a/website/templates/index.html
+++ b/website/templates/index.html
@@ -129,7 +129,9 @@
           <th class="col-commit" data-sort="commit-time">Last Commit</th>
           <th class="col-cat">Category</th>
           <th class="col-arrow">
-            <button class="back-to-top" aria-label="Back to top">Top</button>
+            <button class="back-to-top" aria-label="Back to library index">
+              Top
+            </button>
           </th>
         </tr>
       </thead>