Merge version_1 into main #2
387
src/app/page.tsx
387
src/app/page.tsx
@@ -26,293 +26,118 @@ export default function LandingPage() {
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "home",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Depilex Model Town"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "home" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Depilex Model Town"
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="home" data-section="home">
|
||||
<HeroSplitKpi
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
title="Unveiling Your Natural Radiance"
|
||||
description="Experience premium beauty and grooming services at Depilex Beauty Clinic and Men Salon, Model Town Lahore."
|
||||
kpis={[
|
||||
{
|
||||
value: "30+",
|
||||
label: "Years Experience",
|
||||
},
|
||||
{
|
||||
value: "10k+",
|
||||
label: "Happy Clients",
|
||||
},
|
||||
{
|
||||
value: "5.0",
|
||||
label: "Client Rating",
|
||||
},
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/woman-getting-her-hair-done-beauty-salon_23-2149167391.jpg?_wi=1"
|
||||
imageAlt="Depilex Salon Interior"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-woman-relaxing-spa-salon_176420-7534.jpg",
|
||||
alt: "Client 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149229815.jpg",
|
||||
alt: "Client 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/female-wedding-planner-working-with-client_23-2150167196.jpg",
|
||||
alt: "Client 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149229812.jpg",
|
||||
alt: "Client 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-holding-mirror_23-2149313549.jpg",
|
||||
alt: "Client 5",
|
||||
},
|
||||
]}
|
||||
avatarText="Join 10k+ satisfied clients"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Premium Salon Services",
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Expert Stylists",
|
||||
icon: Scissors,
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Model Town, Lahore",
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Certified Treatments",
|
||||
icon: ShieldCheck,
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Luxury Experience",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="home" data-section="home">
|
||||
<HeroSplitKpi
|
||||
background={{ variant: "plain" }}
|
||||
title="Unveiling Your Natural Radiance"
|
||||
description="Experience premium beauty and grooming services at Depilex Beauty Clinic and Men Salon, Model Town Lahore."
|
||||
kpis={[
|
||||
{ value: "30+", label: "Years Experience" },
|
||||
{ value: "10k+", label: "Happy Clients" },
|
||||
{ value: "5.0", label: "Client Rating" }
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[{ text: "Book Appointment", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/woman-getting-her-hair-done-beauty-salon_23-2149167391.jpg"
|
||||
imageAlt="Depilex Salon Interior"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-woman-relaxing-spa-salon_176420-7534.jpg", alt: "Client 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149229815.jpg", alt: "Client 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/female-wedding-planner-working-with-client_23-2150167196.jpg", alt: "Client 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149229812.jpg", alt: "Client 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-holding-mirror_23-2149313549.jpg", alt: "Client 5" },
|
||||
]}
|
||||
avatarText="Join 10k+ satisfied clients"
|
||||
marqueeItems={[
|
||||
{ type: "text", text: "Premium Salon Services" },
|
||||
{ type: "text-icon", text: "Expert Stylists", icon: Scissors },
|
||||
{ type: "text", text: "Model Town, Lahore" },
|
||||
{ type: "text-icon", text: "Certified Treatments", icon: ShieldCheck },
|
||||
{ type: "text", text: "Luxury Experience" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Excellence in Beauty"
|
||||
metrics={[
|
||||
{
|
||||
icon: Award,
|
||||
label: "Global Standards",
|
||||
value: "Premium",
|
||||
},
|
||||
{
|
||||
icon: Sparkles,
|
||||
label: "Modern Trends",
|
||||
value: "Expert",
|
||||
},
|
||||
{
|
||||
icon: Users,
|
||||
label: "Trained Staff",
|
||||
value: "Certified",
|
||||
},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
title="Excellence in Beauty"
|
||||
metrics={[
|
||||
{ icon: Award, label: "Global Standards", value: "Premium" },
|
||||
{ icon: Sparkles, label: "Modern Trends", value: "Expert" },
|
||||
{ icon: Users, label: "Trained Staff", value: "Certified" }
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyOne
|
||||
useInvertedBackground={false}
|
||||
title="Our Signature Services"
|
||||
description="Comprehensive beauty and grooming treatments tailored to your unique style and needs."
|
||||
accordionItems={[
|
||||
{
|
||||
id: "hair",
|
||||
title: "Advanced Hair Services",
|
||||
content: "Professional cuts, coloring, styling, and treatments for both men and women using premium products.",
|
||||
},
|
||||
{
|
||||
id: "skin",
|
||||
title: "Skincare & Facials",
|
||||
content: "Rejuvenating facials, skincare consultations, and aesthetic treatments for healthy, glowing skin.",
|
||||
},
|
||||
{
|
||||
id: "men",
|
||||
title: "Men's Grooming",
|
||||
content: "Sophisticated grooming services including precise haircuts, beard styling, and skincare treatments in our dedicated men salon.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-details-hairdresser-salon_23-2149205857.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyOne
|
||||
title="Our Signature Services"
|
||||
description="Comprehensive beauty and grooming treatments tailored to your unique style and needs."
|
||||
accordionItems={[
|
||||
{ id: "hair", title: "Advanced Hair Services", content: "Professional cuts, coloring, styling, and treatments for both men and women using premium products." },
|
||||
{ id: "skin", title: "Skincare & Facials", content: "Rejuvenating facials, skincare consultations, and aesthetic treatments for healthy, glowing skin." },
|
||||
{ id: "men", title: "Men's Grooming", content: "Sophisticated grooming services including precise haircuts, beard styling, and skincare treatments in our dedicated men salon." }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-details-hairdresser-salon_23-2149205857.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Khan",
|
||||
date: "Jan 2025",
|
||||
title: "Excellent Service",
|
||||
quote: "The best beauty clinic in Model Town. Professional staff and wonderful environment.",
|
||||
tag: "Hair Care",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/young-woman-relaxing-spa-salon_176420-7534.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-her-hair-done-beauty-salon_23-2149167391.jpg?_wi=2",
|
||||
imageAlt: "elegant beauty clinic luxury interior",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Ali Raza",
|
||||
date: "Dec 2024",
|
||||
title: "Top Notch Grooming",
|
||||
quote: "Depilex Men Salon is unmatched in Lahore. Highly recommended.",
|
||||
tag: "Men Salon",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149229815.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-relaxing-spa-salon_176420-7559.jpg?_wi=1",
|
||||
imageAlt: "professional salon service spa",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Fatima Noor",
|
||||
date: "Dec 2024",
|
||||
title: "Glowing Results",
|
||||
quote: "Amazing facial treatments, I feel refreshed every time I visit.",
|
||||
tag: "Skincare",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/female-wedding-planner-working-with-client_23-2150167196.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-details-hairdresser-salon_23-2149205857.jpg?_wi=2",
|
||||
imageAlt: "hair styling professional treatment",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Zain Malik",
|
||||
date: "Nov 2024",
|
||||
title: "Professional Salon",
|
||||
quote: "Great environment and highly trained stylists. Very satisfied.",
|
||||
tag: "Hair Care",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149229812.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-cosmetology-studio-procedures_1157-34011.jpg",
|
||||
imageAlt: "skincare treatment luxury facial",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Hina Ahmed",
|
||||
date: "Nov 2024",
|
||||
title: "Relaxing Experience",
|
||||
quote: "Truly a premium salon experience in the heart of Model Town.",
|
||||
tag: "Spa Treatment",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-holding-mirror_23-2149313549.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149141753.jpg",
|
||||
imageAlt: "men grooming luxury salon",
|
||||
},
|
||||
]}
|
||||
title="Client Experiences"
|
||||
description="What our clients in Lahore say about their experience at Depilex."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
title="Client Experiences"
|
||||
description="What our clients in Lahore say about their experience at Depilex."
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah Khan", date: "Jan 2025", title: "Excellent Service", quote: "The best beauty clinic in Model Town. Professional staff and wonderful environment.", tag: "Hair Care", avatarSrc: "http://img.b2bpic.net/free-photo/young-woman-relaxing-spa-salon_176420-7534.jpg", imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-her-hair-done-beauty-salon_23-2149167391.jpg" },
|
||||
{ id: "2", name: "Ali Raza", date: "Dec 2024", title: "Top Notch Grooming", quote: "Depilex Men Salon is unmatched in Lahore. Highly recommended.", tag: "Men Salon", avatarSrc: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149229815.jpg", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-relaxing-spa-salon_176420-7559.jpg" },
|
||||
{ id: "3", name: "Fatima Noor", date: "Dec 2024", title: "Glowing Results", quote: "Amazing facial treatments, I feel refreshed every time I visit.", tag: "Skincare", avatarSrc: "http://img.b2bpic.net/free-photo/female-wedding-planner-working-with-client_23-2150167196.jpg", imageSrc: "http://img.b2bpic.net/free-photo/close-up-details-hairdresser-salon_23-2149205857.jpg" },
|
||||
{ id: "4", name: "Zain Malik", date: "Nov 2024", title: "Professional Salon", quote: "Great environment and highly trained stylists. Very satisfied.", tag: "Hair Care", avatarSrc: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149229812.jpg", imageSrc: "http://img.b2bpic.net/free-photo/woman-cosmetology-studio-procedures_1157-34011.jpg" },
|
||||
{ id: "5", name: "Hina Ahmed", date: "Nov 2024", title: "Relaxing Experience", quote: "Truly a premium salon experience in the heart of Model Town.", tag: "Spa Treatment", avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-holding-mirror_23-2149313549.jpg", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149141753.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
text="Ready to visit Depilex Model Town? Book your appointment today and transform your style."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us",
|
||||
href: "tel:+92420000000",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
text="Ready to visit Depilex Model Town? Book your appointment today and transform your style."
|
||||
background={{ variant: "gradient-bars" }}
|
||||
useInvertedBackground={false}
|
||||
buttons={[{ text: "Contact Us", href: "tel:+92420000000" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/young-woman-relaxing-spa-salon_176420-7559.jpg?_wi=2"
|
||||
logoText="Depilex Beauty Clinic"
|
||||
columns={[
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
{
|
||||
label: "Hair Care",
|
||||
href: "#features",
|
||||
},
|
||||
{
|
||||
label: "Skin Care",
|
||||
href: "#features",
|
||||
},
|
||||
{
|
||||
label: "Men Grooming",
|
||||
href: "#features",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Location",
|
||||
items: [
|
||||
{
|
||||
label: "Model Town, Lahore",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
{
|
||||
label: "Call Us",
|
||||
href: "tel:+92420000000",
|
||||
},
|
||||
{
|
||||
label: "Email",
|
||||
href: "mailto:info@depilex.com",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 Depilex Model Town. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
logoText="Depilex Beauty Clinic"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/young-woman-relaxing-spa-salon_176420-7559.jpg"
|
||||
columns={[
|
||||
{ title: "Services", items: [{ label: "Hair Care", href: "#features" }, { label: "Skin Care", href: "#features" }, { label: "Men Grooming", href: "#features" }] },
|
||||
{ title: "Location", items: [{ label: "Model Town, Lahore", href: "#" }] },
|
||||
{ title: "Contact", items: [{ label: "Call Us", href: "tel:+92420000000" }, { label: "Email", href: "mailto:info@depilex.com" }] }
|
||||
]}
|
||||
copyrightText="© 2025 Depilex Model Town. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user