Merge version_2 into main #5
@@ -8,8 +8,8 @@ import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
||||
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
||||
import { Scissors } from "lucide-react";
|
||||
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
||||
import { Zap, Scissors, Star } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -17,7 +17,7 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="elastic-effect"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="pill"
|
||||
contentWidth="mediumLarge"
|
||||
contentWidth="mediumSmall"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="noiseDiagonalGradient"
|
||||
cardStyle="glass-depth"
|
||||
@@ -29,91 +29,81 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
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="Pablo's Barbershop"
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
title="Sophisticated Grooming for the Modern Gentleman"
|
||||
description="Experience the pinnacle of barbering arts at Pablo's. Where heritage techniques meet contemporary refinement."
|
||||
buttons={[{ text: "Reserve Your Seat", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/barber-holding-razor-client_23-2148506354.jpg"
|
||||
imageAlt="Master barber at work"
|
||||
title="Mastery in Every Cut"
|
||||
description="Pablo's Barbershop delivers a premium grooming experience, blending classic tradition with modern precision. Redefine your style with our expert artisans."
|
||||
buttons={[{ text: "Book Your Session", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/man-getting-his-beard-shaved-with-razor_107420-94772.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
tag="Our Philosophy"
|
||||
title="Artisanship Reimagined"
|
||||
description="At Pablo's Barbershop, we hold ourselves to a standard beyond the ordinary. Our master artisans are dedicated to crafting your identity through precise grooming and ritualistic attention to detail."
|
||||
subdescription="Every service is a curated experience, designed to elevate your confidence and presence."
|
||||
tag="Legacy & Tradition"
|
||||
title="The Pablo's Difference"
|
||||
description="At Pablo's, we believe a haircut is more than just a trim—it's a ritual. Our legacy of precision, style, and dedicated care has made us the cornerstone of premium men's grooming."
|
||||
subdescription="Every service is an artisanal experience designed to elevate your personal style."
|
||||
icon={Scissors}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/barber-corrects-guy-s-beard_140725-7665.jpg"
|
||||
imageAlt="The art of the cut"
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardThree
|
||||
animationType="blur-reveal"
|
||||
title="Signature Services"
|
||||
description="Discover our curated suite of premium grooming options."
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
title="Signature Grooming"
|
||||
description="Our premium menu is designed for those who appreciate the finer things in life."
|
||||
useInvertedBackground={false}
|
||||
animationType="blur-reveal"
|
||||
textboxLayout="split-description"
|
||||
features={[
|
||||
{
|
||||
title: "The Master Cut", description: "Custom tailoring your hair to your face shape and personal style.", imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-cutting-man-s-hair-barber-shop_23-2149186462.jpg"
|
||||
},
|
||||
title: "Traditional Shave", description: "A hot-towel experience for a smooth, classic finish.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-doing-his-job_23-2149220583.jpg"},
|
||||
{
|
||||
title: "Royal Shave", description: "Full hot-towel treatment and precision straight-razor finish.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-doing-his-job_23-2149220583.jpg"
|
||||
},
|
||||
title: "Precision Cut", description: "Bespoke styling tailored to your specific facial structure.", imageSrc: "http://img.b2bpic.net/free-photo/female-hairdresser-cutting-hair-bearded-hipster-male-saloon_613910-5711.jpg"},
|
||||
{
|
||||
title: "Sculpted Beard", description: "Refined beard shaping and moisturizing treatment for a healthy look.", imageSrc: "http://img.b2bpic.net/free-photo/crop-barber-combing-moustache-client_23-2147778841.jpg"
|
||||
}
|
||||
title: "Beard Sculpting", description: "Expert grooming to define and enhance your beard.", imageSrc: "http://img.b2bpic.net/free-photo/crop-barber-combing-moustache-client_23-2147778841.jpg"}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
animationType="depth-3d"
|
||||
title="Voices of Distinction"
|
||||
description="Trusted by our clientele for unrivaled quality and sophistication."
|
||||
kpiItems={[
|
||||
{ value: "5k+", label: "Premium Grooms" },
|
||||
{ value: "100%", label: "Satisfaction Rate" },
|
||||
{ value: "20+", label: "Years of Mastery" }
|
||||
]}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Julian V.", role: "Executive", company: "Vanguard", rating: 5 },
|
||||
{ id: "2", name: "Marcus R.", role: "Art Director", company: "CreativeCo", rating: 5 },
|
||||
{ id: "3", name: "Samuel L.", role: "Consultant", company: "Strategy", rating: 5 }
|
||||
]}
|
||||
<TestimonialCardSix
|
||||
title="Words from Gentlemen"
|
||||
description="Trusted by the city's most discerning men."
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1", name: "Arthur J.", handle: "@arthur_j", testimonial: "The best grooming experience I've ever had. Truly masterful technique.", icon: Star
|
||||
},
|
||||
{
|
||||
id: "t2", name: "Benjamin S.", handle: "@bens_arch", testimonial: "Pablo's is a classic. Always consistent, always precise.", icon: Star
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
title="Book Your Experience"
|
||||
description="Pablo's operates by appointment to ensure every client receives our undivided attention."
|
||||
useInvertedBackground={false}
|
||||
title="Book Your Chair"
|
||||
description="Secure a spot for your next session at our premier shop."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Full Name" },
|
||||
{ name: "email", type: "email", placeholder: "Email Address" }
|
||||
{ name: "name", type: "text", placeholder: "Full Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Email Address", required: true }
|
||||
]}
|
||||
textarea={{ name: "request", placeholder: "How can we assist you?" }}
|
||||
textarea={{ name: "message", placeholder: "Tell us what service you're looking for..." }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/front-view-baber-shop-chiar_23-2148506341.jpg"
|
||||
/>
|
||||
</div>
|
||||
@@ -122,12 +112,16 @@ export default function LandingPage() {
|
||||
<FooterBaseCard
|
||||
logoText="Pablo's Barbershop"
|
||||
columns={[
|
||||
{ title: "Information", items: [{ label: "About Us", href: "#about" }, { label: "Services", href: "#services" }] },
|
||||
{ title: "Support", items: [{ label: "Appointments", href: "#contact" }, { label: "Privacy Policy", href: "#" }] }
|
||||
{
|
||||
title: "Connect", items: [
|
||||
{ label: "About", href: "#about" },
|
||||
{ label: "Contact", href: "#contact" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #0a0a0a;
|
||||
--card: #1a1a1a;
|
||||
--foreground: #ffffffe6;
|
||||
--primary-cta: #ffdf7d;
|
||||
--background: #050505;
|
||||
--card: #121212;
|
||||
--foreground: #f5f5f5;
|
||||
--primary-cta: #d4af37;
|
||||
--primary-cta-text: #f5f4ef;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta: #1c1c1c;
|
||||
--secondary-cta-text: #2a2928;
|
||||
--accent: #b8860b;
|
||||
--background-accent: #8b6914;
|
||||
--accent: #d4af37;
|
||||
--background-accent: #1a1a1a;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user