Thream/website
2
2
Fork 0
mirror of https://github.com/Thream/website.git synced 2024-07-06 18:40:12 +02:00
Code Issues Releases Activity

fix(components): change sidebar behaviour

Browse Source
This commit is contained in:
Walid 2022-03-21 21:42:11 +01:00
parent fdc754fcf5
commit d2b0e8831c
No known key found for this signature in database
GPG Key ID: 4BDA1ABD227F9279
2 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
components/Application/Application.tsx
View File

@ -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',
{

4
components/Application/Sidebar/Sidebar.tsx
View File

@ -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,