49 lines
2.2 KiB
TypeScript
49 lines
2.2 KiB
TypeScript
import { company } from "@/lib/site-content";
|
|
|
|
export function ContactStrip() {
|
|
return (
|
|
<section id="kontakt" className="section-block pb-10">
|
|
<div className="container-shell">
|
|
<div className="rounded-3xl border border-copper-200 bg-copper-50 p-7 shadow-card sm:p-10">
|
|
<div className="grid gap-6 md:grid-cols-[1.2fr_1fr] md:items-center">
|
|
<div>
|
|
<p className="eyebrow text-copper-700">Direkter Kontakt</p>
|
|
<h2 className="mt-3 text-3xl font-semibold text-alpine-900">Ein Anruf klaert oft mehr als zehn Mails.</h2>
|
|
<p className="mt-4 max-w-2xl text-alpine-700">
|
|
Wenn Sie einen Tarif wechseln, einen Standort anbinden oder eine Stoerung melden wollen: Sie landen
|
|
nicht in einem anonymen Ticketsystem, sondern bei einem Team aus der Region.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="rounded-2xl border border-copper-200 bg-white p-6">
|
|
<ul className="space-y-3 text-sm text-alpine-800">
|
|
<li>
|
|
<span className="font-semibold">Telefon:</span>{" "}
|
|
<a className="text-alpine-700 underline decoration-copper-400 underline-offset-4" href={`tel:${company.phone.replace(/\s+/g, "")}`}>
|
|
{company.phone}
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<span className="font-semibold">Beratung:</span>{" "}
|
|
<a className="text-alpine-700 underline decoration-copper-400 underline-offset-4" href={`mailto:${company.email}`}>
|
|
{company.email}
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<span className="font-semibold">Stoerung:</span>{" "}
|
|
<a className="text-alpine-700 underline decoration-copper-400 underline-offset-4" href={`mailto:${company.supportEmail}`}>
|
|
{company.supportEmail}
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<span className="font-semibold">Erreichbarkeit:</span> {company.openingHours}
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|