Merge pull request #134 from tangly1024/preview

Hexo: 导航菜单

themes/hexo/components/HeaderArticle.js

@@ -37,7 +37,8 @@ export default function HeaderArticle ({ post, siteInfo }) {
   const updateTopNav = () => {
     if (!isDarkMode) {
       const stickyNavElement = document.getElementById('sticky-nav')
-      if (window.scrollY < window.innerHeight) {
+      const header = document.querySelector('#header')
+      if (window.scrollY < header.clientHeight) {
         stickyNavElement?.classList?.add('dark')
       } else {
         stickyNavElement?.classList?.remove('dark')

themes/hexo/components/TopNav.js

@@ -7,7 +7,6 @@ import Collapse from './Collapse'
 import Logo from './Logo'
 import SearchDrawer from './SearchDrawer'
 import TagGroups from './TagGroups'
-import CONFIG_HEXO from '../config_hexo'
 import MenuButtonGroupTop from './MenuButtonGroupTop'
 import MenuList from './MenuList'
 
@@ -40,12 +39,9 @@ const TopNav = props => {
 
   // 监听滚动
   useEffect(() => {
-    if (CONFIG_HEXO.NAV_TYPE === 'autoCollapse') {
+    window.addEventListener('scroll', scrollTrigger)
-      // scrollTrigger()
-      window.addEventListener('scroll', scrollTrigger)
-    }
     return () => {
-      CONFIG_HEXO.NAV_TYPE === 'autoCollapse' && window.removeEventListener('scroll', scrollTrigger)
+      window.removeEventListener('scroll', scrollTrigger)
     }
   }, [])
 
@@ -91,7 +87,7 @@ const TopNav = props => {
     <SearchDrawer cRef={searchDrawer} slot={searchDrawerSlot}/>
 
     {/* 导航栏 */}
-    <div id='sticky-nav' className={`${CONFIG_HEXO.NAV_TYPE !== 'normal' ? 'fixed bg-white' : ' bg-none -mb-10'} animate__animated animate__fadeIn dark:bg-hexo-black-gray dark:text-gray-200 text-black w-full top-0 z-20 transform duration-200 font-san `}>
+    <div id='sticky-nav' className={'fixed bg-none animate__animated animate__fadeIn dark:bg-hexo-black-gray dark:text-gray-200 text-black w-full top-0 z-20 transform duration-200 font-san'}>
       <div className='w-full flex justify-between items-center px-4 py-2 border dark:border-transparent'>
         <div className='flex'>
          <Logo {...props}/>

themes/hexo/config_hexo.js

@@ -11,7 +11,6 @@ const CONFIG_HEXO = {
   POST_LIST_COVER: true, // 文章封面
   POST_LIST_SUMMARY: true, // 文章摘要
   POST_LIST_PREVIEW: true, // 读取文章预览
-  NAV_TYPE: 'autoCollapse', // ['fixed','autoCollapse','normal'] 分别是固定屏幕顶部、屏幕顶部自动折叠，不固定
 
   ARTICLE_ADJACENT: true, // 显示上一篇下一篇文章推荐
   ARTICLE_COPYRIGHT: true, // 显示文章版权声明