Merge version_1 into main #2
309
src/app/page.tsx
309
src/app/page.tsx
@@ -20,27 +20,22 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Services", id: "#services" },
|
||||
{ name: "Reviews", id: "#testimonials" },
|
||||
{ name: "Contact", id: "#contact" }
|
||||
]}
|
||||
brandName="BABOR"
|
||||
/>
|
||||
@@ -48,42 +43,17 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
title="BABOR Beauty Institute — Where Science Meets Luxury Care"
|
||||
description="Advanced skin and body treatments with visible results from the first visit."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book an Appointment",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Book an Appointment", href: "#contact" }]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/illuminated-couch-armchair_1203-771.jpg",
|
||||
imageAlt: "Luxurious spa ambiance",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/massage-concept-with-woman-candles_23-2147816944.jpg",
|
||||
imageAlt: "Facial treatment in progress",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/artist-creating-alternative-bedroom-pop-music_23-2149736738.jpg",
|
||||
imageAlt: "Sophisticated clinic environment",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303093-781p1gbr.png?_wi=1",
|
||||
imageAlt: "Premium spa products",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303093-s99tbkqy.png?_wi=1",
|
||||
imageAlt: "Professional service detail",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303094-818exle9.png?_wi=1",
|
||||
imageAlt: "Healthy skin close up",
|
||||
},
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/illuminated-couch-armchair_1203-771.jpg", imageAlt: "Luxurious spa ambiance" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/massage-concept-with-woman-candles_23-2147816944.jpg", imageAlt: "Facial treatment in progress" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/artist-creating-alternative-bedroom-pop-music_23-2149736738.jpg", imageAlt: "Sophisticated clinic environment" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303093-781p1gbr.png", imageAlt: "Premium spa products" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303093-s99tbkqy.png", imageAlt: "Professional service detail" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303094-818exle9.png", imageAlt: "Healthy skin close up" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -93,21 +63,9 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
title="A space where beauty, relaxation, and medical expertise come together"
|
||||
metrics={[
|
||||
{
|
||||
icon: Award,
|
||||
label: "Industry Standard",
|
||||
value: "2026 Nominee",
|
||||
},
|
||||
{
|
||||
icon: Star,
|
||||
label: "Client Satisfaction",
|
||||
value: "4.9/5.0",
|
||||
},
|
||||
{
|
||||
icon: Users,
|
||||
label: "Verified Reviews",
|
||||
value: "267+",
|
||||
},
|
||||
{ icon: Award, label: "Industry Standard", value: "2026 Nominee" },
|
||||
{ icon: Star, label: "Client Satisfaction", value: "4.9/5.0" },
|
||||
{ icon: Users, label: "Verified Reviews", value: "267+" }
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -118,21 +76,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Face & Skin",
|
||||
description: "Lifting procedures, professional peels, and deep skin rejuvenation.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303094-nxq4a3hj.png?_wi=1",
|
||||
},
|
||||
{
|
||||
title: "Body & Wellness",
|
||||
description: "Lymphatic massage, cryotherapy, and body contouring technologies.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303094-m5htbyls.png?_wi=1",
|
||||
},
|
||||
{
|
||||
title: "Beauty & Care",
|
||||
description: "Premium hair restoration, gel manicures, and expert styling.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/gua-sha-face-roller-assortment_23-2149357153.jpg",
|
||||
},
|
||||
{ title: "Face & Skin", description: "Lifting procedures, professional peels, and deep skin rejuvenation.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303094-nxq4a3hj.png" },
|
||||
{ title: "Body & Wellness", description: "Lymphatic massage, cryotherapy, and body contouring technologies.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303094-m5htbyls.png" },
|
||||
{ title: "Beauty & Care", description: "Premium hair restoration, gel manicures, and expert styling.", imageSrc: "http://img.b2bpic.net/free-photo/gua-sha-face-roller-assortment_23-2149357153.jpg" }
|
||||
]}
|
||||
title="Refined Care Rituals"
|
||||
description="Personalized treatments focusing on visible lifting, cellular renewal, and deep relaxation."
|
||||
@@ -146,48 +92,12 @@ export default function LandingPage() {
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "offer-1",
|
||||
name: "Signature Ritual",
|
||||
price: "Complimentary",
|
||||
variant: "Gift",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-working-spa_23-2150911822.jpg",
|
||||
},
|
||||
{
|
||||
id: "offer-2",
|
||||
name: "Deep Relaxation",
|
||||
price: "Included",
|
||||
variant: "Premium",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/person-getting-micro-needling-beauty-treatment_23-2149334235.jpg",
|
||||
},
|
||||
{
|
||||
id: "offer-3",
|
||||
name: "Body Renewal",
|
||||
price: "Included",
|
||||
variant: "Special",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/elegant-minimal-interior-design_23-2151913231.jpg",
|
||||
},
|
||||
{
|
||||
id: "offer-4",
|
||||
name: "Vitality Boost",
|
||||
price: "Included",
|
||||
variant: "Complimentary",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-lies-beautician-s-table-receives-procedures-light-facial-massage-using-oil_343596-4184.jpg",
|
||||
},
|
||||
{
|
||||
id: "offer-5",
|
||||
name: "Inner Glow",
|
||||
price: "Included",
|
||||
variant: "Exclusive",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/panoramic-sauna-with-view-modern-wooden-design-nature-relaxation_169016-68880.jpg",
|
||||
},
|
||||
{
|
||||
id: "offer-6",
|
||||
name: "Skin Refresh",
|
||||
price: "Included",
|
||||
variant: "Signature",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/simple-elegant-neutral-spa-facebook-profile-cover_23-2149452345.jpg",
|
||||
},
|
||||
{ id: "offer-1", name: "Signature Ritual", price: "Complimentary", variant: "Gift", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-working-spa_23-2150911822.jpg" },
|
||||
{ id: "offer-2", name: "Deep Relaxation", price: "Included", variant: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/person-getting-micro-needling-beauty-treatment_23-2149334235.jpg" },
|
||||
{ id: "offer-3", name: "Body Renewal", price: "Included", variant: "Special", imageSrc: "http://img.b2bpic.net/free-photo/elegant-minimal-interior-design_23-2151913231.jpg" },
|
||||
{ id: "offer-4", name: "Vitality Boost", price: "Included", variant: "Complimentary", imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-lies-beautician-s-table-receives-procedures-light-facial-massage-using-oil_343596-4184.jpg" },
|
||||
{ id: "offer-5", name: "Inner Glow", price: "Included", variant: "Exclusive", imageSrc: "http://img.b2bpic.net/free-photo/panoramic-sauna-with-view-modern-wooden-design-nature-relaxation_169016-68880.jpg" },
|
||||
{ id: "offer-6", name: "Skin Refresh", price: "Included", variant: "Signature", imageSrc: "http://img.b2bpic.net/free-vector/simple-elegant-neutral-spa-facebook-profile-cover_23-2149452345.jpg" }
|
||||
]}
|
||||
title="Limited-Time Offer"
|
||||
description="Manual body massage + 10 minutes of relaxation as a gift."
|
||||
@@ -201,27 +111,9 @@ export default function LandingPage() {
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "res-1",
|
||||
value: "98%",
|
||||
title: "Smoother Skin",
|
||||
description: "Clinical improvement results",
|
||||
icon: Sparkles,
|
||||
},
|
||||
{
|
||||
id: "res-2",
|
||||
value: "85%",
|
||||
title: "Lifted Contours",
|
||||
description: "Immediate visible lifting effect",
|
||||
icon: Award,
|
||||
},
|
||||
{
|
||||
id: "res-3",
|
||||
value: "100%",
|
||||
title: "Relaxation",
|
||||
description: "Deep stress relief feedback",
|
||||
icon: Heart,
|
||||
},
|
||||
{ id: "res-1", value: "98%", title: "Smoother Skin", description: "Clinical improvement results", icon: Sparkles },
|
||||
{ id: "res-2", value: "85%", title: "Lifted Contours", description: "Immediate visible lifting effect", icon: Award },
|
||||
{ id: "res-3", value: "100%", title: "Relaxation", description: "Deep stress relief feedback", icon: Heart }
|
||||
]}
|
||||
title="Visible Transformation"
|
||||
description="Not just procedures — a transformation you can feel."
|
||||
@@ -234,60 +126,16 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Elena V.",
|
||||
role: "Creative",
|
||||
company: "Client",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303093-781p1gbr.png?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Sophia L.",
|
||||
role: "Manager",
|
||||
company: "Client",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303093-s99tbkqy.png?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Anna K.",
|
||||
role: "Architect",
|
||||
company: "Client",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303094-818exle9.png?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Maria S.",
|
||||
role: "Director",
|
||||
company: "Client",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303094-nxq4a3hj.png?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Julia P.",
|
||||
role: "Artist",
|
||||
company: "Client",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303094-m5htbyls.png?_wi=2",
|
||||
},
|
||||
{ id: "t1", name: "Elena V.", role: "Creative", company: "Client", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303093-781p1gbr.png" },
|
||||
{ id: "t2", name: "Sophia L.", role: "Manager", company: "Client", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303093-s99tbkqy.png" },
|
||||
{ id: "t3", name: "Anna K.", role: "Architect", company: "Client", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303094-818exle9.png" },
|
||||
{ id: "t4", name: "Maria S.", role: "Director", company: "Client", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303094-nxq4a3hj.png" },
|
||||
{ id: "t5", name: "Julia P.", role: "Artist", company: "Client", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DKILga5vj01uPHtGSt2nB0uG57/uploaded-1778024303094-m5htbyls.png" }
|
||||
]}
|
||||
kpiItems={[
|
||||
{
|
||||
value: "95%",
|
||||
label: "Return Rate",
|
||||
},
|
||||
{
|
||||
value: "4.9",
|
||||
label: "Average Rating",
|
||||
},
|
||||
{
|
||||
value: "12k+",
|
||||
label: "Visits",
|
||||
},
|
||||
{ value: "95%", label: "Return Rate" },
|
||||
{ value: "4.9", label: "Average Rating" },
|
||||
{ value: "12k+", label: "Visits" }
|
||||
]}
|
||||
title="Voices of BABOR"
|
||||
description="Beautiful space, exceptional service, and real results that define our excellence."
|
||||
@@ -298,26 +146,10 @@ export default function LandingPage() {
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Expert Specialists",
|
||||
content: "Our practitioners hold the highest certifications in beauty medicine.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Advanced Equipment",
|
||||
content: "We utilize cutting-edge medical hardware for precision care.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Safety Standards",
|
||||
content: "Uncompromising hygiene protocols ensure your peace of mind.",
|
||||
},
|
||||
{
|
||||
id: "f4",
|
||||
title: "Personalized Plans",
|
||||
content: "Treatments customized to your unique needs for maximum results.",
|
||||
},
|
||||
{ id: "f1", title: "Expert Specialists", content: "Our practitioners hold the highest certifications in beauty medicine." },
|
||||
{ id: "f2", title: "Advanced Equipment", content: "We utilize cutting-edge medical hardware for precision care." },
|
||||
{ id: "f3", title: "Safety Standards", content: "Uncompromising hygiene protocols ensure your peace of mind." },
|
||||
{ id: "f4", title: "Personalized Plans", content: "Treatments customized to your unique needs for maximum results." }
|
||||
]}
|
||||
sideTitle="Why BABOR?"
|
||||
sideDescription="Premium standards for those who value beauty."
|
||||
@@ -328,57 +160,18 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
background={{ variant: "plain" }}
|
||||
text="Book your appointment and experience premium beauty care. Consultation available."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Book Now", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
label: "Reviews",
|
||||
href: "#testimonials",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
{
|
||||
label: "Phone: +1 234 567 890",
|
||||
href: "tel:+1234567890",
|
||||
},
|
||||
{
|
||||
label: "WhatsApp",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Location",
|
||||
items: [
|
||||
{
|
||||
label: "City Center, 123 Luxury St.",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ title: "Navigation", items: [{ label: "Services", href: "#services" }, { label: "Reviews", href: "#testimonials" }] },
|
||||
{ title: "Contact", items: [{ label: "Phone: +1 234 567 890", href: "tel:+1234567890" }, { label: "WhatsApp", href: "#" }] },
|
||||
{ title: "Location", items: [{ label: "City Center, 123 Luxury St.", href: "#" }] }
|
||||
]}
|
||||
bottomLeftText="© 2024 BABOR Beauty Institute."
|
||||
bottomRightText="Premium Beauty Care"
|
||||
|
||||
Reference in New Issue
Block a user