Merge branch 'legal-sites' into 'dev'
Legal sites See merge request rheinsw/website!32
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import ImprintComp from "@/components/Legal/ImprintComp";
|
import ImprintComp from "@/components/Legal/Imprint/ImprintComp";
|
||||||
|
|
||||||
const ImprintPage = () => {
|
const ImprintPage = () => {
|
||||||
return (
|
return (
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PrivacyComp from "@/components/Legal/PrivacyComp";
|
import PrivacyComp from "@/components/Legal/Privacy/PrivacyComp";
|
||||||
|
|
||||||
const PrivacyPage = () => {
|
const PrivacyPage = () => {
|
||||||
return (
|
return (
|
||||||
|
|||||||
@@ -36,13 +36,13 @@ const Footer = () => {
|
|||||||
</p>
|
</p>
|
||||||
</Link>
|
</Link>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
{/*<li>*/}
|
||||||
<Link href="/contact">
|
{/* <Link href="/contact">*/}
|
||||||
<p className="nav_link transition-all duration-300 ease-in-out hover:text-white">
|
{/* <p className="nav_link transition-all duration-300 ease-in-out hover:text-white">*/}
|
||||||
Zahlung und Versand
|
{/* Zahlung und Versand*/}
|
||||||
</p>
|
{/* </p>*/}
|
||||||
</Link>
|
{/* </Link>*/}
|
||||||
</li>
|
{/*</li>*/}
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -50,20 +50,20 @@ const Footer = () => {
|
|||||||
<div>
|
<div>
|
||||||
<h3 className="text-lg font-semibold text-white">Rechtliches</h3>
|
<h3 className="text-lg font-semibold text-white">Rechtliches</h3>
|
||||||
<ul className="mt-4 space-y-4 text-sm font-semibold text-gray-400">
|
<ul className="mt-4 space-y-4 text-sm font-semibold text-gray-400">
|
||||||
<li>
|
{/*<li>*/}
|
||||||
<Link href="/legal/terms-of-use">
|
{/* <Link href="/legal/terms-of-use">*/}
|
||||||
<p className="nav_link transition-all duration-300 ease-in-out hover:text-white">
|
{/* <p className="nav_link transition-all duration-300 ease-in-out hover:text-white">*/}
|
||||||
AGB
|
{/* AGB*/}
|
||||||
</p>
|
{/* </p>*/}
|
||||||
</Link>
|
{/* </Link>*/}
|
||||||
</li>
|
{/*</li>*/}
|
||||||
<li>
|
{/*<li>*/}
|
||||||
<Link href="/legal/revocation">
|
{/* <Link href="/legal/revocation">*/}
|
||||||
<p className="nav_link transition-all duration-300 ease-in-out hover:text-white">
|
{/* <p className="nav_link transition-all duration-300 ease-in-out hover:text-white">*/}
|
||||||
Widerruf
|
{/* Widerruf*/}
|
||||||
</p>
|
{/* </p>*/}
|
||||||
</Link>
|
{/* </Link>*/}
|
||||||
</li>
|
{/*</li>*/}
|
||||||
<li>
|
<li>
|
||||||
<Link href="/legal/privacy">
|
<Link href="/legal/privacy">
|
||||||
<p className="nav_link transition-all duration-300 ease-in-out hover:text-white">
|
<p className="nav_link transition-all duration-300 ease-in-out hover:text-white">
|
||||||
|
|||||||
131
components/Legal/Imprint/ImprintComp.tsx
Normal file
131
components/Legal/Imprint/ImprintComp.tsx
Normal file
@@ -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;
|
||||||
@@ -1,99 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import SmallHero from "@/components/Helper/SmallHero";
|
|
||||||
import React, {useContext, useEffect} from "react";
|
|
||||||
import {ThemeContext} from "@/components/provider/ThemeProvider";
|
|
||||||
import {themeColors} from "@/components/Helper/ThemeColors";
|
|
||||||
import AOS from "aos";
|
|
||||||
|
|
||||||
const ImprintComp = () => {
|
|
||||||
const {theme} = useContext(ThemeContext);
|
|
||||||
const colors = themeColors[theme];
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
AOS.init({
|
|
||||||
duration: 1000,
|
|
||||||
easing: "ease",
|
|
||||||
once: true,
|
|
||||||
anchorPlacement: "top-bottom",
|
|
||||||
});
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="overflow-hidden transition-colors duration-500"
|
|
||||||
style={{backgroundColor: colors.secondaryBg, color: colors.primaryText}}>
|
|
||||||
|
|
||||||
{/* Hero Section */}
|
|
||||||
<div className="mt-[10vh]">
|
|
||||||
<SmallHero
|
|
||||||
title="Impressum"
|
|
||||||
subtitle=""
|
|
||||||
backgroundImage="/images/contact.png"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
{/* Contact Form */}
|
|
||||||
<div className="mt-16 w-[90%] sm:w-[80%] mx-auto py-12">
|
|
||||||
<h2 className="text-2xl md:text-3xl font-bold text-center"
|
|
||||||
data-aos="fade-up"
|
|
||||||
data-aos-delay="400"
|
|
||||||
>
|
|
||||||
Schreib uns eine Nachricht
|
|
||||||
</h2>
|
|
||||||
<p data-aos="fade-up" data-aos-delay="600"
|
|
||||||
className="text-center mt-3 text-[var(--secondary-text)]">
|
|
||||||
Wir melden uns schnellstmöglich bei dir!
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<form className="mt-8 max-w-2xl mx-auto space-y-6">
|
|
||||||
{/* Name & Email */}
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
|
||||||
{["Dein Name", "Deine E-Mail"].map((label, index) => (
|
|
||||||
<div key={index} data-aos="fade-up" data-aos-delay={index * 100}>
|
|
||||||
<label className="block font-semibold">{label}</label>
|
|
||||||
<input
|
|
||||||
type={index === 0 ? "text" : "email"}
|
|
||||||
placeholder={index === 0 ? "Max Mustermann" : "max@example.com"}
|
|
||||||
className="w-full p-3 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 transition"
|
|
||||||
style={{
|
|
||||||
backgroundColor: colors.inputFieldBg,
|
|
||||||
border: `1px solid ${colors.inputBorder}`,
|
|
||||||
color: colors.primaryText
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Message */}
|
|
||||||
<div data-aos="fade-up" data-aos-delay="300">
|
|
||||||
<label className="block font-semibold">Deine Nachricht</label>
|
|
||||||
<textarea
|
|
||||||
rows={4}
|
|
||||||
placeholder="Schreibe deine Nachricht..."
|
|
||||||
className="w-full p-3 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 transition"
|
|
||||||
style={{
|
|
||||||
backgroundColor: colors.inputFieldBg,
|
|
||||||
border: `1px solid ${colors.inputBorder}`,
|
|
||||||
color: colors.primaryText
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Submit Button */}
|
|
||||||
<div className="text-center" data-aos="fade-up" data-aos-delay="400">
|
|
||||||
<button
|
|
||||||
type="submit"
|
|
||||||
className="px-6 py-3 bg-blue-600 text-white text-lg font-semibold rounded-lg shadow-md hover:bg-blue-700 transition-all"
|
|
||||||
>
|
|
||||||
📩 Nachricht senden
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default ImprintComp;
|
|
||||||
145
components/Legal/Privacy/PrivacyComp.tsx
Normal file
145
components/Legal/Privacy/PrivacyComp.tsx
Normal file
@@ -0,0 +1,145 @@
|
|||||||
|
"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 PrivacyComp = () => {
|
||||||
|
const {theme} = useContext(ThemeContext);
|
||||||
|
const colors = themeColors[theme];
|
||||||
|
|
||||||
|
const sections = [
|
||||||
|
{
|
||||||
|
title: "1. Datenschutz auf einen Blick",
|
||||||
|
content: (
|
||||||
|
<>
|
||||||
|
<p>
|
||||||
|
Die folgenden Hinweise geben einen einfachen Überblick darüber, was mit Ihren personenbezogenen
|
||||||
|
Daten passiert, wenn Sie diese Website besuchen. Personenbezogene Daten sind alle Daten, mit
|
||||||
|
denen Sie persönlich identifiziert werden können.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Die Datenverarbeitung auf dieser Website erfolgt durch den Websitebetreiber. Dessen Kontaktdaten
|
||||||
|
finden Sie im Abschnitt „Hinweis zur Verantwortlichen Stelle“.
|
||||||
|
</p>
|
||||||
|
</>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "2. Allgemeine Hinweise und Pflichtinformationen",
|
||||||
|
content: (
|
||||||
|
<>
|
||||||
|
<p>
|
||||||
|
Wir behandeln Ihre personenbezogenen Daten vertraulich und entsprechend den gesetzlichen
|
||||||
|
Datenschutzvorschriften sowie dieser Datenschutzerklärung. Wir weisen darauf hin, dass die
|
||||||
|
Datenübertragung im Internet Sicherheitslücken aufweisen kann.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Verantwortlich für die Datenverarbeitung:
|
||||||
|
<br/>
|
||||||
|
Rhein-Software Development
|
||||||
|
<br/>
|
||||||
|
Mühlenstrasse 13
|
||||||
|
<br/>
|
||||||
|
79664 Wehr
|
||||||
|
<br/><br/>
|
||||||
|
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>
|
||||||
|
</p>
|
||||||
|
</>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "3. Ihre Rechte",
|
||||||
|
content: (
|
||||||
|
<p>
|
||||||
|
Sie haben das Recht auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung,
|
||||||
|
Datenübertragbarkeit sowie auf Widerspruch gegen die Verarbeitung Ihrer Daten. Zudem haben Sie
|
||||||
|
ein Beschwerderecht bei der zuständigen Aufsichtsbehörde.
|
||||||
|
</p>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "4. Analyse-Tools und Cookies",
|
||||||
|
content: (
|
||||||
|
<p>
|
||||||
|
Beim Besuch dieser Website kann Ihr Surfverhalten statistisch ausgewertet werden. Das geschieht
|
||||||
|
vor allem mit sogenannten Analyseprogrammen und Cookies. Detaillierte Informationen hierzu
|
||||||
|
entnehmen Sie bitte unserer vollständigen Datenschutzerklärung.
|
||||||
|
</p>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "5. Sicherheit",
|
||||||
|
content: (
|
||||||
|
<p>
|
||||||
|
Diese Seite nutzt eine SSL- bzw. TLS-Verschlüsselung. Eine verschlüsselte Verbindung erkennen
|
||||||
|
Sie an der Adresszeile des Browsers („https://“) und dem Schloss-Symbol.
|
||||||
|
</p>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Quelle",
|
||||||
|
content: (
|
||||||
|
<p className="text-sm text-gray-500">
|
||||||
|
Quelle:{" "}
|
||||||
|
<a
|
||||||
|
href="https://www.e-recht24.de"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="underline"
|
||||||
|
>
|
||||||
|
www.e-recht24.de
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
className="overflow-hidden transition-colors duration-500"
|
||||||
|
style={{backgroundColor: colors.secondaryBg, color: colors.primaryText}}
|
||||||
|
>
|
||||||
|
{/* Privacy Content */}
|
||||||
|
<div className="mt-16 w-[90%] sm:w-[80%] mx-auto py-12 space-y-10 text-base leading-relaxed">
|
||||||
|
{sections.map((section, i) => (
|
||||||
|
<motion.div
|
||||||
|
key={section.title}
|
||||||
|
custom={i}
|
||||||
|
initial="hidden"
|
||||||
|
whileInView="visible"
|
||||||
|
viewport={{once: true, amount: 0.2}}
|
||||||
|
variants={fadeInUp}
|
||||||
|
>
|
||||||
|
<h2 className="text-2xl font-bold mb-4">{section.title}</h2>
|
||||||
|
<div className="space-y-4">{section.content}</div>
|
||||||
|
</motion.div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default PrivacyComp;
|
||||||
@@ -1,99 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import SmallHero from "@/components/Helper/SmallHero";
|
|
||||||
import React, {useContext, useEffect} from "react";
|
|
||||||
import {ThemeContext} from "@/components/provider/ThemeProvider";
|
|
||||||
import {themeColors} from "@/components/Helper/ThemeColors";
|
|
||||||
import AOS from "aos";
|
|
||||||
|
|
||||||
const PrivacyComp = () => {
|
|
||||||
const {theme} = useContext(ThemeContext);
|
|
||||||
const colors = themeColors[theme];
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
AOS.init({
|
|
||||||
duration: 1000,
|
|
||||||
easing: "ease",
|
|
||||||
once: true,
|
|
||||||
anchorPlacement: "top-bottom",
|
|
||||||
});
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="overflow-hidden transition-colors duration-500"
|
|
||||||
style={{backgroundColor: colors.secondaryBg, color: colors.primaryText}}>
|
|
||||||
|
|
||||||
{/* Hero Section */}
|
|
||||||
<div className="mt-[10vh]">
|
|
||||||
<SmallHero
|
|
||||||
title="Datenschutz"
|
|
||||||
subtitle=""
|
|
||||||
backgroundImage="/images/contact.png"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
{/* Contact Form */}
|
|
||||||
<div className="mt-16 w-[90%] sm:w-[80%] mx-auto py-12">
|
|
||||||
<h2 className="text-2xl md:text-3xl font-bold text-center"
|
|
||||||
data-aos="fade-up"
|
|
||||||
data-aos-delay="400"
|
|
||||||
>
|
|
||||||
Schreib uns eine Nachricht
|
|
||||||
</h2>
|
|
||||||
<p data-aos="fade-up" data-aos-delay="600"
|
|
||||||
className="text-center mt-3 text-[var(--secondary-text)]">
|
|
||||||
Wir melden uns schnellstmöglich bei dir!
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<form className="mt-8 max-w-2xl mx-auto space-y-6">
|
|
||||||
{/* Name & Email */}
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
|
||||||
{["Dein Name", "Deine E-Mail"].map((label, index) => (
|
|
||||||
<div key={index} data-aos="fade-up" data-aos-delay={index * 100}>
|
|
||||||
<label className="block font-semibold">{label}</label>
|
|
||||||
<input
|
|
||||||
type={index === 0 ? "text" : "email"}
|
|
||||||
placeholder={index === 0 ? "Max Mustermann" : "max@example.com"}
|
|
||||||
className="w-full p-3 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 transition"
|
|
||||||
style={{
|
|
||||||
backgroundColor: colors.inputFieldBg,
|
|
||||||
border: `1px solid ${colors.inputBorder}`,
|
|
||||||
color: colors.primaryText
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Message */}
|
|
||||||
<div data-aos="fade-up" data-aos-delay="300">
|
|
||||||
<label className="block font-semibold">Deine Nachricht</label>
|
|
||||||
<textarea
|
|
||||||
rows={4}
|
|
||||||
placeholder="Schreibe deine Nachricht..."
|
|
||||||
className="w-full p-3 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 transition"
|
|
||||||
style={{
|
|
||||||
backgroundColor: colors.inputFieldBg,
|
|
||||||
border: `1px solid ${colors.inputBorder}`,
|
|
||||||
color: colors.primaryText
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Submit Button */}
|
|
||||||
<div className="text-center" data-aos="fade-up" data-aos-delay="400">
|
|
||||||
<button
|
|
||||||
type="submit"
|
|
||||||
className="px-6 py-3 bg-blue-600 text-white text-lg font-semibold rounded-lg shadow-md hover:bg-blue-700 transition-all"
|
|
||||||
>
|
|
||||||
📩 Nachricht senden
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default PrivacyComp;
|
|
||||||
Reference in New Issue
Block a user