admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Prevent layout shift on page load (#2268)

Browse Source 
- prevent layout shift on page load
This commit is contained in:
brendanlaschke
2023-10-31 14:09:33 +01:00
committed by GitHub
parent dda911fea7
commit 48aa89664a
2 changed files with 2 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
front/src/modules/ui/navigation/navbar/components/NavCollapseButton.tsx
View File

@ -50,6 +50,7 @@ const NavCollapseButton = ({
return ( return (
<> <>
<StyledCollapseButton <StyledCollapseButton
initial={{ opacity: show ? 1 : 0 }}
animate={{ animate={{
opacity: show ? 1 : 0, opacity: show ? 1 : 0,
}} }}

1
front/src/modules/ui/navigation/navbar/components/NavbarAnimatedContainer.tsx
View File

@ -48,6 +48,7 @@ export const NavbarAnimatedContainer = ({
onAnimationComplete={() => { onAnimationComplete={() => {
setIsNavbarSwitchingSize(false); setIsNavbarSwitchingSize(false);
}} }}
initial={{ width: isNavbarOpened ? leftBarWidth : '0' }}
animate={{ animate={{
width: isNavbarOpened ? leftBarWidth : '0', width: isNavbarOpened ? leftBarWidth : '0',
opacity: isNavbarOpened ? 1 : 0, opacity: isNavbarOpened ? 1 : 0,