Merge branch 'main' into original-fix

2026-05-24 23:16:52 +00:00 · 2025-01-01 15:49:15 +08:00
parent c06cf1055d 707a686c0d
commit 2cfc6be804
355 changed files with 16915 additions and 6775 deletions
--- a/themes/gitbook/components/ArticleAround.js
+++ b/themes/gitbook/components/ArticleAround.js
@@ -1,3 +1,4 @@
+import { useGlobal } from '@/lib/global'
 import Link from 'next/link'

 /**
@@ -9,21 +10,29 @@ export default function ArticleAround({ prev, next }) {
  if (!prev || !next) {
    return <></>
  }
+  const { locale } = useGlobal()
  return (
-    <section className='text-gray-800 dark:text-gray-400 h-12 flex items-center justify-between space-x-5 my-4'>
+    <section className='text-gray-800 dark:text-gray-400 flex items-center justify-between gap-x-3 my-4'>
      <Link
        href={prev.href}
        passHref
-        className='text-sm cursor-pointer justify-start items-center flex hover:underline duration-300'>
-        <i className='mr-1 fas fa-angle-double-left' />
-        {prev.title}
+        className='rounded border w-full h-20 px-3 cursor-pointer justify-between items-center flex hover:text-green-500 duration-300'>
+        <i className='mr-1 fas fa-angle-left' />
+        <div>
+          <div>{locale.COMMON.PREV_POST}</div>
+          <div>{prev.title}</div>
+        </div>
      </Link>
+
      <Link
        href={next.href}
        passHref
-        className='text-sm cursor-pointer justify-end items-center flex hover:underline duration-300'>
-        {next.title}
-        <i className='ml-1 my-1 fas fa-angle-double-right' />
+        className='rounded border w-full h-20 px-3 cursor-pointer justify-between items-center flex hover:text-green-500 duration-300'>
+        <div>
+          <div>{locale.COMMON.NEXT_POST}</div>
+          <div> {next.title}</div>
+        </div>
+        <i className='ml-1 my-1 fas fa-angle-right' />
      </Link>
    </section>
  )
--- a/themes/gitbook/components/ArticleInfo.js
+++ b/themes/gitbook/components/ArticleInfo.js
@@ -1,9 +1,17 @@
+/**
+ * 文章补充咨询
+ * @param {*} param0
+ * @returns
+ */
 export default function ArticleInfo({ post }) {
  if (!post) {
    return null
  }
-  return <div className="pt-10 pb-6 text-gray-400 text-sm border-b">
-        <i className="fa-regular fa-clock mr-1" />
-        Last update:  { post.date?.start_date}
+  return (
+    <div className='pt-10 pb-6 text-gray-400 text-sm'>
+      <i className='fa-regular fa-clock mr-1' />
+      Last update:{' '}
+      {post.date?.start_date || post?.publishDay || post?.lastEditedDay}
    </div>
+  )
 }
--- a/themes/gitbook/components/BlogPostCard.js
+++ b/themes/gitbook/components/BlogPostCard.js
@@ -3,7 +3,6 @@ import NotionIcon from '@/components/NotionIcon'
 import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 import { useRouter } from 'next/router'
