From 308f1937561a5536b5ea9a64f5b05595354ede3f Mon Sep 17 00:00:00 2001
From: keannu125 <noehbernasol0@gmail.com>
Date: Tue, 21 Feb 2023 14:25:55 +0800
Subject: [PATCH] Fix sidebar (again)

---
 src/components/Sidebar/Sidebar.tsx | 53 ++++++++++++++++++------------
 src/styles.tsx                     |  1 -
 2 files changed, 32 insertions(+), 22 deletions(-)

diff --git a/src/components/Sidebar/Sidebar.tsx b/src/components/Sidebar/Sidebar.tsx
index 041ebe5..cfbc502 100644
--- a/src/components/Sidebar/Sidebar.tsx
+++ b/src/components/Sidebar/Sidebar.tsx
@@ -57,34 +57,45 @@ export default function Sidebar() {
     );
   } else {
     return (
-      <div style={styles.sidebar_wrapper}>
+      <div style={styles.sidebar_container}>
         <div
           style={{
-            position: "relative",
             display: "flex",
-            flexDirection: "column",
+            flexDirection: "row",
+            justifyContent: "flex-end",
           }}
         >
-          <SidebarButton onClick={() => navigate("/")} name="Dashboard">
-            <HomeIcon size={4} color="white" />
-          </SidebarButton>
-          <SidebarButton onClick={() => navigate("/Products")} name="Products">
-            <ProductsIcon size={4} color="white" />
-          </SidebarButton>
-          <SidebarButton
-            onClick={() => navigate("/Inventory")}
-            name="Inventory"
+          <div
+            style={{
+              position: "relative",
+              display: "flex",
+              flexDirection: "column",
+              justifyContent: "flex-start",
+            }}
           >
-            <InventoryIcon size={4} color="white" />
-          </SidebarButton>
-          <SidebarButton onClick={() => navigate("/Logs")} name="Logs">
-            <LogsIcon size={4} color="white" />
-          </SidebarButton>
+            <SidebarButton onClick={() => navigate("/")} name="Dashboard">
+              <HomeIcon size={4} color="white" />
+            </SidebarButton>
+            <SidebarButton
+              onClick={() => navigate("/Products")}
+              name="Products"
+            >
+              <ProductsIcon size={4} color="white" />
+            </SidebarButton>
+            <SidebarButton
+              onClick={() => navigate("/Inventory")}
+              name="Inventory"
+            >
+              <InventoryIcon size={4} color="white" />
+            </SidebarButton>
+            <SidebarButton onClick={() => navigate("/Logs")} name="Logs">
+              <LogsIcon size={4} color="white" />
+            </SidebarButton>
+            <Logout>
+              <LogoutIcon size={4} color="white" />
+            </Logout>
+          </div>
         </div>
-
-        <Logout>
-          <LogoutIcon size={4} color="white" />
-        </Logout>
       </div>
     );
   }
diff --git a/src/styles.tsx b/src/styles.tsx
index 3863988..f266346 100644
--- a/src/styles.tsx
+++ b/src/styles.tsx
@@ -141,7 +141,6 @@ const styles: { [key: string]: React.CSSProperties } = {
     paddingLeft: "2vh",
     backgroundColor: "#3d4848",
   },
-  sidebar_wrapper: {},
 };
 
 export default styles;