fix navbar

Fourteen98 · Jul 30, 2022 · c7107a0 · c7107a0
1 parent b35583f
commit c7107a0
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 11 deletions.
diff --git a/src/index.html b/src/index.html
@@ -31,11 +31,11 @@
         <nav class="on-mobile">
             <ul class="popup-menu non-active">
                 <li class="close"><a class="x-icon"><i class="fa-solid fa-x fa-1x"></i></a></li>
-                <li class="nav-text"><a href='#' class="pokemons"><span>Pokemon's</span> <i
+                <li class="nav-text"><a href='#' class="pokemons mobile-a"><span>Pokemon's</span> <i
                         class="fa-solid fa-chevron-right left-arrow"></i></a>
-                <li class="nav-text"><a href='#' class="regions"><span>Regions</span> <i
+                <li class="nav-text"><a href='#' class="regions mobile-a"><span>Regions</span> <i
                         class="fa-solid fa-chevron-right left-arrow"></i></a>
-                <li class="nav-text"><a href='#' class="championship"><span>Championship</span><i
+                <li class="nav-text"><a href='#' class="championship mobile-a"><span>Championship</span><i
                         class="fa-solid fa-chevron-right left-arrow"></i></a></li>
             </ul>
             <ul class="default">
@@ -54,14 +54,14 @@
                  alt="logo">
             <ul class=" nav-list">
                 <li class="spot-nav nav-text">
-                    <a class="" href="#">Pokemon's <span class="sr-only">(current)</span></a>
+                    <a class="desktop-a" href="#">Pokemon's <span class="sr-only">(current)</span></a>
                     <div class="spotlight "></div>
                 </li>
                 <li class="nav-text">
-                    <a class="" href="#">Regions</a>
+                    <a class="desktop-a" href="#">Regions</a>
                 </li>
                 <li class="nav-text">
-                    <a class="" href="#">Championship</a>
+                    <a class="desktop-a" href="#">Championship</a>
                 </li>
             </ul>
         </nav>

diff --git a/src/style.css b/src/style.css
@@ -5,8 +5,8 @@
 }
 
 body {
-  /*background: url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTAuwq1HulMchJDkh9SPs6rhaPyrA4iTXf1Rw&usqp=CAU) no-repeat;*/
-  /*background-size: cover;*/
+  background: url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTAuwq1HulMchJDkh9SPs6rhaPyrA4iTXf1Rw&usqp=CAU) no-repeat;
+  background-size: cover;
   padding: 2% 10%;
   min-height: 100vh;
 }
@@ -349,6 +349,7 @@ footer {
     align-items: center;
     justify-content: center;
     width: 100%;
+    padding: 10px;
     gap: 10%;
   }
 
@@ -358,12 +359,19 @@ footer {
 
 
   .nav-list{
-    width: 60%;
+    width: 80%;
     display: flex;
     justify-content: space-evenly;
     align-items: center;
     align-self: center;
     text-align: center;
+    gap: 15px;
+    margin: 0;
+  }
+
+  .desktop-a {
+    color: #555;
+    font-size: 1.5rem;
   }
 
 }
@@ -405,15 +413,26 @@ footer {
     width: 100vw;
     height: 100vh;
     align-items: center;
-    padding: 2%;
-    gap: 2%;
+    padding: 5%;
+    gap: 3%;
   }
 
   .hamburger {
     width: 100%;
     display: flex;
     justify-content: flex-end;
   }
+
+  .close  {
+    width: 100%;
+    display: flex;
+    justify-content: end;
+  }
+
+  .mobile-a {
+    color: #555;
+    font-size: 2em
+  }
 }