initial commit

src/components/Footer.tsx

@@ -0,0 +1,49 @@
+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";
+
+export default function Footer() {
+	return (
+		<footer className="text-white w-full grid-cols-2 items-center bg-(--accent) px-10 py-5">
+			<div className="flex w-full items-center">
+				<Link to="/">
+					<Image
+						src={footerLogo}
+						alt="ChessScribe Logo"
+						width={10}
+						height={10}
+						className="hidden h-10 w-10 sm:block"
+					/>
+				</Link>
+				<div>
+					<p data-testid="copyright">
+						Copyright © 2023 - {new Date().getFullYear()}
+					</p>
+				</div>
+				<div className="ml-auto flex gap-2">
+					<a
+						href={import.meta.env.VITE_GITHUB_URL} // TODO ZOD
+						target="_blank"
+						rel="noopener noreferrer"
+						className="text-2xl hover:text-(--neutral-content) transition-colors duration-300 ease-in-out cursor-pointer"
+					>
+						<LuGithub />
+					</a>
+
+					<Link
+						to="/contact"
+						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} />
+			</div>
+		</footer>
+	);
+}