📱 responsive

fixed home page responsivety under 500px width
fl4viooliveira · May 1, 2022 · 760f5c7 · 760f5c7
1 parent 97d76a3
commit 760f5c7
Show file tree

Hide file tree

Showing 6 changed files with 11 additions and 6 deletions.
diff --git a/frontend/components/Navbar.jsx b/frontend/components/Navbar.jsx
@@ -14,7 +14,6 @@ export default function Navbar() {
     <div className={styles.navBar}>
       <Link href="/">
         <div className={styles.logo}>
-          {/* <img src="4devlogo.png" alt="" /> */}
           <img src="/logo.svg" alt="logo" />
         </div>
       </Link>

diff --git a/frontend/styles/Banner.module.css b/frontend/styles/Banner.module.css
@@ -53,8 +53,11 @@
   .container {
     flex-wrap: wrap;
   }
+  .infoBox {
+    min-width: 200px;
+  }
 }
-@media (max-width: 400px) {
+@media (max-width: 500px) {
   .container {
     width: calc(100% - 20px);
     margin: 10px auto;

diff --git a/frontend/styles/Footer.module.css b/frontend/styles/Footer.module.css
@@ -9,7 +9,7 @@
 .img {
   margin: 10px 0;
 }
-@media (max-width: 400px) {
+@media (max-width: 500px) {
   .container {
     width: calc(100% - 20px);
     margin: 0 auto;

diff --git a/frontend/styles/Home.module.css b/frontend/styles/Home.module.css
@@ -99,7 +99,7 @@
     width: 100%;
   }
 }
-@media (max-width: 400px) {
+@media (max-width: 500px) {
   .productsContainer {
     width: calc(100% - 20px);
     margin: 0 auto;

diff --git a/frontend/styles/Navbar.module.css b/frontend/styles/Navbar.module.css
@@ -77,6 +77,9 @@
   display: none;
 }
 @media (max-width: 900px) {
+  .logo {
+    width: 100px;
+  }
   .navbar {
     position: relative;
   }
@@ -124,7 +127,7 @@
     visibility: visible;
   }
 }
-@media (max-width: 400px) {
+@media (max-width: 500px) {
   .navBar {
     width: calc(100% - 20px);
     margin: 10px auto;

diff --git a/frontend/styles/ProjectBanner.module.css b/frontend/styles/ProjectBanner.module.css
@@ -104,7 +104,7 @@
     margin-top: 25px;
   }
 }
-@media (max-width: 400px) {
+@media (max-width: 500px) {
   .container {
     width: calc(100% - 20px);
     margin: 10px auto;