From 08aff7ce5803ce8a7565933346a73465c4d99145 Mon Sep 17 00:00:00 2001
From: "tangly1024.com" <tlyong1992@hotmail.com>
Date: Tue, 18 Jul 2023 18:48:59 +0800
Subject: [PATCH] =?UTF-8?q?=E7=A7=BB=E5=8A=A8=E7=AB=AF=E8=8F=9C=E5=8D=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/Collapse.js                    | 2 +-
 themes/heo/components/MenuItemCollapse.js | 6 +++---
 themes/heo/components/MenuListSide.js     | 2 +-
 themes/heo/components/MenuListTop.js      | 2 --
 themes/heo/components/SlideOver.js        | 4 ++++
 5 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/components/Collapse.js b/components/Collapse.js
index 25db6292..4e26f7fd 100644
--- a/components/Collapse.js
+++ b/components/Collapse.js
@@ -84,7 +84,7 @@ const Collapse = props => {
   }, [props.isOpen])
 
   return (
-        <div ref={ref} style={type === 'vertical' ? { height: '0px', willChange: 'height' } : { width: '0px', willChange: 'width' }} className={`${props.className} overflow-hidden duration-200 `}>
+        <div ref={ref} style={type === 'vertical' ? { height: '0px', willChange: 'height' } : { width: '0px', willChange: 'width' }} className={`${props.className || ''} overflow-hidden duration-200 `}>
             {props.children}
         </div>
   )
diff --git a/themes/heo/components/MenuItemCollapse.js b/themes/heo/components/MenuItemCollapse.js
index 3ec10f5e..d12e9ffe 100644
--- a/themes/heo/components/MenuItemCollapse.js
+++ b/themes/heo/components/MenuItemCollapse.js
@@ -26,7 +26,7 @@ export const MenuItemCollapse = ({ link }) => {
   }
 
   return <>
-        <div className='w-full px-8 py-3 text-left dark:bg-hexo-black-gray' onClick={toggleShow} >
+        <div className='w-full px-2 py-3 border rounded-xl text-left dark:bg-hexo-black-gray' onClick={toggleShow} >
             {!hasSubMenu && <Link
                 href={link?.to}
                 className="font-extralight  flex justify-between pl-2 pr-4 dark:text-gray-200 no-underline tracking-widest pb-1">
@@ -41,9 +41,9 @@ export const MenuItemCollapse = ({ link }) => {
         </div>
 
         {/* 折叠子菜单 */}
-        {hasSubMenu && <Collapse isOpen={isOpen}>
+        {hasSubMenu && <Collapse isOpen={isOpen} className='rounded-xl'>
             {link.subMenus.map(sLink => {
-              return <div key={sLink.id} className='dark:bg-black dark:text-gray-200 text-left px-10 justify-start bg-gray-50 hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200  py-3 pr-6'>
+              return <div key={sLink.id} className='dark:bg-black dark:text-gray-200 text-left px-3 justify-start bg-gray-50 hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200  py-3 pr-6'>
                     <Link href={sLink.to}>
                         <span className='text-sm ml-4 whitespace-nowrap'>{link?.icon && <i className={sLink.icon + ' mr-2'} />} {sLink.title}</span>
                     </Link>
diff --git a/themes/heo/components/MenuListSide.js b/themes/heo/components/MenuListSide.js
index 1a3b2f5b..19f70863 100644
--- a/themes/heo/components/MenuListSide.js
+++ b/themes/heo/components/MenuListSide.js
@@ -29,7 +29,7 @@ export const MenuListSide = (props) => {
   }
 
   return (
-        <nav>
+        <nav className='flex-col space-y-2'>
             {/* {links.map(link => <MenuItemNormal key={link?.id} link={link} />)} */}
             {links?.map(link => <MenuItemCollapse key={link?.id} link={link} />)}
         </nav>
diff --git a/themes/heo/components/MenuListTop.js b/themes/heo/components/MenuListTop.js
index a2fd66ad..381b5adb 100644
--- a/themes/heo/components/MenuListTop.js
+++ b/themes/heo/components/MenuListTop.js
@@ -12,8 +12,6 @@ export const MenuListTop = (props) => {
     { id: 1, icon: 'fa-solid fa-house', name: locale.NAV.INDEX, to: '/', show: CONFIG.MENU_INDEX },
     { id: 2, icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG.MENU_SEARCH },
     { id: 3, icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG.MENU_ARCHIVE }
-    // { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG.MENU_CATEGORY },
-    // { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG.MENU_TAG }
   ]
 
   if (customNav) {
diff --git a/themes/heo/components/SlideOver.js b/themes/heo/components/SlideOver.js
index fdd20bf4..60ff696d 100644
--- a/themes/heo/components/SlideOver.js
+++ b/themes/heo/components/SlideOver.js
@@ -4,9 +4,11 @@ import { Dialog, Transition } from '@headlessui/react'
 import DarkModeButton from '@/components/DarkModeButton'
 import Link from 'next/link'
 import TagGroups from './TagGroups'
+import { MenuListSide } from './MenuListSide'
 
 /**
  * 侧边抽屉
+ * 移动端的菜单在这里
  */
 export default function SlideOver(props) {
   const { cRef, tagOptions } = props
@@ -88,6 +90,8 @@ export default function SlideOver(props) {
                                                     <Button title={'主页'} url={'/'} />
                                                     <Button title={'关于'} url={'/about'} />
                                                 </div>
+                                                {/* 用户自定义菜单 */}
+                                                <MenuListSide {...props}/>
                                             </section>
 
                                             <section className='space-y-2 flex flex-col'>