From d31acf80b3920ce718169c321ba8abd7f241fc9c Mon Sep 17 00:00:00 2001
From: "tangly1024.com" <tlyong1992@hotmail.com>
Date: Thu, 12 Sep 2024 19:14:41 +0800
Subject: [PATCH] =?UTF-8?q?medium=E4=B8=BB=E9=A2=98=E5=BE=AE=E8=B0=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 themes/medium/components/BottomMenuBar.js | 34 ++++++++++------
 themes/medium/components/TocDrawer.js     | 48 +++++++++++++++--------
 2 files changed, 53 insertions(+), 29 deletions(-)

diff --git a/themes/medium/components/BottomMenuBar.js b/themes/medium/components/BottomMenuBar.js
index 23979d9e..c04269c2 100644
--- a/themes/medium/components/BottomMenuBar.js
+++ b/themes/medium/components/BottomMenuBar.js
@@ -1,8 +1,8 @@
 import Link from 'next/link'
-import { useMediumGlobal } from '@/themes/medium'
+import { useMediumGlobal } from '..'
 import JumpToTopButton from './JumpToTopButton'
 
-export default function BottomMenuBar ({ post, className }) {
+export default function BottomMenuBar({ post, className }) {
   const { tocVisible, changeTocVisible } = useMediumGlobal()
   const showTocButton = post?.toc?.length > 0
 
@@ -11,24 +11,34 @@ export default function BottomMenuBar ({ post, className }) {
   }
 
   return (
-    <div className={'sticky z-10 bottom-0 w-full h-12 bg-white dark:bg-hexo-black-gray ' + className}>
+    <div
+      className={
+        'sticky z-10 bottom-0 w-full h-12 bg-white dark:bg-hexo-black-gray ' +
+        className
+      }>
       <div className='flex justify-between h-full shadow-card'>
         <Link href='/search' passHref legacyBehavior>
           <div className='flex w-full items-center justify-center cursor-pointer'>
-            <i className='fas fa-search'/>
+            <i className='fas fa-search' />
           </div>
         </Link>
         <div className='flex w-full items-center justify-center cursor-pointer z-20'>
-          <JumpToTopButton/>
+          <JumpToTopButton />
         </div>
-        {showTocButton && <div onClick={toggleToc} className='flex w-full items-center justify-center cursor-pointer z-30'>
-          <i className='fas fa-list-ol ' />
-        </div>}
-        { !showTocButton && <Link href='/' passHref legacyBehavior>
-          <div className='flex w-full items-center justify-center cursor-pointer'>
-            <i className='fas fa-home' />
+        {showTocButton && (
+          <div
+            onClick={toggleToc}
+            className='flex w-full items-center justify-center cursor-pointer z-30'>
+            <i className='fas fa-list-ol ' />
           </div>
-        </Link>}
+        )}
+        {!showTocButton && (
+          <Link href='/' passHref legacyBehavior>
+            <div className='flex w-full items-center justify-center cursor-pointer'>
+              <i className='fas fa-home' />
+            </div>
+          </Link>
+        )}
       </div>
     </div>
   )
diff --git a/themes/medium/components/TocDrawer.js b/themes/medium/components/TocDrawer.js
index 0df5cb56..9c04701e 100644
--- a/themes/medium/components/TocDrawer.js
+++ b/themes/medium/components/TocDrawer.js
@@ -1,5 +1,5 @@
+import { useMediumGlobal } from '..'
 import Catalog from './Catalog'
-import { useMediumGlobal } from '@/themes/medium'
 
 /**
  * 悬浮抽屉目录
@@ -13,22 +13,36 @@ const TocDrawer = ({ post, cRef }) => {
   const switchVisible = () => {
     changeTocVisible(!tocVisible)
   }
-  return <>
-    <div id='medium-toc-float' className='fixed top-0 right-0 z-40'>
-      {/* 侧边菜单 */}
-      <div
-        className={(tocVisible ? 'animate__slideInRight ' : ' -mr-72 animate__slideOutRight') +
-        ' overflow-y-hidden shadow-card w-60 duration-200 fixed right-1 bottom-16 rounded py-2 bg-white dark:bg-gray-600'}>
-          {post && <>
-           <div className='dark:text-gray-400 text-gray-600 h-56'>
-             <Catalog toc={post.toc}/>
-           </div>
-          </>}
+  return (
+    <>
+      <div id='medium-toc-float' className='fixed top-0 right-0 z-40'>
+        {/* 侧边菜单 */}
+        <div
+          className={
+            (tocVisible
+              ? 'animate__slideInRight '
+              : ' -mr-72 animate__slideOutRight') +
+            ' overflow-y-hidden shadow-card w-60 duration-200 fixed right-1 bottom-16 rounded py-2 bg-white dark:bg-gray-600'
+          }>
+          {post && (
+            <>
+              <div className='dark:text-gray-400 text-gray-600 h-56'>
+                <Catalog toc={post.toc} />
+              </div>
+            </>
+          )}
+        </div>
       </div>
-    </div>
-    {/* 背景蒙版 */}
-    <div id='right-drawer-background' className={(tocVisible ? 'block' : 'hidden') + ' fixed top-0 left-0 z-30 w-full h-full'}
-         onClick={switchVisible} />
-  </>
+      {/* 背景蒙版 */}
+      <div
+        id='right-drawer-background'
+        className={
+          (tocVisible ? 'block' : 'hidden') +
+          ' fixed top-0 left-0 z-30 w-full h-full'
+        }
+        onClick={switchVisible}
+      />
+    </>
+  )
 }
 export default TocDrawer