added page footer

2026-05-24 13:50:41 +02:00
parent ccb09caa4f
commit 1f11a4ecab
8 changed files with 69 additions and 10 deletions
@@ -0,0 +1,42 @@
+import { Link, Sheet, Typography } from "@mui/joy";
+import { useTranslation } from "react-i18next";
+import qrCode from "../assets/Portfolio-QR-Code.png";
+
+export const PageFooter = () => {
+  const { t } = useTranslation();
+
+  return (
+    <footer className="w-full mt-auto px-3 pb-3">
+      <Sheet
+        variant="soft"
+        className="mx-auto w-full max-w-3xl rounded-2xl border border-slate-200/70 bg-white/80 backdrop-blur"
+      >
+        <div className="flex flex-col gap-2 p-2.5 sm:p-3">
+          <div className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
+            <Typography
+              level="title-sm"
+              className="text-slate-800 tracking-wide"
+            >
+              {t("footer-headline")}
+              <Link
+                href="https://portfolio-theis.de/"
+                target="_blank"
+                rel="noreferrer"
+                className="ml-2 inline-flex items-center text-slate-700 underline decoration-slate-300 underline-offset-4 hover:text-slate-900"
+              >
+                portfolio-theis.de
+              </Link>
+            </Typography>
+            <Typography level="body-sm" className="text-slate-500">
+              <img
+                src={qrCode}
+                alt="https://portfolio-theis.de/"
+                className="h-20 w-20 rounded-md border border-slate-200 object-contain"
+              />
+            </Typography>
+          </div>
+        </div>
+      </Sheet>
+    </footer>
+  );
+};