bender/0dd27b84-a656-4b63-8a92-c484cf032bae
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-04-07 15:19:36 +00:00
parent c6a1bed52b
commit 3de99a7d48
1 changed files with 64 additions and 312 deletions
Download Patch File Download Diff File Expand all files Collapse all files

376
src/app/page.tsx
View File

@@ -30,144 +30,54 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Services",
id: "#services",
},
{
name: "About",
id: "#about",
},
{
name: "Team",
id: "#team",
},
{
name: "Pricing",
id: "#pricing",
},
{
name: "Contact",
id: "#contact",
},
{ name: "Services", id: "services" },
{ name: "About", id: "about" },
{ name: "Team", id: "team" },
{ name: "Pricing", id: "pricing" },
{ name: "Contact", id: "contact" },
]}
brandName="4kfadez"
button={{
text: "Book Now",
href: "#contact",
}}
text: "Book Now", href: "#contact"}}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitDoubleCarousel
background={{
variant: "gradient-bars",
}}
background={{ variant: "gradient-bars" }}
title="Refining the Modern Gentleman"
description="Premium grooming meets contemporary lifestyle. Experience precision fades, beard sculpting, and the classic hot towel ritual in a sanctuary designed for the modern man."
leftCarouselItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg?_wi=1",
imageAlt: "Barber precision fade",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg?_wi=2",
imageAlt: "Barber precision fade",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg?_wi=3",
imageAlt: "Barber precision fade",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg?_wi=4",
imageAlt: "Barber precision fade",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg?_wi=5",
imageAlt: "Barber precision fade",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg?_wi=6",
imageAlt: "Barber precision fade",
},
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg", imageAlt: "Barber precision fade" },
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg", imageAlt: "Barber precision fade" },
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg", imageAlt: "Barber precision fade" },
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg", imageAlt: "Barber precision fade" },
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg", imageAlt: "Barber precision fade" },
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg", imageAlt: "Barber precision fade" },
]}
rightCarouselItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg?_wi=7",
imageAlt: "Vintage chair",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg?_wi=8",
imageAlt: "Vintage chair",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg?_wi=9",
imageAlt: "Vintage chair",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg?_wi=10",
imageAlt: "Vintage chair",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg?_wi=11",
imageAlt: "Vintage chair",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg?_wi=12",
imageAlt: "Vintage chair",
},
]}
buttons={[
{
text: "Book Appointment",
href: "#contact",
},
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg", imageAlt: "Vintage chair" },
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg", imageAlt: "Vintage chair" },
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg", imageAlt: "Vintage chair" },
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg", imageAlt: "Vintage chair" },
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg", imageAlt: "Vintage chair" },
{ imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg", imageAlt: "Vintage chair" },
]}
buttons={[{ text: "Book Appointment", href: "#contact" }]}
avatars={[
{
src: "http://img.b2bpic.net/free-photo/redhead-non-binary-person-smiling_23-2148760583.jpg",
alt: "Barber 1",
},
{
src: "http://img.b2bpic.net/free-photo/barber-man-apron-holding-brushes-beard-trimmer-smiling-standing-orange-wall_141793-61360.jpg",
alt: "Barber 2",
},
{
src: "http://img.b2bpic.net/free-photo/portrait-man-with-tattoo-his-face-arms-dressed-white-shirt-grey-background_613910-1412.jpg",
alt: "Barber 3",
},
{
src: "http://img.b2bpic.net/free-photo/low-angle-barbershop-concept_23-2148506214.jpg",
alt: "Client 1",
},
{
src: "http://img.b2bpic.net/free-photo/hairdresser-styling-mustache-client-salon_23-2148181984.jpg",
alt: "Client 2",
},
{ src: "http://img.b2bpic.net/free-photo/redhead-non-binary-person-smiling_23-2148760583.jpg", alt: "Barber 1" },
{ src: "http://img.b2bpic.net/free-photo/barber-man-apron-holding-brushes-beard-trimmer-smiling-standing-orange-wall_141793-61360.jpg", alt: "Barber 2" },
{ src: "http://img.b2bpic.net/free-photo/portrait-man-with-tattoo-his-face-arms-dressed-white-shirt-grey-background_613910-1412.jpg", alt: "Barber 3" },
{ src: "http://img.b2bpic.net/free-photo/low-angle-barbershop-concept_23-2148506214.jpg", alt: "Client 1" },
{ src: "http://img.b2bpic.net/free-photo/hairdresser-styling-mustache-client-salon_23-2148181984.jpg", alt: "Client 2" },
]}
avatarText="Trusted by 500+ gentlemen"
marqueeItems={[
{
type: "text",
text: "PRECISION FADES",
},
{
type: "text",
text: "HOT TOWEL SHAVES",
},
{
type: "text",
text: "BEARD ARTISTRY",
},
{
type: "text",
text: "PREMIUM GROOMING",
},
{
type: "text",
text: "MODERN STYLE",
},
{ type: "text", text: "PRECISION FADES" },
{ type: "text", text: "HOT TOWEL SHAVES" },
{ type: "text", text: "BEARD ARTISTRY" },
{ type: "text", text: "PREMIUM GROOMING" },
{ type: "text", text: "MODERN STYLE" },
]}
/>
</div>
@@ -176,15 +86,8 @@ export default function LandingPage() {
<InlineImageSplitTextAbout
useInvertedBackground={true}
heading={[
{
type: "text",
content: "More than just a haircut.",
},
{
type: "image",
src: "http://img.b2bpic.net/free-photo/barber-shop-interior_1163-2009.jpg",
alt: "Shop atmosphere",
},
{ type: "text", content: "More than just a haircut." },
{ type: "image", src: "http://img.b2bpic.net/free-photo/barber-shop-interior_1163-2009.jpg", alt: "Shop atmosphere" },
]}
/>
</div>
@@ -194,47 +97,23 @@ export default function LandingPage() {
animationType="slide-up"
textboxLayout="inline-image"
useInvertedBackground={false}
features={[
{
title: "Precision Fades",
description: "Crisp, clean, and perfectly blended fades tailored to your head shape and hair texture.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/barber-corrects-guy-s-beard_140725-7665.jpg?_wi=1",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/barber-corrects-guy-s-beard_140725-7665.jpg?_wi=2",
},
imageSrc: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg?_wi=13",
imageAlt: "barbershop interior dark atmosphere",
},
{
title: "Beard Sculpting",
description: "Refined beard grooming, trimming, and hot towel applications to maintain your distinct look.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/barber-corrects-guy-s-beard_140725-7665.jpg?_wi=3",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/barber-corrects-guy-s-beard_140725-7665.jpg?_wi=4",
},
imageSrc: "http://img.b2bpic.net/free-photo/barber-shop-interior_1163-2009.jpg",
imageAlt: "modern luxury barbershop interior design",
},
{
title: "Hot Towel Shave",
description: "The ultimate barber experience. Relaxing, soothing, and impossibly smooth results.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/barber-corrects-guy-s-beard_140725-7665.jpg?_wi=5",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/barber-corrects-guy-s-beard_140725-7665.jpg?_wi=6",
},
imageSrc: "http://img.b2bpic.net/free-photo/barber-corrects-guy-s-beard_140725-7665.jpg?_wi=7",
imageAlt: "precision hair fade cutting",
},
]}
showStepNumbers={true}
title="Mastery in Grooming"
description="Our services blend heritage techniques with modern styling to ensure you leave looking and feeling your best."
features={[
{
title: "Precision Fades", description: "Crisp, clean, and perfectly blended fades tailored to your head shape and hair texture.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/barber-corrects-guy-s-beard_140725-7665.jpg" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/barber-corrects-guy-s-beard_140725-7665.jpg" }
},
{
title: "Beard Sculpting", description: "Refined beard grooming, trimming, and hot towel applications to maintain your distinct look.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/barber-corrects-guy-s-beard_140725-7665.jpg" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/barber-corrects-guy-s-beard_140725-7665.jpg" }
},
{
title: "Hot Towel Shave", description: "The ultimate barber experience. Relaxing, soothing, and impossibly smooth results.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/barber-corrects-guy-s-beard_140725-7665.jpg" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/barber-corrects-guy-s-beard_140725-7665.jpg" }
},
]}
/>
</div>
@@ -245,52 +124,16 @@ export default function LandingPage() {
useInvertedBackground={true}
plans={[
{
id: "p1",
price: "450 kr",
name: "The Fade",
features: [
"Precision cut",
"Hot towel neck finish",
"Styling",
],
buttons: [
{
text: "Book",
href: "#contact",
},
],
id: "p1", price: "450 kr", name: "The Fade", features: ["Precision cut", "Hot towel neck finish", "Styling"],
buttons: [{ text: "Book", href: "#contact" }],
},
{
id: "p2",
price: "350 kr",
name: "Beard Grooming",
features: [
"Trimming",
"Hot towel",
"Beard oil treatment",
],
buttons: [
{
text: "Book",
href: "#contact",
},
],
id: "p2", price: "350 kr", name: "Beard Grooming", features: ["Trimming", "Hot towel", "Beard oil treatment"],
buttons: [{ text: "Book", href: "#contact" }],
},
{
id: "p3",
price: "600 kr",
name: "Signature Combo",
features: [
"Precision cut",
"Beard sculpting",
"Hot towel treatment",
],
buttons: [
{
text: "Book",
href: "#contact",
},
],
id: "p3", price: "600 kr", name: "Signature Combo", features: ["Precision cut", "Beard sculpting", "Hot towel treatment"],
buttons: [{ text: "Book", href: "#contact" }],
},
]}
title="Grooming Investment"
@@ -305,27 +148,9 @@ export default function LandingPage() {
gridVariant="asymmetric-60-wide-40-narrow"
useInvertedBackground={false}
members={[
{
id: "1",
name: "Marcus",
role: "Master Barber",
description: "10+ years experience in precision fading.",
imageSrc: "http://img.b2bpic.net/free-photo/redhead-non-binary-person-smiling_23-2148760583.jpg",
},
{
id: "2",
name: "Elias",
role: "Senior Stylist",
description: "Specialist in beard craft and wet shaves.",
imageSrc: "http://img.b2bpic.net/free-photo/barber-man-apron-holding-brushes-beard-trimmer-smiling-standing-orange-wall_141793-61360.jpg",
},
{
id: "3",
name: "Julian",
role: "Junior Stylist",
description: "Modern techniques and sharp finishes.",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-with-tattoo-his-face-arms-dressed-white-shirt-grey-background_613910-1412.jpg",
},
{ id: "1", name: "Marcus", role: "Master Barber", description: "10+ years experience in precision fading.", imageSrc: "http://img.b2bpic.net/free-photo/redhead-non-binary-person-smiling_23-2148760583.jpg" },
{ id: "2", name: "Elias", role: "Senior Stylist", description: "Specialist in beard craft and wet shaves.", imageSrc: "http://img.b2bpic.net/free-photo/barber-man-apron-holding-brushes-beard-trimmer-smiling-standing-orange-wall_141793-61360.jpg" },
{ id: "3", name: "Julian", role: "Junior Stylist", description: "Modern techniques and sharp finishes.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-with-tattoo-his-face-arms-dressed-white-shirt-grey-background_613910-1412.jpg" },
]}
title="Meet Your Masters"
description="Expert barbers dedicated to the craft."
@@ -338,46 +163,11 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={true}
testimonials={[
{
id: "1",
name: "John Doe",
handle: "@johndoe",
testimonial: "Best fade I have ever had.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-barbershop-concept_23-2148506214.jpg",
},
{
id: "2",
name: "Sam Smith",
handle: "@samsmith",
testimonial: "Incredibly professional staff.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-styling-mustache-client-salon_23-2148181984.jpg",
},
{
id: "3",
name: "Mike Ross",
handle: "@mikeross",
testimonial: "Great community vibe.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/crop-barber-holding-mousse-client_23-2147778804.jpg",
},
{
id: "4",
name: "Alex King",
handle: "@alexking",
testimonial: "4kfadez is the standard.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-male-waits-hairdresser-sitting-barber-chair_613910-18391.jpg",
},
{
id: "5",
name: "Chris Paul",
handle: "@chrispaul",
testimonial: "Clean shop, great cuts.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-showing-strong-emotions-mental-health-awareness_23-2151759613.jpg",
},
{ id: "1", name: "John Doe", handle: "@johndoe", testimonial: "Best fade I have ever had.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/low-angle-barbershop-concept_23-2148506214.jpg" },
{ id: "2", name: "Sam Smith", handle: "@samsmith", testimonial: "Incredibly professional staff.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-styling-mustache-client-salon_23-2148181984.jpg" },
{ id: "3", name: "Mike Ross", handle: "@mikeross", testimonial: "Great community vibe.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/crop-barber-holding-mousse-client_23-2147778804.jpg" },
{ id: "4", name: "Alex King", handle: "@alexking", testimonial: "4kfadez is the standard.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-male-waits-hairdresser-sitting-barber-chair_613910-18391.jpg" },
{ id: "5", name: "Chris Paul", handle: "@chrispaul", testimonial: "Clean shop, great cuts.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-showing-strong-emotions-mental-health-awareness_23-2151759613.jpg" },
]}
showRating={true}
title="What Clients Say"
@@ -391,18 +181,8 @@ export default function LandingPage() {
title="Book Your Seat"
description="Secure your spot at 4kfadez today."
inputs={[
{
name: "name",
type: "text",
placeholder: "Your Name",
required: true,
},
{
name: "email",
type: "email",
placeholder: "Email",
required: true,
},
{ name: "name", type: "text", placeholder: "Your Name", required: true },
{ name: "email", type: "email", placeholder: "Email", required: true },
]}
imageSrc="http://img.b2bpic.net/free-photo/hairdressing-chair-vintage-barber-shop_23-2148298304.jpg"
/>
@@ -411,36 +191,8 @@ export default function LandingPage() {
<div id="footer" data-section="footer">
<FooterBase
columns={[
{
title: "Menu",
items: [
{
label: "Services",
href: "#services",
},
{
label: "Pricing",
href: "#pricing",
},
{
label: "Contact",
href: "#contact",
},
],
},
{
title: "Connect",
items: [
{
label: "Instagram",
href: "#",
},
{
label: "Facebook",
href: "#",
},
],
},
{ title: "Menu", items: [{ label: "Services", href: "#services" }, { label: "Pricing", href: "#pricing" }, { label: "Contact", href: "#contact" }] },
{ title: "Connect", items: [{ label: "Instagram", href: "#" }, { label: "Facebook", href: "#" }] },
]}
logoText="4kfadez"
copyrightText="© 2025 4kfadez Barbershop"