Merge version_1 into main #2
235
src/app/page.tsx
235
src/app/page.tsx
@@ -9,7 +9,7 @@ import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||
import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
||||
import { Award, Scissors, Zap } from "lucide-react";
|
||||
import { Award, Scissors, Zap, Sparkles } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -29,32 +29,14 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "home",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Gallery",
|
||||
id: "gallery",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Book",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "home" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Gallery", id: "gallery" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Book", id: "contact" },
|
||||
]}
|
||||
brandName="Fade House"
|
||||
button={{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
}}
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -64,74 +46,29 @@ export default function LandingPage() {
|
||||
description="Precision in Every Fade"
|
||||
testimonials={[
|
||||
{
|
||||
name: "Mark S.",
|
||||
handle: "@marks",
|
||||
testimonial: "The best fade in Basel, hands down.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work_627829-7325.jpg?_wi=1",
|
||||
imageAlt: "barbershop interior dark atmospheric",
|
||||
},
|
||||
name: "Mark S.", handle: "@marks", testimonial: "The best fade in Basel, hands down.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work_627829-7325.jpg", imageAlt: "barbershop interior dark atmospheric"},
|
||||
{
|
||||
name: "Luca R.",
|
||||
handle: "@lucar",
|
||||
testimonial: "Sharpest lines I've ever had.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-with-brunette-hair-bright-sweatshirt-posing-striped-wall_197531-24309.jpg?_wi=1",
|
||||
imageAlt: "clean skin fade hairstyle",
|
||||
},
|
||||
name: "Luca R.", handle: "@lucar", testimonial: "Sharpest lines I've ever had.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-with-brunette-hair-bright-sweatshirt-posing-striped-wall_197531-24309.jpg", imageAlt: "clean skin fade hairstyle"},
|
||||
{
|
||||
name: "Tim B.",
|
||||
handle: "@timb",
|
||||
testimonial: "Premium service, professional atmosphere.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-senior-man-getting-groomed_23-2149220521.jpg?_wi=1",
|
||||
imageAlt: "professional beard grooming trim",
|
||||
},
|
||||
name: "Tim B.", handle: "@timb", testimonial: "Premium service, professional atmosphere.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-senior-man-getting-groomed_23-2149220521.jpg", imageAlt: "professional beard grooming trim"},
|
||||
{
|
||||
name: "Jan K.",
|
||||
handle: "@jank",
|
||||
testimonial: "Clean, precise, exactly what I asked for.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-doing-his-job_23-2149220583.jpg?_wi=1",
|
||||
imageAlt: "barber styling hair product",
|
||||
},
|
||||
name: "Jan K.", handle: "@jank", testimonial: "Clean, precise, exactly what I asked for.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-doing-his-job_23-2149220583.jpg", imageAlt: "barber styling hair product"},
|
||||
{
|
||||
name: "Sam D.",
|
||||
handle: "@samd",
|
||||
testimonial: "Modern style for modern men.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-with-foam-his-face-holding-towel_23-2148213384.jpg?_wi=1",
|
||||
imageAlt: "premium hot towel shave",
|
||||
},
|
||||
name: "Sam D.", handle: "@samd", testimonial: "Modern style for modern men.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-with-foam-his-face-holding-towel_23-2148213384.jpg", imageAlt: "premium hot towel shave"},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work_627829-7325.jpg?_wi=2"
|
||||
buttons={[{ text: "Book Now", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work_627829-7325.jpg"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/back-view-man-getting-haircut_23-2148224420.jpg",
|
||||
alt: "Client 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-man-getting-his-hair-cut_23-2148256900.jpg",
|
||||
alt: "Client 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/bearded-man-look-into-cameta-talk-by-mobile-phone_343059-47.jpg",
|
||||
alt: "Client 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/old-man-with-thin-beard-sketch-blackboard_1379-311.jpg",
|
||||
alt: "Client 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/studio-portrait-fashionable-modern-male-grey-t-shirt_613910-532.jpg",
|
||||
alt: "Client 5",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/back-view-man-getting-haircut_23-2148224420.jpg", alt: "Client 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-man-getting-his-hair-cut_23-2148256900.jpg", alt: "Client 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/bearded-man-look-into-cameta-talk-by-mobile-phone_343059-47.jpg", alt: "Client 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/old-man-with-thin-beard-sketch-blackboard_1379-311.jpg", alt: "Client 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/studio-portrait-fashionable-modern-male-grey-t-shirt_613910-532.jpg", alt: "Client 5" },
|
||||
]}
|
||||
avatarText="Join 10,000+ satisfied clients"
|
||||
/>
|
||||
@@ -142,30 +79,10 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Fade Cuts",
|
||||
description: "Expert skin fades and tapered looks.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-with-brunette-hair-bright-sweatshirt-posing-striped-wall_197531-24309.jpg?_wi=2",
|
||||
buttonIcon: "Scissors",
|
||||
},
|
||||
{
|
||||
title: "Beard Trim",
|
||||
description: "Precision shaping and beard maintenance.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-senior-man-getting-groomed_23-2149220521.jpg?_wi=2",
|
||||
buttonIcon: "Zap",
|
||||
},
|
||||
{
|
||||
title: "Styling",
|
||||
description: "Modern cuts and professional product finishing.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-doing-his-job_23-2149220583.jpg?_wi=2",
|
||||
buttonIcon: "Sparkles",
|
||||
},
|
||||
{
|
||||
title: "Premium Grooming",
|
||||
description: "Full-service grooming experiences.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-with-foam-his-face-holding-towel_23-2148213384.jpg?_wi=2",
|
||||
buttonIcon: "Award",
|
||||
},
|
||||
{ title: "Fade Cuts", description: "Expert skin fades and tapered looks.", imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-with-brunette-hair-bright-sweatshirt-posing-striped-wall_197531-24309.jpg", buttonIcon: Scissors },
|
||||
{ title: "Beard Trim", description: "Precision shaping and beard maintenance.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-senior-man-getting-groomed_23-2149220521.jpg", buttonIcon: Zap },
|
||||
{ title: "Styling", description: "Modern cuts and professional product finishing.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-doing-his-job_23-2149220583.jpg", buttonIcon: Sparkles },
|
||||
{ title: "Premium Grooming", description: "Full-service grooming experiences.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-with-foam-his-face-holding-towel_23-2148213384.jpg", buttonIcon: Award },
|
||||
]}
|
||||
title="Our Services"
|
||||
description="Professional grooming for the modern individual."
|
||||
@@ -177,55 +94,14 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
animationType="slide-up"
|
||||
testimonials={[
|
||||
{
|
||||
id: "g1",
|
||||
name: "Style 01",
|
||||
role: "Classic Fade",
|
||||
company: "Fade House",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/back-view-man-getting-haircut_23-2148224420.jpg",
|
||||
},
|
||||
{
|
||||
id: "g2",
|
||||
name: "Style 02",
|
||||
role: "Taper Cut",
|
||||
company: "Fade House",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-getting-his-hair-cut_23-2148256900.jpg",
|
||||
},
|
||||
{
|
||||
id: "g3",
|
||||
name: "Style 03",
|
||||
role: "Textured",
|
||||
company: "Fade House",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/bearded-man-look-into-cameta-talk-by-mobile-phone_343059-47.jpg",
|
||||
},
|
||||
{
|
||||
id: "g4",
|
||||
name: "Style 04",
|
||||
role: "Classic",
|
||||
company: "Fade House",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/old-man-with-thin-beard-sketch-blackboard_1379-311.jpg",
|
||||
},
|
||||
{
|
||||
id: "g5",
|
||||
name: "Style 05",
|
||||
role: "Sharp Fade",
|
||||
company: "Fade House",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-fashionable-modern-male-grey-t-shirt_613910-532.jpg",
|
||||
},
|
||||
{
|
||||
id: "g6",
|
||||
name: "Style 06",
|
||||
role: "Modern Cut",
|
||||
company: "Fade House",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-barbershop-concept_23-2148506212.jpg",
|
||||
},
|
||||
{ id: "g1", name: "Style 01", role: "Classic Fade", company: "Fade House", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/back-view-man-getting-haircut_23-2148224420.jpg" },
|
||||
{ id: "g2", name: "Style 02", role: "Taper Cut", company: "Fade House", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-getting-his-hair-cut_23-2148256900.jpg" },
|
||||
{ id: "g3", name: "Style 03", role: "Textured", company: "Fade House", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/bearded-man-look-into-cameta-talk-by-mobile-phone_343059-47.jpg" },
|
||||
{ id: "g4", name: "Style 04", role: "Classic", company: "Fade House", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/old-man-with-thin-beard-sketch-blackboard_1379-311.jpg" },
|
||||
{ id: "g5", name: "Style 05", role: "Sharp Fade", company: "Fade House", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-fashionable-modern-male-grey-t-shirt_613910-532.jpg" },
|
||||
{ id: "g6", name: "Style 06", role: "Modern Cut", company: "Fade House", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-barbershop-concept_23-2148506212.jpg" },
|
||||
]}
|
||||
title="Our Work"
|
||||
description="Precision in every transition."
|
||||
@@ -237,21 +113,9 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
title="Our Philosophy"
|
||||
metrics={[
|
||||
{
|
||||
icon: Award,
|
||||
label: "Precision",
|
||||
value: "100%",
|
||||
},
|
||||
{
|
||||
icon: Scissors,
|
||||
label: "Styles",
|
||||
value: "50+",
|
||||
},
|
||||
{
|
||||
icon: Zap,
|
||||
label: "Clients",
|
||||
value: "10k+",
|
||||
},
|
||||
{ icon: Award, label: "Precision", value: "100%" },
|
||||
{ icon: Scissors, label: "Styles", value: "50+" },
|
||||
{ icon: Zap, label: "Clients", value: "10k+" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -260,33 +124,20 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
text="Book your premium grooming experience today. Reserve your spot at our Basel or Schaffhausen locations."
|
||||
buttons={[
|
||||
{
|
||||
text: "Reserve Your Spot",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Reserve Your Spot", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Fade House"
|
||||
leftLink={{
|
||||
text: "Basel / Schaffhausen",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Instagram",
|
||||
href: "https://instagram.com",
|
||||
}}
|
||||
leftLink={{ text: "Basel / Schaffhausen", href: "#" }}
|
||||
rightLink={{ text: "Instagram", href: "https://instagram.com" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user