From ffc3fb984b52573a150fe5c86ac170721a2e1301 Mon Sep 17 00:00:00 2001
From: tangly1024 <mail@tangly1024.com>
Date: Sat, 24 Jun 2023 21:04:13 +0800
Subject: [PATCH] gitbook-drawer

---
 themes/gitbook/components/Catalog.js   | 9 ++++++---
 themes/gitbook/components/TocDrawer.js | 4 ++--
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/themes/gitbook/components/Catalog.js b/themes/gitbook/components/Catalog.js
index 292ff7eb..df7484a6 100644
--- a/themes/gitbook/components/Catalog.js
+++ b/themes/gitbook/components/Catalog.js
@@ -49,8 +49,11 @@ const Catalog = ({ post }) => {
     }
     setActiveSection(currentSectionId)
     const index = tocIds.indexOf(currentSectionId) || 0
-    if (isBrowser()) {
-      document?.getElementById('toc-wrapper')?.scrollTo({ top: 28 * index, behavior: 'smooth' })
+    if (isBrowser() && tocIds?.length > 0) {
+      console.log(28 * index, index, currentSectionId)
+      for (const tocWrapper of document?.getElementsByClassName('toc-wrapper')) {
+        tocWrapper?.scrollTo({ top: 28 * index, behavior: 'smooth' })
+      }
     }
   }, throttleMs))
 
@@ -60,7 +63,7 @@ const Catalog = ({ post }) => {
   }
 
   return <>
-    <div id='toc-wrapper' className='max-h-96 scroll-hidden'>
+    <div id='toc-wrapper' className='toc-wrapper overflow-y-auto max-h-96 overscroll-none scroll-hidden'>
       <nav className='h-full  text-black'>
         {toc.map((tocItem) => {
           const id = uuidToId(tocItem.id)
diff --git a/themes/gitbook/components/TocDrawer.js b/themes/gitbook/components/TocDrawer.js
index fe1933a6..e7f5d305 100644
--- a/themes/gitbook/components/TocDrawer.js
+++ b/themes/gitbook/components/TocDrawer.js
@@ -18,9 +18,9 @@ const TocDrawer = ({ post, cRef }) => {
       {/* 侧边菜单 */}
       <div
         className={(tocVisible ? 'animate__slideInRight ' : ' -mr-72 animate__slideOutRight') +
-        ' shadow-card w-60 duration-200 fixed right-1 bottom-16 rounded py-2 bg-white dark:bg-gray-900'}>
+        ' overflow-y-hidden shadow-card w-60 duration-200 fixed right-1 bottom-16 rounded py-2 bg-white dark:bg-gray-900'}>
           {post && <>
-           <div className='dark:text-gray-400 text-gray-600 h-56 p-3 overflow-y-scroll '>
+           <div className='dark:text-gray-400 text-gray-600 h-96 p-3'>
              <Catalog post={post}/>
            </div>
           </>}