From 1c595b3b03a4f88d2bcaa49b49efc682dc8c1921 Mon Sep 17 00:00:00 2001
From: Keannu Bernasol <noehbernasol0@gmail.com>
Date: Sun, 3 Dec 2023 11:26:16 +0800
Subject: [PATCH] Fixed landing page being broken in mobile and merged popup
 styling

---
 .../EquipmentInstancesListPage.tsx                  | 13 +------------
 src/Pages/EquipmentListPage/EquipmentListPage.tsx   | 13 +------------
 src/Pages/LandingPage/LandingPage.tsx               |  7 ++-----
 src/styles.tsx                                      | 12 ++++++++++++
 4 files changed, 16 insertions(+), 29 deletions(-)

diff --git a/src/Pages/EquipmentInstancesListPage/EquipmentInstancesListPage.tsx b/src/Pages/EquipmentInstancesListPage/EquipmentInstancesListPage.tsx
index 0f6d0f9..e6d15fc 100644
--- a/src/Pages/EquipmentInstancesListPage/EquipmentInstancesListPage.tsx
+++ b/src/Pages/EquipmentInstancesListPage/EquipmentInstancesListPage.tsx
@@ -140,18 +140,7 @@ export default function EquipmentInstancesListPage() {
         onClose={() => SetEditModalOpen(false)}
         modal
         position={"top center"}
-        contentStyle={{
-          width: "32rem",
-          borderRadius: 16,
-          borderColor: "grey",
-          borderStyle: "solid",
-          borderWidth: 1,
-          padding: 16,
-          alignContent: "center",
-          justifyContent: "center",
-          textAlign: "center",
-          flexWrap: "wrap",
-        }}
+        contentStyle={styles.popup_center}
       >
         <EditItemModal id={selectedItem} setOpen={SetEditModalOpen} />
       </Popup>
diff --git a/src/Pages/EquipmentListPage/EquipmentListPage.tsx b/src/Pages/EquipmentListPage/EquipmentListPage.tsx
index d0a6875..6d6149f 100644
--- a/src/Pages/EquipmentListPage/EquipmentListPage.tsx
+++ b/src/Pages/EquipmentListPage/EquipmentListPage.tsx
@@ -140,18 +140,7 @@ export default function EquipmentListPage() {
         onClose={() => SetEditModalOpen(false)}
         modal
         position={"top center"}
-        contentStyle={{
-          width: "32rem",
-          borderRadius: 16,
-          borderColor: "grey",
-          borderStyle: "solid",
-          borderWidth: 1,
-          padding: 16,
-          alignContent: "center",
-          justifyContent: "center",
-          textAlign: "center",
-          flexWrap: "wrap",
-        }}
+        contentStyle={styles.popup_center}
       >
         <EditSKUModal id={selectedItem} setOpen={SetEditModalOpen} />
       </Popup>
diff --git a/src/Pages/LandingPage/LandingPage.tsx b/src/Pages/LandingPage/LandingPage.tsx
index 6e18c0e..2381447 100644
--- a/src/Pages/LandingPage/LandingPage.tsx
+++ b/src/Pages/LandingPage/LandingPage.tsx
@@ -39,14 +39,11 @@ export default function LandingPage() {
           flexWrap: "wrap",
         }}
       >
-        <div
-          style={{ maxWidth: "50%", height: "auto", flex: 1, flexWrap: "wrap" }}
-        >
-          <img style={{ maxWidth: "50%", height: "auto" }} src={citc_logo} />
+        <div style={{ height: "auto", flex: 1, flexWrap: "wrap" }}>
+          <img style={{ width: "16rem", height: "auto" }} src={citc_logo} />
         </div>
         <div
           style={{
-            maxWidth: "50%",
             height: "auto",
             flex: 1,
             flexWrap: "wrap",
diff --git a/src/styles.tsx b/src/styles.tsx
index 3ad2dc1..d0ed01d 100644
--- a/src/styles.tsx
+++ b/src/styles.tsx
@@ -75,6 +75,18 @@ const styles: { [key: string]: React.CSSProperties } = {
     minWidth: "100%",
     marginTop: 16,
   },
+  popup_center: {
+    width: "32rem",
+    borderRadius: 16,
+    borderColor: "grey",
+    borderStyle: "solid",
+    borderWidth: 1,
+    padding: 16,
+    alignContent: "center",
+    justifyContent: "center",
+    textAlign: "center",
+    overflowY: "scroll",
+  },
 };
 
 export default styles;