diff --git a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerHeader.tsx b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerHeader.tsx index 72b384fb0..9ba91a1c5 100644 --- a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerHeader.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerHeader.tsx @@ -9,9 +9,13 @@ import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile'; import { NavigationDrawerCollapseButton } from './NavigationDrawerCollapseButton'; -const StyledContainer = styled.div` +const StyledContainer = styled.div<{ isMultiWorkspace: boolean }>` align-items: center; display: flex; + gap: ${({ theme, isMultiWorkspace }) => + !isMultiWorkspace ? theme.spacing(2) : null}; + padding: ${({ theme, isMultiWorkspace }) => + !isMultiWorkspace ? theme.spacing(1) : null}; height: ${({ theme }) => theme.spacing(7)}; user-select: none; `; @@ -53,10 +57,11 @@ export const NavigationDrawerHeader = ({ }: NavigationDrawerHeaderProps) => { const isMobile = useIsMobile(); const workspaces = useRecoilValue(workspacesState); + const isMultiWorkspace = workspaces !== null && workspaces.length > 1; return ( - - {workspaces !== null && workspaces.length > 1 ? ( + + {isMultiWorkspace ? ( ) : ( <>