Merge version_1 into main #1
280
src/app/page.tsx
280
src/app/page.tsx
@@ -32,22 +32,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "features" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="New Face Salon"
|
||||
/>
|
||||
@@ -55,70 +43,31 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background="gradient-bars"
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Book unforgettable beauty and wellness experiences"
|
||||
description="Discover top-rated salons, barbers, medspas, and beauty experts trusted by millions worldwide. Book your spot today."
|
||||
kpis={[
|
||||
{
|
||||
value: "781+",
|
||||
label: "Happy Clients",
|
||||
},
|
||||
{
|
||||
value: "5.0",
|
||||
label: "Average Rating",
|
||||
},
|
||||
{
|
||||
value: "7+ Years",
|
||||
label: "Professional Experience",
|
||||
},
|
||||
{ value: "781+", label: "Happy Clients" },
|
||||
{ value: "5.0", label: "Average Rating" },
|
||||
{ value: "7+ Years", label: "Professional Experience" }
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/professional-barber-shop-chairs-close-up_23-2148353478.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/life-style_1122-1803.jpg",
|
||||
alt: "Happy client 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/skies-snowboard-lounge-area_482257-76730.jpg",
|
||||
alt: "Happy client 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/woman-putting-face-client-towel_23-2147737012.jpg",
|
||||
alt: "Happy client 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg",
|
||||
alt: "Happy client 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-women_23-2149272198.jpg",
|
||||
alt: "Happy client 5",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/life-style_1122-1803.jpg", alt: "Happy client 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/skies-snowboard-lounge-area_482257-76730.jpg", alt: "Happy client 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/woman-putting-face-client-towel_23-2147737012.jpg", alt: "Happy client 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/photo-two-black-ceramical-hair-sinks-standing-beaty-salon_651396-960.jpg", alt: "Happy client 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-women_23-2149272198.jpg", alt: "Happy client 5" }
|
||||
]}
|
||||
avatarText="Join our community of beauty lovers"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Hair Styling",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Beard Grooming",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Scalp Therapy",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Face Care",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Professional Tools",
|
||||
},
|
||||
{ type: "text", text: "Hair Styling" },
|
||||
{ type: "text", text: "Beard Grooming" },
|
||||
{ type: "text", text: "Scalp Therapy" },
|
||||
{ type: "text", text: "Face Care" },
|
||||
{ type: "text", text: "Professional Tools" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -128,7 +77,7 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
title="Professional Care, Experienced Staff"
|
||||
description={[
|
||||
"We offer a wide range of services including professional hair styling, beard grooming, and relaxation treatments. Our friendly team is dedicated to providing the best options for your personal care needs.",
|
||||
"We offer a wide range of services including professional hair styling, beard grooming, and relaxation treatments. Our friendly team is dedicated to providing the best options for your personal care needs."
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -139,33 +88,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Precision Haircut",
|
||||
tags: [
|
||||
"Hair",
|
||||
"Style",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/circle-from-combs-scissors_23-2147711644.jpg",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Beard Grooming",
|
||||
tags: [
|
||||
"Beard",
|
||||
"Maintenance",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/thoughtful-redhead-bearded-hipster-male-with-crossed-arms-dressed-blue-fleece-shirt_613910-9449.jpg",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Scalp Treatment",
|
||||
tags: [
|
||||
"Relaxation",
|
||||
"Care",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149230921.jpg",
|
||||
},
|
||||
{ id: "f1", title: "Precision Haircut", tags: ["Hair", "Style"], imageSrc: "http://img.b2bpic.net/free-photo/circle-from-combs-scissors_23-2147711644.jpg" },
|
||||
{ id: "f2", title: "Beard Grooming", tags: ["Beard", "Maintenance"], imageSrc: "http://img.b2bpic.net/free-photo/thoughtful-redhead-bearded-hipster-male-with-crossed-arms-dressed-blue-fleece-shirt_613910-9449.jpg" },
|
||||
{ id: "f3", title: "Scalp Treatment", tags: ["Relaxation", "Care"], imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149230921.jpg" }
|
||||
]}
|
||||
title="Signature Grooming Services"
|
||||
description="Expert services tailored to help you look and feel your absolute best."
|
||||
@@ -176,25 +101,11 @@ export default function LandingPage() {
|
||||
<MetricCardThree
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
animationType="slide-up"
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
icon: CheckCircle,
|
||||
title: "Bookings Today",
|
||||
value: "40+",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
icon: Star,
|
||||
title: "Client Satisfaction",
|
||||
value: "100%",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
icon: Award,
|
||||
title: "Years Business",
|
||||
value: "7+",
|
||||
},
|
||||
{ id: "m1", icon: CheckCircle, title: "Bookings Today", value: "40+" },
|
||||
{ id: "m2", icon: Star, title: "Client Satisfaction", value: "100%" },
|
||||
{ id: "m3", icon: Award, title: "Years Business", value: "7+" }
|
||||
]}
|
||||
title="Service Excellence"
|
||||
description="Measurable results backed by our dedication to quality."
|
||||
@@ -208,60 +119,12 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
brand: "ProStyle",
|
||||
name: "Styling Gel",
|
||||
price: "$15",
|
||||
rating: 5,
|
||||
reviewCount: "120",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/model-career-kit-still-life_23-2150217986.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
brand: "BeardCraft",
|
||||
name: "Beard Oil",
|
||||
price: "$22",
|
||||
rating: 5,
|
||||
reviewCount: "85",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-elder-bearded-man-holding-serum_23-2148621173.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
brand: "SilkRoot",
|
||||
name: "Organic Shampoo",
|
||||
price: "$18",
|
||||
rating: 4,
|
||||
reviewCount: "200",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-composition-spa-bath-concept_23-2148094253.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
brand: "ProStyle",
|
||||
name: "Matte Hair Wax",
|
||||
price: "$19",
|
||||
rating: 5,
|
||||
reviewCount: "45",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-barbershop-concept_23-2148506261.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
brand: "FreshFace",
|
||||
name: "Aftershave Balm",
|
||||
price: "$25",
|
||||
rating: 5,
|
||||
reviewCount: "67",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-doing-his-face-care-routine_23-2149288066.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
brand: "EliteCut",
|
||||
name: "Styling Comb",
|
||||
price: "$12",
|
||||
rating: 4,
|
||||
reviewCount: "90",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/set-cosmetic-brushes_23-2147710658.jpg",
|
||||
},
|
||||
{ id: "p1", brand: "ProStyle", name: "Styling Gel", price: "$15", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/model-career-kit-still-life_23-2150217986.jpg" },
|
||||
{ id: "p2", brand: "BeardCraft", name: "Beard Oil", price: "$22", rating: 5, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/front-view-elder-bearded-man-holding-serum_23-2148621173.jpg" },
|
||||
{ id: "p3", brand: "SilkRoot", name: "Organic Shampoo", price: "$18", rating: 4, reviewCount: "200", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-composition-spa-bath-concept_23-2148094253.jpg" },
|
||||
{ id: "p4", brand: "ProStyle", name: "Matte Hair Wax", price: "$19", rating: 5, reviewCount: "45", imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-barbershop-concept_23-2148506261.jpg" },
|
||||
{ id: "p5", brand: "FreshFace", name: "Aftershave Balm", price: "$25", rating: 5, reviewCount: "67", imageSrc: "http://img.b2bpic.net/free-photo/man-doing-his-face-care-routine_23-2149288066.jpg" },
|
||||
{ id: "p6", brand: "EliteCut", name: "Styling Comb", price: "$12", rating: 4, reviewCount: "90", imageSrc: "http://img.b2bpic.net/free-photo/set-cosmetic-brushes_23-2147710658.jpg" }
|
||||
]}
|
||||
title="Premium Beauty Essentials"
|
||||
description="Selected products used by our professionals to maintain your style at home."
|
||||
@@ -274,41 +137,11 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah",
|
||||
handle: "@sarah_salon",
|
||||
testimonial: "Best service in Doha! My hair has never looked better.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-afro-american-woman_23-2148332136.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Mark",
|
||||
handle: "@mark_doha",
|
||||
testimonial: "Excellent barber shop, highly recommended for beard care.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/best-friends-smiling-each-other_23-2148238236.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emily",
|
||||
handle: "@emily_beauty",
|
||||
testimonial: "Very professional and friendly staff. Amazing results every time.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-women-getting-married_23-2150753670.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "James",
|
||||
handle: "@james_groom",
|
||||
testimonial: "They know exactly how to style men's hair perfectly.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-hairdresser-with-hair-dryer-his-hands-hairstyle-woman-beauty-hair-professional-beauty-salon_231208-10937.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Linda",
|
||||
handle: "@linda_styles",
|
||||
testimonial: "Such a relaxing atmosphere and a perfect haircut.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-happy-bride-holding-smartphone_23-2149722007.jpg",
|
||||
},
|
||||
{ id: "1", name: "Sarah", handle: "@sarah_salon", testimonial: "Best service in Doha! My hair has never looked better.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-afro-american-woman_23-2148332136.jpg" },
|
||||
{ id: "2", name: "Mark", handle: "@mark_doha", testimonial: "Excellent barber shop, highly recommended for beard care.", imageSrc: "http://img.b2bpic.net/free-photo/best-friends-smiling-each-other_23-2148238236.jpg" },
|
||||
{ id: "3", name: "Emily", handle: "@emily_beauty", testimonial: "Very professional and friendly staff. Amazing results every time.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-women-getting-married_23-2150753670.jpg" },
|
||||
{ id: "4", name: "James", handle: "@james_groom", testimonial: "They know exactly how to style men's hair perfectly.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-hairdresser-with-hair-dryer-his-hands-hairstyle-woman-beauty-hair-professional-beauty-salon_231208-10937.jpg" },
|
||||
{ id: "5", name: "Linda", handle: "@linda_styles", testimonial: "Such a relaxing atmosphere and a perfect haircut.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-happy-bride-holding-smartphone_23-2149722007.jpg" }
|
||||
]}
|
||||
title="Loved by Our Clients"
|
||||
description="Hear what our regulars have to say about their experience."
|
||||
@@ -320,21 +153,9 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "How do I book an appointment?",
|
||||
content: "You can book directly through our website or give us a call at our salon locations.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "What payment methods are accepted?",
|
||||
content: "We accept major credit cards and digital payments.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Are walk-ins allowed?",
|
||||
content: "Walk-ins are welcome, but appointments are recommended for guaranteed service.",
|
||||
},
|
||||
{ id: "q1", title: "How do I book an appointment?", content: "You can book directly through our website or give us a call at our salon locations." },
|
||||
{ id: "q2", title: "What payment methods are accepted?", content: "We accept major credit cards and digital payments." },
|
||||
{ id: "q3", title: "Are walk-ins allowed?", content: "Walk-ins are welcome, but appointments are recommended for guaranteed service." }
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
title="Common Questions"
|
||||
@@ -347,32 +168,19 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Visit Us"
|
||||
title="Ready for a New Look?"
|
||||
description="Reach out to our professional team in Doha today. We are always here to give you the best service."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Book Now", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="New Face Salon"
|
||||
leftLink={{
|
||||
text: "Terms of Service",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
leftLink={{ text: "Terms of Service", href: "#" }}
|
||||
rightLink={{ text: "Privacy Policy", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
|
||||
Reference in New Issue
Block a user