diff --git a/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectAvatar.tsx b/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectAvatar.tsx
index 8f143c044..c44159c08 100644
--- a/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectAvatar.tsx
+++ b/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectAvatar.tsx
@@ -2,11 +2,12 @@ import { useTheme } from '@emotion/react';
import { ReactNode } from 'react';
import {
+ StyledMenuItemIconCheck,
StyledMenuItemLabel,
StyledMenuItemLeftContent,
} from '../internals/components/StyledMenuItemBase';
-import { IconCheck, OverflowingTextWithTooltip } from '@ui/display';
+import { OverflowingTextWithTooltip } from '@ui/display';
import { StyledMenuItemSelect } from './MenuItemSelect';
type MenuItemSelectAvatarProps = {
@@ -50,7 +51,7 @@ export const MenuItemSelectAvatar = ({
- {selected && }
+ {selected && }
);
};
diff --git a/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectColor.tsx b/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectColor.tsx
index b3c320d31..7f00f75bc 100644
--- a/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectColor.tsx
+++ b/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectColor.tsx
@@ -1,11 +1,12 @@
import { useTheme } from '@emotion/react';
import {
+ StyledMenuItemIconCheck,
StyledMenuItemLabel,
StyledMenuItemLeftContent,
} from '../internals/components/StyledMenuItemBase';
-import { ColorSample, ColorSampleVariant, IconCheck } from '@ui/display';
+import { ColorSample, ColorSampleVariant } from '@ui/display';
import { ThemeColor } from '@ui/theme';
import { StyledMenuItemSelect } from './MenuItemSelect';
@@ -55,7 +56,7 @@ export const MenuItemSelectColor = ({
{colorLabels[color]}
- {selected && }
+ {selected && }
);
};
diff --git a/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectTag.tsx b/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectTag.tsx
index 1217f1199..ee2d1c37e 100644
--- a/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectTag.tsx
+++ b/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectTag.tsx
@@ -1,8 +1,11 @@
import { useTheme } from '@emotion/react';
-import { StyledMenuItemLeftContent } from '../internals/components/StyledMenuItemBase';
+import {
+ StyledMenuItemIconCheck,
+ StyledMenuItemLeftContent,
+} from '../internals/components/StyledMenuItemBase';
-import { IconCheck, IconComponent, Tag } from '@ui/display';
+import { IconComponent, Tag } from '@ui/display';
import { ThemeColor } from '@ui/theme';
import { StyledMenuItemSelect } from './MenuItemSelect';
@@ -43,7 +46,7 @@ export const MenuItemSelectTag = ({
Icon={LeftIcon ?? undefined}
/>
- {selected && }
+ {selected && }
);
};
diff --git a/packages/twenty-ui/src/navigation/menu-item/internals/components/StyledMenuItemBase.tsx b/packages/twenty-ui/src/navigation/menu-item/internals/components/StyledMenuItemBase.tsx
index 97f489f41..3012a0d17 100644
--- a/packages/twenty-ui/src/navigation/menu-item/internals/components/StyledMenuItemBase.tsx
+++ b/packages/twenty-ui/src/navigation/menu-item/internals/components/StyledMenuItemBase.tsx
@@ -2,6 +2,8 @@ import { css } from '@emotion/react';
import styled from '@emotion/styled';
import { isUndefined } from '@sniptt/guards';
+
+import { IconCheck } from '@ui/display';
import { HOVER_BACKGROUND } from '@ui/theme';
import { MenuItemAccent } from '../../types/MenuItemAccent';
@@ -159,3 +161,8 @@ export const StyledHoverableMenuItemBase = styled(StyledMenuItemBase)<{
}
}};
`;
+
+export const StyledMenuItemIconCheck = styled(IconCheck)`
+ flex-shrink: 0;
+ margin-right: ${({ theme }) => theme.spacing(1)};
+`;