SCSS: Move payment and reviews media queries into respective section …

…file
wikjoh · Oct 5, 2024 · af9096a · af9096a
1 parent 61646d2
commit af9096a
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 16 deletions.
diff --git a/css/main.css b/css/main.css
@@ -756,6 +756,11 @@ section#how {
 section#payment {
   display: none;
 }
+@media (width >= 1400px) {
+  section#payment {
+    display: block;
+  }
+}
 
 .payment-container {
   margin-top: 8rem;
@@ -844,6 +849,11 @@ section#reviews {
   display: none;
   background-color: var(--color-reviewsbg);
 }
+@media (width >= 1400px) {
+  section#reviews {
+    display: block;
+  }
+}
 
 .reviews-container {
   padding: 6rem 1.5rem 7rem;
@@ -1659,14 +1669,6 @@ a:hover {
 }
 @media (1400px <= width) {
   /* How does it work-section */
-  /* Payment section */
-  section#payment {
-    display: block;
-  }
-  /* Reviews section */
-  section#reviews {
-    display: block;
-  }
   /* FAQ-contact section */
   .faq-contact-container {
     margin-top: 7rem;

diff --git a/css/scss/base/_media-width.scss b/css/scss/base/_media-width.scss
@@ -366,15 +366,15 @@
   //   }
   // }
 
-  /* Payment section */
-  section#payment {
-    display: block;
-  }
+  // /* Payment section */
+  // section#payment {
+  //   display: block;
+  // }
 
-  /* Reviews section */
-  section#reviews {
-    display: block;
-  }
+  // /* Reviews section */
+  // section#reviews {
+  //   display: block;
+  // }
 
   /* FAQ-contact section */
   .faq-contact-container {

diff --git a/css/scss/sections/_payment.scss b/css/scss/sections/_payment.scss
@@ -1,5 +1,11 @@
+@use '../abstracts/' as *;
+
 section#payment {
   display: none;
+
+  @include desktop {
+    display: block;
+  }
 }
 
 .payment-container {

diff --git a/css/scss/sections/_reviews.scss b/css/scss/sections/_reviews.scss
@@ -1,6 +1,12 @@
+@use '../abstracts/' as *;
+
 section#reviews {
   display: none;
   background-color: var(--color-reviewsbg);
+
+  @include desktop {
+    display: block;
+  }
 }
 
 .reviews-container {