1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-02-09 00:18:00 +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,7 +41,8 @@ export const MobileNavigationSidebar: FC<{ onClick: () => void }> = ({
); );
}; };
export const StretchContainer = styled(Box)(({ theme }) => ({ export const StretchContainer = styled(Box)<{ mode: string }>(
({ theme, mode }) => ({
backgroundColor: theme.palette.background.paper, backgroundColor: theme.palette.background.paper,
padding: theme.spacing(2), padding: theme.spacing(2),
alignSelf: 'stretch', alignSelf: 'stretch',
@ -50,8 +51,9 @@ export const StretchContainer = styled(Box)(({ theme }) => ({
gap: theme.spacing(2), gap: theme.spacing(2),
zIndex: 1, zIndex: 1,
overflowAnchor: 'none', overflowAnchor: 'none',
maxWidth: theme.spacing(40), 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. // 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 }) => ({ const StickyContainer = styled(Box)(({ theme }) => ({
@ -83,7 +85,7 @@ export const NavigationSidebar = () => {
}, [initialPathname]); }, [initialPathname]);
return ( return (
<StretchContainer> <StretchContainer mode={mode}>
<PrimaryNavigationList <PrimaryNavigationList
mode={mode} mode={mode}
onClick={setActiveItem} onClick={setActiveItem}