333 lines
18 KiB
TypeScript
333 lines
18 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactText from '@/components/sections/contact/ContactText';
|
|
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
|
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
|
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
|
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import TeamCardEleven from '@/components/sections/team/TeamCardEleven';
|
|
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
|
import { Feather, Heart, Palette, Scissors, Sparkles } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="expand-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="medium"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="blurBottom"
|
|
cardStyle="layered-gradient"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="bold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "#home"},
|
|
{
|
|
name: "About", id: "#about"},
|
|
{
|
|
name: "Services", id: "#services"},
|
|
{
|
|
name: "Products", id: "#products"},
|
|
{
|
|
name: "Team", id: "#team"},
|
|
{
|
|
name: "Pricing", id: "#pricing"},
|
|
{
|
|
name: "Testimonials", id: "#testimonials"},
|
|
{
|
|
name: "Contact", id: "#contact"},
|
|
]}
|
|
brandName="Hair Couture Salon LLC"
|
|
button={{
|
|
text: "Book Appointment", href: "#contact"}}
|
|
animateOnLoad={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="home" data-section="home">
|
|
<HeroBillboardTestimonial
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "sparkles-gradient"}}
|
|
title="Hair That Turns Heads"
|
|
description="Luxury hair services designed around you. Experience premium styling, expert color, and personalized care from New Jersey's most trusted women-owned salon."
|
|
testimonials={[
|
|
{
|
|
name: "Sophia R.", handle: "@sophia_beauty", testimonial: "Hair Couture Salon transformed my look! The balayage is flawless, and the team is simply the best.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/business-woman-smiling-with-top-hat-thumbs-up_1187-1549.jpg"},
|
|
{
|
|
name: "Isabella M.", handle: "@bella_glam", testimonial: "Unparalleled expertise and a truly luxurious experience. My bridal hair was absolutely perfect.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/best-friends-smiling-each-other_23-2148238236.jpg"},
|
|
{
|
|
name: "Olivia P.", handle: "@olivia_chic", testimonial: "Every visit feels like a pampered escape. They understand luxury and deliver consistent, stunning results.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/girl-holding-cup_23-2147984958.jpg"},
|
|
{
|
|
name: "Mia S.", handle: "@mia_styles", testimonial: "Finally, a salon that truly listens and brings my vision to life. The attention to detail is remarkable.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/barber-customer-giving-high-five_23-2147737094.jpg"},
|
|
{
|
|
name: "Charlotte K.", handle: "@charlotte_glow", testimonial: "From consultation to final style, the professionalism and warmth are exceptional. Highly recommend for any transformation!", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-beautiful-bride-getting-ready_23-2149640900.jpg"},
|
|
{
|
|
name: "Amelia L.", handle: "@amelia_lux", testimonial: "My hair has never felt healthier or looked better. The advanced treatments are a game-changer.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-blonde-girl-women-with-makeup-beautiful-wavy-hair-black-tshirt-city-park-green-background-closeup_132075-12106.jpg"},
|
|
]}
|
|
buttons={[
|
|
{
|
|
text: "Book Appointment", href: "#contact"},
|
|
{
|
|
text: "Explore Services", href: "#services"},
|
|
]}
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg", alt: "Client 1"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/sucsessful-businesswoman-studio-isolated-grey_613910-11320.jpg", alt: "Client 2"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/pretty-attractive-young-mixed-race-model-with-large-afro-wearing-navy-jacket-her-naked-body-shorts_633478-1216.jpg", alt: "Client 3"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67131.jpg", alt: "Client 4"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/joyful-woman-black-jacket-liking-lip-posing-isolated-background-charming-lady-dark-suit-smiling-white-backdrop_197531-18516.jpg", alt: "Client 5"},
|
|
]}
|
|
avatarText="Trusted by over 1,000 satisfied clients"
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EyuRsNtpoJqNn1Zp8otLTc76by/uploaded-1781175161784-r7oib9km.png?_wi=1"
|
|
imageAlt="Luxurious Hair Salon Interior"
|
|
mediaAnimation="opacity"
|
|
marqueeItems={[
|
|
{
|
|
type: "text-icon", text: "Artistry & Precision", icon: Sparkles,
|
|
},
|
|
{
|
|
type: "text-icon", text: "Expert Colorists", icon: Palette,
|
|
},
|
|
{
|
|
type: "text-icon", text: "Exclusive Treatments", icon: Heart,
|
|
},
|
|
{
|
|
type: "text-icon", text: "Bridal Specialists", icon: Feather,
|
|
},
|
|
{
|
|
type: "text-icon", text: "Personalized Style", icon: Scissors,
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<InlineImageSplitTextAbout
|
|
useInvertedBackground={true}
|
|
heading={[
|
|
{
|
|
type: "text", content: "Crafting Elegance, "},
|
|
{
|
|
type: "text", content: "One Strand at a Time"},
|
|
]}
|
|
buttons={[
|
|
{
|
|
text: "Our Story", href: "#about"},
|
|
{
|
|
text: "Meet Our Team", href: "#team"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureHoverPattern
|
|
animationType="scale-rotate"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
icon: Scissors,
|
|
title: "Expert Cut & Style", description: "Precision haircuts tailored to your features and lifestyle, paired with a luxurious blowdry and styling."},
|
|
{
|
|
icon: Palette,
|
|
title: "Precision Color & Balayage", description: "From subtle highlights to dramatic transformations, our colorists craft bespoke shades using premium products."},
|
|
{
|
|
icon: Feather,
|
|
title: "Bridal & Special Occasion", description: "Flawless hair artistry for your most memorable moments, ensuring you radiate confidence and beauty."},
|
|
{
|
|
icon: Heart,
|
|
title: "Advanced Hair Treatments", description: "Restore and rejuvenate your hair with our bespoke treatments, targeting health, shine, and resilience."},
|
|
]}
|
|
title="Our Signature Services"
|
|
description="Experience the pinnacle of hair artistry with our curated selection of luxury treatments and styling expertise. Designed to deliver perfection."
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardFour
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="bento-grid"
|
|
useInvertedBackground={true}
|
|
products={[
|
|
{
|
|
id: "1", name: "Radiant Repair Shampoo", price: "$45", variant: "250ml", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EyuRsNtpoJqNn1Zp8otLTc76by/uploaded-1781175161785-r5vzeecm.png", imageAlt: "Luxury shampoo bottle"},
|
|
{
|
|
id: "2", name: "Velvet Smooth Conditioner", price: "$48", variant: "250ml", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EyuRsNtpoJqNn1Zp8otLTc76by/uploaded-1781175161785-ipq4pige.png", imageAlt: "Luxury conditioner bottle"},
|
|
{
|
|
id: "3", name: "Silk Elixir Hair Serum", price: "$65", variant: "50ml", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EyuRsNtpoJqNn1Zp8otLTc76by/uploaded-1781175161784-r7oib9km.png?_wi=2", imageAlt: "Luxury hair serum bottle"},
|
|
{
|
|
id: "4", name: "Deep Renewal Hair Mask", price: "$70", variant: "200ml", imageSrc: "http://img.b2bpic.net/free-photo/skin-care-product-arrangement-sand_23-2148761480.jpg", imageAlt: "Luxury hair mask jar"},
|
|
{
|
|
id: "5", name: "Weightless Volume Mist", price: "$38", variant: "150ml", imageSrc: "http://img.b2bpic.net/free-photo/stressful-young-girl-holding-alcohol-bottle-looking-camera-high-quality-photo_2831-9525.jpg", imageAlt: "Luxury hair styling mist"},
|
|
{
|
|
id: "6", name: "Sculpting Clay Pomade", price: "$35", variant: "100g", imageSrc: "http://img.b2bpic.net/free-photo/round-hair-brushes_23-2147711530.jpg", imageAlt: "Luxury hair pomade jar"},
|
|
]}
|
|
title="Exclusive Hair Couture Collection"
|
|
description="Elevate your daily routine with our meticulously selected professional hair care products, designed for ultimate hair health and style."
|
|
/>
|
|
</div>
|
|
|
|
<div id="team" data-section="team">
|
|
<TeamCardEleven
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
groups={[
|
|
{
|
|
id: "1", groupTitle: "Our Artisans of Hair", members: [
|
|
{
|
|
id: "m1", title: "Eleanor Vance", subtitle: "Creative Director & Master Colorist", detail: "With over two decades of experience, Eleanor is renowned for her transformative balayage and intricate color corrections.", imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-blonde-female-dressed-white-t-shirt-waistcoat-grey-background_613910-9333.jpg", imageAlt: "Portrait of Eleanor Vance"},
|
|
{
|
|
id: "m2", title: "Isabelle Chen", subtitle: "Senior Stylist & Bridal Expert", detail: "Isabelle specializes in elegant updos and bespoke bridal styling, ensuring every client feels radiant on their special day.", imageSrc: "http://img.b2bpic.net/free-photo/unpleased-young-beautiful-female-barber-uniform-holding-hair-clipper-with-comb-isolated-green-background_141793-119384.jpg", imageAlt: "Portrait of Isabelle Chen"},
|
|
{
|
|
id: "m3", title: "Chloe Dubois", subtitle: "Cutting Specialist & Texture Guru", detail: "Chloe's passion lies in precision cutting and enhancing natural hair textures, from sleek bobs to voluminous curls.", imageSrc: "http://img.b2bpic.net/free-photo/unpleased-looking-down-young-beautiful-female-barber-uniform-combing-hair-isolated-blue-background_141793-119376.jpg", imageAlt: "Portrait of Chloe Dubois"},
|
|
{
|
|
id: "m4", title: "Sophia Rodriguez", subtitle: "Advanced Treatment Specialist", detail: "Sophia is dedicated to hair health, offering cutting-edge treatments to repair, strengthen, and revitalize even the most delicate strands.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-elderly-woman-holding-tablet_23-2148419331.jpg", imageAlt: "Portrait of Sophia Rodriguez"},
|
|
],
|
|
},
|
|
]}
|
|
title="Meet Our Master Stylists"
|
|
description="Our award-winning team is dedicated to bringing your vision to life, combining unparalleled expertise with a personalized touch and artistic flair."
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardFive
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
plans={[
|
|
{
|
|
id: "1", tag: "Signature Cut", tagIcon: Sparkles,
|
|
price: "$120+", period: "starting", description: "A bespoke haircut experience, including consultation, wash, conditioning, and professional styling.", button: {
|
|
text: "Book Now", href: "#contact"},
|
|
featuresTitle: "Includes:", features: [
|
|
"Personalized consultation", "Luxury wash & scalp massage", "Precision cut & blowdry", "Custom styling & finish"],
|
|
},
|
|
{
|
|
id: "2", tag: "Master Color", tagIcon: Sparkles,
|
|
price: "$250+", period: "starting", description: "Expert color application, from highlights to balayage, with deep conditioning and tailored finish.", button: {
|
|
text: "Book Now", href: "#contact"},
|
|
featuresTitle: "Includes:", features: [
|
|
"In-depth color consultation", "Custom color formulation", "Deep conditioning treatment", "Professional styling & gloss"],
|
|
},
|
|
{
|
|
id: "3", tag: "Bridal Package", tagIcon: Sparkles,
|
|
price: "Custom", period: "per event", description: "A luxurious, personalized experience for your special day, ensuring a breathtaking bridal look.", button: {
|
|
text: "Enquire Now", href: "#contact"},
|
|
featuresTitle: "Includes:", features: [
|
|
"Trial styling session", "On-site styling available", "Hair extensions placement", "Pre-wedding hair health plan"],
|
|
},
|
|
]}
|
|
title="Transparent Pricing, Unrivaled Value"
|
|
description="Invest in your beauty with our clear and comprehensive luxury service offerings, tailored to meet your unique needs and preferences."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardFifteen
|
|
useInvertedBackground={false}
|
|
testimonial="Hair Couture Salon has truly elevated my hair care routine. The stylists are not just experts; they're artists. Every visit leaves me feeling refreshed, confident, and absolutely glamorous. The attention to detail, personalized approach, and luxurious ambiance are simply unmatched. I wouldn't trust anyone else with my hair."
|
|
rating={5}
|
|
author="Victoria Sterling, CEO of Sterling Ventures"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/gorgeous-smiling-blonde-fashion-model-sits-white-suit-soft-armchair_8353-5476.jpg", alt: "Client Victoria Sterling"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/pov-tourist-waves-videocall_482257-76727.jpg", alt: "Client Isabella Clarke"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/image-corporate-woman-working-office-sitting-front-laptop-preparing-business_1258-194628.jpg", alt: "Client Sophia Davis"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/very-elegant-woman-looking-away_329181-7317.jpg", alt: "Client Emily Watson"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/portrait-smiling-waitress_107420-12307.jpg", alt: "Client Sarah Miller"},
|
|
]}
|
|
ratingAnimation="opacity"
|
|
avatarsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactText
|
|
useInvertedBackground={true}
|
|
background={{
|
|
variant: "radial-gradient"}}
|
|
text="Ready to transform your look? Book your bespoke hair experience today. Our team of master stylists awaits."
|
|
buttons={[
|
|
{
|
|
text: "Book Appointment", href: "#contact"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterMedia
|
|
videoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EyuRsNtpoJqNn1Zp8otLTc76by/uploaded-1781175161784-r7oib9km.png?_wi=3"
|
|
videoAriaLabel="Elegant hair salon interior video"
|
|
logoText="Hair Couture Salon LLC"
|
|
columns={[
|
|
{
|
|
title: "Services", items: [
|
|
{
|
|
label: "Haircuts & Styling", href: "#services"},
|
|
{
|
|
label: "Color & Balayage", href: "#services"},
|
|
{
|
|
label: "Treatments", href: "#services"},
|
|
{
|
|
label: "Bridal Services", href: "#services"},
|
|
],
|
|
},
|
|
{
|
|
title: "About Us", items: [
|
|
{
|
|
label: "Our Story", href: "#about"},
|
|
{
|
|
label: "Meet The Team", href: "#team"},
|
|
{
|
|
label: "Our Philosophy", href: "#about"},
|
|
],
|
|
},
|
|
{
|
|
title: "Contact", items: [
|
|
{
|
|
label: "Book Now", href: "#contact"},
|
|
{
|
|
label: "Visit Us", href: "#contact"},
|
|
{
|
|
label: "Careers", href: "#"},
|
|
],
|
|
},
|
|
]}
|
|
copyrightText="© 2024 Hair Couture Salon LLC. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |