230 lines
11 KiB
TypeScript
230 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import AboutMetric from '@/components/sections/about/AboutMetric';
|
|
import BlogCardTwo from '@/components/sections/blog/BlogCardTwo';
|
|
import ContactText from '@/components/sections/contact/ContactText';
|
|
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
|
import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
|
|
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
|
import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
|
import { Award, Scissors, Smile } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="bounce-effect"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="rounded"
|
|
contentWidth="medium"
|
|
sizing="medium"
|
|
background="noiseDiagonalGradient"
|
|
cardStyle="subtle-shadow"
|
|
primaryButtonStyle="shadow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{
|
|
name: "Startseite", id: "hero"},
|
|
{
|
|
name: "Über uns", id: "about"},
|
|
{
|
|
name: "Leistungen", id: "services"},
|
|
{
|
|
name: "Kontakt", id: "contact"},
|
|
]}
|
|
brandName="Shadi Style"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroOverlayTestimonial
|
|
title="Präzision & Stil: Ihr Barbershop in Lotte"
|
|
description="Erleben Sie bei Shadi Style Barbershop klassische Handwerkskunst und modernes Grooming in entspannter Atmosphäre. Bahnhofstraße 2, Lotte."
|
|
testimonials={[
|
|
{
|
|
name: "Markus K.", handle: "@kunde", testimonial: "Bester Barber in Lotte! Schnelle Arbeit, top Schnitt.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205920.jpg?_wi=1", imageAlt: "luxurious barbershop dark interior"},
|
|
{
|
|
name: "Jens B.", handle: "@kunde", testimonial: "Absolute Präzision, tolle Atmosphäre.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/set-razors-table_23-2147736987.jpg", imageAlt: "luxurious barbershop dark interior"},
|
|
{
|
|
name: "Ali H.", handle: "@kunde", testimonial: "Sauberer Service, komme wieder.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/front-view-barbershop-concept_23-2148506188.jpg?_wi=1", imageAlt: "luxurious barbershop dark interior"},
|
|
{
|
|
name: "Timo M.", handle: "@kunde", testimonial: "Top Adresse für Herrenfrisuren.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/different-razors-table_23-2147736988.jpg?_wi=1", imageAlt: "luxurious barbershop dark interior"},
|
|
{
|
|
name: "Dirk S.", handle: "@kunde", testimonial: "Handwerklich absolute Spitzenklasse.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work-washing-head_627829-7234.jpg", imageAlt: "luxurious barbershop dark interior"},
|
|
]}
|
|
buttons={[
|
|
{
|
|
text: "Termin vereinbaren", href: "#contact"},
|
|
{
|
|
text: "Visit Us", href: "https://maps.google.com/?q=Bahnhofstraße+2,+49504+Lotte"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205920.jpg?_wi=2"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work-washing-head_627829-7378.jpg", alt: "Happy Customer 1"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/medium-shot-hairdresser-washing-man-s-hair_23-2150665396.jpg", alt: "Happy Customer 2"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/professional-barber-working-with-client-hairdressing-salon-styling-beard-with-trimmer_613910-5073.jpg", alt: "Happy Customer 3"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/man-getting-his-hair-cut-barber-shop4_23-2149186458.jpg", alt: "Happy Customer 4"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/happy-young-man-posing-isolated-grey_171337-10592.jpg", alt: "Happy Customer 5"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<AboutMetric
|
|
useInvertedBackground={false}
|
|
title="Über Shadi Style Barbershop"
|
|
metrics={[
|
|
{
|
|
label: "Qualität", value: "100%", icon: Award,
|
|
},
|
|
{
|
|
label: "Erfahrung", value: "Jahrelang", icon: Scissors,
|
|
},
|
|
{
|
|
label: "Kundenzufriedenheit", value: "Exzellent", icon: Smile,
|
|
},
|
|
]}
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureCardSix
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "Herrenhaarschnitt", description: "Moderner oder klassischer Schnitt, auf Ihren Style abgestimmt.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-barbershop-concept_23-2148506188.jpg?_wi=2"},
|
|
{
|
|
title: "Bartpflege", description: "Präzises Trimmen und Konturpflege für den perfekten Bart.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-holding-hair-dryer_23-2149220573.jpg"},
|
|
{
|
|
title: "Konturen & Styling", description: "Sauberer Abschluss und professionelles Styling.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-shaving-with-black-trimmer_23-2148213367.jpg"},
|
|
]}
|
|
title="Unsere Leistungen"
|
|
description="Von klassischem Haarschnitt bis zum perfekten Bart-Styling: Wir bieten erstklassigen Service für den modernen Mann in Lotte."
|
|
/>
|
|
</div>
|
|
|
|
<div id="vorteile" data-section="vorteile">
|
|
<FaqDouble
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "1", title: "Zentral in Lotte", content: "Wir sind direkt an der Bahnhofstraße 2 für Sie da."},
|
|
{
|
|
id: "2", title: "Saubere Atmosphäre", content: "Hygiene und Entspannung stehen bei uns an erster Stelle."},
|
|
{
|
|
id: "3", title: "Freundlicher Service", content: "Wir nehmen uns Zeit für jeden Kunden."},
|
|
]}
|
|
title="Warum Shadi Style?"
|
|
description="Erfahren Sie, warum wir die erste Adresse für Barber in Lotte sind."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="gallery" data-section="gallery">
|
|
<BlogCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
title="Unsere Arbeiten"
|
|
description="Ein kleiner Einblick in unsere handwerkliche Präzision."
|
|
blogs={[
|
|
{
|
|
id: "1", title: "Fresh Fade", category: "Styling", excerpt: "Klassischer Fade Cut für den täglichen Style.", imageSrc: "http://img.b2bpic.net/free-photo/different-razors-table_23-2147736988.jpg?_wi=2", authorName: "Shadi", authorAvatar: "http://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work-washing-head_627829-7234.jpg", date: "2024"},
|
|
{
|
|
id: "2", title: "Bart Konturen", category: "Pflege", excerpt: "Präzise Bart-Pflege für jeden Typ.", imageSrc: "http://img.b2bpic.net/free-photo/barber-shop-retro-vintage-style_1150-17931.jpg", authorName: "Shadi", authorAvatar: "http://img.b2bpic.net/free-photo/neon-portrait-young-attractive-man_158595-5145.jpg", date: "2024"},
|
|
{
|
|
id: "3", title: "Modern Haircut", category: "Haarschnitt", excerpt: "Der moderne Look für moderne Männer.", imageSrc: "http://img.b2bpic.net/free-photo/luxury-armchairs-barber-shop_140725-7720.jpg", authorName: "Shadi", authorAvatar: "http://img.b2bpic.net/free-photo/young-woman-doing-okay_1187-4049.jpg", date: "2024"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardThirteen
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Markus", handle: "@Lotte", testimonial: "Absolut empfehlenswert!", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-hair-salon_23-2150665449.jpg"},
|
|
{
|
|
id: "2", name: "Jens", handle: "@Lotte", testimonial: "Top Barber!", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-positive-blond-bearded-male-dressed-red-fleece-shirt-makes-conversation_613910-13394.jpg"},
|
|
{
|
|
id: "3", name: "Timo", handle: "@Lotte", testimonial: "Super Beratung.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/happy-man-with-thumbs-up_1187-3144.jpg"},
|
|
{
|
|
id: "4", name: "Ali", handle: "@Lotte", testimonial: "Immer wieder gerne.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/senior-man-consulting-beard-trimming-salon_23-2148181867.jpg"},
|
|
{
|
|
id: "5", name: "Dirk", handle: "@Lotte", testimonial: "Bester in der Gegend.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/attractive-man-getting-ready_1153-1518.jpg"},
|
|
]}
|
|
showRating={true}
|
|
title="Was unsere Kunden sagen"
|
|
description="Erfahren Sie, warum Kunden in Lotte auf Shadi Style vertrauen."
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactText
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "gradient-bars"}}
|
|
text="Besuchen Sie uns in der Bahnhofstraße 2, 49504 Lotte. Telefon: 05404 9598100. Wir freuen uns auf Ihren Besuch!"
|
|
buttons={[
|
|
{
|
|
text: "Jetzt anrufen", href: "tel:054049598100"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoEmphasis
|
|
columns={[
|
|
{
|
|
items: [
|
|
{
|
|
label: "Kontakt", href: "tel:054049598100"},
|
|
{
|
|
label: "Impressum", href: "#"},
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{
|
|
label: "Adresse", href: "#"},
|
|
{
|
|
label: "Öffnungszeiten", href: "#"},
|
|
],
|
|
},
|
|
]}
|
|
logoText="Shadi Style Barbershop"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|