1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-01-25 00:07:47 +01:00

feat: fixed full mode navbar width (#7999)

This commit is contained in:
Mateusz Kwasniewski 2024-08-28 11:07:55 +02:00 committed by GitHub
parent 3d22f6e909
commit bed4f66fa2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -41,17 +41,19 @@ export const MobileNavigationSidebar: FC<{ onClick: () => void }> = ({
);
};
export const StretchContainer = styled(Box)(({ theme }) => ({
backgroundColor: theme.palette.background.paper,
padding: theme.spacing(2),
alignSelf: 'stretch',
display: 'flex',
flexDirection: 'column',
gap: theme.spacing(2),
zIndex: 1,
overflowAnchor: 'none',
maxWidth: theme.spacing(40),
}));
export const StretchContainer = styled(Box)<{ mode: string }>(
({ theme, mode }) => ({
backgroundColor: theme.palette.background.paper,
padding: theme.spacing(2),
alignSelf: 'stretch',
display: 'flex',
flexDirection: 'column',
gap: theme.spacing(2),
zIndex: 1,
overflowAnchor: 'none',
width: mode === 'full' ? theme.spacing(40) : 'auto',
}),
);
// This component is needed when the sticky item could overlap with nav items. You can replicate it on a short screen.
const StickyContainer = styled(Box)(({ theme }) => ({
@ -83,7 +85,7 @@ export const NavigationSidebar = () => {
}, [initialPathname]);
return (
<StretchContainer>
<StretchContainer mode={mode}>
<PrimaryNavigationList
mode={mode}
onClick={setActiveItem}