Merge version_1 into main #2
327
src/app/page.tsx
327
src/app/page.tsx
@@ -16,242 +16,113 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "#hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "#pricing",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="Salon Alim"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "#hero" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Services", id: "#pricing" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="Salon Alim"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Precision Cuts. Timeless Style."
|
||||
description="At Salon Alim, we bring out the best in you with classic grooming techniques and contemporary precision. Your journey to a perfect cut starts here."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/professional-barber-working-with-client-hairdressing-salon-styling-beard-with-trimmer_613910-18295.jpg?_wi=1"
|
||||
imageAlt="Barber shop interior"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Precision Cuts. Timeless Style."
|
||||
description="At Salon Alim, we bring out the best in you with classic grooming techniques and contemporary precision. Your journey to a perfect cut starts here."
|
||||
buttons={[{ text: "Book Appointment", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/professional-barber-working-with-client-hairdressing-salon-styling-beard-with-trimmer_613910-18295.jpg"
|
||||
imageAlt="Barber shop interior"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Our Craft"
|
||||
description="Salon Alim isn't just a shop; it's a sanctuary for men who appreciate refined grooming. With years of experience and a passion for the craft, our barbers provide more than just a haircut—we provide an experience that leaves you confident and looking your best."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/barber-giving-high-five-client_23-2147737095.jpg?_wi=1"
|
||||
imageAlt="Barber performing service"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Our Craft"
|
||||
description="Salon Alim isn't just a shop; it's a sanctuary for men who appreciate refined grooming. With years of experience and a passion for the craft, our barbers provide more than just a haircut—we provide an experience that leaves you confident and looking your best."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/barber-giving-high-five-client_23-2147737095.jpg"
|
||||
imageAlt="Barber performing service"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Classic Cut",
|
||||
price: "$35",
|
||||
period: "Session",
|
||||
features: [
|
||||
"Consultation",
|
||||
"Precision Cut",
|
||||
"Hot Towel Finish",
|
||||
],
|
||||
button: {
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-barber-working-with-client-hairdressing-salon-styling-beard-with-trimmer_613910-18295.jpg?_wi=2",
|
||||
imageAlt: "barber shop interior wooden furniture",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Signature Groom",
|
||||
price: "$50",
|
||||
period: "Session",
|
||||
features: [
|
||||
"Classic Cut",
|
||||
"Beard Trim & Lineup",
|
||||
"Facial Treatment",
|
||||
],
|
||||
button: {
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-giving-high-five-client_23-2147737095.jpg?_wi=2",
|
||||
imageAlt: "professional barber cutting hair",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "The Full Alim",
|
||||
price: "$75",
|
||||
period: "Session",
|
||||
features: [
|
||||
"Signature Groom",
|
||||
"Hair Wash",
|
||||
"Scalp Massage",
|
||||
"Style Advice",
|
||||
],
|
||||
button: {
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-talking-with-elderly-client-hair-salon_23-2148182014.jpg?_wi=1",
|
||||
imageAlt: "man smiling portrait studio",
|
||||
},
|
||||
]}
|
||||
title="Services & Pricing"
|
||||
description="Select from our curated list of grooming services designed for the modern man."
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "1", title: "Classic Cut", price: "$35", period: "Session", features: ["Consultation", "Precision Cut", "Hot Towel Finish"],
|
||||
button: { text: "Book Now", href: "#contact" },
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-barber-working-with-client-hairdressing-salon-styling-beard-with-trimmer_613910-18295.jpg", imageAlt: "barber shop interior wooden furniture"},
|
||||
{
|
||||
id: "2", title: "Signature Groom", price: "$50", period: "Session", features: ["Classic Cut", "Beard Trim & Lineup", "Facial Treatment"],
|
||||
button: { text: "Book Now", href: "#contact" },
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-giving-high-five-client_23-2147737095.jpg", imageAlt: "professional barber cutting hair"},
|
||||
{
|
||||
id: "3", title: "The Full Alim", price: "$75", period: "Session", features: ["Signature Groom", "Hair Wash", "Scalp Massage", "Style Advice"],
|
||||
button: { text: "Book Now", href: "#contact" },
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-talking-with-elderly-client-hair-salon_23-2148182014.jpg", imageAlt: "man smiling portrait studio"},
|
||||
]}
|
||||
title="Services & Pricing"
|
||||
description="Select from our curated list of grooming services designed for the modern man."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alex R.",
|
||||
handle: "@alexr",
|
||||
testimonial: "Best fade I've ever had. Salon Alim is the place to be.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-talking-with-elderly-client-hair-salon_23-2148182014.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Jordan P.",
|
||||
handle: "@jordanp",
|
||||
testimonial: "Incredible attention to detail. The hot towel service is top-notch.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-sad-boy-portrait_23-2149607252.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Marcus W.",
|
||||
handle: "@marcusw",
|
||||
testimonial: "I always leave feeling like a new man. Highly recommend.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/reflection-male-client-grooming-his-beard-mirror_23-2147839835.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Sam T.",
|
||||
handle: "@samt",
|
||||
testimonial: "Friendly staff, relaxed atmosphere, and excellent cuts every single time.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-bearded-hair-stylist-conversing-with-elderly-client-salon_23-2148182002.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "David L.",
|
||||
handle: "@dlbarber",
|
||||
testimonial: "Exceptional service. Salon Alim sets the standard for quality.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-talking-with-elderly-client-hair-salon_23-2148182014.jpg?_wi=3",
|
||||
},
|
||||
]}
|
||||
showRating={true}
|
||||
title="Client Stories"
|
||||
description="Hear from our loyal clients about their experience at Salon Alim."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
showRating={true}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Alex R.", handle: "@alexr", testimonial: "Best fade I've ever had. Salon Alim is the place to be.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/barber-talking-with-elderly-client-hair-salon_23-2148182014.jpg" },
|
||||
{ id: "2", name: "Jordan P.", handle: "@jordanp", testimonial: "Incredible attention to detail. The hot towel service is top-notch.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-sad-boy-portrait_23-2149607252.jpg" },
|
||||
{ id: "3", name: "Marcus W.", handle: "@marcusw", testimonial: "I always leave feeling like a new man. Highly recommend.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/reflection-male-client-grooming-his-beard-mirror_23-2147839835.jpg" },
|
||||
{ id: "4", name: "Sam T.", handle: "@samt", testimonial: "Friendly staff, relaxed atmosphere, and excellent cuts every single time.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-bearded-hair-stylist-conversing-with-elderly-client-salon_23-2148182002.jpg" },
|
||||
{ id: "5", name: "David L.", handle: "@dlbarber", testimonial: "Exceptional service. Salon Alim sets the standard for quality.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/barber-talking-with-elderly-client-hair-salon_23-2148182014.jpg" },
|
||||
]}
|
||||
title="Client Stories"
|
||||
description="Hear from our loyal clients about their experience at Salon Alim."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Visit Us"
|
||||
title="Book Your Seat"
|
||||
description="Ready for a transformation? Secure your spot today."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/chairs-green-male-barbershop-retro-style_627829-8284.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
buttonText="Request Booking"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Visit Us"
|
||||
title="Book Your Seat"
|
||||
description="Ready for a transformation? Secure your spot today."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/chairs-green-male-barbershop-retro-style_627829-8284.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
buttonText="Request Booking"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
columns={[
|
||||
{
|
||||
title: "Salon Alim",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#pricing",
|
||||
},
|
||||
{
|
||||
label: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Social",
|
||||
items: [
|
||||
{
|
||||
label: "Instagram",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Facebook",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2024 Salon Alim. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
columns={[
|
||||
{ title: "Salon Alim", items: [{ label: "About Us", href: "#about" }, { label: "Services", href: "#pricing" }, { label: "Book Now", href: "#contact" }] },
|
||||
{ title: "Social", items: [{ label: "Instagram", href: "#" }, { label: "Facebook", href: "#" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
|
||||
]}
|
||||
copyrightText="© 2024 Salon Alim. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user