mirror of
https://github.com/d0zingcat/NotionNext.git
synced 2026-05-23 07:26:47 +00:00
fix(子菜单闪烁问题)
This commit is contained in:
@@ -52,7 +52,7 @@ export const MenuItemDrop = ({ link }) => {
|
||||
{/* 子菜单 */}
|
||||
{hasSubMenu && (
|
||||
<ul
|
||||
className={`${show ? 'visible opacity-100 top-14' : 'invisible opacity-0 top-20'} p-1 absolute border bg-white dark:bg-black dark:border-gray-800 transition-all duration-150 z-20 block rounded-lg drop-shadow-lg`}>
|
||||
className={`${show ? 'visible opacity-100 top-14 pointer-events-auto' : 'invisible opacity-0 top-20 pointer-events-none'} p-1 absolute border bg-white dark:bg-black dark:border-gray-800 transition-all duration-150 z-20 block rounded-lg drop-shadow-lg`}>
|
||||
{link?.subMenus?.map(sLink => {
|
||||
return (
|
||||
<li
|
||||
|
||||
@@ -28,10 +28,14 @@ export const MenuItemDrop = ({ link }) => {
|
||||
|
||||
{hasSubMenu && (
|
||||
<>
|
||||
<div className='cursor-pointer menu-link pl-2 pr-4 no-underline tracking-widest pb-1'>
|
||||
<div className='cursor-pointer menu-link pl-2 pr-4 no-underline tracking-widest pb-1 relative'>
|
||||
{link?.icon && <i className={link?.icon} />} {link?.name}
|
||||
<i
|
||||
className={`px-2 fa fa-angle-down duration-300 ${show ? 'rotate-180' : 'rotate-0'}`}></i>
|
||||
{/* 主菜单下方的安全区域 */}
|
||||
{show && (
|
||||
<div className='absolute w-full h-3 -bottom-1 left-0 bg-transparent z-30'></div>
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
@@ -40,7 +44,7 @@ export const MenuItemDrop = ({ link }) => {
|
||||
{hasSubMenu && (
|
||||
<ul
|
||||
style={{ backdropFilter: 'blur(3px)' }}
|
||||
className={`${show ? 'visible opacity-100 top-12' : 'invisible opacity-0 top-20'} drop-shadow-md overflow-hidden rounded-md bg-white transition-all duration-300 z-20 absolute block `}>
|
||||
className={`${show ? 'visible opacity-100 top-12 pointer-events-auto' : 'invisible opacity-0 top-20 pointer-events-none'} drop-shadow-md overflow-hidden rounded-md bg-white transition-all duration-300 z-20 absolute block `}>
|
||||
{link.subMenus.map((sLink, index) => {
|
||||
return (
|
||||
<li
|
||||
|
||||
@@ -37,7 +37,7 @@ export const MenuItemDrop = ({ link }) => {
|
||||
{hasSubMenu && (
|
||||
<ul
|
||||
style={{ backdropFilter: 'blur(3px)' }}
|
||||
className={`${show ? 'visible opacity-100 top-14' : 'invisible opacity-0 top-20'} drop-shadow-md overflow-hidden rounded-md text-black dark:text-white bg-white dark:bg-black transition-all duration-300 z-30 absolute block `}>
|
||||
className={`${show ? 'visible opacity-100 top-14 pointer-events-auto' : 'invisible opacity-0 top-20 pointer-events-none'} drop-shadow-md overflow-hidden rounded-md text-black dark:text-white bg-white dark:bg-black transition-all duration-300 z-30 absolute block `}>
|
||||
{link.subMenus.map((sLink, index) => {
|
||||
return (
|
||||
<li
|
||||
|
||||
Reference in New Issue
Block a user