diff --git a/.env.local b/.env.local
index 8a2ae88c2df..b8274ef0559 100644
--- a/.env.local
+++ b/.env.local
@@ -1,5 +1,5 @@
 # 环境变量 @see https://www.nextjs.cn/docs/basic-features/environment-variables
-NEXT_PUBLIC_VERSION=4.3.2
+NEXT_PUBLIC_VERSION=4.4.0
 
 
 # 可在此添加环境变量，去掉最左边的（# ）注释即可
diff --git a/components/AlgoliaSearchModal.js b/components/AlgoliaSearchModal.js
index 5446582645c..ea727a48dbb 100644
--- a/components/AlgoliaSearchModal.js
+++ b/components/AlgoliaSearchModal.js
@@ -1,4 +1,4 @@
-import { useState, useImperativeHandle, useRef, useEffect } from 'react'
+import { useState, useImperativeHandle, useRef, useEffect, Fragment } from 'react'
 import algoliasearch from 'algoliasearch'
 import replaceSearchResult from '@/components/Mark'
 import Link from 'next/link'
@@ -7,6 +7,22 @@ import throttle from 'lodash/throttle'
 import { siteConfig } from '@/lib/config'
 import { useHotkeys } from 'react-hotkeys-hook';
 
+const ShortCutActions = [
+  {
+    key: '↑ ↓',
+    action: '选择'
+  },
+  {
+    key: 'Enter',
+    action: '跳转'
+  },
+  {
+    key: 'Esc',
+    action: '关闭'
+  }
+
+]
+
 /**
  * 结合 Algolia 实现的弹出式搜索框
  * 打开方式 cRef.current.openSearch()
@@ -234,6 +250,15 @@ export default function AlgoliaSearchModal({ cRef }) {
         </ul>
         <Pagination totalPage={totalPage} page={page} switchPage={switchPage} />
         <div className='flex items-center justify-between mt-2 sm:text-sm text-xs dark:text-gray-300'>
+          {totalHit === 0 && (<div className='flex items-center'>
+            {
+              ShortCutActions.map((action, index) => {
+                return <Fragment key={index}><div className='border-gray-300 dark:text-gray-300 text-gray-600 px-2 rounded border inline-block'>{action.key}</div>
+                  <span className='ml-2 mr-4  text-gray-600 dark:text-gray-300'>{action.action}</span></Fragment>
+              })
+            }
+          </div>)
+          }
           <div>
             {totalHit > 0 && (
               <p>
diff --git a/lib/global.js b/lib/global.js
index 57f5e41d0b2..77b94e2dfad 100644
--- a/lib/global.js
+++ b/lib/global.js
@@ -16,8 +16,8 @@ export function GlobalContextProvider(props) {
   const [lang, updateLang] = useState(NOTION_CONFIG?.LANG || LANG) // 默认语言
   const [locale, updateLocale] = useState(generateLocaleDict(NOTION_CONFIG?.LANG || LANG)) // 默认语言
   const [theme, setTheme] = useState(NOTION_CONFIG?.THEME || THEME) // 默认博客主题
-  const defaultDarkMode = NOTION_CONFIG?.APPEARANCE || APPEARANCE === 'dark'
-  const [isDarkMode, updateDarkMode] = useState(defaultDarkMode) // 默认深色模式
+  const defaultDarkMode = NOTION_CONFIG?.APPEARANCE || APPEARANCE
+  const [isDarkMode, updateDarkMode] = useState(defaultDarkMode === 'dark') // 默认深色模式
   const [onLoading, setOnLoading] = useState(false) // 抓取文章数据
   const router = useRouter()
 
@@ -58,13 +58,13 @@ export function GlobalContextProvider(props) {
   }
 
   useEffect(() => {
-    initDarkMode(updateDarkMode,defaultDarkMode)
+    initDarkMode(updateDarkMode, defaultDarkMode)
     initLocale(lang, locale, updateLang, updateLocale)
   }, [])
 
   // 加载进度条
   useEffect(() => {
-    const handleStart = (url) => {
+    const handleStart = url => {
       const { theme } = router.query
       if (theme && !url.includes(`theme=${theme}`)) {
         const newUrl = `${url}${url.includes('?') ? '&' : '?'}theme=${theme}`
@@ -87,27 +87,28 @@ export function GlobalContextProvider(props) {
   }, [router])
 
   return (
-        <GlobalContext.Provider value={{
-          fullWidth,
-          NOTION_CONFIG,
-          toggleDarkMode,
-          onLoading,
-          setOnLoading,
-          lang,
-          changeLang,
-          locale,
-          updateLocale,
-          isDarkMode,
-          updateDarkMode,
-          theme,
-          setTheme,
-          switchTheme,
-          siteInfo,
-          categoryOptions,
-          tagOptions
-        }}>
-            {children}
-        </GlobalContext.Provider>
+    <GlobalContext.Provider
+      value={{
+        fullWidth,
+        NOTION_CONFIG,
+        toggleDarkMode,
+        onLoading,
+        setOnLoading,
+        lang,
+        changeLang,
+        locale,
+        updateLocale,
+        isDarkMode,
+        updateDarkMode,
+        theme,
+        setTheme,
+        switchTheme,
+        siteInfo,
+        categoryOptions,
+        tagOptions
+      }}>
+      {children}
+    </GlobalContext.Provider>
   )
 }
 
diff --git a/package.json b/package.json
index 13b60baf01a..9dc7983b567 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "notion-next",
-    "version": "4.3.2",
+    "version": "4.4.0",
     "homepage": "https://github.com/tangly1024/NotionNext.git",
     "license": "MIT",
     "repository": {
diff --git a/public/dplayer.htm b/public/dplayer.htm
index 67348de4e88..73760fa3380 100644
--- a/public/dplayer.htm
+++ b/public/dplayer.htm
@@ -8,8 +8,17 @@
     <!-- 引入 DPlayer 样式文件 -->
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/dplayer/dist/DPlayer.min.css">
     <style>
+        html,
         body {
-            margin: 0px 0px;
+            height: 100%;
+            margin: 0;
+            padding: 0;
+            overflow: hidden;
+        }
+
+        #dplayer-container {
+            width: 100%;
+            height: 100%;
         }
     </style>
 </head>
@@ -25,7 +34,7 @@
 
     <script>
         var myParam = decodeURIComponent(location.search.split('n=')[1]);
-        if(!myParam){
+        if (!myParam) {
             alert('无效的视频地址')
         }
         // 创建 DPlayer 实例
diff --git a/themes/fukasawa/components/AsideLeft.js b/themes/fukasawa/components/AsideLeft.js
index 5083269b0de..f534d1b68c8 100644
--- a/themes/fukasawa/components/AsideLeft.js
+++ b/themes/fukasawa/components/AsideLeft.js
@@ -14,7 +14,7 @@ import { AdSlot } from '@/components/GoogleAdsense'
 import { siteConfig } from '@/lib/config'
 import MailChimpForm from './MailChimpForm'
 import { useGlobal } from '@/lib/global'
-import { useEffect, useState } from 'react'
+import { useEffect, useMemo, useState } from 'react'
 import { isBrowser } from '@/lib/utils'
 import { debounce } from 'lodash'
 
@@ -45,6 +45,23 @@ function AsideLeft(props) {
     }
   }, [isCollapsed])
 
+  const position = useMemo(() => {
+    const isReverse = JSON.parse(siteConfig('LAYOUT_SIDEBAR_REVERSE'))
+    if (isCollapsed) {
+      if (isReverse) {
+        return 'right-2'
+      } else {
+        return 'left-2'
+      }
+    } else {
+      if (isReverse) {
+        return 'right-80'
+      } else {
+        return 'left-80'
+      }
+    }
+  }, [isCollapsed])
+
   // 折叠侧边栏
   const toggleOpen = () => {
     setIsCollapse(!isCollapsed)
@@ -75,14 +92,15 @@ function AsideLeft(props) {
       }
     }
   }, [])
-
+ 
+ 
   return <div className={`sideLeft relative ${isCollapsed ? 'w-0' : 'w-80'} duration-300 transition-all bg-white dark:bg-hexo-black-gray min-h-screen hidden lg:block z-20`}>
         {/* 折叠按钮 */}
