bender/4e855ca4-eeab-48c7-9afb-8ef7a00b9e76
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-05-13 16:17:55 +00:00
parent ff70f15343
commit f671b7f787
1 changed files with 46 additions and 211 deletions
Download Patch File Download Diff File Expand all files Collapse all files

257
src/app/page.tsx
View File

@@ -32,26 +32,11 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "Services",
id: "features",
},
{
name: "Our Team",
id: "team",
},
{
name: "Reviews",
id: "testimonial",
},
{
name: "Contact",
id: "contact",
},
{ name: "Home", id: "hero" },
{ name: "Services", id: "features" },
{ name: "Our Team", id: "team" },
{ name: "Reviews", id: "testimonial" },
{ name: "Contact", id: "contact" },
]}
brandName="Elegance Salon"
/>
@@ -59,22 +44,14 @@ export default function LandingPage() {
<div id="hero" data-section="hero">
<HeroLogoBillboard
background={{
variant: "radial-gradient",
}}
background={{ variant: "radial-gradient" }}
logoText="Elegance Hair Salon"
description="Experience professional styling in our modern, serene space. We craft beauty with precision and passion."
buttons={[
{
text: "Book Appointment",
href: "#contact",
},
{
text: "Our Services",
href: "#features",
},
{ text: "Book Appointment", href: "#contact" },
{ text: "Our Services", href: "#features" },
]}
imageSrc="http://img.b2bpic.net/free-photo/beautician-styling-clients-hair_107420-94677.jpg?_wi=1"
imageSrc="http://img.b2bpic.net/free-photo/beautician-styling-clients-hair_107420-94677.jpg"
mediaAnimation="slide-up"
/>
</div>
@@ -83,21 +60,11 @@ export default function LandingPage() {
<InlineImageSplitTextAbout
useInvertedBackground={false}
heading={[
{
type: "text",
content: "Crafting Your Perfect Look",
},
{
type: "image",
src: "http://img.b2bpic.net/free-photo/side-view-happy-bride-holding-smartphone_23-2149722007.jpg",
alt: "Stylist working",
},
{ type: "text", content: "Crafting Your Perfect Look" },
{ type: "image", src: "http://img.b2bpic.net/free-photo/side-view-happy-bride-holding-smartphone_23-2149722007.jpg", alt: "Stylist working" },
]}
buttons={[
{
text: "Meet the Team",
href: "#team",
},
{ text: "Meet the Team", href: "#team" },
]}
/>
</div>
@@ -109,49 +76,25 @@ export default function LandingPage() {
useInvertedBackground={false}
features={[
{
title: "Precision Styling",
description: "Tailored haircuts that complement your face shape and personal style.",
icon: Scissors,
title: "Precision Styling", description: "Tailored haircuts that complement your face shape and personal style.", icon: Scissors,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/side-view-hairdresser-washing-woman-s-hair_23-2150668438.jpg",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-composition-spa-bath-concept_23-2148094191.jpg",
},
],
imageSrc: "http://img.b2bpic.net/free-photo/beautician-styling-clients-hair_107420-94677.jpg?_wi=2",
imageAlt: "hair coloring technique palette",
{ imageSrc: "http://img.b2bpic.net/free-photo/side-view-hairdresser-washing-woman-s-hair_23-2150668438.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/beautiful-composition-spa-bath-concept_23-2148094191.jpg" },
]
},
{
title: "Organic Coloring",
description: "High-quality, gentle color treatments using natural-based ingredients.",
icon: Palette,
title: "Organic Coloring", description: "High-quality, gentle color treatments using natural-based ingredients.", icon: Palette,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/blonde-woman-getting-her-hair-done_23-2148108776.jpg",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/hairstylist-washing-client-hair-sink_23-2147769790.jpg",
},
],
imageSrc: "http://img.b2bpic.net/free-photo/side-view-happy-bride-holding-smartphone_23-2149722007.jpg",
imageAlt: "hair coloring technique palette",
{ imageSrc: "http://img.b2bpic.net/free-photo/blonde-woman-getting-her-hair-done_23-2148108776.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/hairstylist-washing-client-hair-sink_23-2147769790.jpg" },
]
},
{
title: "Revitalizing Spa",
description: "Deep conditioning and scalp treatments for long-lasting hair health.",
icon: Sparkles,
title: "Revitalizing Spa", description: "Deep conditioning and scalp treatments for long-lasting hair health.", icon: Sparkles,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/woman-combing-hair-her-beauty-routine_23-2150166426.jpg",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/view-scissors-hair-salon_23-2150462460.jpg",
},
],
imageSrc: "http://img.b2bpic.net/free-photo/skin-regeneration-product-still-life_23-2151232242.jpg?_wi=1",
imageAlt: "hair coloring technique palette",
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-combing-hair-her-beauty-routine_23-2150166426.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/view-scissors-hair-salon_23-2150462460.jpg" },
]
},
]}
title="Our Expert Services"
@@ -161,53 +104,17 @@ export default function LandingPage() {
<div id="products" data-section="products">
<ProductCardFour
animationType="scale-rotate"
animationType="blur-reveal"
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false}
products={[
{
id: "p1",
name: "Hydrate Shampoo",
price: "$34.00",
variant: "250ml",
imageSrc: "http://img.b2bpic.net/free-photo/skin-regeneration-product-still-life_23-2151232242.jpg?_wi=2",
},
{
id: "p2",
name: "Silk Conditioner",
price: "$38.00",
variant: "250ml",
imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-her-hair-done-beauty-salon_23-2149167391.jpg",
},
{
id: "p3",
name: "Argan Hair Oil",
price: "$42.00",
variant: "50ml",
imageSrc: "http://img.b2bpic.net/free-photo/delicious-organic-coffee-still-life_23-2151762333.jpg",
},
{
id: "p4",
name: "Volume Spray",
price: "$29.00",
variant: "150ml",
imageSrc: "http://img.b2bpic.net/free-photo/different-foundation-with-dark-background_23-2148978147.jpg",
},
{
id: "p5",
name: "Deep Mask",
price: "$45.00",
variant: "200ml",
imageSrc: "http://img.b2bpic.net/free-photo/female-client-getting-her-hair-washed-hairdresser_23-2150771292.jpg",
},
{
id: "p6",
name: "Finishing Mist",
price: "$32.00",
variant: "100ml",
imageSrc: "http://img.b2bpic.net/free-photo/mom-helping-her-child-styling-afro-hair_23-2149625751.jpg",
},
{ id: "p1", name: "Hydrate Shampoo", price: "$34.00", variant: "250ml", imageSrc: "http://img.b2bpic.net/free-photo/skin-regeneration-product-still-life_23-2151232242.jpg" },
{ id: "p2", name: "Silk Conditioner", price: "$38.00", variant: "250ml", imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-her-hair-done-beauty-salon_23-2149167391.jpg" },
{ id: "p3", name: "Argan Hair Oil", price: "$42.00", variant: "50ml", imageSrc: "http://img.b2bpic.net/free-photo/delicious-organic-coffee-still-life_23-2151762333.jpg" },
{ id: "p4", name: "Volume Spray", price: "$29.00", variant: "150ml", imageSrc: "http://img.b2bpic.net/free-photo/different-foundation-with-dark-background_23-2148978147.jpg" },
{ id: "p5", name: "Deep Mask", price: "$45.00", variant: "200ml", imageSrc: "http://img.b2bpic.net/free-photo/female-client-getting-her-hair-washed-hairdresser_23-2150771292.jpg" },
{ id: "p6", name: "Finishing Mist", price: "$32.00", variant: "100ml", imageSrc: "http://img.b2bpic.net/free-photo/mom-helping-her-child-styling-afro-hair_23-2149625751.jpg" },
]}
title="Premium Care Essentials"
description="Professional-grade products to maintain your salon results at home."
@@ -216,28 +123,13 @@ export default function LandingPage() {
<div id="team" data-section="team">
<TeamCardFive
animationType="depth-3d"
animationType="scale-rotate"
textboxLayout="default"
useInvertedBackground={false}
team={[
{
id: "t1",
name: "Elena Rossi",
role: "Creative Director",
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-blonde-female-dressed-white-t-shirt-waistcoat-grey-background_613910-9333.jpg",
},
{
id: "t2",
name: "Marcus Chen",
role: "Colorist Expert",
imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-female-barber-wearing-uniform-glasses-headband-holding-comb-hair-trimmer-air-looking-down-pretend-doing-haircut-client-isolated-red-background_141793-137002.jpg",
},
{
id: "t3",
name: "Sarah Miller",
role: "Senior Stylist",
imageSrc: "http://img.b2bpic.net/free-photo/confident-young-beautiful-female-barber-uniform-holding-winner-cup-with-hair-clippers-showing-look-gesture-isolated-blue-wall_141793-105678.jpg",
},
{ id: "t1", name: "Elena Rossi", role: "Creative Director", imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-blonde-female-dressed-white-t-shirt-waistcoat-grey-background_613910-9333.jpg" },
{ id: "t2", name: "Marcus Chen", role: "Colorist Expert", imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-female-barber-wearing-uniform-glasses-headband-holding-comb-hair-trimmer-air-looking-down-pretend-doing-haircut-client-isolated-red-background_141793-137002.jpg" },
{ id: "t3", name: "Sarah Miller", role: "Senior Stylist", imageSrc: "http://img.b2bpic.net/free-photo/confident-young-beautiful-female-barber-uniform-holding-winner-cup-with-hair-clippers-showing-look-gesture-isolated-blue-wall_141793-105678.jpg" },
]}
title="Meet Our Stylists"
description="Passionate professionals dedicated to bringing your vision to life."
@@ -249,46 +141,11 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "1",
title: "Amazing Color!",
quote: "The best colorist in town. My hair feels so healthy and vibrant.",
name: "Jessica L.",
role: "Regular Client",
imageSrc: "http://img.b2bpic.net/free-photo/mutual-creative-work-young-beautiful-couple-casual-clothes-aprons-people-creating-bowl-pottery-wheel-clay-studio_1157-40131.jpg",
},
{
id: "2",
title: "Relaxing Oasis",
quote: "I love visiting this salon. Always professional and the results are consistently stunning.",
name: "Brian K.",
role: "Loyal Client",
imageSrc: "http://img.b2bpic.net/free-photo/young-black-people-taking-care-afro-hair_23-2149575437.jpg",
},
{
id: "3",
title: "Precision Cut",
quote: "Elena perfectly captured the style I wanted. Highly recommended!",
name: "Samantha P.",
role: "New Client",
imageSrc: "http://img.b2bpic.net/free-photo/closeup-excited-goodlooking-africanamerican-curlyhaired-woman-trendy-silver-glittering-dress-touc_1258-142766.jpg",
},
{
id: "4",
title: "Top Notch Quality",
quote: "Expensive but worth every penny for the quality of care.",
name: "Oliver D.",
role: "Loyal Client",
imageSrc: "http://img.b2bpic.net/free-photo/handsome-stylish-bearded-male-with-tattoo-arm-dressed-flannel-shirt-holding-juice-while-getting-haircut_613910-5727.jpg",
},
{
id: "5",
title: "So Friendly!",
quote: "The staff makes you feel incredibly welcome and listened to.",
name: "Chloe M.",
role: "Happy Guest",
imageSrc: "http://img.b2bpic.net/free-photo/friendly-young-interracial-girls-good-mood-wear-nightgowns-pajama-party-leisure-lifestyle-beauty-concept_197531-31732.jpg",
},
{ id: "1", title: "Amazing Color!", quote: "The best colorist in town. My hair feels so healthy and vibrant.", name: "Jessica L.", role: "Regular Client", imageSrc: "http://img.b2bpic.net/free-photo/mutual-creative-work-young-beautiful-couple-casual-clothes-aprons-people-creating-bowl-pottery-wheel-clay-studio_1157-40131.jpg" },
{ id: "2", title: "Relaxing Oasis", quote: "I love visiting this salon. Always professional and the results are consistently stunning.", name: "Brian K.", role: "Loyal Client", imageSrc: "http://img.b2bpic.net/free-photo/young-black-people-taking-care-afro-hair_23-2149575437.jpg" },
{ id: "3", title: "Precision Cut", quote: "Elena perfectly captured the style I wanted. Highly recommended!", name: "Samantha P.", role: "New Client", imageSrc: "http://img.b2bpic.net/free-photo/closeup-excited-goodlooking-africanamerican-curlyhaired-woman-trendy-silver-glittering-dress-touc_1258-142766.jpg" },
{ id: "4", title: "Top Notch Quality", quote: "Expensive but worth every penny for the quality of care.", name: "Oliver D.", role: "Loyal Client", imageSrc: "http://img.b2bpic.net/free-photo/handsome-stylish-bearded-male-with-tattoo-arm-dressed-flannel-shirt-holding-juice-while-getting-haircut_613910-5727.jpg" },
{ id: "5", title: "So Friendly!", quote: "The staff makes you feel incredibly welcome and listened to.", name: "Chloe M.", role: "Happy Guest", imageSrc: "http://img.b2bpic.net/free-photo/friendly-young-interracial-girls-good-mood-wear-nightgowns-pajama-party-leisure-lifestyle-beauty-concept_197531-31732.jpg" },
]}
title="Client Love"
description="Read what our wonderful clients are saying about their experience."
@@ -300,21 +157,9 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "f1",
title: "How do I book?",
content: "You can book directly through our website or give us a call.",
},
{
id: "f2",
title: "Do you offer consultations?",
content: "Yes, we offer complimentary 15-minute consultations for all new color clients.",
},
{
id: "f3",
title: "What is your cancellation policy?",
content: "Please provide 24 hours notice for any cancellations.",
},
{ id: "f1", title: "How do I book?", content: "You can book directly through our website or give us a call." },
{ id: "f2", title: "Do you offer consultations?", content: "Yes, we offer complimentary 15-minute consultations for all new color clients." },
{ id: "f3", title: "What is your cancellation policy?", content: "Please provide 24 hours notice for any cancellations." },
]}
title="Salon FAQs"
description="Everything you need to know about our booking process."
@@ -325,9 +170,7 @@ export default function LandingPage() {
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={false}
background={{
variant: "radial-gradient",
}}
background={{ variant: "radial-gradient" }}
tag="Let's Connect"
title="Visit Elegance Salon"
description="Ready for a transformation? Reach out to reserve your spot today."
@@ -341,16 +184,8 @@ export default function LandingPage() {
logoText="Elegance Salon"
copyrightText="© 2025 Elegance Salon. All rights reserved."
socialLinks={[
{
icon: Instagram,
href: "#",
ariaLabel: "Instagram",
},
{
icon: Facebook,
href: "#",
ariaLabel: "Facebook",
},
{ icon: Instagram, href: "#", ariaLabel: "Instagram" },
{ icon: Facebook, href: "#", ariaLabel: "Facebook" },
]}
/>
</div>