From fb289cc687e0dd09ead32f9d0e0daaba3eccb10f Mon Sep 17 00:00:00 2001
From: Benny Guo <bennyxguo6@gmail.com>
Date: Tue, 22 Aug 2023 15:41:36 +0800
Subject: [PATCH] fix: include fixed header height for scroll to

---
 src/hooks/useJumpToEle.ts | 4 +++-
 src/router/index.ts       | 2 +-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/hooks/useJumpToEle.ts b/src/hooks/useJumpToEle.ts
index 805fdc85..e7157880 100644
--- a/src/hooks/useJumpToEle.ts
+++ b/src/hooks/useJumpToEle.ts
@@ -17,12 +17,14 @@ export default function useJumpToEle() {
     return offsetTop
   }
 
+  // -31 for top padding of the app container
+  // -81 for fixed header
   const jumpToEle = (id: string) => {
     element.value = document.getElementById(id)
     if (element.value) {
       elementOffsetTop.value =
         element.value && element.value instanceof HTMLElement
-          ? getOffsetTop(element.value) - 30
+          ? getOffsetTop(element.value) - 30 - 81
           : 0
     }
     window.scrollTo({
diff --git a/src/router/index.ts b/src/router/index.ts
index 3d9293e4..6b070a03 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -73,7 +73,7 @@ const router = createRouter({
     return new Promise(resolve => {
       if (to.hash) {
         setTimeout(() => {
-          resolve({ el: to.hash, behavior: 'smooth' })
+          resolve({ el: to.hash, behavior: 'smooth', top: 81 })
         }, 1500)
       } else if (savedPosition) {
         resolve(savedPosition)