From 8427414c25df751933d2d475c1ebbdcf4b94afd3 Mon Sep 17 00:00:00 2001
From: Jerilyn Yare <102701655+Jy-re@users.noreply.github.com>
Date: Sun, 7 Jan 2024 08:29:30 +0800
Subject: [PATCH] add sku button position and alignment

---
 .../EquipmentListPage/EquipmentListPage.tsx   | 111 +++++++++---------
 1 file changed, 55 insertions(+), 56 deletions(-)

diff --git a/src/Pages/EquipmentListPage/EquipmentListPage.tsx b/src/Pages/EquipmentListPage/EquipmentListPage.tsx
index 332c297..58bb098 100644
--- a/src/Pages/EquipmentListPage/EquipmentListPage.tsx
+++ b/src/Pages/EquipmentListPage/EquipmentListPage.tsx
@@ -64,68 +64,67 @@ export default function EquipmentListPage() {
           display: "flex",
           alignItems: "center",
           justifyContent: "center",
-          height: "100%",
+          height: "80%",
           width: "100%",
-          minHeight: "100%",
+          minHeight: "80%",
           minWidth: "100%",
-          flexWrap: "wrap",
-        }}
+        }}>
+
+        <div style={{width: "90%", marginTop: "3rem"}}>
+          <Button
+              style={{
+                ...styles.flex_column,
+                ...{
+                  alignSelf: "flex-start",
+                  justifyContent: "center",
+                  flexWrap: "wrap",
+
+                },
+              }}
+              onClick={() => {
+                SetAddSKUModalOpen(true);
+              }}
+            >
+              <NoteAddIcon
+                style={{
+                  height: 64,
+                  width: 64,
+                  fill: colors.font_dark,
+                  marginLeft: "1rem",
+                  marginRight: "1rem",
+                }}
+              />
+              <p
+                style={{
+                  ...styles.text_dark,
+                  ...styles.text_M,
+                }}
+              >
+                Add SKU
+              </p>
+            </Button>
+          </div>
 
 
-      >
-
-      <Button
-          style={{
-            ...styles.flex_column,
-            ...{
-              alignSelf: "center",
-              justifyContent: "center",
-              flexWrap: "wrap",
-            },
-          }}
-          onClick={() => {
-            SetAddSKUModalOpen(true);
+          <Popup
+          open={addSKUmodalOpen}
+          onClose={() => SetAddSKUModalOpen(false)}
+          modal
+          position={"top center"}
+          contentStyle={{
+            width: "32rem",
+            borderRadius: 16,
+            borderColor: "grey",
+            borderStyle: "solid",
+            borderWidth: 1,
+            padding: 16,
+            alignContent: "center",
+            justifyContent: "center",
+            textAlign: "center",
           }}
         >
-          <NoteAddIcon
-            style={{
-              height: 64,
-              width: 64,
-              fill: colors.font_dark,
-              marginLeft: "1rem",
-              marginRight: "1rem",
-            }}
-          />
-          <p
-            style={{
-              ...styles.text_dark,
-              ...styles.text_M,
-            }}
-          >
-            Add SKU
-          </p>
-        </Button>
-
-
-        <Popup
-        open={addSKUmodalOpen}
-        onClose={() => SetAddSKUModalOpen(false)}
-        modal
-        position={"top center"}
-        contentStyle={{
-          width: "32rem",
-          borderRadius: 16,
-          borderColor: "grey",
-          borderStyle: "solid",
-          borderWidth: 1,
-          padding: 16,
-          alignContent: "center",
-          justifyContent: "center",
-          textAlign: "center",
-        }}
-      >
-        <AddSKUModal />
-      </Popup>
+          <AddSKUModal />
+        </Popup>
 
         <TableContainer
           style={{ width: "90%", overflowY: "scroll", marginTop: "2rem" }}