twentyhq/twenty
1
1
Fork 0
mirror of https://github.com/twentyhq/twenty.git synced 2024-12-23 12:02:10 +03:00
Code Issues Packages Projects Releases Wiki Activity

Fix advanced settings display (#8196)

Browse Source 
In [this PR (fix navigation
overflow)](https://github.com/twentyhq/twenty/pull/7795) we introduced a
regression, hidding the left-side animation with advanced settings:
<img width="285" alt="Capture d’écran 2024-10-30 à 12 56 22"
src="https://github.com/user-attachments/assets/46d7b1e5-4759-42e9-9bcb-aaa0fedfe542">

<img width="274" alt="Capture d’écran 2024-10-30 à 12 56 31"
src="https://github.com/user-attachments/assets/d3c3d337-f6fc-4509-a920-4c2c7506f061">
This commit is contained in:
Marie 2024-10-30 17:18:44 +01:00 committed by GitHub
parent 3957658e1c
commit 7dfde04957
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 9 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawer.tsx
View File

@ -22,9 +22,9 @@ export type NavigationDrawerProps = {
title?: string;
};
const StyledAnimatedContainer = styled(motion.div)`
const StyledAnimatedContainer = styled(motion.div)<{ isSettings?: boolean }>`
max-height: 100vh;
overflow: hidden;
overflow: ${({ isSettings }) => (isSettings ? 'visible' : 'hidden')};
`;
const StyledContainer = styled.div<{
@ -50,11 +50,12 @@ const StyledContainer = styled.div<{
padding-right: 20px;
}
`;
const StyledItemsContainer = styled.div`
const StyledItemsContainer = styled.div<{ isSettings?: boolean }>`
display: flex;
flex-direction: column;
margin-bottom: auto;
overflow: hidden;
overflow: ${({ isSettings }) => (isSettings ? 'visible' : 'hidden')};
flex: 1;
`;
@ -102,6 +103,7 @@ export const NavigationDrawer = ({
transition={{
duration: theme.animation.duration.normal,
}}
isSettings={isSettingsDrawer}
>
<StyledContainer
isSettings={isSettingsDrawer}
@ -118,7 +120,9 @@ export const NavigationDrawer = ({
showCollapseButton={isHovered}
/>
)}
<StyledItemsContainer>{children}</StyledItemsContainer>
<StyledItemsContainer isSettings={isSettingsDrawer}>
{children}
</StyledItemsContainer>
{footer}
</StyledContainer>
</StyledAnimatedContainer>