Merge pull request Counselllor#773 from Amruta7203/updated

Updated Footer
sau-mili · Jun 26, 2024 · 61dba50 · 61dba50
2 parents e32fc02 + 0f1d846
commit 61dba50
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 8 deletions.
diff --git a/src/components/Footer/Footer.css b/src/components/Footer/Footer.css
@@ -30,11 +30,29 @@ footer li{
     align-items: stretch;
     list-style: none;
     text-align: center;
+    position: relative;
+}
+
+footer li a:before {
+    content: "";
+    position: absolute;
+    /* display: block; */
+    width: 100%;
+    height: 2px;
+    bottom: 0;
+    left: 0;
+    top: 20px;
+    background-color: #000;
+    transform: scaleX(0);
+    transition: transform 0.3s ease;
+}
+
+footer li a:hover::before {
+    transform: scaleX(1);
 }
 
 footer li:hover{
     cursor: pointer;
-    text-decoration: underline;
 }
 
 #icons{

diff --git a/src/components/Footer/Footer.jsx b/src/components/Footer/Footer.jsx
@@ -14,13 +14,18 @@ function Footer() {
               About
             </a>
           </li>
-          <li>Blog</li>
-          <a
+          <li>
+            <a 
+          style={{ textDecoration: "none", color: "inherit" }}
+          href="/">Blog
+          </a></li>
+            <li><a
             style={{ textDecoration: "none", color: "inherit" }}
             href="./help"
           >
-            <li>Help</li>
+            Help
           </a>
+          </li>
           <li>
             <a
               style={{ textDecoration: "none", color: "inherit" }}
@@ -45,15 +50,18 @@ function Footer() {
               Contact
             </a>
           </li>
-          <a
+
+            <li>
+            <a
             style={{ textDecoration: "none", color: "inherit" }}
             href="./join-us"
           >
-            <li>Join Us</li>
-          </a>
+              Join Us
+              </a>
+              </li>
           <li>
             <a
-              style={{ textDecoration: "none", color: "inherit" }}
+              style={{display:"flex", justifyContent:"center", textDecoration: "none", color: "inherit" }}
               href="./contribute"
             >
               Our Contributors