gitbook - footer

themes/gitbook/LayoutBase.js

@@ -27,7 +27,7 @@ const ThemeGlobalMedium = createContext()
  * @constructor
  */
 const LayoutBase = (props) => {
-  const { children, meta, post, allNavPages, slotLeft, slotRight, slotTop, siteInfo } = props
+  const { children, meta, post, allNavPages, slotLeft, slotRight, slotTop } = props
   const [tocVisible, changeTocVisible] = useState(false)
   const [pageNavVisible, changePageNavVisible] = useState(false)
   const [filterPosts, setFilterPosts] = useState(allNavPages)
@@ -58,7 +58,7 @@ const LayoutBase = (props) => {
 
                     {/* 左侧推拉抽屉 */}
                     <div style={{ width: '32rem' }} className={'font-sans hidden md:block border-r dark:border-transparent relative z-10 '}>
-                        <div className='py-14 px-6 sticky top-0 overflow-y-scroll h-screen'>
+                        <div className='pt-14 pb-4 px-6 sticky top-0 overflow-y-scroll h-screen flex flex-col justify-between'>
                             {slotLeft}
 
                             <SearchInput className='my-3 rounded-md' />
@@ -66,9 +66,11 @@ const LayoutBase = (props) => {
                             {/* 所有文章列表 */}
                             <NavPostList posts={filterPosts} />
 
-                            <AdSlot />
-
+                            <div className='mt-2'>
+                                <Footer {...props} />
+                            </div>
                         </div>
+
                     </div>
 
                     <div id='center-wrapper' className='flex flex-col justify-between w-full relative z-10 pt-12 min-h-screen'>
@@ -87,8 +89,9 @@ const LayoutBase = (props) => {
                         </div>
 
                         {/* 底部 */}
-                        <Footer title={siteInfo?.title} />
-
+                        <div className='md:hidden'>
+                          <Footer {...props}/>
+                        </div>
                         <div className='text-center'>
                             <AdSlot type='native' />
                         </div>
@@ -111,7 +114,7 @@ const LayoutBase = (props) => {
                                 <Announcement {...props} />
                             </div>
 
-                            <AdSlot />
+                            <Live2D />
 
                         </div>
                     </div>

themes/gitbook/components/Footer.js

@@ -1,8 +1,7 @@
 import React from 'react'
 import BLOG from '@/blog.config'
-import DarkModeButton from '@/components/DarkModeButton'
 
-const Footer = ({ title }) => {
+const Footer = ({ siteInfo }) => {
   const d = new Date()
   const currentYear = d.getFullYear()
   const copyrightDate = (function () {
@@ -14,23 +13,24 @@ const Footer = ({ title }) => {
 
   return (
         <footer
-            className='max-w-3xl z-10 dark:bg-hexo-black-gray flex-shrink-0 justify-center text-center mx-auto w-full leading-6 text-sm px-6 pb-6 relative'
+            className='z-10 bg:white dark:bg-hexo-black-gray justify-center text-center w-full text-sm relative'
         >
-            <hr />
+            <hr className='py-2' />
 
-            <div className='flex justify-between'>
-                <div className='flex'>© {`${copyrightDate}`} <div><i className='mx-1 animate-pulse fas fa-heart' /> <a href={BLOG.LINK} className='underline font-bold text-gray-500 dark:text-gray-300 '>{BLOG.AUTHOR}</a>.<br /></div></div>
-                <div className='text-xs font-serif'><a href='https://github.com/tangly1024/NotionNext' className='underline text-gray-500 dark:text-gray-300'>NotionNext {BLOG.VERSION}</a></div>
+            <div className='flex justify-center'>
+                <div><i className='mx-1 animate-pulse fas fa-heart' /> <a href={BLOG.LINK} className='underline font-bold text-gray-500 dark:text-gray-300 '>{BLOG.AUTHOR}</a>.<br /></div>
+                © {`${copyrightDate}`}
             </div>
 
+            <div className='text-xs font-serif'>Powered By <a href='https://github.com/tangly1024/NotionNext' className='underline text-gray-500 dark:text-gray-300'>NotionNext</a></div>
+
             {BLOG.BEI_AN && <><i className='fas fa-shield-alt' /> <a href='https://beian.miit.gov.cn/' className='mr-2'>{BLOG.BEI_AN}</a><br /></>}
 
             <span className='hidden busuanzi_container_site_pv'>
                 <i className='fas fa-eye' /><span className='px-1 busuanzi_value_site_pv'> </span>  </span>
             <span className='pl-2 hidden busuanzi_container_site_uv'>
                 <i className='fas fa-users' /> <span className='px-1 busuanzi_value_site_uv'> </span> </span>
-            <br />
-            <h1>{title}</h1>
+            <h1 className='pt-1'>{siteInfo?.title}</h1>
 
         </footer>
   )

themes/gitbook/components/NavPostList.js

@@ -36,7 +36,7 @@ const NavPostList = (props) => {
   if (!filteredPosts || filteredPosts.length === 0) {
     return <NavPostListEmpty currentSearch={currentSearch} />
   } else {
-    return <div className='w-full'>
+    return <div className='w-full flex-grow'>
             {/* 文章列表 */}
             {filteredPosts?.map((group, index) => <NavPostItem key={index} group={group} onHeightChange={props.onHeightChange}/>)}
         </div>