329 lines
10 KiB
TypeScript
329 lines
10 KiB
TypeScript
"use client";
|
||
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import ReactLenis from "lenis/react";
|
||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
|
||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
|
||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||
import { Wrench } from "lucide-react";
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="hover-magnetic"
|
||
defaultTextAnimation="entrance-slide"
|
||
borderRadius="rounded"
|
||
>
|
||
<ReactLenis root>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarStyleFullscreen
|
||
navItems={[
|
||
{
|
||
name: "Leistungen",
|
||
id: "#services",
|
||
},
|
||
{
|
||
name: "Über uns",
|
||
id: "#about",
|
||
},
|
||
{
|
||
name: "Bewertungen",
|
||
id: "#testimonials",
|
||
},
|
||
{
|
||
name: "Kontakt",
|
||
id: "#contact",
|
||
},
|
||
]}
|
||
brandName="KFZ Kremer"
|
||
/>
|
||
</div>
|
||
|
||
<div id="hero" data-section="hero">
|
||
<HeroSplitKpi
|
||
background={{
|
||
variant: "plain",
|
||
}}
|
||
title="Ihr Vertrauenswürdiger KFZ-Meisterbetrieb"
|
||
description="Über 20 Jahre Erfahrung für Ihr Fahrzeug. Wir sorgen für Sicherheit auf der Straße."
|
||
kpis={[
|
||
{
|
||
value: "5,0/5,0",
|
||
label: "Bewertungen",
|
||
},
|
||
{
|
||
value: "Schnell",
|
||
label: "Termine",
|
||
},
|
||
{
|
||
value: "Meister",
|
||
label: "Betrieb",
|
||
},
|
||
]}
|
||
enableKpiAnimation={true}
|
||
buttons={[
|
||
{
|
||
text: "Termin anfragen",
|
||
href: "#contact",
|
||
},
|
||
{
|
||
text: "Leistungen",
|
||
href: "#services",
|
||
},
|
||
]}
|
||
imageSrc="http://img.b2bpic.net/free-photo/construction-hammers-still-life_23-2150563134.jpg?_wi=1"
|
||
mediaAnimation="slide-up"
|
||
avatars={[
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/top-view-metal-keys_23-2148796580.jpg",
|
||
alt: "precision tool set",
|
||
},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/tools-repairing-shop_23-2148138424.jpg",
|
||
alt: "repair shop tools",
|
||
},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/vintage-objects-arrangement-still-life_23-2150348577.jpg",
|
||
alt: "vintage workshop gear",
|
||
},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/construction-hammers-still-life_23-2150563136.jpg",
|
||
alt: "construction hammers",
|
||
},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/red-head-bearded-bicycle-mechanic-holds-screwdriver-bike-tools-stand-workshop_613910-14341.jpg",
|
||
alt: "bike repair station",
|
||
},
|
||
]}
|
||
avatarText="Über 500+ zufriedene Stammkunden"
|
||
marqueeItems={[
|
||
{
|
||
type: "text",
|
||
text: "Meisterbetrieb",
|
||
},
|
||
{
|
||
type: "text",
|
||
text: "Alle Marken",
|
||
},
|
||
{
|
||
type: "text",
|
||
text: "Faire Preise",
|
||
},
|
||
{
|
||
type: "text",
|
||
text: "Schneller Service",
|
||
},
|
||
{
|
||
type: "text",
|
||
text: "TÜV vor Ort",
|
||
},
|
||
]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="services" data-section="services">
|
||
<FeatureCardTen
|
||
animationType="slide-up"
|
||
textboxLayout="split"
|
||
useInvertedBackground={false}
|
||
features={[
|
||
{
|
||
title: "Inspektion & Wartung",
|
||
description: "Wartung nach Herstellervorgaben für alle Marken.",
|
||
items: [],
|
||
reverse: false,
|
||
media: {
|
||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-construction-hammers-still-life_23-2150563143.jpg",
|
||
imageAlt: "Inspection service",
|
||
},
|
||
imageSrc: "http://img.b2bpic.net/free-photo/construction-hammers-still-life_23-2150563134.jpg?_wi=2",
|
||
imageAlt: "industrial workshop tools dark aesthetic",
|
||
},
|
||
{
|
||
title: "TÜV / HU & AU",
|
||
description: "Vorbereitung und Abnahme direkt vor Ort.",
|
||
items: [],
|
||
reverse: true,
|
||
media: {
|
||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-arrangement-with-tools_23-2148932612.jpg",
|
||
imageAlt: "TÜV inspection",
|
||
},
|
||
imageSrc: "http://img.b2bpic.net/free-photo/mechanic-repairing-bicycle_23-2148138530.jpg?_wi=1",
|
||
imageAlt: "industrial workshop tools dark aesthetic",
|
||
},
|
||
{
|
||
title: "Reparaturen",
|
||
description: "Bremsen, Auspuff, Kupplung, Motor – alt und neu.",
|
||
items: [],
|
||
reverse: false,
|
||
media: {
|
||
imageSrc: "http://img.b2bpic.net/free-photo/tools-tool-tray-repairing-cars_1150-18951.jpg",
|
||
imageAlt: "General repair",
|
||
},
|
||
imageSrc: "http://img.b2bpic.net/free-photo/client-vehicle-distributor-checkup_482257-115279.jpg?_wi=1",
|
||
imageAlt: "industrial workshop tools dark aesthetic",
|
||
},
|
||
]}
|
||
title="Unsere Leistungen"
|
||
description="Umfassender Service für alle Automarken."
|
||
/>
|
||
</div>
|
||
|
||
<div id="about" data-section="about">
|
||
<TestimonialAboutCard
|
||
useInvertedBackground={true}
|
||
tag="Über uns"
|
||
title="Meisterhafte Erfahrung"
|
||
description="Seit über 20 Jahren setzen wir auf Qualität und Zuverlässigkeit. Wir beraten Sie persönlich und individuell."
|
||
subdescription="Wir stehen für Kompetenz – auch bei Oldtimern und seltenen Fahrzeugen."
|
||
imageSrc="http://img.b2bpic.net/free-photo/mechanic-repairing-bicycle_23-2148138530.jpg?_wi=2"
|
||
mediaAnimation="slide-up"
|
||
icon={Wrench}
|
||
/>
|
||
</div>
|
||
|
||
<div id="testimonials" data-section="testimonials">
|
||
<TestimonialCardTwo
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
testimonials={[
|
||
{
|
||
id: "1",
|
||
name: "Gast",
|
||
role: "Kunde",
|
||
testimonial: "Gute Leistung bei gutem Preis. Zuverlässig und freundlich.",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/client-vehicle-distributor-checkup_482257-115279.jpg?_wi=2",
|
||
},
|
||
{
|
||
id: "2",
|
||
name: "Gast",
|
||
role: "Kunde",
|
||
testimonial: "Schnell, sehr gute Qualität, kostengünstig.",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/happy-couple-shaking-hands-with-car-mechanic-while-greeting-repair-shop_637285-7726.jpg",
|
||
},
|
||
{
|
||
id: "3",
|
||
name: "Gast",
|
||
role: "Kunde",
|
||
testimonial: "Einfach sehr gut und absolut zufrieden.",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-customer-with-business-person-car-dealership_23-2149117151.jpg",
|
||
},
|
||
{
|
||
id: "4",
|
||
name: "Gast",
|
||
role: "Kunde",
|
||
testimonial: "Bin seit Jahren Kundin und war bis jetzt immer sehr zufrieden.",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/satisfied-couple-signing-documents-while-talking-their-mechanic-auto-repair-shop_637285-7722.jpg",
|
||
},
|
||
{
|
||
id: "5",
|
||
name: "Gast",
|
||
role: "Kunde",
|
||
testimonial: "Dieser Mann versteht wirklich was von Autos. Immer zuverlässig.",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-blonde-woman-looking-away_23-2148384924.jpg",
|
||
},
|
||
]}
|
||
title="Was Kunden sagen"
|
||
description="5,0 von 5 Sternen – wir schätzen das Vertrauen unserer Kunden."
|
||
/>
|
||
</div>
|
||
|
||
<div id="faq" data-section="faq">
|
||
<FaqSplitText
|
||
useInvertedBackground={true}
|
||
faqs={[
|
||
{
|
||
id: "1",
|
||
title: "Bieten Sie auch Notfallhilfe an?",
|
||
content: "Ja, wir bieten schnelle Hilfe in Notfällen und bei dringenden Terminsachen.",
|
||
},
|
||
{
|
||
id: "2",
|
||
title: "Reparieren Sie auch Oldtimer?",
|
||
content: "Wir verfügen über fachliche Kompetenz auch bei älteren Fahrzeugen.",
|
||
},
|
||
{
|
||
id: "3",
|
||
title: "Wie vereinbare ich einen Termin?",
|
||
content: "Sie können uns einfach anrufen oder per WhatsApp eine Nachricht schreiben.",
|
||
},
|
||
]}
|
||
sideTitle="Häufige Fragen"
|
||
faqsAnimation="slide-up"
|
||
/>
|
||
</div>
|
||
|
||
<div id="contact" data-section="contact">
|
||
<ContactSplit
|
||
useInvertedBackground={false}
|
||
background={{
|
||
variant: "plain",
|
||
}}
|
||
title="Jetzt Termin anfragen"
|
||
description="Haben Sie ein Anliegen? Schreiben Sie uns oder rufen Sie direkt an."
|
||
imageSrc="http://img.b2bpic.net/free-photo/car-mechanic-choosing-spanners_23-2147897824.jpg"
|
||
buttonText="Anfrage senden"
|
||
tag="Kontakt"
|
||
mediaAnimation="slide-up"
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterMedia
|
||
imageSrc="http://img.b2bpic.net/free-photo/dark-metal-texture_1048-4658.jpg"
|
||
logoText="KFZ Kremer"
|
||
columns={[
|
||
{
|
||
title: "Service",
|
||
items: [
|
||
{
|
||
label: "Leistungen",
|
||
href: "#services",
|
||
},
|
||
{
|
||
label: "Über uns",
|
||
href: "#about",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
title: "Kontakt",
|
||
items: [
|
||
{
|
||
label: "Anrufen",
|
||
href: "tel:+49123456789",
|
||
},
|
||
{
|
||
label: "WhatsApp",
|
||
href: "https://wa.me/4912345678900",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
title: "Rechtliches",
|
||
items: [
|
||
{
|
||
label: "Impressum",
|
||
href: "#",
|
||
},
|
||
{
|
||
label: "Datenschutz",
|
||
href: "#",
|
||
},
|
||
],
|
||
},
|
||
]}
|
||
copyrightText="© 2026 KFZ Kremer"
|
||
/>
|
||
</div>
|
||
</ReactLenis>
|
||
</ThemeProvider>
|
||
);
|
||
}
|