Jayden/AFFiNE-Mirror
0
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-07-21 20:16:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(core): make sidebar switch transition smooth (#6085)

Browse Source
This commit is contained in:
Peng Xiao
2024-03-12 14:56:45 +00:00
parent fb3a0e7b8f
commit e333b4d348
4 changed files with 39 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/frontend/core/src/components/app-sidebar/sidebar-header/sidebar-switch.css.ts
+8 -3
View File
@@ -1,18 +1,23 @@
import { style } from '@vanilla-extract/css';
export const sidebarSwitch = style({
opacity: 0,
display: 'none !important',
display: 'inline-flex',
overflow: 'hidden',
pointerEvents: 'none',
transition: 'all .3s ease-in-out',
transition: 'max-width 0.2s ease-in-out, margin 0.3s ease-in-out',
selectors: {
'&[data-show=true]': {
maxWidth: '32px',
opacity: 1,
display: 'inline-flex !important',
width: '32px',
flexShrink: 0,
fontSize: '24px',
pointerEvents: 'auto',
},
'&[data-show=false]': {
maxWidth: 0,
margin: '0 !important',
},
},
});
packages/frontend/core/src/components/app-sidebar/sidebar-header/sidebar-switch.tsx
+2 -2
View File
@@ -8,10 +8,10 @@ import { appSidebarOpenAtom } from '../index.jotai';
import * as styles from './sidebar-switch.css';
export const SidebarSwitch = ({
show = true,
show,
className,
}: {
show?: boolean;
show: boolean;
className?: string;
}) => {
const [open, setOpen] = useAtom(appSidebarOpenAtom);