Align navigation icons (#10983)

Fixes https://github.com/twentyhq/twenty/issues/10550

FYI : I took the same width calculation than the other navigation items.

packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerCollapseButton.tsx

@@ -46,7 +46,7 @@ export const NavigationDrawerCollapseButton = ({
             : IconLayoutSidebarRightCollapse
         }
         accent="tertiary"
-        size="small"
+        size="medium"
       />
     </StyledCollapseButton>
   );

packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerHeader.tsx

@@ -12,14 +12,18 @@ const StyledContainer = styled.div`
   display: flex;
   height: ${({ theme }) => theme.spacing(8)};
   user-select: none;
+  padding-right: ${({ theme }) => theme.spacing(2)};
 `;
 
 const StyledNavigationDrawerCollapseButton = styled(
   NavigationDrawerCollapseButton,
 )<{ show?: boolean }>`
+  height: ${({ theme }) => theme.spacing(4)};
   margin-left: auto;
   opacity: ${({ show }) => (show ? 1 : 0)};
+  padding-right: ${({ theme }) => theme.spacing(1)};
   transition: opacity ${({ theme }) => theme.animation.duration.normal}s;
+  width: ${({ theme }) => theme.spacing(4)};
 `;
 
 type NavigationDrawerHeaderProps = {

packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerItem.tsx

@@ -169,6 +169,7 @@ const StyledKeyBoardShortcut = styled.span`
   height: ${({ theme }) => theme.spacing(4)};
   justify-content: center;
   width: ${({ theme }) => theme.spacing(4)};
+  box-sizing: border-box;
 
   border-radius: ${({ theme }) => theme.border.radius.sm};
   border: 1px solid ${({ theme }) => theme.border.color.strong};