- Update FAQ copy to mention a concise cookie notice when required - Add footer note about anonymous, cookiefree analytics via Rybbit
87 lines
3.6 KiB
TypeScript
87 lines
3.6 KiB
TypeScript
import {
|
|
Accordion,
|
|
AccordionContent,
|
|
AccordionItem,
|
|
AccordionTrigger,
|
|
} from "@/components/ui/accordion";
|
|
import { Button } from "@/components/ui/button";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
const faqs = [
|
|
{
|
|
question: "Wie lange dauert es bis meine Website fertig ist?",
|
|
answer:
|
|
"In der Regel ist Ihre Website innerhalb von zwei Wochen fertig — vom ersten Gespräch bis zum Go-Live. Nach der Entwicklung bekommen Sie einen Vorschau-Link, damit Sie alles in Ruhe prüfen können. Erst wenn Sie zufrieden sind, geht die Seite online.",
|
|
},
|
|
{
|
|
question: "Was passiert wenn ich das Hosting kündige?",
|
|
answer:
|
|
"Ihre Website und Ihre Domain gehören Ihnen — immer. Wenn Sie das Hosting kündigen, übertrage ich Ihnen alles ohne Wenn und Aber. Keine versteckten Abhängigkeiten, das ist vertraglich festgehalten.",
|
|
},
|
|
{
|
|
question: "Ich habe schon eine Domain — was passiert damit?",
|
|
answer:
|
|
"Kein Problem. Wir zeigen Ihre bestehende Domain einfach auf die neue Website um. Falls Sie möchten, kann ich die Domain auch zu mir umziehen — das macht die Verwaltung einfacher, ist aber kein Muss.",
|
|
},
|
|
{
|
|
question: "Brauche ich technisches Wissen?",
|
|
answer:
|
|
"Keins. Sie kümmern Sie um Ihr Geschäft, ich um alles Technische. Von der Domain über die E-Mails bis zu Updates — das liegt bei mir.",
|
|
},
|
|
{
|
|
question: "Kümmern Sie sich auch um Impressum und Datenschutz?",
|
|
answer:
|
|
"Ja, jede Website die ich baue kommt mit einem rechtssicheren Impressum und einer DSGVO-konformen Datenschutzerklärung — inklusive übersichtlichem Cookie-Hinweis, wo nötig, statt Chaos und unnötigen Tracking-Dialogen.",
|
|
},
|
|
];
|
|
|
|
interface Faq7Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Faq7 = ({ className }: Faq7Props) => {
|
|
return (
|
|
<section className={cn("px-4 py-20 sm:px-6 lg:px-8 lg:py-28", className)}>
|
|
<div className="mx-auto max-w-6xl">
|
|
<div className="grid gap-10 border-t border-border/80 pt-10 md:grid-cols-[minmax(0,0.85fr)_minmax(0,1.15fr)] lg:gap-16">
|
|
<div className="flex max-w-md flex-col gap-6">
|
|
<p className="text-xs font-semibold uppercase tracking-[0.16em] text-primary">
|
|
Häufige Fragen
|
|
</p>
|
|
<h2 className="text-3xl font-semibold tracking-tight text-balance sm:text-4xl">
|
|
Vor dem Start soll nichts schwammig bleiben.
|
|
</h2>
|
|
<p className="text-base leading-7 text-muted-foreground">
|
|
Falls noch etwas offen ist, schreiben Sie mir gern über das
|
|
<a
|
|
href="#kontakt"
|
|
className="mx-1 whitespace-nowrap underline underline-offset-4 transition-colors hover:text-foreground"
|
|
>
|
|
Kontaktformular
|
|
</a>
|
|
.
|
|
</p>
|
|
<Button asChild size="lg" variant="outline" className="w-fit rounded-md">
|
|
<a href="#kontakt">Frage stellen</a>
|
|
</Button>
|
|
</div>
|
|
<Accordion type="multiple" className="rounded-lg border border-border bg-card px-4">
|
|
{faqs.map((faq, index) => (
|
|
<AccordionItem key={index} value={`item-${index}`}>
|
|
<AccordionTrigger className="text-left text-base font-semibold">
|
|
{faq.question}
|
|
</AccordionTrigger>
|
|
<AccordionContent className="text-muted-foreground">
|
|
{faq.answer}
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
))}
|
|
</Accordion>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Faq7 };
|