74 lines
2.7 KiB
TypeScript
74 lines
2.7 KiB
TypeScript
import { ArrowRight, Mail, Phone } from "lucide-react";
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface Footer27Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Footer27 = ({ className }: Footer27Props) => {
|
|
return (
|
|
<footer className={cn("px-4 pb-10 sm:px-6 lg:px-8", className)}>
|
|
<div className="mx-auto max-w-6xl border-t border-border/80 pt-8">
|
|
<div className="grid gap-8 lg:grid-cols-[minmax(0,1fr)_auto] lg:items-start">
|
|
<div>
|
|
<h2 className="max-w-2xl text-3xl font-semibold tracking-tight text-balance sm:text-4xl">
|
|
Bereit für eine Website, die Ihr Unternehmen klarer erklärt?
|
|
</h2>
|
|
<p className="mt-4 max-w-xl text-base leading-7 text-muted-foreground">
|
|
Eine kurze Nachricht reicht. Ich prüfe, welcher Weg sinnvoll ist,
|
|
und melde mich mit einer ehrlichen Einschätzung.
|
|
</p>
|
|
<Button asChild size="lg" className="mt-6 h-11 rounded-md px-5">
|
|
<a href="#kontakt">
|
|
Kostenloses Angebot anfordern
|
|
<ArrowRight className="shrink-0" aria-hidden />
|
|
</a>
|
|
</Button>
|
|
</div>
|
|
|
|
<address className="not-italic">
|
|
<div className="space-y-3 text-sm text-muted-foreground">
|
|
<a
|
|
href="mailto:info@matthias-meister-webdesign.de"
|
|
className="flex items-center gap-2 transition-colors hover:text-foreground"
|
|
>
|
|
<Mail className="size-4" aria-hidden />
|
|
info@matthias-meister-webdesign.de
|
|
</a>
|
|
<a
|
|
href="tel:037627984400"
|
|
className="flex items-center gap-2 transition-colors hover:text-foreground"
|
|
>
|
|
<Phone className="size-4" aria-hidden />
|
|
03762 798 4400
|
|
</a>
|
|
</div>
|
|
</address>
|
|
</div>
|
|
|
|
<div className="mt-10 flex flex-col gap-4 border-t border-border/80 pt-6 text-sm text-muted-foreground sm:flex-row sm:items-center sm:justify-between">
|
|
<p>© 2026 Matthias Meister Webdesign — Crimmitschau</p>
|
|
<div className="flex flex-wrap items-center gap-x-5 gap-y-2">
|
|
<a
|
|
href="/impressum"
|
|
className="underline underline-offset-4 transition-colors hover:text-foreground"
|
|
>
|
|
Impressum
|
|
</a>
|
|
<a
|
|
href="/datenschutz"
|
|
className="underline underline-offset-4 transition-colors hover:text-foreground"
|
|
>
|
|
Datenschutz
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
};
|
|
|
|
export { Footer27 };
|