Initial Commit

frontend/components/Legal/Imprint/ImprintComp.tsx

@@ -0,0 +1,131 @@
+"use client";
+
+import React, {useContext} from "react";
+import {ThemeContext} from "@/components/provider/ThemeProvider";
+import {themeColors} from "@/components/Helper/ThemeColors";
+import {motion} from "framer-motion";
+
+const fadeInUp = {
+    hidden: {opacity: 0, y: 30},
+    visible: (i: number) => ({
+        opacity: 1,
+        y: 0,
+        transition: {
+            duration: 0.6,
+            delay: i * 0.2,
+            ease: "easeOut",
+        },
+    }),
+};
+
+const ImprintComp = () => {
+    const {theme} = useContext(ThemeContext);
+    const colors = themeColors[theme];
+
+    return (
+        <div
+            className="overflow-hidden transition-colors duration-500"
+            style={{backgroundColor: colors.secondaryBg, color: colors.primaryText}}
+        >
+            {/* Imprint Content */}
+            <div className="mt-16 w-[90%] sm:w-[80%] mx-auto py-12 space-y-10 text-base leading-relaxed">
+                {[
+                    {
+                        title: "Impressum",
+                        content: (
+                            <>
+                                Thatsaphorn Atchariyaphap<br/>
+                                Rhein-Software (Einzelunternehmer)<br/>
+                                Mühlenstrasse 13<br/>
+                                79664 Wehr
+                            </>
+                        ),
+                    },
+                    {
+                        title: "Kontakt",
+                        content: (
+                            <>
+                                Telefon: +49 (0) 151 24003632<br/>
+                                E-Mail:{" "}
+                                <a
+                                    href="mailto:contact@rhein-software.dev"
+                                    className="underline text-blue-500"
+                                >
+                                    contact@rhein-software.dev
+                                </a>
+                            </>
+                        ),
+                    },
+                    {
+                        title: "EU-Streitschlichtung",
+                        content: (
+                            <>
+                                Die Europäische Kommission stellt eine Plattform zur
+                                Online-Streitbeilegung (OS) bereit:{" "}
+                                <a
+                                    href="https://ec.europa.eu/consumers/odr/"
+                                    target="_blank"
+                                    rel="noopener noreferrer"
+                                    className="underline text-blue-500"
+                                >
+                                    https://ec.europa.eu/consumers/odr/
+                                </a>
+                                .<br/>
+                                Unsere E-Mail-Adresse finden Sie oben im Impressum.
+                            </>
+                        ),
+                    },
+                    {
+                        title:
+                            "Verbraucherstreitbeilegung / Universalschlichtungsstelle",
+                        content: (
+                            <>
+                                Wir sind nicht bereit oder verpflichtet, an
+                                Streitbeilegungsverfahren vor einer
+                                Verbraucherschlichtungsstelle teilzunehmen.
+                            </>
+                        ),
+                    },
+                ].map((section, i) => (
+                    <motion.div
+                        key={section.title}
+                        custom={i}
+                        initial="hidden"
+                        animate="visible"
+                        variants={fadeInUp}
+                    >
+                        <h2 className="text-2xl font-bold">{section.title}</h2>
+                        <motion.div
+                            className="w-6 h-[2px] mt-2 mb-6 bg-amber-500"
+                            initial={{opacity: 0, x: -20}}
+                            whileInView={{opacity: 1, x: 0}}
+                            viewport={{once: true}}
+                            transition={{duration: 0.4, delay: 0.1}}
+                        />
+                        <p>{section.content}</p>
+                    </motion.div>
+                ))}
+
+                <motion.p
+                    className="text-sm text-gray-500"
+                    custom={4}
+                    initial="hidden"
+                    animate="visible"
+                    variants={fadeInUp}
+                >
+                    Quelle:{" "}
+                    <a
+                        href="https://www.e-recht24.de"
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        className="underline"
+                    >
+                        www.e-recht24.de
+                    </a>
+                </motion.p>
+            </div>
+        </div>
+    );
+};
+
+export default ImprintComp;