add icons to footer with colour transition

src/components/Footer.tsx

@@ -1,6 +1,8 @@
 import { Link } from "@tanstack/react-router";
 import { Image } from "@unpic/react";
 
+import { LuGithub, LuMail } from "react-icons/lu";
+
 import CoffeeWidget from "#/components/CoffeeWidget.tsx";
 import footerLogo from "@/assets/images/footerLogo.svg?url";
 
@@ -23,12 +25,22 @@ export default function Footer() {
 					</p>
 				</div>
 				<div className="ml-auto flex gap-2">
-					<Link to="/" target="_blank" rel="noopener noreferrer">
-						Github
+					<Link
+						to="/"
+						target="_blank"
+						rel="noopener noreferrer"
+						className="text-2xl hover:text-(--neutral-content) transition-colors duration-300 ease-in-out"
+					>
+						<LuGithub />
 					</Link>
 
-					<Link to="/" target="_blank" rel="noopener noreferrer">
-						Mail
+					<Link
+						to="/"
+						target="_blank"
+						rel="noopener noreferrer"
+						className="text-2xl hover:text-(--neutral-content) transition-colors duration-300 ease-in-out"
+					>
+						<LuMail />
 					</Link>
 				</div>
 				<CoffeeWidget width={20} height={50} />