fixe navlinks in smaller screens

ChromeGaming · Aug 6, 2024 · bd8f2d0 · bd8f2d0
1 parent 1b0b18e
commit bd8f2d0
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 6 deletions.
diff --git a/public/css/styles.css b/public/css/styles.css
@@ -3,6 +3,8 @@
 /* Importing Google Fonts - Poppins with different font weights. */
 @import url("https://fonts.googleapis.com/css2?family=Silkscreen:wght@400;700&display=swap");
 
+
+
 html {
   user-select: none;
   scroll-behavior: smooth;
@@ -219,15 +221,16 @@ a {
 /* Styling for the logo in the navigation bar. */
 
 .nav .nav-links {
-  column-gap: 20px;
+  /* margin: 0 1rem; */
+  /* column-gap: 20px; */
   list-style: none;
 }
 
 /* Styling for navigation links. */
 
 .nav .nav-links a {
   transition: all 0.2s linear;
-  /* font-size: 15px; */
+  font-size: 14px;
   /* font-family: "Silkscreen", sans-serif; */
   /* font-weight: 400; */
   /* font-style: normal;  */
@@ -892,7 +895,7 @@ h3 {
     top: 0;
     left: -100%;
     height: 100%;
-    max-width: 280px;
+    /* max-width: 280px; */
     width: 100%;
     padding-top: 100px;
     row-gap: 30px;
@@ -1014,7 +1017,11 @@ h3 {
     height: 0.875rem;
   }
 }
-
+/* @media screen and (max-width: 1024px) {
+.nav-links{
+  display: none;
+}
+} */
 @media screen and (min-width: 48rem) {
   .remodal {
     padding-top: 4.5rem;

diff --git a/server/views/index.ejs b/server/views/index.ejs
@@ -226,7 +226,7 @@
     .nav__actions {
       display: flex;
       align-items: center;
-      column-gap: 1rem;
+      /* column-gap: 1rem; */
     }
 
     .nav__search,
@@ -346,7 +346,7 @@
     @media screen and (min-width: 900px) {
       .nav {
         height: calc(var(--header-height) + 2rem);
-        column-gap: 3rem;
+        /* column-gap: 3rem; */
       }
 
       .nav__close,