fix: margin

alleslabs · Mar 27, 2024 · d05118d · d05118d
1 parent 2de50ca
commit d05118d
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 45 deletions.
diff --git a/src/lib/layout/SubHeader.tsx b/src/lib/layout/SubHeader.tsx
@@ -70,52 +70,48 @@ const SubHeader = () => {
   };
 
   return (
-    <Flex px={6} alignItems="center" h="full" justifyContent="space-between">
-      <Flex h="full">
-        {subHeaderMenu.map((item) => (
-          <AppLink
-            href={item.slug}
-            key={item.slug}
-            onClick={() => trackOnClick(item.name)}
-          >
-            <Flex
-              alignItems="center"
-              px={4}
-              gap={2}
-              h="full"
-              borderBottomWidth={2}
-              borderColor={
-                isCurrentPage(item.slug) ? activeColor : "transparent"
-              }
-              transition="all 0.25s ease-in-out"
-              _hover={{ borderColor: activeColor }}
-              sx={{
-                _hover: {
-                  "> svg, > p": {
-                    color: activeColor,
-                    transition: "all .25s ease-in-out",
-                  },
-                  borderBottomWidth: 2,
-                  borderColor: activeColor,
+    <Flex px={6} h="full">
+      {subHeaderMenu.map((item) => (
+        <AppLink
+          href={item.slug}
+          key={item.slug}
+          onClick={() => trackOnClick(item.name)}
+        >
+          <Flex
+            alignItems="center"
+            px={4}
+            gap={2}
+            h="full"
+            borderBottomWidth={2}
+            borderColor={isCurrentPage(item.slug) ? activeColor : "transparent"}
+            transition="all 0.25s ease-in-out"
+            _hover={{ borderColor: activeColor }}
+            sx={{
+              _hover: {
+                "> svg, > p": {
+                  color: activeColor,
+                  transition: "all .25s ease-in-out",
                 },
-              }}
+                borderBottomWidth: 2,
+                borderColor: activeColor,
+              },
+            }}
+          >
+            <CustomIcon
+              boxSize={3}
+              name={item.icon}
+              color={isCurrentPage(item.slug) ? activeColor : "gray.600"}
+            />
+            <Text
+              variant="body2"
+              fontWeight={700}
+              color={isCurrentPage(item.slug) ? activeColor : "text.dark"}
             >
-              <CustomIcon
-                boxSize={3}
-                name={item.icon}
-                color={isCurrentPage(item.slug) ? activeColor : "gray.600"}
-              />
-              <Text
-                variant="body2"
-                fontWeight={700}
-                color={isCurrentPage(item.slug) ? activeColor : "text.dark"}
-              >
-                {item.name}
-              </Text>
-            </Flex>
-          </AppLink>
-        ))}
-      </Flex>
+              {item.name}
+            </Text>
+          </Flex>
+        </AppLink>
+      ))}
     </Flex>
   );
 };

diff --git a/src/lib/layout/index.tsx b/src/lib/layout/index.tsx
@@ -65,7 +65,7 @@ const Layout = ({ children }: LayoutProps) => {
           <GridItem
             bg={{ base: "background.main", md: "gray.900" }}
             area="subheader"
-            mb="1"
+            mb={1}
             py={{ base: 2, md: 0 }}
             px={{ base: 4, md: 0 }}
           >
@@ -75,6 +75,7 @@ const Layout = ({ children }: LayoutProps) => {
             bg={{ base: "background.main", md: "gray.900" }}
             area="nav"
             overflowY="auto"
+            mr={1}
           >
             <Navbar isExpand={isExpand} setIsExpand={setIsExpand} />
           </GridItem>