177 lines
9.7 KiB
TypeScript
177 lines
9.7 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
|
import AboutMetric from '@/components/sections/about/AboutMetric';
|
|
import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
|
|
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
|
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
|
import { Users, Award, Star, Sparkles } from 'lucide-react';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="icon-arrow"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="pill"
|
|
contentWidth="mediumSmall"
|
|
sizing="largeSmall"
|
|
background="radialGradient"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="bold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
brandName="Luminé"
|
|
navItems={[
|
|
{ name: "About", id: "about" },
|
|
{ name: "Services", id: "services" },
|
|
{ name: "Results", id: "results" },
|
|
{ name: "Testimonials", id: "testimonials" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
button={{ text: "Book Consultation", href: "contact" }}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogoBillboard
|
|
logoText="Luminé Cosmetic Clinic"
|
|
description="Enhance your natural beauty with precision, artistry, and personalized aesthetic excellence. Where science meets elegance."
|
|
imageSrc="https://img.b2bpic.net/free-photo/woman-with-doctor-cosmetology-studio_1157-33838.jpg"
|
|
imageAlt="Modern cosmetic clinic treatment room"
|
|
frameStyle="card"
|
|
logoLineHeight={1.2}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<AboutMetric
|
|
title="Trusted expertise in aesthetic transformation. Over a decade of refined artistry and patient-centric care."
|
|
metrics={[
|
|
{ icon: Users, label: "Satisfied Patients", value: "2,500+" },
|
|
{ icon: Award, label: "Years Experience", value: "15+" },
|
|
{ icon: Star, label: "Five-Star Reviews", value: "98%" },
|
|
{ icon: Sparkles, label: "Custom Treatments", value: "50+" }
|
|
]}
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureCardSix
|
|
title="Our Services"
|
|
description="Comprehensive aesthetic solutions tailored to your unique beauty goals"
|
|
tag="Treatments"
|
|
features={[
|
|
{
|
|
id: 1,
|
|
title: "Advanced Skincare", description: "Bespoke facial treatments combining clinical science with luxury care. Hydra-infusion, chemical peels, and custom serums designed for your skin.", imageSrc: "https://img.b2bpic.net/free-photo/closeup-woman-having-facial-massage-beauty-treatment-spa_637285-2151.jpg", imageAlt: "Advanced skincare treatment"
|
|
},
|
|
{
|
|
id: 2,
|
|
title: "Dermal Fillers & Injectables", description: "Artfully administered to enhance volume and contours. Premium fillers and neuromodulators for natural, refined results that preserve your unique character.", imageSrc: "https://img.b2bpic.net/free-photo/beautiful-female-wearing-pink-gloves-showing-filled-syringe-camera-close-up-portrait_7502-10384.jpg", imageAlt: "Injectable cosmetic treatment"
|
|
},
|
|
{
|
|
id: 3,
|
|
title: "Laser & Energy-Based", description: "State-of-the-art laser technology for skin resurfacing, hair removal, and rejuvenation. Precision treatments with minimal downtime.", imageSrc: "https://img.b2bpic.net/free-photo/woman-receiving-laser-epilation-treatment-her-face_107420-74043.jpg", imageAlt: "Laser treatment technology"
|
|
}
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="results" data-section="results">
|
|
<ProductCardThree
|
|
title="Visible Results"
|
|
description="Real transformations from our patients. Each result reflects our commitment to natural enhancement and patient satisfaction."
|
|
products={[
|
|
{
|
|
id: "1", name: "Skin Renewal", price: "See the difference", imageSrc: "https://img.b2bpic.net/free-photo/antiaging-beauty-treatment_23-2149123622.jpg", imageAlt: "Before and after skin rejuvenation"
|
|
},
|
|
{
|
|
id: "2", name: "Facial Harmony", price: "Enhanced naturally", imageSrc: "https://img.b2bpic.net/free-photo/antiaging-beauty-treatment_23-2149123614.jpg", imageAlt: "Before and after facial enhancement"
|
|
},
|
|
{
|
|
id: "3", name: "Radiance Restored", price: "Luminous glow", imageSrc: "https://img.b2bpic.net/free-photo/panoramic-spa-lounge-minimalist-relaxation-modern-resort_169016-68893.jpg", imageAlt: "Clinic environment"
|
|
}
|
|
]}
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground="invertDefault"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTen
|
|
title="Loved by Our Patients"
|
|
description="Real stories from people who trusted us with their aesthetic journey"
|
|
testimonials={[
|
|
{
|
|
id: "1", title: "Finally feeling like myself", quote: "Dr. Silva's approach was so thoughtful. She listened to what I wanted and delivered results that look completely natural. I can't recommend Luminé highly enough.", name: "Jennifer Walsh", role: "Business Executive", imageSrc: "https://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg", imageAlt: "Jennifer Walsh"
|
|
},
|
|
{
|
|
id: "2", title: "Refreshed, not overdone", quote: "I was nervous about procedures, but the team made me feel so comfortable. The results are subtle and beautiful. Everyone says I look rested!", name: "Michelle Park", role: "Marketing Director", imageSrc: "https://img.b2bpic.net/free-photo/blond-business-woman-blue-shirt_23-2148095792.jpg", imageAlt: "Michelle Park"
|
|
},
|
|
{
|
|
id: "3", title: "Artistry at its finest", quote: "The attention to detail is remarkable. Dr. Silva has an artist's eye. I feel more confident in my skin now than I ever have.", name: "Amanda Foster", role: "Creative Director", imageSrc: "https://img.b2bpic.net/free-photo/close-up-good-looking-smiling-friendly-female-trainee-ready-tackle-assignments-smiling-broadly-feeling-lucky-day-work-self-assured-encouraged-achieve-success-goal-white-wall_176420-35567.jpg", imageAlt: "Amanda Foster"
|
|
},
|
|
{
|
|
id: "4", title: "Worth every moment", quote: "The whole experience from consultation to aftercare was exceptional. Luminé treats you like family, not just a patient.", name: "Rachel Thompson", role: "Interior Designer", imageSrc: "https://img.b2bpic.net/free-photo/portrait-middle-aged-businesswoman_23-2148204386.jpg", imageAlt: "Rachel Thompson"
|
|
}
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
tag="Get Started"
|
|
title="Ready for Your Transformation?"
|
|
description="Schedule a private consultation with Dr. Silva to explore your aesthetic goals. Every journey is personal, and every result is remarkable."
|
|
inputPlaceholder="Enter your email"
|
|
buttonText="Book Now"
|
|
termsText="We respect your privacy. We'll reach out within 24 hours to confirm your consultation time."
|
|
useInvertedBackground="invertDefault"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoEmphasis
|
|
logoText="Luminé"
|
|
columns={[
|
|
{
|
|
items: [
|
|
{ label: "About", href: "about" },
|
|
{ label: "Services", href: "services" },
|
|
{ label: "Results", href: "results" }
|
|
]
|
|
},
|
|
{
|
|
items: [
|
|
{ label: "Testimonials", href: "testimonials" },
|
|
{ label: "Contact", href: "contact" },
|
|
{ label: "Book Consultation", href: "contact" }
|
|
]
|
|
},
|
|
{
|
|
items: [
|
|
{ label: "Privacy Policy", href: "/privacy" },
|
|
{ label: "Terms of Service", href: "/terms" },
|
|
{ label: "Accessibility", href: "/accessibility" }
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |