80 lines
2.0 KiB
TypeScript
80 lines
2.0 KiB
TypeScript
import Link from "next/link";
|
|
import styles from "./IndustrySolutionsSection.module.css";
|
|
import {
|
|
BuildingsIcon,
|
|
StethoscopeIcon,
|
|
WarehouseIcon,
|
|
HouseLineIcon,
|
|
ArrowRightIcon,
|
|
} from "@phosphor-icons/react/dist/ssr";
|
|
|
|
const industries = [
|
|
{
|
|
title: "Büros",
|
|
href: "/branchen/bueros",
|
|
icon: BuildingsIcon,
|
|
},
|
|
{
|
|
title: "Arztpraxen",
|
|
href: "/branchen/arztpraxen",
|
|
icon: StethoscopeIcon,
|
|
},
|
|
{
|
|
title: "Hallen und Lagerflächen",
|
|
href: "/branchen/hallen-lagerflaechen",
|
|
icon: WarehouseIcon,
|
|
},
|
|
{
|
|
title: "Wohn- und Geschäftshäuser",
|
|
href: "/branchen/wohn-geschaeftshaeuser",
|
|
icon: HouseLineIcon,
|
|
},
|
|
{
|
|
title: "Zum Kontaktformular",
|
|
href: "/kontakt",
|
|
icon: ArrowRightIcon,
|
|
},
|
|
];
|
|
|
|
export default function IndustrySolutionsSection() {
|
|
return (
|
|
<section
|
|
className={styles.section}
|
|
aria-labelledby="industry-solutions-heading"
|
|
>
|
|
<div className={styles.inner}>
|
|
<div className={styles.intro}>
|
|
<h2 id="industry-solutions-heading" className={styles.heading}>
|
|
Reinigungsleistungen für verschiedene Branchen
|
|
</h2>
|
|
<p className={styles.lead}>
|
|
Als Reinigungsfirma betreuen wir Unternehmen aus unterschiedlichen
|
|
Branchen. Unsere Leistungen passen wir individuell an Nutzung,
|
|
Objektgröße und branchenspezifische Anforderungen an.
|
|
</p>
|
|
</div>
|
|
|
|
<div className={styles.grid}>
|
|
{industries.map((industry) => {
|
|
const Icon = industry.icon;
|
|
|
|
return (
|
|
<Link
|
|
key={industry.title}
|
|
href={industry.href}
|
|
className={styles.card}
|
|
>
|
|
<span className={styles.cardText}>{industry.title}</span>
|
|
|
|
<span className={styles.iconWrap} aria-hidden="true">
|
|
<Icon size={18} weight="bold" className={styles.icon} />
|
|
</span>
|
|
</Link>
|
|
);
|
|
})}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|