Merge version_1 into main #1
277
src/app/page.tsx
277
src/app/page.tsx
@@ -30,22 +30,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "#services",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "#testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Services", id: "#services" },
|
||||
{ name: "Testimonials", id: "#testimonials" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="Hair Hub"
|
||||
/>
|
||||
@@ -53,92 +41,30 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardTestimonial
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Professional Salon Services in Winnipeg"
|
||||
description="Experience premium hair care and styling tailored to your unique look. Book your appointment today and rediscover your confidence."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Sarah W.",
|
||||
handle: "@sarahw",
|
||||
testimonial: "Best hair cut I've had in years! Absolutely love the transformation.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-handsome-male-barber-uniform-holding-out-straight-razor-camera-isolated-blue_141793-73815.jpg",
|
||||
},
|
||||
{
|
||||
name: "Michael B.",
|
||||
handle: "@mikeb",
|
||||
testimonial: "Great attention to detail. Professional and welcoming atmosphere.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-men-bachelor-party_23-2149275459.jpg",
|
||||
},
|
||||
{
|
||||
name: "Elena K.",
|
||||
handle: "@elenak",
|
||||
testimonial: "The stylist listened to exactly what I wanted. Highly recommend!",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hostess-latino-hair-salon_23-2150555153.jpg",
|
||||
},
|
||||
{
|
||||
name: "David L.",
|
||||
handle: "@davidl",
|
||||
testimonial: "Always a pleasure visiting this shop. Consistent quality every time.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-soccer-fan-watching-euro-final_23-2151696841.jpg",
|
||||
},
|
||||
{
|
||||
name: "Jessica R.",
|
||||
handle: "@jessr",
|
||||
testimonial: "Incredible skills! My color looks better than ever.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-portrait-magnificent-young-sensual-model-with-long-brown-hairs-shy-cute-smile-natural-pure-beauty-soft-make-up_291049-1735.jpg",
|
||||
},
|
||||
{ name: "Sarah W.", handle: "@sarahw", testimonial: "Best hair cut I've had in years! Absolutely love the transformation.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-handsome-male-barber-uniform-holding-out-straight-razor-camera-isolated-blue_141793-73815.jpg" },
|
||||
{ name: "Michael B.", handle: "@mikeb", testimonial: "Great attention to detail. Professional and welcoming atmosphere.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-men-bachelor-party_23-2149275459.jpg" },
|
||||
{ name: "Elena K.", handle: "@elenak", testimonial: "The stylist listened to exactly what I wanted. Highly recommend!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/hostess-latino-hair-salon_23-2150555153.jpg" },
|
||||
{ name: "David L.", handle: "@davidl", testimonial: "Always a pleasure visiting this shop. Consistent quality every time.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-soccer-fan-watching-euro-final_23-2151696841.jpg" },
|
||||
{ name: "Jessica R.", handle: "@jessr", testimonial: "Incredible skills! My color looks better than ever.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-portrait-magnificent-young-sensual-model-with-long-brown-hairs-shy-cute-smile-natural-pure-beauty-soft-make-up_291049-1735.jpg" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/barbershop-washbasin-with-professional-chairs_23-2148298338.jpg"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/hair-salon-workplace_23-2148108753.jpg",
|
||||
alt: "Stylist at work",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/mirror-hairdressing-salon_23-2147670185.jpg",
|
||||
alt: "Salon mirror",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/beautician-styling-clients-hair_107420-94677.jpg",
|
||||
alt: "Beautician styling",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/lodge-wintertime-with-ski-gear_482257-76632.jpg",
|
||||
alt: "Winter salon vibe",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiling-young-handsome-male-barber-uniform-holding-out-straight-razor-camera-isolated-blue_141793-73815.jpg",
|
||||
alt: "Happy client",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/hair-salon-workplace_23-2148108753.jpg", alt: "Stylist at work" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/mirror-hairdressing-salon_23-2147670185.jpg", alt: "Salon mirror" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/beautician-styling-clients-hair_107420-94677.jpg", alt: "Beautician styling" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/lodge-wintertime-with-ski-gear_482257-76632.jpg", alt: "Winter salon vibe" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/smiling-young-handsome-male-barber-uniform-holding-out-straight-razor-camera-isolated-blue_141793-73815.jpg", alt: "Happy client" },
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Premium Salon Quality",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Experienced Professionals",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Modern Techniques",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Customer Satisfaction",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Hair Wellness Expert",
|
||||
},
|
||||
{ type: "text", text: "Premium Salon Quality" },
|
||||
{ type: "text", text: "Experienced Professionals" },
|
||||
{ type: "text", text: "Modern Techniques" },
|
||||
{ type: "text", text: "Customer Satisfaction" },
|
||||
{ type: "text", text: "Hair Wellness Expert" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -158,27 +84,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "s1",
|
||||
title: "Precision Cuts",
|
||||
subtitle: "Modern styling for every hair type.",
|
||||
category: "Styling",
|
||||
value: "Essential",
|
||||
},
|
||||
{
|
||||
id: "s2",
|
||||
title: "Custom Color",
|
||||
subtitle: "Vibrant and healthy hair color transformations.",
|
||||
category: "Coloring",
|
||||
value: "Premium",
|
||||
},
|
||||
{
|
||||
id: "s3",
|
||||
title: "Restorative Treatments",
|
||||
subtitle: "Nourishing therapies to revive your hair.",
|
||||
category: "Care",
|
||||
value: "Treatment",
|
||||
},
|
||||
{ id: "s1", title: "Precision Cuts", subtitle: "Modern styling for every hair type.", category: "Styling", value: "Essential" },
|
||||
{ id: "s2", title: "Custom Color", subtitle: "Vibrant and healthy hair color transformations.", category: "Coloring", value: "Premium" },
|
||||
{ id: "s3", title: "Restorative Treatments", subtitle: "Nourishing therapies to revive your hair.", category: "Care", value: "Treatment" },
|
||||
]}
|
||||
title="Professional Services"
|
||||
description="Comprehensive hair care solutions delivered with precision and care."
|
||||
@@ -187,63 +95,30 @@ export default function LandingPage() {
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
animationType="blur-reveal"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah W.",
|
||||
role: "Designer",
|
||||
company: "Local Agency",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-businessman-white-shirt-headphones-with-microphone-looking-camera-smiling-showing-thumbs-up-sitting-table-offise-white-background_141793-53945.jpg",
|
||||
},
|
||||
id: "t1", name: "Sarah W.", role: "Designer", company: "Local Agency", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-businessman-white-shirt-headphones-with-microphone-looking-camera-smiling-showing-thumbs-up-sitting-table-offise-white-background_141793-53945.jpg"},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Elena K.",
|
||||
role: "Creative",
|
||||
company: "Winnipeg Arts",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-cute-woman-outdoor_624325-1405.jpg",
|
||||
},
|
||||
id: "t2", name: "Elena K.", role: "Creative", company: "Winnipeg Arts", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-cute-woman-outdoor_624325-1405.jpg"},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Jessica R.",
|
||||
role: "Teacher",
|
||||
company: "Education Board",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/sitting-hair-dresser-posing_23-2148108747.jpg",
|
||||
},
|
||||
id: "t3", name: "Jessica R.", role: "Teacher", company: "Education Board", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/sitting-hair-dresser-posing_23-2148108747.jpg"},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Michael B.",
|
||||
role: "Entrepreneur",
|
||||
company: "TechHub",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/excited-young-male-barber-wearing-glasses-red-shirt-barber-apron-holding-barbering-tools-looking-camera-showing-thumb-up-isolated-blue-background_141793-138548.jpg",
|
||||
},
|
||||
id: "t4", name: "Michael B.", role: "Entrepreneur", company: "TechHub", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/excited-young-male-barber-wearing-glasses-red-shirt-barber-apron-holding-barbering-tools-looking-camera-showing-thumb-up-isolated-blue-background_141793-138548.jpg"},
|
||||
{
|
||||
id: "t5",
|
||||
name: "David L.",
|
||||
role: "Consultant",
|
||||
company: "Winnipeg Consulting",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-beach-vacation-lifestyle-portrait-concept_53876-42785.jpg",
|
||||
},
|
||||
id: "t5", name: "David L.", role: "Consultant", company: "Winnipeg Consulting", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-beach-vacation-lifestyle-portrait-concept_53876-42785.jpg"},
|
||||
]}
|
||||
kpiItems={[
|
||||
{
|
||||
value: "500+",
|
||||
label: "Happy Clients",
|
||||
},
|
||||
{
|
||||
value: "10y",
|
||||
label: "Years Experience",
|
||||
},
|
||||
{
|
||||
value: "4.9★",
|
||||
label: "Rating",
|
||||
},
|
||||
{ value: "500+", label: "Happy Clients" },
|
||||
{ value: "10y", label: "Years Experience" },
|
||||
{ value: "4.9★", label: "Rating" },
|
||||
]}
|
||||
title="Client Stories"
|
||||
description="What our wonderful clients have to say about their experience."
|
||||
@@ -255,21 +130,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "How do I book an appointment?",
|
||||
content: "You can contact us via phone or visit the salon for a walk-in consultation.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Do you offer consultations?",
|
||||
content: "Yes, we encourage consultations to discuss your desired look before any major changes.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "What products do you use?",
|
||||
content: "We use professional, salon-grade products known for their quality and effectiveness.",
|
||||
},
|
||||
{ id: "q1", title: "How do I book an appointment?", content: "You can contact us via phone or visit the salon for a walk-in consultation." },
|
||||
{ id: "q2", title: "Do you offer consultations?", content: "Yes, we encourage consultations to discuss your desired look before any major changes." },
|
||||
{ id: "q3", title: "What products do you use?", content: "We use professional, salon-grade products known for their quality and effectiveness." },
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Everything you need to know about booking and services."
|
||||
@@ -286,35 +149,11 @@ export default function LandingPage() {
|
||||
description="Tips, trends, and care advice from our salon experts."
|
||||
blogs={[
|
||||
{
|
||||
id: "b1",
|
||||
category: "Hair Care",
|
||||
title: "5 Tips for Shiny Hair",
|
||||
excerpt: "Keep your hair healthy with these simple daily routines.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-cheerful-woman-brushing-her-long-hair_1098-4046.jpg",
|
||||
authorName: "Admin",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/happy-call-center-agent-with-headset-gesturing-while-looking-camera_637285-6473.jpg",
|
||||
date: "Jan 12, 2025",
|
||||
},
|
||||
id: "b1", category: "Hair Care", title: "5 Tips for Shiny Hair", excerpt: "Keep your hair healthy with these simple daily routines.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-cheerful-woman-brushing-her-long-hair_1098-4046.jpg", authorName: "Admin", authorAvatar: "http://img.b2bpic.net/free-photo/happy-call-center-agent-with-headset-gesturing-while-looking-camera_637285-6473.jpg", date: "Jan 12, 2025"},
|
||||
{
|
||||
id: "b2",
|
||||
category: "Trends",
|
||||
title: "Summer Hair Color Trends",
|
||||
excerpt: "Explore the most popular colors of the season.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-shopping-mall_23-2150585938.jpg",
|
||||
authorName: "Admin",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/excited-young-beautiful-female-barber-uniform-holding-hair-clipper-with-comb-isolated-green-wall_141793-105764.jpg",
|
||||
date: "Jan 15, 2025",
|
||||
},
|
||||
id: "b2", category: "Trends", title: "Summer Hair Color Trends", excerpt: "Explore the most popular colors of the season.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-shopping-mall_23-2150585938.jpg", authorName: "Admin", authorAvatar: "http://img.b2bpic.net/free-photo/excited-young-beautiful-female-barber-uniform-holding-hair-clipper-with-comb-isolated-green-wall_141793-105764.jpg", date: "Jan 15, 2025"},
|
||||
{
|
||||
id: "b3",
|
||||
category: "Maintenance",
|
||||
title: "How to Maintain Your Cut",
|
||||
excerpt: "Keep your haircut fresh and styled between salon visits.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pretty-brunette-looks-her-shoulder_8353-1685.jpg",
|
||||
authorName: "Admin",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/excited-young-beautiful-female-barber-uniform-holding-barber-tools-doing-haircut-boy-isolated-pink-wall_141793-105762.jpg",
|
||||
date: "Jan 20, 2025",
|
||||
},
|
||||
id: "b3", category: "Maintenance", title: "How to Maintain Your Cut", excerpt: "Keep your haircut fresh and styled between salon visits.", imageSrc: "http://img.b2bpic.net/free-photo/pretty-brunette-looks-her-shoulder_8353-1685.jpg", authorName: "Admin", authorAvatar: "http://img.b2bpic.net/free-photo/excited-young-beautiful-female-barber-uniform-holding-barber-tools-doing-haircut-boy-isolated-pink-wall_141793-105762.jpg", date: "Jan 20, 2025"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -322,9 +161,7 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Contact"
|
||||
title="Get in Touch"
|
||||
description="Have questions? We would love to help you with your hair care needs."
|
||||
@@ -337,29 +174,15 @@ export default function LandingPage() {
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
title: "Company", items: [
|
||||
{ label: "About", href: "#about" },
|
||||
{ label: "Services", href: "#services" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Help",
|
||||
items: [
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
title: "Help", items: [
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
Reference in New Issue
Block a user