Added hover effect in footer section

Jattulu · Oct 1, 2023 · 57687a0 · 57687a0
1 parent a58581b
commit 57687a0
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 3 deletions.
diff --git a/index.html b/index.html
@@ -330,7 +330,7 @@ <h5>Subscribe to our newsletter</h5>
                   id="face"  ><i class="fab fa-facebook-f"></i
                   ></a>
                   <a class="btn btn-outline-dark btn-floating m-1" href="https://www.twitter.com" role="button"
-                  id="faces"  ><i class="fab fa-twitter"></i
+                  id="twitter"  ><i class="fab fa-twitter"></i
                   ></a>
                   <a class="btn btn-outline-dark btn-floating m-1" href="https://www.google.com" role="button"
                   id="google"  ><i class="fab fa-google"></i
@@ -339,7 +339,7 @@ <h5>Subscribe to our newsletter</h5>
                    id="insta" ><i class="fab fa-instagram"></i
                   ></a>
                   <a class="btn btn-outline-dark btn-floating m-1" href="https://www.linkedin.com" role="button"
-                   id="face" ><i class="fab fa-linkedin-in"></i
+                   id="link" ><i class="fab fa-linkedin-in"></i
                   ></a>
                   <a class="btn btn-outline-dark btn-floating m-1" href="https://github.com/" role="button"
                     ><i class="fab fa-github"></i

diff --git a/style.css b/style.css
@@ -7,12 +7,21 @@ footer1{
 #face:hover{
   background-color:  rgb(48, 115, 183);
 }
-#faces:hover{
+#twitter:hover{
     background-color: rgb(95, 145, 195);
   }
   #google:hover{
     background:linear-gradient(to right, blue 10%, red 50%, yellow 80% , green 100%) !important; 
   }
   #insta:hover{
     background: linear-gradient(to bottom right, #ff3399 19%, #ff9933 90%);
+  }
+  #link:hover{
+    background-color: rgb(57, 111, 165);
+  }
+  .nav-link:hover{
+    color: navy !important;
+  }
+  .nav-item:hover{
+    color: navy !important;
   }