fix: pin settings to bottom bar (#927)

* fix: pin settings to bottom bar * fix: smaller icons, up ad set limit
brave · Oct 5, 2023 · 61e034a · 61e034a
1 parent be521c1
commit 61e034a
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 25 deletions.
diff --git a/src/components/Drawer/MiniSideBar.tsx b/src/components/Drawer/MiniSideBar.tsx
@@ -31,7 +31,7 @@ type RouteOption = {
   onClick?: (event: MouseEvent<any>) => void;
 };
 
-const drawerWidth = 100;
+const drawerWidth = 85;
 export default function MiniSideBar({ children }: PropsWithChildren) {
   const { advertiser } = useAdvertiser();
   const dashboardRoutes: RouteOption[] = [
@@ -104,7 +104,7 @@ export default function MiniSideBar({ children }: PropsWithChildren) {
   ];
 
   return (
-    <Box sx={{ display: "flex" }}>
+    <Box display="flex">
       <Drawer
         variant="permanent"
         open
@@ -113,27 +113,36 @@ export default function MiniSideBar({ children }: PropsWithChildren) {
         }}
       >
         <Toolbar />
-        <List>
-          {dashboardRoutes.map((dr) => (
-            <ItemBox
-              key={dr.href}
-              href={dr.href}
-              icon={dr.icon}
-              label={dr.label}
-              disabled={dr.disabled}
-            />
-          ))}
-          <Divider sx={{ mt: 3, mb: 3 }} />
-          {settingsRoutes.map((sr) => (
-            <ItemBox
-              href={sr.href}
-              icon={sr.icon}
-              label={sr.label}
-              key={sr.href}
-            />
-          ))}
-          <SupportMenu />
-        </List>
+        <Box
+          display="flex"
+          justifyContent="space-between"
+          flexDirection="column"
+          flexGrow={1}
+        >
+          <List>
+            {dashboardRoutes.map((dr) => (
+              <ItemBox
+                key={dr.href}
+                href={dr.href}
+                icon={dr.icon}
+                label={dr.label}
+                disabled={dr.disabled}
+              />
+            ))}
+          </List>
+          <List>
+            <Divider sx={{ mt: 3, mb: 3 }} />
+            {settingsRoutes.map((sr) => (
+              <ItemBox
+                href={sr.href}
+                icon={sr.icon}
+                label={sr.label}
+                key={sr.href}
+              />
+            ))}
+            <SupportMenu />
+          </List>
+        </Box>
       </Drawer>
       {children}
     </Box>
@@ -160,7 +169,9 @@ const ItemBox = (props: RouteOption) => {
     >
       <ListItemIcon sx={{ minWidth: "unset" }}>{props.icon}</ListItemIcon>
       <ListItemText disableTypography>
-        <Typography textAlign="center">{props.label}</Typography>
+        <Typography textAlign="center" variant="caption" fontWeight={500}>
+          {props.label}
+        </Typography>
       </ListItemText>
     </ListItemButton>
   );

diff --git a/src/user/views/adsManager/views/advanced/components/adSet/NewAdSet.tsx b/src/user/views/adsManager/views/advanced/components/adSet/NewAdSet.tsx
@@ -74,7 +74,7 @@ export function NewAdSet() {
                 )}
               </Stack>
             ))}
-            {values.adSets.length <= 4 && (
+            {values.adSets.length <= 19 && (
               <Box
                 width="100%"
                 pb={0}