fix: sidebar ui fix (#4187)

This commit is contained in:
Peng Xiao
2023-09-05 17:48:48 +08:00
committed by LongYinan
parent 2d2dafdd26
commit c7f14cd48a
2 changed files with 5 additions and 4 deletions
@@ -35,7 +35,7 @@ export const navWrapperStyle = style({
'&[data-enable-animation="true"]': { '&[data-enable-animation="true"]': {
transition: 'margin-left .3s, width .3s', transition: 'margin-left .3s, width .3s',
}, },
'&.has-background': { '&[data-is-floating="false"].has-background': {
backgroundColor: 'var(--affine-white-60)', backgroundColor: 'var(--affine-white-60)',
borderRight: '1px solid var(--affine-border-color)', borderRight: '1px solid var(--affine-border-color)',
}, },
@@ -2,6 +2,7 @@ import { Skeleton } from '@mui/material';
import { assignInlineVars } from '@vanilla-extract/dynamic'; import { assignInlineVars } from '@vanilla-extract/dynamic';
import clsx from 'clsx'; import clsx from 'clsx';
import { useAtom, useAtomValue } from 'jotai'; import { useAtom, useAtomValue } from 'jotai';
import debounce from 'lodash/debounce';
import type { PropsWithChildren, ReactElement } from 'react'; import type { PropsWithChildren, ReactElement } from 'react';
import { useEffect, useRef, useState } from 'react'; import { useEffect, useRef, useState } from 'react';
@@ -77,10 +78,10 @@ export function AppSidebar(props: AppSidebarProps): ReactElement {
setAppSidebarFloating(isFloating && !!open); setAppSidebarFloating(isFloating && !!open);
} }
onResize(); const dOnResize = debounce(onResize, 50);
window.addEventListener('resize', onResize); window.addEventListener('resize', dOnResize);
return () => { return () => {
window.removeEventListener('resize', onResize); window.removeEventListener('resize', dOnResize);
}; };
}, [appSidebarWidth, open, setAppSidebarFloating, setOpen]); }, [appSidebarWidth, open, setAppSidebarFloating, setOpen]);