Gitbook 主题微调

themes/gitbook/components/BottomMenuBar.js

@@ -1,23 +1,27 @@
-import { useGitBookGlobal } from '@/themes/gitbook'
-import JumpToTopButton from './JumpToTopButton'
+import MobileButtonCatalog from './MobileButtonCatalog'
+import MobileButtonPageNav from './MobileButtonPageNav'
 
+/**
+ * 移动端底部导航
+ * @param {*} param0
+ * @returns
+ */
 export default function BottomMenuBar({ post, className }) {
-  const { pageNavVisible, changePageNavVisible } = useGitBookGlobal()
-
-  const togglePageNavVisible = () => {
-    changePageNavVisible(!pageNavVisible)
-  }
+  const showTocButton = post?.toc?.length > 1
 
   return (
-        <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'>
-                <div onClick={togglePageNavVisible} className='flex w-full items-center justify-center cursor-pointer'>
-                <i className="fa-solid fa-book"></i>
-                </div>
-                <div className='flex w-full items-center justify-center cursor-pointer'>
-                    <JumpToTopButton />
-                </div>
-            </div>
+    <>
+      {/* 移动端底部导航按钮 */}
+      <div className='bottom-button-group md:hidden w-screen h-14 px-4 fixed flex items-center justify-between right-left bottom-0 z-30 bg-white border-t dark:border-gray-800'>
+        <div className='w-full'>
+          <MobileButtonPageNav />
         </div>
+        {showTocButton && (
+          <div className='w-full'>
+            <MobileButtonCatalog />
+          </div>
+        )}
+      </div>
+    </>
   )
 }

themes/gitbook/components/Footer.js

@@ -1,6 +1,10 @@
 import { siteConfig } from '@/lib/config'
 import SocialButton from './SocialButton'
-
+/**
+ * 站点也叫
+ * @param {*} param0
+ * @returns
+ */
 const Footer = ({ siteInfo }) => {
   const d = new Date()
   const currentYear = d.getFullYear()

themes/gitbook/components/MobileButtonCatalog.js

@@ -1,3 +1,4 @@
+import { useGlobal } from '@/lib/global'
 import { useGitBookGlobal } from '@/themes/gitbook'
 
 /**
@@ -5,6 +6,7 @@ import { useGitBookGlobal } from '@/themes/gitbook'
  */
 export default function MobileButtonCatalog() {
   const { tocVisible, changeTocVisible } = useGitBookGlobal()
+  const { locale } = useGlobal()
 
   const toggleToc = () => {
     changeTocVisible(!tocVisible)
@@ -19,9 +21,11 @@ export default function MobileButtonCatalog() {
       <a
         id='toc-button'
         className={
-          'fa-list-ol cursor-pointer fas hover:scale-150 transform duration-200'
-        }
-      />
+          'space-x-4 cursor-pointer hover:scale-150 transform duration-200'
+        }>
+        <i className='fa-list-ol fas' />
+        <span>{locale.COMMON.TABLE_OF_CONTENTS}</span>
+      </a>
     </div>
   )
 }

themes/gitbook/components/MobileButtonPageNav.js

@@ -1,3 +1,4 @@
+import { useGlobal } from '@/lib/global'
 import { useGitBookGlobal } from '@/themes/gitbook'
 
 /**
@@ -5,7 +6,7 @@ import { useGitBookGlobal } from '@/themes/gitbook'
  */
 export default function MobileButtonPageNav() {
   const { pageNavVisible, changePageNavVisible } = useGitBookGlobal()
-
+  const { locale } = useGlobal()
   const togglePageNavVisible = () => {
     changePageNavVisible(!pageNavVisible)
   }
@@ -17,11 +18,13 @@ export default function MobileButtonPageNav() {
         'text-black flex justify-center items-center dark:text-gray-200 dark:bg-hexo-black-gray py-2 px-2'
       }>
       <a
-        id='toc-button'
+        id='nav-button'
         className={
-          'fa-book cursor-pointer fas hover:scale-150 transform duration-200'
-        }
-      />
+          'space-x-4 cursor-pointer hover:scale-150 transform duration-200'
+        }>
+        <i className='fa-book fas' />
+        <span>{locale.COMMON.ARTICLE_LIST}</span>
+      </a>
     </div>
   )
 }

themes/gitbook/components/PageNavDrawer.js

@@ -34,7 +34,7 @@ const PageNavDrawer = props => {
           className={`${pageNavVisible ? 'animate__slideInLeft ' : '-ml-80 animate__slideOutLeft'} 
                       overflow-y-hidden shadow-card w-72 duration-200 fixed left-1 bottom-16 rounded py-2 bg-white dark:bg-hexo-black-gray`}>
           <div className='px-4 pb-2 flex justify-between items-center border-b font-bold'>
-            <span>{locale.COMMON.ARTICLE}</span>
+            <span>{locale.COMMON.ARTICLE_LIST}</span>
             <i
               className='fas fa-times p-1 cursor-pointer'
               onClick={() => {