Initial commit

components/Footer.tsx

@@ -0,0 +1,106 @@
+import styles from "./Footer.module.css";
+import Link from "next/link";
+import {
+  InstagramLogoIcon,
+  LinkedinLogoIcon,
+  XLogoIcon,
+  FacebookLogoIcon,
+} from "@phosphor-icons/react/dist/ssr";
+
+const currentYear = new Date().getFullYear();
+
+export default function Footer() {
+  return (
+    <footer className={styles.footer}>
+      <div className={styles.footer__inner}>
+        {/* Top: Brand + Navigation */}
+        <div className={styles.footer__top}>
+          {/* Brand */}
+          <div className={styles.footer__brand}>
+            <Link href="/" className={styles.footer__logo}>
+              ENVU {/* ← Logo oder Bildkomponente hier */}
+            </Link>
+            <p className={styles.footer__tagline}>
+              Maßgeschneiderte digitale Lösungen für Ihr Unternehmen.
+            </p>
+          </div>
+
+          {/* Navigation Spalten */}
+          <nav className={styles.footer__nav} aria-label="Footer Navigation">
+            <div className={styles.footer__nav_group}>
+              <span className={styles.footer__nav_title}>Unternehmen</span>
+              <ul>
+                <li>
+                  <Link href="/ueberuns">Über uns</Link>
+                </li>
+                <li>
+                  <Link href="/leistungen">Leistungen</Link>
+                </li>
+                <li>
+                  <Link href="/kontakt">Kontakt</Link>
+                </li>
+              </ul>
+            </div>
+
+            <div className={styles.footer__nav_group}>
+              <span className={styles.footer__nav_title}>Rechtliches</span>
+              <ul>
+                <li>
+                  <Link href="/impressum">Impressum</Link>
+                </li>
+                <li>
+                  <Link href="/datenschutz">Datenschutz</Link>
+                </li>
+              </ul>
+            </div>
+          </nav>
+        </div>
+
+        {/* Divider */}
+        <div className={styles.footer__divider} />
+
+        {/* Bottom: Copyright + Social */}
+        <div className={styles.footer__bottom}>
+          <p className={styles.footer__copy}>
+            © {currentYear} ENVU. Alle Rechte vorbehalten.
+          </p>
+
+          <div className={styles.footer__social}>
+            <a
+              href="https://instagram.com"
+              target="_blank"
+              rel="noopener noreferrer"
+              aria-label="Instagram"
+            >
+              <InstagramLogoIcon size={20} />
+            </a>
+            <a
+              href="https://linkedin.com"
+              target="_blank"
+              rel="noopener noreferrer"
+              aria-label="LinkedIn"
+            >
+              <LinkedinLogoIcon size={20} />
+            </a>
+            <a
+              href="https://x.com"
+              target="_blank"
+              rel="noopener noreferrer"
+              aria-label="X (Twitter)"
+            >
+              <XLogoIcon size={20} />
+            </a>
+            <a
+              href="https://facebook.com"
+              target="_blank"
+              rel="noopener noreferrer"
+              aria-label="Facebook"
+            >
+              <FacebookLogoIcon size={20} />
+            </a>
+          </div>
+        </div>
+      </div>
+    </footer>
+  );
+}