Merge pull request #181 from HackMerced/fix/Sponsers&ContactUs-page_format

trumanjchan · web-flow · commit 3f022c11a551 · 2021-07-29T19:01:43.000-07:00
Fixed Sponsers&amp;ContactUs page format
diff --git a/src/components/Form/styles.scss b/src/components/Form/styles.scss
@@ -8,6 +8,17 @@
     border-radius: 2rem;
     margin: 2% 7% 0 7%;
 
+    //form box is adjusted depending on its width
+    @media (max-width: 1000px) {
+    width: 75%;
+    }
+    @media (max-width: 750px) {
+        width: 70%;
+    }
+    @media (max-width: 450px) {
+       width: 61%;
+    }
+    
     @media only screen and (max-width: 900px), only screen and (max-height: 640px) {
         margin-bottom: 2rem;
     }
diff --git a/src/pages/ContactUs/styles.scss b/src/pages/ContactUs/styles.scss
@@ -8,10 +8,6 @@
         margin: 0 auto;
     }
 
-    @media (max-width: 500px) {
-        width: 90%;
-    }
-
     &__content {
         &__header {
             font-size: 1.875rem;
@@ -52,6 +48,17 @@
                 margin: 10px;
             }
         }
+     
+        @media only screen and (max-width: 1024px), only screen and (max-height: 1366px) {
+            //sized to an ipad pro
+            padding-top: 2rem;
+
+            padding-bottom : 12rem;
+
+            &__header {
+               margin-bottom: 2rem;
+            }
+        }
 
         @media only screen and (max-width: 900px), only screen and (max-height: 640px) {
             margin: 0;
diff --git a/src/pages/SponsorUs/styles.scss b/src/pages/SponsorUs/styles.scss
@@ -7,10 +7,7 @@
     @media only screen and (max-width: 900px), only screen and (max-height: 640px) {
         margin: 0 auto;
     }
-    @media (max-width: 500px) {
-        width: 90%;
-    }
-
+    
     &__content {
         &__heading {
             font-size: 1.875rem;
