From c314ed53f8e997bda69b661e7a768f4c777f0d93 Mon Sep 17 00:00:00 2001
From: Chaoky <levimanga@gmail.com>
Date: Wed, 17 Aug 2022 00:30:28 -0300
Subject: [PATCH] fix content resize when drawer opens

---
 src/layout/MainLayout/index.js | 66 +++++++++++++++-------------------
 1 file changed, 28 insertions(+), 38 deletions(-)

diff --git a/src/layout/MainLayout/index.js b/src/layout/MainLayout/index.js
index e846e860f..f8e8b05a3 100644
--- a/src/layout/MainLayout/index.js
+++ b/src/layout/MainLayout/index.js
@@ -21,45 +21,35 @@ import { IconChevronRight } from '@tabler/icons';
 // styles
 const Main = styled('main', { shouldForwardProp: (prop) => prop !== 'open' })(({ theme, open }) => ({
     ...theme.typography.mainContent,
-    ...(!open && {
-        borderBottomLeftRadius: 0,
-        borderBottomRightRadius: 0,
-        transition: theme.transitions.create('margin', {
-            easing: theme.transitions.easing.sharp,
-            duration: theme.transitions.duration.leavingScreen
-        }),
-        [theme.breakpoints.up('md')]: {
-            marginLeft: -(drawerWidth - 20),
-            width: `calc(100% - ${drawerWidth}px)`
-        },
-        [theme.breakpoints.down('md')]: {
-            marginLeft: '20px',
-            width: `calc(100% - ${drawerWidth}px)`,
-            padding: '16px'
-        },
-        [theme.breakpoints.down('sm')]: {
-            marginLeft: '10px',
-            width: `calc(100% - ${drawerWidth}px)`,
-            padding: '16px',
-            marginRight: '10px'
-        }
-    }),
-    ...(open && {
-        transition: theme.transitions.create('margin', {
-            easing: theme.transitions.easing.easeOut,
-            duration: theme.transitions.duration.enteringScreen
-        }),
-        marginLeft: 0,
-        borderBottomLeftRadius: 0,
-        borderBottomRightRadius: 0,
+    borderBottomLeftRadius: 0,
+    borderBottomRightRadius: 0,
+    transition: theme.transitions.create(
+        'margin',
+        open
+            ? {
+                  easing: theme.transitions.easing.easeOut,
+                  duration: theme.transitions.duration.enteringScreen
+              }
+            : {
+                  easing: theme.transitions.easing.sharp,
+                  duration: theme.transitions.duration.leavingScreen
+              }
+    ),
+    [theme.breakpoints.up('md')]: {
+        marginLeft: -(drawerWidth - 20),
+        width: `calc(100% - ${drawerWidth}px)`
+    },
+    [theme.breakpoints.down('md')]: {
+        marginLeft: '20px',
         width: `calc(100% - ${drawerWidth}px)`,
-        [theme.breakpoints.down('md')]: {
-            marginLeft: '20px'
-        },
-        [theme.breakpoints.down('sm')]: {
-            marginLeft: '10px'
-        }
-    })
+        padding: '16px'
+    },
+    [theme.breakpoints.down('sm')]: {
+        marginLeft: '10px',
+        width: `calc(100% - ${drawerWidth}px)`,
+        padding: '16px',
+        marginRight: '10px'
+    }
 }));
 
 // ==============================|| MAIN LAYOUT ||============================== //