Update location link and email style in footer

Author: Magicherry

src/components/MainFrame/Footer.js

@@ -2,7 +2,7 @@ import React, { useState, useEffect } from "react";
 import { Container, Row, Col, Modal } from "react-bootstrap";
 import { AiFillGithub } from "react-icons/ai";
 import { SiBilibili } from "react-icons/si";
-import { FaLinkedinIn, FaWeixin } from "react-icons/fa";
+import { FaLinkedinIn, FaWeixin, FaEnvelope } from "react-icons/fa";
 import wechatQrCode from "../../Assets/about/social/Wechat.jpg";
 
 const Footer = () => {
@@ -39,8 +39,9 @@ const Footer = () => {
       <Container fluid className="footer">
         <Row className="align-items-center justify-content-center">
           <Col md={4} className="footer-copyright d-flex align-items-center justify-content-center">
-            <a href="mailto:zyt680129@gmail.com" className="email-link">
-              <h3>Email: zyt680129@gmail.com</h3>
+            <a href="mailto:zyt680129@gmail.com" className="email-link footer-email">
+              <FaEnvelope className="footer-email__icon" aria-hidden="true" />
+              <span className="footer-email__text">zyt680129@gmail.com</span>
             </a>
           </Col>
           <Col md={4} className="footer-copyright d-flex align-items-center justify-content-center">

src/components/MainFrame/Navbar.js

@@ -424,7 +424,7 @@ function NavBar({ triggerPreloader }) {
               <div className="floating-nav-contact-group">
                 <a
                   className="floating-nav-contact-item"
-                  href="https://www.google.com/maps/search/?api=1&query=Rutgers%20University%E2%80%93New%20Brunswick"
+                  href="https://www.cs.rutgers.edu/"
                   target="_blank"
                   rel="noopener noreferrer"
                 >

src/css/style.css

@@ -1681,6 +1681,31 @@ body.homepage .home-about-section {
     text-decoration: none;
 }
 
+.email-link:hover .footer-email__icon,
+.email-link:hover .footer-email__text {
+    color: var(--navbar-color-brand);
+}
+
+.footer-email {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.5rem;
+}
+
+.footer-email__icon {
+    font-size: 1.25rem;
+    flex-shrink: 0;
+    color: inherit;
+    transition: color 0.2s ease;
+}
+
+.footer-email__text {
+    font-size: 1rem;
+    font-weight: 500;
+    color: inherit;
+    transition: color 0.2s ease;
+}
+
 .blockquote-footer {
     color: var(--color-blockquote-footer) !important;
 }