-        {siteConfig('FUKASAWA_SIDEBAR_COLLAPSE_BUTTON', null, CONFIG) && <div className={`${isCollapsed ? '' : 'ml-80'} hidden lg:block sticky top-0 mx-2 cursor-pointer hover:scale-110 duration-300 px-3 py-2`} onClick={toggleOpen}>
+    {siteConfig('FUKASAWA_SIDEBAR_COLLAPSE_BUTTON', null, CONFIG) && <div className={`${position} hidden lg:block fixed top-0 cursor-pointer hover:scale-110 duration-300 px-3 py-2   dark:text-white`} onClick={toggleOpen}>
             {isCollapsed ? <i className="fa-solid fa-indent text-xl"></i> : <i className='fas fa-bars text-xl'></i>}
         </div>}
 
-        <div className={`h-full ${isCollapsed ? 'hidden' : 'px-8'}`}>
+        <div className={`h-full ${isCollapsed ? 'hidden' : 'p-8'}`}>
 
             <Logo {...props} />
 
@@ -133,13 +151,12 @@ function AsideLeft(props) {
                 <DarkModeButton />
             </section>
 
-            <section className='sticky top-0 pt-12'>
+            <section className='sticky top-0 pt-12  flex flex-col max-h-screen '>
                 <Catalog toc={post?.toc} />
                 <div className='flex justify-center'>
                     <div>{slot}</div>
                 </div>
             </section>
-
         </div>
     </div>
 }
diff --git a/themes/fukasawa/components/Catalog.js b/themes/fukasawa/components/Catalog.js
index a69bfbd3922..7823ff742be 100644
--- a/themes/fukasawa/components/Catalog.js
+++ b/themes/fukasawa/components/Catalog.js
@@ -54,35 +54,32 @@ const Catalog = ({ toc }) => {
 
   // 目录自动滚动
   const tRef = useRef(null)
-
   // 无目录就直接返回空
   if (!toc || toc?.length < 1) {
     return <></>
   }
-
-  return <div id='catalog'>
+  return <div id='catalog' className='flex-1 flex-col flex overflow-hidden'>
     <div className='w-full dark:text-gray-300 mb-2'><i className='mr-1 fas fa-stream' />{locale.COMMON.TABLE_OF_CONTENTS}</div>
-    <div className='h-96'>
-      <nav ref={tRef} className='h-full overflow-y-auto overscroll-none scroll-hidden  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
+    <nav ref={tRef} className='flex-1 overflow-auto  overscroll-none scroll-hidden   text-black mb-6'>
+      {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} `}
+          >
+            <span style={{ display: 'inline-block', marginLeft: tocItem.indentLevel * 16 }}
+              className={`${activeSection === id && ' font-bold text-red-400 underline'}`}
+              title={tocItem.text}
             >
-              <span style={{ display: 'inline-block', marginLeft: tocItem.indentLevel * 16 }}
-                className={`${activeSection === id && ' font-bold text-red-400 underline'}`}
-              >
-                {tocItem.text}
-              </span>
-            </a>
-          )
-        })}
-      </nav>
-    </div>
+              {tocItem.text}
+            </span>
+          </a>
+        )
+      })}
+    </nav>
   </div>
 }
 
diff --git a/themes/movie/index.js b/themes/movie/index.js
index 5b7f918477a..af940150cc1 100644
--- a/themes/movie/index.js
+++ b/themes/movie/index.js
@@ -157,7 +157,7 @@ const LayoutSlug = props => {
 
       // 创建一个新的容器元素
       const videoWrapper = document.createElement('div')
-      videoWrapper.className = 'video-wrapper p-2 bg-gray-100 dark:bg-hexo-black-gray max-w-5xl mx-auto'
+      videoWrapper.className = 'video-wrapper p-2 bg-gray-100 dark:bg-hexo-black-gray max-w-4xl mx-auto'
 
       // 创建一个新的容器元素
       const carouselWrapper = document.createElement('div')
diff --git a/themes/theme.js b/themes/theme.js
index 7b50b1ee0f1..f872a12ed32 100644
--- a/themes/theme.js
+++ b/themes/theme.js
@@ -12,7 +12,7 @@ export const { THEMES = [] } = getConfig().publicRuntimeConfig
  * @param {*} themeQuery
  * @returns
  */
-export const getGlobalLayoutByTheme = (themeQuery) => {
+export const getGlobalLayoutByTheme = themeQuery => {
   if (themeQuery !== BLOG.THEME) {
     return dynamic(() => import(`@/themes/${themeQuery}`).then(m => m[getLayoutNameByPath(-1)]), { ssr: true })
   } else {
@@ -29,22 +29,26 @@ export const getGlobalLayoutByTheme = (themeQuery) => {
 export const getLayoutByTheme = ({ router, theme }) => {
   const themeQuery = getQueryParam(router.asPath, 'theme') || theme
   if (themeQuery !== BLOG.THEME) {
-    return dynamic(() => import(`@/themes/${themeQuery}`).then(m => {
-      setTimeout(() => {
-        checkThemeDOM()
-      }, 500);
+    return dynamic(
+      () =>
+        import(`@/themes/${themeQuery}`).then(m => {
+          setTimeout(() => {
+            checkThemeDOM()
+          }, 500)
 
-      const components = m[getLayoutNameByPath(router.pathname, router.asPath)]
-      if (components) {
-        return components
-      } else {
-        return m.LayoutSlug
-      }
-    }), { ssr: true })
+          const components = m[getLayoutNameByPath(router.pathname, router.asPath)]
+          if (components) {
+            return components
+          } else {
+            return m.LayoutSlug
+          }
+        }),
+      { ssr: true }
+    )
   } else {
     setTimeout(() => {
       checkThemeDOM()
-    }, 100);
+    }, 100)
     const components = ThemeComponents[getLayoutNameByPath(router.pathname, router.asPath)]
     if (components) {
       return components
@@ -59,12 +63,12 @@ export const getLayoutByTheme = ({ router, theme }) => {
  * @param {*} path
  * @returns
  */
-const getLayoutNameByPath = (path) => {
+const getLayoutNameByPath = path => {
   if (LAYOUT_MAPPINGS[path]) {
-    return LAYOUT_MAPPINGS[path];
+    return LAYOUT_MAPPINGS[path]
   } else {
     // 没有特殊处理的路径返回默认layout名称
-    return 'LayoutSlug';
+    return 'LayoutSlug'
   }
 }
 
@@ -90,19 +94,20 @@ const checkThemeDOM = () => {
  * @param updateDarkMode 更改主题ChangeState函数
  * @description 读取cookie中存的用户主题
  */
-export const initDarkMode = (updateDarkMode,defaultDarkMode) => {
+export const initDarkMode = (updateDarkMode, defaultDarkMode) => {
   // 查看用户设备浏览器是否深色模型
   let newDarkMode = isPreferDark()
 
   // 查看localStorage中用户记录的是否深色模式
   const userDarkMode = loadDarkModeFromLocalStorage()
+  console.log('深色模式',userDarkMode)
   if (userDarkMode) {
-    newDarkMode = userDarkMode
+    newDarkMode = userDarkMode === 'dark' || userDarkMode === 'true'
   }
-    
+
   // 如果站点强制设置默认深色，则优先级改过用
-  if(defaultDarkMode){
-    newDarkMode = defaultDarkMode
+  if (defaultDarkMode === 'true') {
+    newDarkMode = true
   }
 
   // url查询条件中是否深色模式
@@ -128,7 +133,11 @@ export function isPreferDark() {
     // 系统深色模式或时间是夜间时，强行置为夜间模式
     const date = new Date()
     const prefersDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches
-    return prefersDarkMode || (BLOG.APPEARANCE_DARK_TIME && (date.getHours() >= BLOG.APPEARANCE_DARK_TIME[0] || date.getHours() < BLOG.APPEARANCE_DARK_TIME[1]))
+    return (
+      prefersDarkMode ||
+      (BLOG.APPEARANCE_DARK_TIME &&
+        (date.getHours() >= BLOG.APPEARANCE_DARK_TIME[0] || date.getHours() < BLOG.APPEARANCE_DARK_TIME[1]))
+    )
   }
   return false
 }
@@ -142,9 +151,9 @@ export const loadDarkModeFromLocalStorage = () => {
 }
 
 /**
-   * 保存深色模式
-   * @param newTheme
-   */
-export const saveDarkModeToLocalStorage = (newTheme) => {
+ * 保存深色模式
+ * @param newTheme
+ */
+export const saveDarkModeToLocalStorage = newTheme => {
   localStorage.setItem('darkMode', newTheme)
 }