Merge version_1 into main #1
337
src/app/page.tsx
337
src/app/page.tsx
@@ -20,27 +20,26 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="hover-bubble"
|
||||
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">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
name: "Services", id: "services"},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "pricing",
|
||||
},
|
||||
name: "Pricing", id: "pricing"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="SerenaSpa"
|
||||
/>
|
||||
@@ -49,103 +48,37 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDoubleCarousel
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
variant: "radial-gradient"}}
|
||||
title="Rejuvenate Your Soul"
|
||||
description="Discover a sanctuary of peace and healing in the heart of the city. Expert massage therapy for deep relaxation."
|
||||
leftCarouselItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-relaxing-spa-salon_176420-7549.jpg",
|
||||
imageAlt: "Massage room",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wellness-concept-with-woman-massage-salon_23-2147816967.jpg",
|
||||
imageAlt: "Massage room",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-relaxing-spa_329181-13165.jpg",
|
||||
imageAlt: "Massage room",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-luxury-bedroom-design-illuminated-with-electric-lamps-generated-by-ai_188544-27310.jpg",
|
||||
imageAlt: "Massage room",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-shot-bathing-brush-with-essential-oils-candles-spa-concept_127675-2567.jpg",
|
||||
imageAlt: "Massage room",
|
||||
},
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-woman-relaxing-spa-salon_176420-7549.jpg", imageAlt: "Massage room" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/wellness-concept-with-woman-massage-salon_23-2147816967.jpg", imageAlt: "Massage room" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-relaxing-spa_329181-13165.jpg", imageAlt: "Massage room" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/modern-luxury-bedroom-design-illuminated-with-electric-lamps-generated-by-ai_188544-27310.jpg", imageAlt: "Massage room" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-shot-bathing-brush-with-essential-oils-candles-spa-concept_127675-2567.jpg", imageAlt: "Massage room" }
|
||||
]}
|
||||
rightCarouselItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/massage-woman-spa-salon_1385-266.jpg",
|
||||
imageAlt: "Treatment detail",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-massaging-girl-table_23-2147648483.jpg",
|
||||
imageAlt: "Treatment detail",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/massage-therapy-with-stones_23-2148531203.jpg",
|
||||
imageAlt: "Treatment detail",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pile-stones-white-vase_23-2147677834.jpg",
|
||||
imageAlt: "Treatment detail",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pile-black-stones-with-orchid-top_23-2147684453.jpg",
|
||||
imageAlt: "Treatment detail",
|
||||
},
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/massage-woman-spa-salon_1385-266.jpg", imageAlt: "Treatment detail" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-massaging-girl-table_23-2147648483.jpg", imageAlt: "Treatment detail" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/massage-therapy-with-stones_23-2148531203.jpg", imageAlt: "Treatment detail" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/pile-stones-white-vase_23-2147677834.jpg", imageAlt: "Treatment detail" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/pile-black-stones-with-orchid-top_23-2147684453.jpg", imageAlt: "Treatment detail" }
|
||||
]}
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-naked-woman-relaxing-spa-salon_176420-7536.jpg",
|
||||
alt: "Client 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/luxury-bedroom-with-modern-design-elegance-generated-by-ai_188544-26912.jpg",
|
||||
alt: "Client 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/room-with-massage-tables-wall-with-lights-it_188544-36461.jpg",
|
||||
alt: "Client 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/spa-massage-concept-with-woman_23-2147817020.jpg",
|
||||
alt: "Client 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/woman-relaxing-bath-with-bubbles_1303-24667.jpg",
|
||||
alt: "Client 5",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-naked-woman-relaxing-spa-salon_176420-7536.jpg", alt: "Client 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/luxury-bedroom-with-modern-design-elegance-generated-by-ai_188544-26912.jpg", alt: "Client 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/room-with-massage-tables-wall-with-lights-it_188544-36461.jpg", alt: "Client 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/spa-massage-concept-with-woman_23-2147817020.jpg", alt: "Client 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/woman-relaxing-bath-with-bubbles_1303-24667.jpg", alt: "Client 5" }
|
||||
]}
|
||||
avatarText="Trusted by 10,000+ satisfied clients"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/bed-luxury-beautiful-holiday-oil_1122-1911.jpg",
|
||||
alt: "Logo 1",
|
||||
},
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/young-naked-woman-relaxing-spa-salon_176420-7535.jpg",
|
||||
alt: "Logo 2",
|
||||
},
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/spa-massage-concept-with-woman_23-2147817012.jpg",
|
||||
alt: "Logo 3",
|
||||
},
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/spa-massage-concept-with-woman_23-2147817023.jpg",
|
||||
alt: "Logo 4",
|
||||
},
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/spa-massage-concept-with-woman_23-2147817016.jpg",
|
||||
alt: "Logo 5",
|
||||
},
|
||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/bed-luxury-beautiful-holiday-oil_1122-1911.jpg", alt: "Logo 1" },
|
||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/young-naked-woman-relaxing-spa-salon_176420-7535.jpg", alt: "Logo 2" },
|
||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/spa-massage-concept-with-woman_23-2147817012.jpg", alt: "Logo 3" },
|
||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/spa-massage-concept-with-woman_23-2147817023.jpg", alt: "Logo 4" },
|
||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/spa-massage-concept-with-woman_23-2147817016.jpg", alt: "Logo 5" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -155,21 +88,9 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
title="Excellence in Wellness"
|
||||
metrics={[
|
||||
{
|
||||
icon: Award,
|
||||
label: "Years Experience",
|
||||
value: "15+",
|
||||
},
|
||||
{
|
||||
icon: Users,
|
||||
label: "Happy Clients",
|
||||
value: "10K+",
|
||||
},
|
||||
{
|
||||
icon: CheckCircle,
|
||||
label: "Certified Pros",
|
||||
value: "20+",
|
||||
},
|
||||
{ icon: Award, label: "Years Experience", value: "15+" },
|
||||
{ icon: Users, label: "Happy Clients", value: "10K+" },
|
||||
{ icon: CheckCircle, label: "Certified Pros", value: "20+" }
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -181,27 +102,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "s1",
|
||||
title: "Deep Tissue",
|
||||
subtitle: "Deep muscle relief",
|
||||
category: "Massage",
|
||||
value: "$90",
|
||||
},
|
||||
{
|
||||
id: "s2",
|
||||
title: "Aromatherapy",
|
||||
subtitle: "Essential oil blend",
|
||||
category: "Massage",
|
||||
value: "$80",
|
||||
},
|
||||
{
|
||||
id: "s3",
|
||||
title: "Hot Stone",
|
||||
subtitle: "Heated volcanic rocks",
|
||||
category: "Massage",
|
||||
value: "$110",
|
||||
},
|
||||
{ id: "s1", title: "Deep Tissue", subtitle: "Deep muscle relief", category: "Massage", value: "$90" },
|
||||
{ id: "s2", title: "Aromatherapy", subtitle: "Essential oil blend", category: "Massage", value: "$80" },
|
||||
{ id: "s3", title: "Hot Stone", subtitle: "Heated volcanic rocks", category: "Massage", value: "$110" }
|
||||
]}
|
||||
title="Our Signature Services"
|
||||
description="Tailored treatments for mind, body, and spirit."
|
||||
@@ -215,56 +118,17 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{
|
||||
id: "basic",
|
||||
badge: "Core",
|
||||
price: "$75",
|
||||
subtitle: "Basic Massage",
|
||||
features: [
|
||||
"30 min massage",
|
||||
"Essential oils",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
id: "basic", badge: "Core", price: "$75", subtitle: "Basic Massage", features: ["30 min massage", "Essential oils"],
|
||||
buttons: [{ text: "Book Now", href: "#contact" }]
|
||||
},
|
||||
{
|
||||
id: "gold",
|
||||
badge: "Popular",
|
||||
price: "$150",
|
||||
subtitle: "Deep Wellness",
|
||||
features: [
|
||||
"60 min massage",
|
||||
"Hot stone",
|
||||
"Scalp therapy",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
id: "gold", badge: "Popular", price: "$150", subtitle: "Deep Wellness", features: ["60 min massage", "Hot stone", "Scalp therapy"],
|
||||
buttons: [{ text: "Book Now", href: "#contact" }]
|
||||
},
|
||||
{
|
||||
id: "platinum",
|
||||
badge: "Premium",
|
||||
price: "$250",
|
||||
subtitle: "Total Escape",
|
||||
features: [
|
||||
"90 min massage",
|
||||
"Aromatherapy",
|
||||
"Facial treatment",
|
||||
"Gift included",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
id: "platinum", badge: "Premium", price: "$250", subtitle: "Total Escape", features: ["90 min massage", "Aromatherapy", "Facial treatment", "Gift included"],
|
||||
buttons: [{ text: "Book Now", href: "#contact" }]
|
||||
}
|
||||
]}
|
||||
title="Wellness Packages"
|
||||
description="Choose the perfect journey for your body."
|
||||
@@ -278,27 +142,9 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
members={[
|
||||
{
|
||||
id: "m1",
|
||||
name: "Elena Ross",
|
||||
role: "Head Therapist",
|
||||
description: "10 years of holistic care.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-lady-standing-with-crossed-arms-white-bathrobe-towel-looking-confident-front-view_176474-50981.jpg",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
name: "Mark Chen",
|
||||
role: "Sports Specialist",
|
||||
description: "Expert in muscle recovery.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-enjoying-coffee_23-2148597001.jpg",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
name: "Sarah Lee",
|
||||
role: "Aromatherapist",
|
||||
description: "Certified essential oil expert.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67149.jpg",
|
||||
},
|
||||
{ id: "m1", name: "Elena Ross", role: "Head Therapist", description: "10 years of holistic care.", imageSrc: "http://img.b2bpic.net/free-photo/young-lady-standing-with-crossed-arms-white-bathrobe-towel-looking-confident-front-view_176474-50981.jpg" },
|
||||
{ id: "m2", name: "Mark Chen", role: "Sports Specialist", description: "Expert in muscle recovery.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-enjoying-coffee_23-2148597001.jpg" },
|
||||
{ id: "m3", name: "Sarah Lee", role: "Aromatherapist", description: "Certified essential oil expert.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67149.jpg" }
|
||||
]}
|
||||
title="Expert Therapists"
|
||||
description="Meet the hands behind your relaxation."
|
||||
@@ -309,31 +155,11 @@ export default function LandingPage() {
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Alice D.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-woman-lying-white-coats_1262-423.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Bob K.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-senior-woman-posing_23-2149095418.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Claire W.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/senior-man-talking-phone_23-2148404354.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "David M.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girl-sitting-home-bed_1157-31051.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Eve J.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-smiling-adult-woman-leaning-wall_1262-1759.jpg",
|
||||
},
|
||||
{ id: "t1", name: "Alice D.", imageSrc: "http://img.b2bpic.net/free-photo/man-woman-lying-white-coats_1262-423.jpg" },
|
||||
{ id: "t2", name: "Bob K.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-senior-woman-posing_23-2149095418.jpg" },
|
||||
{ id: "t3", name: "Claire W.", imageSrc: "http://img.b2bpic.net/free-photo/senior-man-talking-phone_23-2148404354.jpg" },
|
||||
{ id: "t4", name: "David M.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girl-sitting-home-bed_1157-31051.jpg" },
|
||||
{ id: "t5", name: "Eve J.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-smiling-adult-woman-leaning-wall_1262-1759.jpg" }
|
||||
]}
|
||||
cardTitle="Client Journey"
|
||||
cardTag="Stories"
|
||||
@@ -345,21 +171,9 @@ export default function LandingPage() {
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "How often should I get a massage?",
|
||||
content: "Depending on your stress levels, once or twice a month.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Can I request a specific therapist?",
|
||||
content: "Yes, bookings can be managed through our website.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "What should I bring?",
|
||||
content: "Just bring yourself, we provide all essentials.",
|
||||
},
|
||||
{ id: "q1", title: "How often should I get a massage?", content: "Depending on your stress levels, once or twice a month." },
|
||||
{ id: "q2", title: "Can I request a specific therapist?", content: "Yes, bookings can be managed through our website." },
|
||||
{ id: "q3", title: "What should I bring?", content: "Just bring yourself, we provide all essentials." }
|
||||
]}
|
||||
sideTitle="Common Queries"
|
||||
faqsAnimation="slide-up"
|
||||
@@ -369,18 +183,11 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
tag="Ready to relax?"
|
||||
title="Book Your Session"
|
||||
description="Secure your time with our specialists today."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Book Appointment", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -388,31 +195,11 @@ export default function LandingPage() {
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "SerenaSpa",
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
title: "SerenaSpa", items: [{ label: "About", href: "#" }, { label: "Services", href: "#services" }]
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
title: "Legal", items: [{ label: "Privacy", href: "#" }, { label: "Terms", href: "#" }]
|
||||
}
|
||||
]}
|
||||
bottomLeftText="© 2024 SerenaSpa. All rights reserved."
|
||||
bottomRightText="Built with care."
|
||||
@@ -421,4 +208,4 @@ export default function LandingPage() {
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user