fix(components): change sidebar behaviour
This commit is contained in:
parent
fdc754fcf5
commit
d2b0e8831c
components/Application
@ -99,6 +99,15 @@ export const Application: React.FC<ApplicationProps> = (props) => {
|
||||
}
|
||||
}
|
||||
|
||||
const handleCloseSidebars = (): void => {
|
||||
if (isMobile && (visibleSidebars.left || visibleSidebars.right)) {
|
||||
return setVisibleSidebars({
|
||||
left: false,
|
||||
right: false
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const swipeableHandlers = useSwipeable({
|
||||
trackMouse: false,
|
||||
trackTouch: true,
|
||||
@ -202,6 +211,7 @@ export const Application: React.FC<ApplicationProps> = (props) => {
|
||||
|
||||
<div
|
||||
id='application-page-content'
|
||||
onClick={handleCloseSidebars}
|
||||
className={classNames(
|
||||
'h-full-without-header top-0 z-0 flex w-full flex-1 flex-col overflow-y-auto transition',
|
||||
{
|
||||
|
@ -17,12 +17,12 @@ export const Sidebar: React.FC<SidebarProps> = (props) => {
|
||||
return (
|
||||
<nav
|
||||
className={classNames(
|
||||
'h-full-without-header z-50 flex bg-gray-200 drop-shadow-2xl transition-all dark:bg-gray-800',
|
||||
'h-full-without-header visible z-50 flex bg-gray-200 drop-shadow-2xl transition-all dark:bg-gray-800',
|
||||
{
|
||||
'scrollbar-firefox-support top-0 right-0 flex-col space-y-1 overflow-y-auto':
|
||||
direction === 'right',
|
||||
'w-72': direction === 'right' && visible,
|
||||
'w-0 opacity-0': !visible,
|
||||
'invisible w-0 opacity-0': !visible,
|
||||
'w-80': direction === 'left' && visible,
|
||||
'max-w-max': typeof path !== 'string' && direction === 'left',
|
||||
'top-0 right-0': direction === 'right' && isMobile,
|
||||
|
Reference in New Issue
Block a user