📱 cart checkout success pages

fixed responsivity on with under 500px
fl4viooliveira · May 1, 2022 · 2ae92ed · 2ae92ed
1 parent 760f5c7
commit 2ae92ed
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 3 deletions.
diff --git a/frontend/styles/Cart.module.css b/frontend/styles/Cart.module.css
@@ -73,7 +73,7 @@
     /* flex-direction: column; */
   }
 }
-@media (max-width: 400px) {
+@media (max-width: 500px) {
   .container {
     width: calc(100% - 20px);
     margin: 10px auto;

diff --git a/frontend/styles/Checkout.module.css b/frontend/styles/Checkout.module.css
@@ -1,8 +1,8 @@
 .containerBox {
   display: flex;
-  width: calc(100% - 140px);
+  /* width: calc(100% - 140px); */
   height: fit-content;
-  margin: 30px auto;
+  margin: 0px auto;
   color: #ffff;
   flex-direction: column;
 }
@@ -72,7 +72,16 @@
   margin: 15px 0;
 }
 @media (max-width: 900px) {
+  .containerBox {
+    width: calc(100% - 20px);
+  }
   .mainBox {
     flex-wrap: wrap;
   }
 }
+@media (max-width: 500px) {
+  .mainBox {
+    width: calc(100% - 20px);
+    margin: 10px auto;
+  }
+}
diff --git a/frontend/styles/Success.module.css b/frontend/styles/Success.module.css
@@ -9,9 +9,19 @@
 }
 .container h1 {
   margin: 15px 0;
+  text-align: center;
 }
 .container a {
   margin: 15px 0;
   color: #ffff;
   font-size: 25px;
 }
+@media (max-width: 500px) {
+  .container {
+    width: calc(100% - 20px);
+    margin: 10px auto;
+  }
+  .container h1 {
+    font-size: 20px;
+  }
+}