Merge version_1 into main #2
233
src/app/page.tsx
233
src/app/page.tsx
@@ -30,21 +30,13 @@ export default function LandingPage() {
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
name: "Services", id: "services"},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "reviews",
|
||||
},
|
||||
name: "Reviews", id: "reviews"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "booking",
|
||||
},
|
||||
name: "Contact", id: "booking"},
|
||||
]}
|
||||
brandName="Master Fade"
|
||||
/>
|
||||
@@ -53,111 +45,61 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardTestimonial
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
variant: "radial-gradient"}}
|
||||
title="Master Fade Barbershop"
|
||||
description="Cloverdale, Perth — Est. in Excellence. Walk-in and experience master-level grooming at Perth's premier barbershop."
|
||||
testimonials={[
|
||||
{
|
||||
name: "David K.",
|
||||
handle: "@davidk",
|
||||
testimonial: "Best barbershop in Perth hands down. The atmosphere is unreal.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/anime-style-beauty-salon-with-cosmetology-equipment_23-2151500999.jpg?_wi=1",
|
||||
imageAlt: "luxury barbershop interior dark aesthetic",
|
||||
},
|
||||
name: "David K.", handle: "@davidk", testimonial: "Best barbershop in Perth hands down. The atmosphere is unreal.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/anime-style-beauty-salon-with-cosmetology-equipment_23-2151500999.jpg", imageAlt: "luxury barbershop interior dark aesthetic"},
|
||||
{
|
||||
name: "Michael S.",
|
||||
handle: "@mikes",
|
||||
testimonial: "Incredible fade, amazing service. This place is something special.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-cutting-client-s-hair_23-2148940859.jpg?_wi=1",
|
||||
imageAlt: "barber cutting hair with scissors",
|
||||
},
|
||||
name: "Michael S.", handle: "@mikes", testimonial: "Incredible fade, amazing service. This place is something special.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-cutting-client-s-hair_23-2148940859.jpg", imageAlt: "barber cutting hair with scissors"},
|
||||
{
|
||||
name: "James R.",
|
||||
handle: "@jamr",
|
||||
testimonial: "Armando really listens to what you want and delivers every single time.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-with-razor-blade_23-2151102215.jpg?_wi=1",
|
||||
imageAlt: "beard trim and shape",
|
||||
},
|
||||
name: "James R.", handle: "@jamr", testimonial: "Armando really listens to what you want and delivers every single time.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-with-razor-blade_23-2151102215.jpg", imageAlt: "beard trim and shape"},
|
||||
{
|
||||
name: "Robert B.",
|
||||
handle: "@robb",
|
||||
testimonial: "Won't go anywhere else for my cuts. Elite work.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-cuts-his-beard-barbershop_1157-16152.jpg?_wi=1",
|
||||
imageAlt: "full groom barber package",
|
||||
},
|
||||
name: "Robert B.", handle: "@robb", testimonial: "Won't go anywhere else for my cuts. Elite work.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-cuts-his-beard-barbershop_1157-16152.jpg", imageAlt: "full groom barber package"},
|
||||
{
|
||||
name: "Chris P.",
|
||||
handle: "@chrisp",
|
||||
testimonial: "Always professional, clean, and fast. The gold standard.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wooden-background-table_627829-6236.jpg?_wi=1",
|
||||
imageAlt: "barbershop interior design gold",
|
||||
},
|
||||
name: "Chris P.", handle: "@chrisp", testimonial: "Always professional, clean, and fast. The gold standard.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wooden-background-table_627829-6236.jpg", imageAlt: "barbershop interior design gold"},
|
||||
]}
|
||||
tag="Cloverdale, Perth"
|
||||
buttons={[
|
||||
{
|
||||
text: "Book an Appointment",
|
||||
href: "#booking",
|
||||
},
|
||||
text: "Book an Appointment", href: "#booking"},
|
||||
{
|
||||
text: "View Services",
|
||||
href: "#services",
|
||||
},
|
||||
text: "View Services", href: "#services"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/anime-style-beauty-salon-with-cosmetology-equipment_23-2151500999.jpg?_wi=2"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/anime-style-beauty-salon-with-cosmetology-equipment_23-2151500999.jpg"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/professional-barber-man-apron-holding-trimmer-showing-index-finger-number-one-being-amazed-standing-blue-wall_141793-96707.jpg",
|
||||
alt: "Client 1",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/professional-barber-man-apron-holding-trimmer-showing-index-finger-number-one-being-amazed-standing-blue-wall_141793-96707.jpg", alt: "Client 1"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/european-brutal-man-with-beard-cut-barbershop_343596-4697.jpg",
|
||||
alt: "Client 2",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/european-brutal-man-with-beard-cut-barbershop_343596-4697.jpg", alt: "Client 2"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/latino-hair-salon-owner-preparing-clients_23-2150286080.jpg",
|
||||
alt: "Client 3",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/latino-hair-salon-owner-preparing-clients_23-2150286080.jpg", alt: "Client 3"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/experienced-tattoo-artist-front-his-studio_23-2149479271.jpg",
|
||||
alt: "Client 4",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/experienced-tattoo-artist-front-his-studio_23-2149479271.jpg", alt: "Client 4"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/latino-hair-salon-owner-preparing-clients_23-2150286016.jpg",
|
||||
alt: "Client 5",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/latino-hair-salon-owner-preparing-clients_23-2150286016.jpg", alt: "Client 5"},
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Precision Cuts",
|
||||
icon: Scissors,
|
||||
type: "text-icon", text: "Precision Cuts", icon: Scissors,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Hot Towel Shaves",
|
||||
icon: Waves,
|
||||
type: "text-icon", text: "Hot Towel Shaves", icon: Waves,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Master Barbers",
|
||||
icon: Crown,
|
||||
type: "text-icon", text: "Master Barbers", icon: Crown,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Premium Grooming",
|
||||
icon: Sparkles,
|
||||
type: "text-icon", text: "Premium Grooming", icon: Sparkles,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Cloverdale Perth",
|
||||
icon: MapPin,
|
||||
type: "text-icon", text: "Cloverdale Perth", icon: MapPin,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
@@ -170,64 +112,46 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Signature Fade",
|
||||
description: "Precision skin fades, taper fades, and drop fades executed with surgical accuracy.",
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-cutting-client-s-hair_23-2148940859.jpg?_wi=2",
|
||||
title: "Signature Fade", description: "Precision skin fades, taper fades, and drop fades executed with surgical accuracy.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-cutting-client-s-hair_23-2148940859.jpg", imageAlt: "happy client after haircut"
|
||||
},
|
||||
items: [
|
||||
{
|
||||
text: "Precision Cutting",
|
||||
icon: Scissors,
|
||||
text: "Precision Cutting", icon: Scissors,
|
||||
},
|
||||
{
|
||||
text: "Sharp Fades",
|
||||
icon: Sparkles,
|
||||
text: "Sharp Fades", icon: Sparkles,
|
||||
},
|
||||
],
|
||||
reverse: false,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-barber-man-apron-holding-trimmer-showing-index-finger-number-one-being-amazed-standing-blue-wall_141793-96707.jpg?_wi=1",
|
||||
imageAlt: "happy client after haircut",
|
||||
},
|
||||
{
|
||||
title: "Beard Trim & Shape",
|
||||
description: "Clean lines, shaped edges, and a hot towel finish for your beard.",
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-with-razor-blade_23-2151102215.jpg?_wi=2",
|
||||
title: "Beard Trim & Shape", description: "Clean lines, shaped edges, and a hot towel finish for your beard.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-with-razor-blade_23-2151102215.jpg", imageAlt: "happy client after haircut"
|
||||
},
|
||||
items: [
|
||||
{
|
||||
text: "Hot Towel Finish",
|
||||
icon: Waves,
|
||||
text: "Hot Towel Finish", icon: Waves,
|
||||
},
|
||||
{
|
||||
text: "Sharp Lines",
|
||||
icon: Scissors,
|
||||
text: "Sharp Lines", icon: Scissors,
|
||||
},
|
||||
],
|
||||
reverse: true,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/european-brutal-man-with-beard-cut-barbershop_343596-4697.jpg?_wi=1",
|
||||
imageAlt: "happy client after haircut",
|
||||
},
|
||||
{
|
||||
title: "Full Groom Package",
|
||||
description: "Cut, beard, hot towel, and styling. The complete master-level experience.",
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-cuts-his-beard-barbershop_1157-16152.jpg?_wi=2",
|
||||
title: "Full Groom Package", description: "Cut, beard, hot towel, and styling. The complete master-level experience.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-cuts-his-beard-barbershop_1157-16152.jpg", imageAlt: "happy client after haircut"
|
||||
},
|
||||
items: [
|
||||
{
|
||||
text: "Signature Cut",
|
||||
icon: Crown,
|
||||
text: "Signature Cut", icon: Crown,
|
||||
},
|
||||
{
|
||||
text: "Beard Care",
|
||||
icon: Sparkles,
|
||||
text: "Beard Care", icon: Sparkles,
|
||||
},
|
||||
],
|
||||
reverse: false,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/latino-hair-salon-owner-preparing-clients_23-2150286080.jpg?_wi=1",
|
||||
imageAlt: "happy client after haircut",
|
||||
},
|
||||
]}
|
||||
title="Our Services"
|
||||
@@ -243,7 +167,7 @@ export default function LandingPage() {
|
||||
description="Master Fade Barbershop in Cloverdale isn't just a haircut — it's an experience. Every detail from the gold chairs to our design is intentional."
|
||||
subdescription="Armando and the team bring skill, passion, and personality to every client. Walk-ins are always welcome, 7 days a week."
|
||||
icon={Scissors}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/barber-tools-wooden-background-table_627829-6236.jpg?_wi=2"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/barber-tools-wooden-background-table_627829-6236.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
@@ -255,40 +179,15 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "David K.",
|
||||
role: "Google Client",
|
||||
testimonial: "Best barbershop in Perth hands down. The atmosphere is elite.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-barber-man-apron-holding-trimmer-showing-index-finger-number-one-being-amazed-standing-blue-wall_141793-96707.jpg?_wi=2",
|
||||
},
|
||||
id: "1", name: "David K.", role: "Google Client", testimonial: "Best barbershop in Perth hands down. The atmosphere is elite.", imageSrc: "http://img.b2bpic.net/free-photo/professional-barber-man-apron-holding-trimmer-showing-index-finger-number-one-being-amazed-standing-blue-wall_141793-96707.jpg"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Michael S.",
|
||||
role: "Google Client",
|
||||
testimonial: "Incredible fade, amazing service. This place is something special.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/european-brutal-man-with-beard-cut-barbershop_343596-4697.jpg?_wi=2",
|
||||
},
|
||||
id: "2", name: "Michael S.", role: "Google Client", testimonial: "Incredible fade, amazing service. This place is something special.", imageSrc: "http://img.b2bpic.net/free-photo/european-brutal-man-with-beard-cut-barbershop_343596-4697.jpg"},
|
||||
{
|
||||
id: "3",
|
||||
name: "James R.",
|
||||
role: "Google Client",
|
||||
testimonial: "Armando really listens to what you want and delivers every single time.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/latino-hair-salon-owner-preparing-clients_23-2150286080.jpg?_wi=2",
|
||||
},
|
||||
id: "3", name: "James R.", role: "Google Client", testimonial: "Armando really listens to what you want and delivers every single time.", imageSrc: "http://img.b2bpic.net/free-photo/latino-hair-salon-owner-preparing-clients_23-2150286080.jpg"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Robert B.",
|
||||
role: "Google Client",
|
||||
testimonial: "Won't go anywhere else for my cuts. Everything is perfect.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/experienced-tattoo-artist-front-his-studio_23-2149479271.jpg",
|
||||
},
|
||||
id: "4", name: "Robert B.", role: "Google Client", testimonial: "Won't go anywhere else for my cuts. Everything is perfect.", imageSrc: "http://img.b2bpic.net/free-photo/experienced-tattoo-artist-front-his-studio_23-2149479271.jpg"},
|
||||
{
|
||||
id: "5",
|
||||
name: "Chris P.",
|
||||
role: "Google Client",
|
||||
testimonial: "Always professional, clean, and fast. The gold standard in Perth.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/latino-hair-salon-owner-preparing-clients_23-2150286016.jpg",
|
||||
},
|
||||
id: "5", name: "Chris P.", role: "Google Client", testimonial: "Always professional, clean, and fast. The gold standard in Perth.", imageSrc: "http://img.b2bpic.net/free-photo/latino-hair-salon-owner-preparing-clients_23-2150286016.jpg"},
|
||||
]}
|
||||
title="What Our Clients Say"
|
||||
description="Join over 1,700 satisfied customers who have experienced our service."
|
||||
@@ -302,20 +201,14 @@ export default function LandingPage() {
|
||||
description="Walk in anytime — no appointment necessary. We're open 7 days a week in Cloverdale."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
name: "name", type: "text", placeholder: "Your Name", required: true,
|
||||
},
|
||||
{
|
||||
name: "phone",
|
||||
type: "tel",
|
||||
placeholder: "Your Phone",
|
||||
required: true,
|
||||
name: "phone", type: "tel", placeholder: "Your Phone", required: true,
|
||||
},
|
||||
]}
|
||||
buttonText="Check Hours"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/barber-tools-wooden-background-table_627829-6236.jpg?_wi=3"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/barber-tools-wooden-background-table_627829-6236.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -325,37 +218,23 @@ export default function LandingPage() {
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
label: "Services", href: "#services"},
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
label: "About Us", href: "#about"},
|
||||
{
|
||||
label: "Reviews",
|
||||
href: "#reviews",
|
||||
},
|
||||
label: "Reviews", href: "#reviews"},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#booking",
|
||||
},
|
||||
label: "Contact", href: "#booking"},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Instagram",
|
||||
href: "#",
|
||||
},
|
||||
label: "Instagram", href: "#"},
|
||||
{
|
||||
label: "Facebook",
|
||||
href: "#",
|
||||
},
|
||||
label: "Facebook", href: "#"},
|
||||
{
|
||||
label: "Google Maps",
|
||||
href: "#",
|
||||
},
|
||||
label: "Google Maps", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
Reference in New Issue
Block a user