-import CONFIG from '../config'

 const BlogPostCard = ({ post, className }) => {
  const router = useRouter()
@@ -14,8 +13,8 @@ const BlogPostCard = ({ post, className }) => {
    <Link href={post?.href} passHref>
      <div
        key={post.id}
-        className={`${className} relative py-1.5 cursor-pointer px-1.5 hover:bg-gray-50 rounded-md dark:hover:bg-yellow-100 dark:hover:text-yellow-600
-                    ${currentSelected && 'bg-green-50 text-green-500 dark:bg-yellow-100 dark:text-yellow-600'}`}>
+        className={`${className} relative py-1.5 cursor-pointer px-1.5 rounded-md hover:bg-gray-50
+                    ${currentSelected ? 'text-green-500 dark:bg-yellow-100 dark:text-yellow-600 font-semibold' : ' dark:hover:bg-yellow-100 dark:hover:text-yellow-600'}`}>
        <div className='w-full select-none'>
          {siteConfig('POST_TITLE_ICON') && (
            <NotionIcon icon={post?.pageIcon} />
@@ -23,10 +22,9 @@ const BlogPostCard = ({ post, className }) => {
          {post.title}
        </div>
        {/* 最新文章加个红点 */}
-        {post?.isLatest &&
-          siteConfig('GITBOOK_LATEST_POST_RED_BADGE', false, CONFIG) && (
-            <Badge />
-          )}
+        {post?.isLatest && siteConfig('GITBOOK_LATEST_POST_RED_BADGE') && (
+          <Badge />
+        )}
      </div>
    </Link>
  )
--- a/themes/gitbook/components/BottomMenuBar.js
+++ b/themes/gitbook/components/BottomMenuBar.js
@@ -1,5 +1,5 @@
-import MobileButtonCatalog from './MobileButtonCatalog'
-import MobileButtonPageNav from './MobileButtonPageNav'
+import { useGlobal } from '@/lib/global'
+import { useGitBookGlobal } from '..'

 /**
 * 移动端底部导航
@@ -8,20 +8,43 @@ import MobileButtonPageNav from './MobileButtonPageNav'
 */
 export default function BottomMenuBar({ post, className }) {
  const showTocButton = post?.toc?.length > 1
+  const { locale } = useGlobal()
+  const { pageNavVisible, changePageNavVisible, tocVisible, changeTocVisible } =
+    useGitBookGlobal()
+  const togglePageNavVisible = () => {
+    changePageNavVisible(!pageNavVisible)
+  }
+
+  const toggleToc = () => {
+    changeTocVisible(!tocVisible)
+  }

  return (
-    <>
-      {/* 移动端底部导航按钮 */}
-      <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>
+    <div className='md:hidden fixed bottom-0 left-0 z-50 w-full h-16 bg-white border-t border-gray-200 dark:bg-gray-700 dark:border-gray-600'>
+      <div
+        className={`grid h-full max-w-lg  mx-auto font-medium ${showTocButton && 'grid-cols-2'}`}>
+        <button
+          type='button'
+          onClick={togglePageNavVisible}
+          className='inline-flex flex-col items-center justify-center px-5 border-gray-200 border-x hover:bg-gray-50 dark:hover:bg-gray-800 group dark:border-gray-600'>
+          <i className='fa-book fas w-5 h-5 mb-2 text-gray-500 dark:text-gray-400 group-hover:text-gray-600 dark:group-hover:text-gray-500' />
+          <span className='text-sm text-gray-500 dark:text-gray-400 group-hover:text-gray-600 dark:group-hover:text-gray-500'>
+            {locale.COMMON.ARTICLE_LIST}
+          </span>
+        </button>
+
        {showTocButton && (
-          <div className='w-full'>
-            <MobileButtonCatalog />
-          </div>
+          <button
+            type='button'
+            onClick={toggleToc}
+            className='inline-flex flex-col items-center justify-center px-5 border-gray-200 border-x hover:bg-gray-50 dark:hover:bg-gray-800 group dark:border-gray-600'>
+            <i className='fa-list-ol fas w-5 h-5 mb-2 text-gray-500 dark:text-gray-400 group-hover:text-gray-600 dark:group-hover:text-gray-500' />
+            <span class='text-sm text-gray-500 dark:text-gray-400 group-hover:text-gray-600 dark:group-hover:text-gray-500'>
+              {locale.COMMON.TABLE_OF_CONTENTS}
+            </span>
+          </button>
        )}
      </div>
-    </>
+    </div>
  )
 }
--- a/themes/gitbook/components/Catalog.js
+++ b/themes/gitbook/components/Catalog.js
@@ -1,4 +1,3 @@
-import { useGlobal } from '@/lib/global'
 import { isBrowser } from '@/lib/utils'
 import throttle from 'lodash.throttle'
 import { uuidToId } from 'notion-utils'
@@ -14,7 +13,6 @@ const Catalog = ({ post }) => {
  const toc = post?.toc
  // 同步选中目录事件
  const [activeSection, setActiveSection] = useState(null)
-  const {locale}= useGlobal()

  // 监听滚动事件
  useEffect(() => {
@@ -69,25 +67,29 @@ const Catalog = ({ post }) => {

  return (
    <>
-      <div className='w-full hidden md:block'><i className='mr-1 fas fa-stream' />{locale.COMMON.TABLE_OF_CONTENTS}</div>
+      {/* <div className='w-full hidden md:block'>
+        <i className='mr-1 fas fa-stream' />{locale.COMMON.TABLE_OF_CONTENTS}
+        </div> */}
+
      <div
        id='toc-wrapper'
        className='toc-wrapper overflow-y-auto my-2 max-h-80 overscroll-none scroll-hidden'>
-        <nav className='h-full  text-black'>
+        <nav className='h-full text-black'>
          {toc?.map(tocItem => {
            const id = uuidToId(tocItem.id)
            return (
              <a
                key={id}
                href={`#${id}`}
-                className={`notion-table-of-contents-item duration-300 transform font-light dark:text-gray-300
-              notion-table-of-contents-item-indent-level-${tocItem.indentLevel} `}>
+                //  notion-table-of-contents-item
+                className={`${activeSection === id && 'border-green-500 text-green-500 font-bold'} border-l pl-4 block hover:text-green-500 border-lduration-300 transform font-light dark:text-gray-300
+              notion-table-of-contents-item-indent-level-${tocItem.indentLevel} catalog-item `}>
                <span
                  style={{
                    display: 'inline-block',
                    marginLeft: tocItem.indentLevel * 16
                  }}
-                  className={`truncate ${activeSection === id ? 'font-bold text-gray-500 underline' : ''}`}>
+                  className={`truncate`}>
                  {tocItem.text}
                </span>
              </a>
--- a/themes/gitbook/components/Footer.js
+++ b/themes/gitbook/components/Footer.js
@@ -1,3 +1,4 @@
+import { BeiAnGongAn } from '@/components/BeiAnGongAn'
 import { siteConfig } from '@/lib/config'
 import SocialButton from './SocialButton'
 /**
@@ -13,12 +14,10 @@ const Footer = ({ siteInfo }) => {
    parseInt(since) < currentYear ? since + '-' + currentYear : currentYear

  return (
-    <footer className='z-20 bg:white dark:bg-hexo-black-gray justify-center text-center w-full text-sm relative'>
-      <hr className='pb-2' />
-
+    <footer className='z-20 border p-2 rounded-lg bg:white dark:border-black dark:bg-hexo-black-gray justify-center text-center w-full text-sm relative'>
      <SocialButton />

-      <div className='flex justify-center pt-1'>
+      <div className='flex justify-center'>
        <div>
          <i className='mx-1 animate-pulse fas fa-heart' />{' '}
          <a
@@ -31,21 +30,13 @@ const Footer = ({ siteInfo }) => {
        © {`${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 {siteConfig('VERSION')}
-        </a>
-      </div>
-
      {siteConfig('BEI_AN') && (
        <>
          <i className='fas fa-shield-alt' />{' '}
          <a href='https://beian.miit.gov.cn/' className='mr-2'>
            {siteConfig('BEI_AN')}
          </a>
+          <BeiAnGongAn />
          <br />
        </>
      )}
@@ -58,6 +49,14 @@ const Footer = ({ siteInfo }) => {
        <i className='fas fa-users' />{' '}
        <span className='px-1 busuanzi_value_site_uv'> </span>{' '}
      </span>
+      <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 {siteConfig('VERSION')}
+        </a>
+      </div>
      {/* SEO title */}
      <h1 className='pt-1 hidden'>{siteConfig('TITLE')}</h1>
    </footer>
--- a/themes/gitbook/components/Header.js
+++ b/themes/gitbook/components/Header.js
@@ -2,11 +2,13 @@ import Collapse from '@/components/Collapse'
 import DarkModeButton from '@/components/DarkModeButton'
 import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
+import { SignInButton, SignedOut, UserButton } from '@clerk/nextjs'
 import { useRef, useState } from 'react'
 import CONFIG from '../config'
 import LogoBar from './LogoBar'
 import { MenuBarMobile } from './MenuBarMobile'
 import { MenuItemDrop } from './MenuItemDrop'
+import SearchInput from './SearchInput'

 /**
 * 页头：顶部导航栏 + 菜单
@@ -58,8 +60,60 @@ export default function Header(props) {
    links = customMenu
  }

+  const enableClerk = process.env.NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY
+
  return (
    <div id='top-nav' className={'fixed top-0 w-full z-20 ' + className}>
+      {/* PC端菜单 */}
+      <div className='flex justify-center border-b dark:border-black items-center w-full h-16 bg-white dark:bg-hexo-black-gray'>
+        <div className='px-5 max-w-screen-4xl w-full flex gap-x-3 justify-between items-center'>
+          {/* 左侧*/}
+          <div className='flex'>
+            <LogoBar {...props} />
+
+            {/* 桌面端顶部菜单 */}
+            <div className='hidden md:flex'>
+              {links &&
+                links?.map((link, index) => (
+                  <MenuItemDrop key={index} link={link} />
+                ))}
+            </div>
+          </div>
+
+          {/* 右侧 */}
+          <div className='flex items-center gap-4'>
+            {/* 登录相关 */}
+            {enableClerk && (
+              <>
+                <SignedOut>
+                  <SignInButton mode='modal'>
+                    <button className='bg-green-500 hover:bg-green-600 text-white rounded-lg px-3 py-2'>
+                      {locale.COMMON.SIGN_IN}
+                    </button>
+                  </SignInButton>
+                </SignedOut>
+                <UserButton />
+              </>
+            )}
+            <DarkModeButton className='text-sm items-center h-full hidden md:flex' />
+            <SearchInput className='hidden md:flex md:w-52 lg:w-72' />
+            {/* 折叠按钮、仅移动端显示 */}
+            <div className='mr-1 flex md:hidden justify-end items-center space-x-4  dark:text-gray-200'>
+              <DarkModeButton className='flex text-md items-center h-full' />
+              <div
+                onClick={toggleMenuOpen}
+                className='cursor-pointer text-lg hover:scale-110 duration-150'>
+                {isOpen ? (
+                  <i className='fas fa-times' />
+                ) : (
+                  <i className='fa-solid fa-bars' />
+                )}
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
      {/* 移动端折叠菜单 */}
      <Collapse
        type='vertical'
@@ -75,35 +129,6 @@ export default function Header(props) {
          />
        </div>
      </Collapse>
-
-      {/* 导航栏菜单 */}
-      <div className='flex w-full h-14 shadow glassmorphism bg-white dark:bg-hexo-black-gray px-7 items-between'>
-        {/* 左侧图标Logo */}
-        <LogoBar {...props} />
-
-        {/* 折叠按钮、仅移动端显示 */}
-        <div className='mr-1 flex md:hidden justify-end items-center space-x-4  dark:text-gray-200'>
-          <DarkModeButton className='flex text-md items-center h-full' />
-          <div
-            onClick={toggleMenuOpen}
-            className='cursor-pointer text-lg hover:scale-110 duration-150'>
-            {isOpen ? (
-              <i className='fas fa-times' />
-            ) : (
-              <i className='fa-solid fa-bars' />
-            )}
-          </div>
-        </div>
-
-        {/* 桌面端顶部菜单 */}
-        <div className='hidden md:flex'>
-          {links &&
-            links?.map((link, index) => (
-              <MenuItemDrop key={index} link={link} />
-            ))}
-          <DarkModeButton className='text-sm flex items-center h-full' />
-        </div>
-      </div>
    </div>
  )
 }
--- a/themes/gitbook/components/JumpToTopButton.js
+++ b/themes/gitbook/components/JumpToTopButton.js
@@ -14,7 +14,7 @@ const JumpToTopButton = ({ showPercent = false, percent, className }) => {
      data-aos-duration='300'
      data-aos-once='false'
      data-aos-anchor-placement='top-center'
-      className='fixed xl:right-80 right-2 bottom-24 z-20'>
+      className='fixed xl:right-96 xl:mr-20 right-2 bottom-24 z-20'>
      <i
        className='shadow fas fa-chevron-up cursor-pointer p-2 rounded-full border bg-white dark:bg-hexo-black-gray'
        onClick={() => {
--- a/themes/gitbook/components/LoadingCover.js
+++ b/themes/gitbook/components/LoadingCover.js
@@ -1,7 +0,0 @@
-export default function LoadingCover() {
-  return <div id='cover-loading' className={'z-50 opacity-50pointer-events-none transition-all duration-300'}>
-    <div className='w-full h-screen flex justify-center items-center'>
-        <i className="fa-solid fa-spinner text-2xl text-black dark:text-white animate-spin">  </i>
-    </div>
-</div>
-}
--- a/themes/gitbook/components/LogoBar.js
+++ b/themes/gitbook/components/LogoBar.js
@@ -11,16 +11,16 @@ import CONFIG from '../config'
 export default function LogoBar(props) {
  const { siteInfo } = props
  return (
-    <div id='top-wrapper' className='w-full flex items-center'>
+    <div id='logo-wrapper' className='w-full flex items-center mr-2'>
      <Link
        href={`/${siteConfig('GITBOOK_INDEX_PAGE', '', CONFIG)}`}
-        className='flex text-md md:text-xl dark:text-gray-200'>
+        className='flex text-lg font-bold md:text-2xl dark:text-gray-200'>
        <LazyImage
          src={siteInfo?.icon}
          width={24}
          height={24}
          alt={siteConfig('AUTHOR')}
-          className='mr-2 hidden md:block'
+          className='mr-2 hidden md:block '
        />
        {siteInfo?.title || siteConfig('TITLE')}
      </Link>
--- a/themes/gitbook/components/MenuItemDrop.js
+++ b/themes/gitbook/components/MenuItemDrop.js
@@ -13,27 +13,9 @@ export const MenuItemDrop = ({ link }) => {
  const selected = router.pathname === link.href || router.asPath === link.href
  return (
    <li
-      className='cursor-pointer list-none items-center flex mx-2'
+      className='cursor-pointer list-none items-center flex mx-2 font-semibold'
      onMouseOver={() => changeShow(true)}
      onMouseOut={() => changeShow(false)}>
-      {hasSubMenu && (
-        <div
-          className={
-            'px-2 h-full whitespace-nowrap duration-300 text-sm justify-between dark:text-gray-300 cursor-pointer flex flex-nowrap items-center ' +
-            (selected
-              ? 'bg-green-600 text-white hover:text-white'
-              : 'hover:text-green-600')
-          }>
-          <div>
-            {link?.icon && <i className={link?.icon} />} {link?.name}
-            {hasSubMenu && (
-              <i
-                className={`px-2 fas fa-chevron-down duration-500 transition-all ${show ? ' rotate-180' : ''}`}></i>
-            )}
-          </div>
-        </div>
-      )}
-
      {!hasSubMenu && (
        <div
          className={
@@ -48,25 +30,43 @@ export const MenuItemDrop = ({ link }) => {
        </div>
      )}

-      {/* 子菜单 */}
+      {/* 包含子菜单 */}
      {hasSubMenu && (
-        <ul
-          className={`${show ? 'visible opacity-100 top-12 ' : 'invisible opacity-0 top-10 '} border-gray-100  bg-white  dark:bg-black dark:border-gray-800 transition-all duration-300 z-20 absolute block drop-shadow-lg `}>
-          {link?.subMenus?.map((sLink, index) => {
-            return (
-              <li
-                key={index}
-                className='not:last-child:border-b-0 border-b text-gray-700 dark:text-gray-200  hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200  dark:border-gray-800 py-3 pr-6 pl-3'>
-                <Link href={sLink.href} target={link?.target}>
-                  <span className='text-xs font-extralight'>
-                    {link?.icon && <i className={sLink?.icon}> &nbsp; </i>}
-                    {sLink.title}
-                  </span>
-                </Link>
-              </li>
-            )
-          })}
-        </ul>
+        <>
+          <div
+            className={
+              'px-2 h-full whitespace-nowrap duration-300 text-sm justify-between dark:text-gray-300 cursor-pointer flex flex-nowrap items-center ' +
+              (selected
+                ? 'bg-green-600 text-white hover:text-white'
+                : 'hover:text-green-600')
+            }>
+            <div>
+              {link?.icon && <i className={link?.icon} />} {link?.name}
+              {hasSubMenu && (
+                <i
+                  className={`px-2 fas fa-chevron-down duration-500 transition-all ${show ? ' rotate-180' : ''}`}></i>
+              )}
+            </div>
+          </div>
+          {/* 下拉菜单内容 */}
+          <ul
+            className={`${show ? 'visible opacity-100 top-12 ' : 'invisible opacity-0 top-10 '} border-gray-100  bg-white  dark:bg-black dark:border-gray-800 transition-all duration-300 z-20 absolute block drop-shadow-lg `}>
+            {link?.subMenus?.map((sLink, index) => {
+              return (
+                <li
+                  key={index}
+                  className='not:last-child:border-b-0 border-b text-gray-700 dark:text-gray-200  hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200  dark:border-gray-800 py-3 pr-6 pl-3'>
+                  <Link href={sLink.href} target={link?.target}>
+                    <span className='text-xs'>
+                      {link?.icon && <i className={sLink?.icon}> &nbsp; </i>}
+                      {sLink.title}
+                    </span>
+                  </Link>
+                </li>
+              )
+            })}
+          </ul>
+        </>
      )}
    </li>
  )
--- a/themes/gitbook/components/MobileButtonCatalog.js
+++ b/themes/gitbook/components/MobileButtonCatalog.js
@@ -1,31 +0,0 @@
-import { useGlobal } from '@/lib/global'
-import { useGitBookGlobal } from '@/themes/gitbook'
-
-/**
- * 移动端目录按钮
- */
-export default function MobileButtonCatalog() {
-  const { tocVisible, changeTocVisible } = useGitBookGlobal()
-  const { locale } = useGlobal()
-
-  const toggleToc = () => {
-    changeTocVisible(!tocVisible)
-  }
-
-  return (
-    <div
-      onClick={toggleToc}
-      className={
-        'text-black flex justify-center items-center dark:text-gray-200 dark:bg-hexo-black-gray py-2 px-2'
-      }>
-      <a
-        id='toc-button'
-        className={
-          '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>
-  )
-}
--- a/themes/gitbook/components/MobileButtonPageNav.js
+++ b/themes/gitbook/components/MobileButtonPageNav.js
@@ -1,30 +0,0 @@
-import { useGlobal } from '@/lib/global'
-import { useGitBookGlobal } from '@/themes/gitbook'
-
-/**
- * 移动端文章导航按钮
- */
-export default function MobileButtonPageNav() {
-  const { pageNavVisible, changePageNavVisible } = useGitBookGlobal()
-  const { locale } = useGlobal()
-  const togglePageNavVisible = () => {
-    changePageNavVisible(!pageNavVisible)
-  }
-
-  return (
-    <div
-      onClick={togglePageNavVisible}
-      className={
-        'text-black flex justify-center items-center dark:text-gray-200 dark:bg-hexo-black-gray py-2 px-2'
-      }>
-      <a
-        id='nav-button'
-        className={
-          'space-x-4 cursor-pointer hover:scale-150 transform duration-200'
-        }>
-        <i className='fa-book fas' />
-        <span>{locale.COMMON.ARTICLE_LIST}</span>
-      </a>
-    </div>
-  )
-}
--- a/themes/gitbook/components/NavPostItem.js
+++ b/themes/gitbook/components/NavPostItem.js
@@ -1,7 +1,7 @@
 import Badge from '@/components/Badge'
 import Collapse from '@/components/Collapse'
 import { siteConfig } from '@/lib/config'
-import CONFIG from '../config'
+import { useEffect, useState } from 'react'
 import BlogPostCard from './BlogPostCard'

 /**
@@ -13,12 +13,35 @@ import BlogPostCard from './BlogPostCard'
 */
 const NavPostItem = props => {
  const { group, expanded, toggleItem } = props // 接收传递的展开状态和切换函数
-  // const [isOpen, setIsOpen] = useState(expanded) // 使用展开状态作为组件内部状态
+  const hoverExpand = siteConfig('GITBOOK_FOLDER_HOVER_EXPAND')
+  const [isTouchDevice, setIsTouchDevice] = useState(false)
+
+  // 检测是否为触摸设备
+  useEffect(() => {
+    const checkTouchDevice = () => {
+      if (window.matchMedia('(pointer: coarse)').matches) {
+        setIsTouchDevice(true)
+      }
+    }
+    checkTouchDevice()
+
+    // 可选：监听窗口大小变化时重新检测
+    window.addEventListener('resize', checkTouchDevice)
+    return () => {
+      window.removeEventListener('resize', checkTouchDevice)
+    }
+  }, [])

  // 当展开状态改变时触发切换函数，并根据传入的展开状态更新内部状态
  const toggleOpenSubMenu = () => {
    toggleItem() // 调用父组件传递的切换函数
-    // setIsOpen(!expanded) // 更新内部状态为传入的展开状态的相反值
+  }
+  const onHoverToggle = () => {
+    // 允许鼠标悬停时自动展开，而非点击展开
+    if (!hoverExpand || isTouchDevice) {
+      return
+    }
+    toggleOpenSubMenu()
  }

  const groupHasLatest = group?.items?.some(post => post.isLatest)
@@ -27,22 +50,25 @@ const NavPostItem = props => {
    return (
      <>
        <div
+          onMouseEnter={onHoverToggle}
          onClick={toggleOpenSubMenu}
-          className='select-none relative flex justify-between text-sm cursor-pointer p-2 hover:bg-gray-50 rounded-md dark:hover:bg-yellow-100 dark:hover:text-yellow-600'
+          className='cursor-pointer relative flex justify-between text-md p-2 hover:bg-gray-50 rounded-md dark:hover:bg-yellow-100 dark:hover:text-yellow-600'
          key={group?.category}>
-          <span>{group?.category}</span>
+          <span className={`${expanded && 'font-semibold'}`}>
+            {group?.category}
+          </span>
          <div className='inline-flex items-center select-none pointer-events-none '>
            <i
-              className={`px-2 fas fa-chevron-left transition-all opacity-50 duration-200 ${expanded ? '-rotate-90' : ''}`}></i>
+              className={`px-2 fas fa-chevron-left transition-all opacity-50 duration-700 ${expanded ? '-rotate-90' : ''}`}></i>
          </div>
          {groupHasLatest &&
-            siteConfig('GITBOOK_LATEST_POST_RED_BADGE', false, CONFIG) &&
+            siteConfig('GITBOOK_LATEST_POST_RED_BADGE') &&
            !expanded && <Badge />}
        </div>
        <Collapse isOpen={expanded} onHeightChange={props.onHeightChange}>
          {group?.items?.map((post, index) => (
            <div key={index} className='ml-3 border-l'>
-              <BlogPostCard className='text-sm ml-3' post={post} />
+              <BlogPostCard className='ml-3' post={post} />
            </div>
          ))}
        </Collapse>
@@ -53,7 +79,7 @@ const NavPostItem = props => {
      <>
        {group?.items?.map((post, index) => (
          <div key={index}>
-            <BlogPostCard className='text-sm py-2' post={post} />
+            <BlogPostCard className='text-md py-2' post={post} />
          </div>
        ))}
      </>
--- a/themes/gitbook/components/NavPostList.js
+++ b/themes/gitbook/components/NavPostList.js
@@ -3,6 +3,7 @@ import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 import { useEffect, useState } from 'react'
 import CONFIG from '../config'
+import BlogPostCard from './BlogPostCard'
 import NavPostItem from './NavPostItem'

 /**
@@ -30,16 +31,17 @@ const NavPostList = props => {
    CONFIG
  )

-  // 展开文件夹
  useEffect(() => {
+    // 展开文件夹
    setTimeout(() => {
-      // 默认展开一个
+      const currentPath = decodeURIComponent(router.asPath.split('?')[0])
      const defaultOpenIndex = getDefaultOpenIndexByPath(
        categoryFolders,
-        decodeURIComponent(router.asPath.split('?')[0])
+        currentPath
      )
      setExpandedGroups([defaultOpenIndex])
    }, 500)
+    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [router, filteredNavPages])

  // 折叠项切换，当折叠或展开数组时会调用
@@ -80,11 +82,22 @@ const NavPostList = props => {
      </div>
    )
  }
+  // 如果href
+  const href = siteConfig('GITBOOK_INDEX_PAGE') + ''
+
+  const homePost = {
+    id: '-1',
+    title: siteConfig('DESCRIPTION'),
+    href: href.indexOf('/') !== 0 ? '/' + href : href
+  }

  return (
    <div
      id='posts-wrapper'
-      className='w-full flex-grow space-y-0.5 tracking-wider'>
+      className='w-full flex-grow space-y-0.5 pr-4 tracking-wider'>
+      {/* 当前文章 */}
+      <BlogPostCard className='mb-4' post={homePost} />
+
      {/* 文章列表 */}
      {categoryFolders?.map((group, index) => (
        <NavPostItem
@@ -105,6 +118,7 @@ function groupArticles(filteredNavPages) {
    return []
  }
  const groups = []
+  const AUTO_SORT = siteConfig('GITBOOK_AUTO_SORT', true, CONFIG)

  for (let i = 0; i < filteredNavPages.length; i++) {
    const item = filteredNavPages[i]
@@ -112,7 +126,7 @@ function groupArticles(filteredNavPages) {

    let existingGroup = null
    // 开启自动分组排序；将同分类的自动归到同一个文件夹，忽略Notion中的排序
-    if (siteConfig('GITBOOK_AUTO_SORT', true, CONFIG)) {
+    if (AUTO_SORT) {
      existingGroup = groups.find(group => group.category === categoryName) // 搜索同名的最后一个分组
    } else {
      existingGroup = groups[groups.length - 1] // 获取最后一个分组
@@ -136,19 +150,16 @@ function groupArticles(filteredNavPages) {
 * @returns {number} 返回需要展开的菜单索引
 */
 function getDefaultOpenIndexByPath(categoryFolders, path) {
-  // 默认展开第一个索引
-  let defaultIndex = 0
-
  // 查找满足条件的第一个索引
  const index = categoryFolders.findIndex(group => {
-    return group.items.some(post => path === '/' + post.slug)
+    return group.items.some(post => path === post.href)
  })

  // 如果找到满足条件的索引，则设置为该索引
  if (index !== -1) {
-    defaultIndex = index
+    return index
  }

-  return defaultIndex
+  return 0
 }
 export default NavPostList
--- a/themes/gitbook/components/PageNavDrawer.js
+++ b/themes/gitbook/components/PageNavDrawer.js
@@ -22,6 +22,7 @@ const PageNavDrawer = props => {

  useEffect(() => {
    changePageNavVisible(false)
+    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [router])

  return (
--- a/themes/gitbook/components/SearchInput.js
+++ b/themes/gitbook/components/SearchInput.js
@@ -2,6 +2,7 @@ import { siteConfig } from '@/lib/config'
 import { deepClone } from '@/lib/utils'
 import { useGitBookGlobal } from '@/themes/gitbook'
 import { useImperativeHandle, useRef, useState } from 'react'
+import { useHotkeys } from 'react-hotkeys-hook'
 let lock = false

 /**
@@ -19,6 +20,15 @@ const SearchInput = ({ currentSearch, cRef, className }) => {
    }
  })

+  /**
+   * 快捷键设置
+   */
+  useHotkeys('ctrl+k', e => {
+    searchInputRef?.current?.focus()
+    e.preventDefault()
+    handleSearch()
+  })
+
  const handleSearch = () => {
    // 使用Algolia
    if (siteConfig('ALGOLIA_APP_ID')) {
@@ -29,6 +39,7 @@ const SearchInput = ({ currentSearch, cRef, className }) => {
      keyword = keyword.trim()
    } else {
      setFilteredNavPages(allNavPages)
+      return
    }
    const filterAllNavPages = deepClone(allNavPages)

@@ -79,6 +90,7 @@ const SearchInput = ({ currentSearch, cRef, className }) => {
  const cleanSearch = () => {
    searchInputRef.current.value = ''
    handleSearch()
+    setShowClean(false)
  }

  const [showClean, setShowClean] = useState(false)
@@ -103,22 +115,9 @@ const SearchInput = ({ currentSearch, cRef, className }) => {
  }

  return (
-    <div className={'flex w-full'}>
-      <input
-        ref={searchInputRef}
-        type='text'
-        className={`${className} outline-none w-full text-sm pl-2 transition focus:shadow-lg font-light leading-10 text-black bg-gray-100 dark:bg-gray-800 dark:text-white`}
-        onFocus={handleFocus}
-        onKeyUp={handleKeyUp}
-        onCompositionStart={lockSearchInput}
-        onCompositionUpdate={lockSearchInput}
-        onCompositionEnd={unLockSearchInput}
-        onChange={e => updateSearchKey(e.target.value)}
-        defaultValue={currentSearch}
-      />
-
+    <div className={`${className} relative`}>
      <div
-        className='flex -ml-8 cursor-pointer float-right items-center justify-center py-2'
+        className='absolute left-0 ml-4 items-center justify-center py-2'
        onClick={handleSearch}>
        <i
          className={
@@ -126,6 +125,24 @@ const SearchInput = ({ currentSearch, cRef, className }) => {
          }
        />
      </div>
+      <input
+        ref={searchInputRef}
+        type='text'
+        className={`rounded-lg border dark:border-black pl-12 leading-10 placeholder-gray-500 outline-none w-full transition focus:shadow-lg text-black bg-gray-100 dark:bg-black dark:text-white`}
+        onFocus={handleFocus}
+        onKeyUp={handleKeyUp}
+        placeholder='Search'
+        onCompositionStart={lockSearchInput}
+        onCompositionUpdate={lockSearchInput}
+        onCompositionEnd={unLockSearchInput}
+        onChange={e => updateSearchKey(e.target.value)}
+        defaultValue={currentSearch}
+      />
+      <div
+        className='absolute right-0 mr-4 items-center justify-center py-2 text-gray-400 dark:text-gray-600'
+        onClick={handleSearch}>
+        Ctrl+K
+      </div>

      {showClean && (
        <div className='-ml-12 cursor-pointer flex float-right items-center justify-center py-2'>
--- a/themes/gitbook/components/SocialButton.js
+++ b/themes/gitbook/components/SocialButton.js
@@ -144,6 +144,7 @@ const SocialButton = () => {
            target='_blank'
            rel='noreferrer'
            title={'知识星球'}
+            className='flex justify-center items-center'
            href={CONTACT_ZHISHIXINGQIU}>
            {/* eslint-disable-next-line @next/next/no-img-element */}
            <img
--- a/themes/gitbook/config.js
+++ b/themes/gitbook/config.js
@@ -15,6 +15,8 @@ const CONFIG = {
  // 导航文章自动排他折叠
  GITBOOK_EXCLUSIVE_COLLAPSE: true, // 一次只展开一个分类，其它文件夹自动关闭。

+  GITBOOK_FOLDER_HOVER_EXPAND: false, // 左侧导航文件夹鼠标悬停时自动展开；若为false，则要点击才能展开
+
  // Widget
  GITBOOK_WIDGET_REVOLVER_MAPS:
    process.env.NEXT_PUBLIC_WIDGET_REVOLVER_MAPS || 'false', // 地图插件
--- a/themes/gitbook/index.js
+++ b/themes/gitbook/index.js
@@ -3,14 +3,19 @@
 import Comment from '@/components/Comment'
 import { AdSlot } from '@/components/GoogleAdsense'
 import Live2D from '@/components/Live2D'
+import LoadingCover from '@/components/LoadingCover'
 import NotionIcon from '@/components/NotionIcon'
 import NotionPage from '@/components/NotionPage'
 import ShareBar from '@/components/ShareBar'
+import DashboardBody from '@/components/ui/dashboard/DashboardBody'
+import DashboardHeader from '@/components/ui/dashboard/DashboardHeader'
 import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
 import { isBrowser } from '@/lib/utils'
 import { getShortId } from '@/lib/utils/pageId'
+import { SignIn, SignUp } from '@clerk/nextjs'
 import dynamic from 'next/dynamic'
+import Head from 'next/head'
 import Link from 'next/link'
 import { useRouter } from 'next/router'
 import { createContext, useContext, useEffect, useRef, useState } from 'react'
@@ -30,7 +35,6 @@ import JumpToTopButton from './components/JumpToTopButton'
 import NavPostList from './components/NavPostList'
 import PageNavDrawer from './components/PageNavDrawer'
 import RevolverMaps from './components/RevolverMaps'
-import SearchInput from './components/SearchInput'
 import TagItemMini from './components/TagItemMini'
 import CONFIG from './config'
 import { Style } from './style'
@@ -74,7 +78,7 @@ function getNavPagesWithLatest(allNavPages, latestPosts, post) {
    }
    // 属于最新文章通常6篇 && (无阅读记录 || 最近更新时间大于上次阅读时间)
    if (
-      latestPosts.some(post => post?.id.indexOf(item?.short_id) === 0) &&
+      latestPosts.some(post => post?.id.indexOf(item?.short_id) === 14) &&
      (!postReadTime[item.short_id] ||
        postReadTime[item.short_id] < new Date(item.lastEditedDate).getTime())
    ) {
@@ -113,6 +117,11 @@ const LayoutBase = props => {
    setFilteredNavPages(getNavPagesWithLatest(allNavPages, latestPosts, post))
  }, [router])

+  const GITBOOK_LOADING_COVER = siteConfig(
+    'GITBOOK_LOADING_COVER',
+    true,
+    CONFIG
+  )
  return (
    <ThemeGlobalGitbook.Provider
      value={{
@@ -129,7 +138,7 @@ const LayoutBase = props => {

      <div
        id='theme-gitbook'
-        className={`${siteConfig('FONT_STYLE')} pb-16 md:pb-0 scroll-smooth bg-white dark:bg-hexo-black-gray w-full h-full min-h-screen justify-center dark:text-gray-300`}>
+        className={`${siteConfig('FONT_STYLE')} pb-16 md:pb-0 scroll-smooth bg-white dark:bg-black w-full h-full min-h-screen justify-center dark:text-gray-300`}>
        <AlgoliaSearchModal cRef={searchModal} {...props} />

        {/* 顶部导航栏 */}
@@ -137,27 +146,18 @@ const LayoutBase = props => {

        <main
          id='wrapper'
-          className={
-            (siteConfig('LAYOUT_SIDEBAR_REVERSE') ? 'flex-row-reverse' : '') +
-            'relative flex justify-between w-full h-full mx-auto'
-          }>
+          className={`${siteConfig('LAYOUT_SIDEBAR_REVERSE') ? 'flex-row-reverse' : ''} relative flex justify-between w-full gap-x-6 h-full mx-auto max-w-screen-4xl`}>
          {/* 左侧推拉抽屉 */}
          {fullWidth ? null : (
-            <div
-              className={
-                'hidden md:block border-r dark:border-transparent relative z-10 dark:bg-hexo-black-gray'
-              }>
-              <div className='w-72 pt-14 pb-4 px-6 sticky top-0 h-screen flex justify-between flex-col'>
+            <div className={'hidden md:block relative z-10 '}>
+              <div className='w-80 pt-14 pb-4 sticky top-0 h-screen flex justify-between flex-col'>
                {/* 导航 */}
-                <div className='overflow-y-scroll scroll-hidden'>
+                <div className='overflow-y-scroll scroll-hidden pt-10 pl-5'>
                  {/* 嵌入 */}
                  {slotLeft}
-                  {/* 搜索框 */}
-                  <SearchInput className='my-3 rounded-md' />

-                  {/* 文章列表 */}
                  {/* 所有文章列表 */}
-                  <NavPostList filteredNavPages={filteredNavPages} />
+                  <NavPostList filteredNavPages={filteredNavPages} {...props} />
                </div>
                {/* 页脚 */}
                <Footer {...props} />
@@ -165,34 +165,21 @@ const LayoutBase = props => {
            </div>
          )}

+          {/* 中间内容区域 */}
          <div
            id='center-wrapper'
-            className='flex flex-col justify-between w-full relative z-10 pt-14 min-h-screen dark:bg-black'>
+            className='flex flex-col justify-between w-full relative z-10 pt-14 min-h-screen'>
            <div
              id='container-inner'
-              className={`w-full px-7 ${fullWidth ? 'px-10' : 'max-w-3xl'} justify-center mx-auto`}>
+              className={`w-full ${fullWidth ? 'px-5' : 'max-w-3xl px-3 lg:px-0'} justify-center mx-auto`}>
              {slotTop}
              <WWAds className='w-full' orientation='horizontal' />

-              {/* <Transition
-                show={!onLoading}
-                appear={true}
-                enter='transition ease-in-out duration-700 transform order-first'
-                enterFrom='opacity-0 translate-y-16'
-                enterTo='opacity-100'
-                leave='transition ease-in-out duration-300 transform'
-                leaveFrom='opacity-100 translate-y-0'
-                leaveTo='opacity-0 -translate-y-16'
-                unmount={false}> */}
              {children}
-              {/* </Transition> */}

              {/* Google广告 */}
              <AdSlot type='in-article' />
              <WWAds className='w-full' orientation='horizontal' />
-
-              {/* 回顶按钮 */}
-              <JumpToTopButton />
            </div>

            {/* 底部 */}
@@ -201,17 +188,16 @@ const LayoutBase = props => {
            </div>
          </div>

-          {/*  右侧侧推拉抽屉 */}
+          {/*  右侧 */}
          {fullWidth ? null : (
            <div
-              style={{ width: '20rem' }}
              className={
-                'hidden xl:block dark:border-transparent flex-shrink-0 relative z-10 '
+                'w-72 hidden 2xl:block dark:border-transparent flex-shrink-0 relative z-10 '
              }>
-              <div className='py-14 px-6 sticky top-0'>
+              <div className='py-14 sticky top-0'>
                <ArticleInfo post={props?.post ? props?.post : props.notice} />

-                <div className='py-4'>
+                <div>
                  {/* 桌面端目录 */}
                  <Catalog {...props} />
                  {slotRight}
@@ -237,6 +223,11 @@ const LayoutBase = props => {
          )}
        </main>

+        {GITBOOK_LOADING_COVER && <LoadingCover />}
+
+        {/* 回顶按钮 */}
+        <JumpToTopButton />
+
        {/* 移动端导航抽屉 */}
        <PageNavDrawer {...props} filteredNavPages={filteredNavPages} />

@@ -255,29 +246,48 @@ const LayoutBase = props => {
 */
 const LayoutIndex = props => {
  const router = useRouter()
-  useEffect(() => {
-    router.push(siteConfig('GITBOOK_INDEX_PAGE', null, CONFIG)).then(() => {
-      // console.log('跳转到指定首页', siteConfig('INDEX_PAGE', null, CONFIG))
-      setTimeout(() => {
-        if (isBrowser) {
-          const article = document.getElementById('notion-article')
-          if (!article) {
-            console.log(
-              '请检查您的Notion数据库中是否包含此slug页面： ',
-              siteConfig('GITBOOK_INDEX_PAGE', null, CONFIG)
-            )
-            const containerInner = document.querySelector(
-              '#theme-gitbook #container-inner'
-            )
-            const newHTML = `<h1 class="text-3xl pt-12  dark:text-gray-300">配置有误</h1><blockquote class="notion-quote notion-block-ce76391f3f2842d386468ff1eb705b92"><div>请在您的notion中添加一个slug为${siteConfig('GITBOOK_INDEX_PAGE', null, CONFIG)}的文章</div></blockquote>`
-            containerInner?.insertAdjacentHTML('afterbegin', newHTML)
-          }
-        }
-      }, 7 * 1000)
-    })
-  }, [])
+  const index = siteConfig('GITBOOK_INDEX_PAGE', 'about', CONFIG)
+  const [hasRedirected, setHasRedirected] = useState(false) // 添加状态追踪是否已重定向

-  return <></>
+  useEffect(() => {
+    const tryRedirect = async () => {
+      if (!hasRedirected) {
+        // 仅当未重定向时执行
+        setHasRedirected(true) // 更新状态，防止多次执行
+
+        // 重定向到指定文章
+        router.push(index).then(() => {
+          setTimeout(() => {
+            const article = document.querySelector(
+              '#article-wrapper #notion-article'
+            )
+            if (!article) {
+              console.log(
+                '请检查您的Notion数据库中是否包含此slug页面： ',
+                index
+              )
+
+              // 显示错误信息
+              const containerInner = document.querySelector(
+                '#theme-gitbook #container-inner'
+              )
+              const newHTML = `<h1 class="text-3xl pt-12 dark:text-gray-300">配置有误</h1><blockquote class="notion-quote notion-block-ce76391f3f2842d386468ff1eb705b92"><div>请在您的notion中添加一个slug为${index}的文章</div></blockquote>`
+              containerInner?.insertAdjacentHTML('afterbegin', newHTML)
+            }
+          }, 2000)
+        })
+      }
+    }
+
+    if (index) {
+      console.log('重定向', index)
+      tryRedirect()
+    } else {
+      console.log('无重定向', index)
+    }
+  }, [index, hasRedirected]) // 将 hasRedirected 作为依赖确保状态变更时更新
+
+  return null // 不渲染任何内容
 }

 /**
@@ -296,15 +306,26 @@ const LayoutPostList = props => {
 * @returns
 */
 const LayoutSlug = props => {
-  const { post, prev, next, lock, validPassword } = props
+  const { post, prev, next, siteInfo, lock, validPassword } = props
  const router = useRouter()
+  // 如果是文档首页文章，则修改浏览器标签
+  const index = siteConfig('GITBOOK_INDEX_PAGE', 'about', CONFIG)
+  const basePath = router.asPath.split('?')[0]
+  const title =
+    basePath?.indexOf(index) > 0
+      ? `${post?.title} | ${siteInfo?.description}`
+      : `${post?.title} | ${siteInfo?.title}`
+
+  const waiting404 = siteConfig('POST_WAITING_TIME_FOR_404') * 1000
  useEffect(() => {
    // 404
    if (!post) {
      setTimeout(
        () => {
          if (isBrowser) {
-            const article = document.getElementById('notion-article')
+            const article = document.querySelector(
+              '#article-wrapper #notion-article'
+            )
            if (!article) {
              router.push('/404').then(() => {
                console.warn('找不到页面', router.asPath)
@@ -312,12 +333,16 @@ const LayoutSlug = props => {
            }
          }
        },
-        siteConfig('POST_WAITING_TIME_FOR_404') * 1000
+        waiting404
      )
    }
  }, [post])
  return (
    <>
+      <Head>
+        <title>{title}</title>
+      </Head>
+
      {/* 文章锁 */}
      {lock && <ArticleLock validPassword={validPassword} />}

@@ -333,17 +358,20 @@ const LayoutSlug = props => {

          {/* Notion文章主体 */}
          {post && (
-            <section id='article-wrapper' className='px-1'>
-              <NotionPage post={post} />
+            <section className='px-1'>
+              <div id='article-wrapper'>
+                <NotionPage post={post} />
+              </div>

              {/* 分享 */}
              <ShareBar post={post} />
              {/* 文章分类和标签信息 */}
              <div className='flex justify-between'>
-                {siteConfig('POST_DETAIL_CATEGORY', null, CONFIG) &&
-                  post?.category && <CategoryItem category={post.category} />}
+                {siteConfig('POST_DETAIL_CATEGORY') && post?.category && (
+                  <CategoryItem category={post.category} />
+                )}
                <div>
-                  {siteConfig('POST_DETAIL_TAG', null, CONFIG) &&
+                  {siteConfig('POST_DETAIL_TAG') &&
                    post?.tagItems?.map(tag => (
                      <TagItemMini key={tag.name} tag={tag} />
                    ))}
@@ -354,8 +382,8 @@ const LayoutSlug = props => {
                <ArticleAround prev={prev} next={next} />
              )}

-              <AdSlot />
-              <WWAds className='w-full' orientation='horizontal' />
+              {/* <AdSlot />
+              <WWAds className='w-full' orientation='horizontal' /> */}

              <Comment frontMatter={post} />
            </section>
@@ -499,15 +527,99 @@ const LayoutTagIndex = props => {
  )
 }

-export {
-  Layout404,
-  LayoutArchive,
-  LayoutBase,
-  LayoutCategoryIndex,
-  LayoutIndex,
-  LayoutPostList,
-  LayoutSearch,
-  LayoutSlug,
-  LayoutTagIndex,
-  CONFIG as THEME_CONFIG
+/**
+ * 登录页面
+ * @param {*} props
+ * @returns
+ */
+const LayoutSignIn = props => {
+  const { post } = props
+  const enableClerk = process.env.NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY
+
+  return (
+    <>
+      <div className='grow mt-20'>
+        {/* clerk预置表单 */}
+        {enableClerk && (
+          <div className='flex justify-center py-6'>
+            <SignIn />
+          </div>
+        )}
+        <div id='article-wrapper'>
+          <NotionPage post={post} />
+        </div>
+      </div>
+    </>
+  )
 }
+
+/**
+ * 注册页面
+ * @param {*} props
+ * @returns
+ */
+const LayoutSignUp = props => {
+  const { post } = props
+  const enableClerk = process.env.NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY
+
+  return (
+    <>
+      <div className='grow mt-20'>
+        {/* clerk预置表单 */}
+        {enableClerk && (
+          <div className='flex justify-center py-6'>
+            <SignUp />
+          </div>
+        )}
+        <div id='article-wrapper'>
+          <NotionPage post={post} />
+        </div>
+      </div>
+    </>
+  )
+}
+
+/**
+ * 仪表盘
+ * @param {*} props
+ * @returns
+ */
+const LayoutDashboard = props => {
+  const { post } = props
+
+  return (
+    <>
+      <div className='container grow'>
+        <div className='flex flex-wrap justify-center -mx-4'>
+          <div id='container-inner' className='w-full p-4'>
+            {post && (
+              <div id='article-wrapper' className='mx-auto'>
+                <NotionPage {...props} />
+              </div>
+            )}
+          </div>
+        </div>
+      </div>
+      {/* 仪表盘 */}
+      <DashboardHeader />
+      <DashboardBody />
+    </>
+  )
+}
+
+export {
+    Layout404,
+    LayoutArchive,
+    LayoutBase,
+    LayoutCategoryIndex,
+    LayoutDashboard,
+    LayoutIndex,
+    LayoutPostList,
+    LayoutSearch,
+    LayoutSignIn,
+    LayoutSignUp,
+    LayoutSlug,
+    LayoutTagIndex,
+    CONFIG as THEME_CONFIG
+}
+