remove: sidemenu drag effect
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import React, { useMemo, useRef } from 'react';
|
import React, { useMemo, useRef } from 'react';
|
||||||
import { motion, PanInfo, Variants } from 'framer-motion';
|
import { motion, Variants } from 'framer-motion';
|
||||||
import SideMenuItem from './SideMenuItem';
|
import SideMenuItem from './SideMenuItem';
|
||||||
import NoteBoardIcon from '../icons/NoteBoardIcon';
|
import NoteBoardIcon from '../icons/NoteBoardIcon';
|
||||||
import BlurredOverlayContainer from '../overlays/BlurredOverlayContainer';
|
import BlurredOverlayContainer from '../overlays/BlurredOverlayContainer';
|
||||||
@@ -75,12 +75,6 @@ function SideMenu({ menuState, toggleMenuState, nightModeState, togglenightModeS
|
|||||||
visible: { x: 0, transition: { delay: 0.075, duration: 0.1, ease: 'easeInOut' } }
|
visible: { x: 0, transition: { delay: 0.075, duration: 0.1, ease: 'easeInOut' } }
|
||||||
};
|
};
|
||||||
|
|
||||||
const onDrag = (_event: MouseEvent | TouchEvent | PointerEvent, info: PanInfo) => {
|
|
||||||
if (info.offset.x > 20 && closeRef.current) {
|
|
||||||
closeRef.current.click();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const hrefOnClicks = [
|
const hrefOnClicks = [
|
||||||
{ href: '?logout', handler: toggleLogoutModal },
|
{ href: '?logout', handler: toggleLogoutModal },
|
||||||
{ href: '?share', handler: toggleShareModal },
|
{ href: '?share', handler: toggleShareModal },
|
||||||
@@ -178,12 +172,7 @@ function SideMenu({ menuState, toggleMenuState, nightModeState, togglenightModeS
|
|||||||
<aside aria-label={tMenu('AriaLabel')}>
|
<aside aria-label={tMenu('AriaLabel')}>
|
||||||
<BlurredOverlayContainer className='xl:hidden!' bgOpacity={40} visible={menuStateMemo} outDelay={150} inDuration={200}>
|
<BlurredOverlayContainer className='xl:hidden!' bgOpacity={40} visible={menuStateMemo} outDelay={150} inDuration={200}>
|
||||||
<motion.nav
|
<motion.nav
|
||||||
drag='x'
|
|
||||||
dragConstraints={{ left: 0, right: 20 }}
|
|
||||||
transition={{ type: "spring", stiffness: 200, damping: 20 }}
|
transition={{ type: "spring", stiffness: 200, damping: 20 }}
|
||||||
dragTransition={{ bounceDamping: 10, bounceStiffness: 600 }}
|
|
||||||
dragElastic={0.05}
|
|
||||||
onDragEnd={onDrag}
|
|
||||||
initial="hidden"
|
initial="hidden"
|
||||||
animate={menuState ? 'visible' : 'hidden'}
|
animate={menuState ? 'visible' : 'hidden'}
|
||||||
variants={variants}
|
variants={variants}
|
||||||
@@ -193,7 +182,6 @@ function SideMenu({ menuState, toggleMenuState, nightModeState, togglenightModeS
|
|||||||
className="fixed top-0 bottom-0 right-0 bg-white w-[200px] h-dvh flex flex-col z-40 overflow-clip not-xl:!rounded-s-none"
|
className="fixed top-0 bottom-0 right-0 bg-white w-[200px] h-dvh flex flex-col z-40 overflow-clip not-xl:!rounded-s-none"
|
||||||
>
|
>
|
||||||
{renderMenu()}
|
{renderMenu()}
|
||||||
{String(logoutModal)}
|
|
||||||
</motion.nav>
|
</motion.nav>
|
||||||
</BlurredOverlayContainer>
|
</BlurredOverlayContainer>
|
||||||
<nav
|
<nav
|
||||||
|
|||||||
Reference in New Issue
Block a user