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

Navigation drawer sibling gap fix (#9472)

Browse Source 
fixes
https://discord.com/channels/1130383047699738754/1326560179113955328/1326560179113955328
This commit is contained in:
nitin
2025-01-09 15:19:43 +05:30
committed by GitHub
parent a2f2f4148a
commit ae68a4b8d9
2 changed files with 10 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
packages/twenty-front/src/modules/object-metadata/components/NavigationDrawerSectionForObjectMetadataItems.tsx
View File

@ -4,7 +4,6 @@ import { NavigationDrawerAnimatedCollapseWrapper } from '@/ui/navigation/navigat
import { NavigationDrawerSection } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerSection'; import { NavigationDrawerSection } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerSection';
import { NavigationDrawerSectionTitle } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerSectionTitle'; import { NavigationDrawerSectionTitle } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerSectionTitle';
import { useNavigationSection } from '@/ui/navigation/navigation-drawer/hooks/useNavigationSection'; import { useNavigationSection } from '@/ui/navigation/navigation-drawer/hooks/useNavigationSection';
import styled from '@emotion/styled';
import { useRecoilValue } from 'recoil'; import { useRecoilValue } from 'recoil';
const ORDERED_STANDARD_OBJECTS = [ const ORDERED_STANDARD_OBJECTS = [
@ -15,15 +14,6 @@ const ORDERED_STANDARD_OBJECTS = [
'note', 'note',
]; ];
const StyledObjectsMetaDataItemsWrapper = styled.div`
display: flex;
flex-direction: column;
gap: ${({ theme }) => theme.betweenSiblingsGap};
width: 100%;
flex: 1;
overflow-y: auto;
`;
export const NavigationDrawerSectionForObjectMetadataItems = ({ export const NavigationDrawerSectionForObjectMetadataItems = ({
sectionTitle, sectionTitle,
isRemote, isRemote,
@ -77,15 +67,13 @@ export const NavigationDrawerSectionForObjectMetadataItems = ({
onClick={() => toggleNavigationSection()} onClick={() => toggleNavigationSection()}
/> />
</NavigationDrawerAnimatedCollapseWrapper> </NavigationDrawerAnimatedCollapseWrapper>
<StyledObjectsMetaDataItemsWrapper> {isNavigationSectionOpen &&
{isNavigationSectionOpen && objectMetadataItemsForNavigationItems.map((objectMetadataItem) => (
objectMetadataItemsForNavigationItems.map((objectMetadataItem) => ( <NavigationDrawerItemForObjectMetadataItem
<NavigationDrawerItemForObjectMetadataItem key={`navigation-drawer-item-${objectMetadataItem.id}`}
key={`navigation-drawer-item-${objectMetadataItem.id}`} objectMetadataItem={objectMetadataItem}
objectMetadataItem={objectMetadataItem} />
/> ))}
))}
</StyledObjectsMetaDataItemsWrapper>
</NavigationDrawerSection> </NavigationDrawerSection>
) )
); );

6
packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerSection.tsx
View File

@ -2,9 +2,6 @@ import styled from '@emotion/styled';
import { useIsMobile } from 'twenty-ui'; import { useIsMobile } from 'twenty-ui';
const StyledSection = styled.div` const StyledSection = styled.div`
display: flex;
flex-direction: column;
gap: ${({ theme }) => theme.betweenSiblingsGap};
width: 100%; width: 100%;
margin-bottom: ${({ theme }) => theme.spacing(3)}; margin-bottom: ${({ theme }) => theme.spacing(3)};
flex-shrink: 1; flex-shrink: 1;
@ -13,6 +10,9 @@ const StyledSection = styled.div`
const StyledSectionInnerContainerMinusScrollPadding = styled.div<{ const StyledSectionInnerContainerMinusScrollPadding = styled.div<{
isMobile: boolean; isMobile: boolean;
}>` }>`
display: flex;
flex-direction: column;
gap: ${({ theme }) => theme.betweenSiblingsGap};
width: calc( width: calc(
100% - ${({ isMobile, theme }) => (isMobile ? 0 : theme.spacing(2))} 100% - ${({ isMobile, theme }) => (isMobile ? 0 : theme.spacing(2))}
); );