From d5730e1e8b9f776aa4783149f31ebf5253af04a1 Mon Sep 17 00:00:00 2001
From: Mateusz Kwasniewski <kwasniewski.mateusz@gmail.com>
Date: Tue, 28 May 2024 12:15:40 +0200
Subject: [PATCH] feat: Sidebar nav tweaks (#7185)

---
 .../component/layout/MainLayout/MainLayout.tsx  | 17 ++++++++++-------
 .../NavigationSidebar/NavigationSidebar.tsx     |  4 ++--
 2 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/frontend/src/component/layout/MainLayout/MainLayout.tsx b/frontend/src/component/layout/MainLayout/MainLayout.tsx
index 9678fee011..f197677edf 100644
--- a/frontend/src/component/layout/MainLayout/MainLayout.tsx
+++ b/frontend/src/component/layout/MainLayout/MainLayout.tsx
@@ -60,20 +60,23 @@ const OldMainLayoutContent = styled(Grid)(({ theme }) => ({
 }));
 
 const NewMainLayoutContent = styled(Grid)(({ theme }) => ({
-    width: '100%',
     minWidth: 0, // this is a fix for overflowing flex
-    margin: theme.spacing(0, 7),
+    width: '100%',
+    maxWidth: '1512px',
+    margin: '0 auto',
     paddingLeft: theme.spacing(2),
     paddingRight: theme.spacing(2),
     [theme.breakpoints.down('lg')]: {
+        maxWidth: '1250px',
         paddingLeft: theme.spacing(1),
         paddingRight: theme.spacing(1),
-        margin: 0,
     },
-    [theme.breakpoints.up('xl')]: {
-        maxWidth: '1920px',
-        marginLeft: 'auto',
-        marginRight: 'auto',
+    [theme.breakpoints.down(1024)]: {
+        marginLeft: 0,
+        marginRight: 0,
+    },
+    [theme.breakpoints.down('sm')]: {
+        minWidth: '100%',
     },
     minHeight: '94vh',
 }));
diff --git a/frontend/src/component/layout/MainLayout/NavigationSidebar/NavigationSidebar.tsx b/frontend/src/component/layout/MainLayout/NavigationSidebar/NavigationSidebar.tsx
index 96d8811c00..218cefdc93 100644
--- a/frontend/src/component/layout/MainLayout/NavigationSidebar/NavigationSidebar.tsx
+++ b/frontend/src/component/layout/MainLayout/NavigationSidebar/NavigationSidebar.tsx
@@ -25,7 +25,7 @@ export const MobileNavigationSidebar: FC<{ onClick: () => void }> = ({
                 mode='full'
                 onClick={onClick}
             />
-            <AdminNavigationList
+            <SecondaryNavigationList
                 routes={routes.adminRoutes}
                 mode='full'
                 onClick={onClick}
@@ -37,7 +37,7 @@ export const MobileNavigationSidebar: FC<{ onClick: () => void }> = ({
 
 export const StyledBox = styled(Box)(({ theme }) => ({
     backgroundColor: theme.palette.background.paper,
-    padding: theme.spacing(2, 1, 6, 1),
+    padding: theme.spacing(2, 2, 6, 2),
 }));
 
 export const NavigationSidebar = () => {