Merge version_2 into main #2
253
src/app/page.tsx
253
src/app/page.tsx
@@ -16,7 +16,7 @@ import { Crown, Scissors } from "lucide-react";
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-bubble"
|
||||
defaultButtonVariant="elastic-effect"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="soft"
|
||||
contentWidth="mediumLarge"
|
||||
@@ -32,50 +32,33 @@ export default function LandingPage() {
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
name: "Services", id: "services"},
|
||||
{
|
||||
name: "About Us",
|
||||
id: "about",
|
||||
},
|
||||
name: "About Us", id: "about"},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "pricing",
|
||||
},
|
||||
name: "Pricing", id: "pricing"},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "testimonials",
|
||||
},
|
||||
name: "Testimonials", id: "testimonials"},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "faq",
|
||||
},
|
||||
name: "FAQ", id: "faq"},
|
||||
]}
|
||||
brandName="Dunamis Barbershop"
|
||||
button={{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
}}
|
||||
text: "Book Now", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboardSplit
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
variant: "radial-gradient"}}
|
||||
logoText="Dunamis Barbershop"
|
||||
description="Experience the perfect blend of classic artistry and modern style. Where precision meets passion, your look is transformed."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book an Appointment",
|
||||
href: "#contact",
|
||||
},
|
||||
text: "Book an Appointment", href: "#contact"},
|
||||
{
|
||||
text: "Our Services",
|
||||
href: "#services",
|
||||
},
|
||||
text: "Our Services", href: "#services"},
|
||||
]}
|
||||
layoutOrder="default"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/crop-barber-shaving-hair-unrecognizable-man_23-2147778749.jpg"
|
||||
@@ -89,19 +72,13 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
heading={[
|
||||
{
|
||||
type: "text",
|
||||
content: "About ",
|
||||
},
|
||||
type: "text", content: "About "},
|
||||
{
|
||||
type: "text",
|
||||
content: "Dunamis Barbershop",
|
||||
},
|
||||
type: "text", content: "Dunamis Barbershop"},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Meet Our Barbers",
|
||||
href: "#team",
|
||||
},
|
||||
text: "Meet Our Barbers", href: "#team"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -113,32 +90,16 @@ export default function LandingPage() {
|
||||
features={[
|
||||
{
|
||||
id: 1,
|
||||
title: "Precision Haircuts",
|
||||
description: "Expertly crafted cuts tailored to your head shape and desired style. Includes a refreshing wash and hot towel finish.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313017.jpg",
|
||||
imageAlt: "Precision haircut with scissors and comb",
|
||||
},
|
||||
title: "Precision Haircuts", description: "Expertly crafted cuts tailored to your head shape and desired style. Includes a refreshing wash and hot towel finish.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313017.jpg", imageAlt: "Precision haircut with scissors and comb"},
|
||||
{
|
||||
id: 2,
|
||||
title: "Classic Royal Shave",
|
||||
description: "Experience the ultimate relaxation with our traditional hot lather and straight razor shave, leaving your skin smooth and revitalized.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-bearded-man-getting-shaved-with-straight-edge-razor-by-hairdresser-barbershop_1153-9769.jpg",
|
||||
imageAlt: "Traditional hot towel royal shave",
|
||||
},
|
||||
title: "Classic Royal Shave", description: "Experience the ultimate relaxation with our traditional hot lather and straight razor shave, leaving your skin smooth and revitalized.", imageSrc: "http://img.b2bpic.net/free-photo/young-bearded-man-getting-shaved-with-straight-edge-razor-by-hairdresser-barbershop_1153-9769.jpg", imageAlt: "Traditional hot towel royal shave"},
|
||||
{
|
||||
id: 3,
|
||||
title: "Beard Trims & Styling",
|
||||
description: "Keep your beard looking sharp and well-groomed with our precise trimming, shaping, and conditioning services.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-hairdresser-shop_23-2149220531.jpg",
|
||||
imageAlt: "Professional beard trim and shaping",
|
||||
},
|
||||
title: "Beard Trims & Styling", description: "Keep your beard looking sharp and well-groomed with our precise trimming, shaping, and conditioning services.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-hairdresser-shop_23-2149220531.jpg", imageAlt: "Professional beard trim and shaping"},
|
||||
{
|
||||
id: 4,
|
||||
title: "Hair & Scalp Treatments",
|
||||
description: "Revitalize your hair and scalp with our nourishing treatments, designed to promote healthy hair growth and shine.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-bearded-barber-man-apron-making-haircut-with-shaving-machine-young-man-standing-orange-wall_141793-48301.jpg",
|
||||
imageAlt: "Hair styling with products and brush",
|
||||
},
|
||||
title: "Hair & Scalp Treatments", description: "Revitalize your hair and scalp with our nourishing treatments, designed to promote healthy hair growth and shine.", imageSrc: "http://img.b2bpic.net/free-photo/professional-bearded-barber-man-apron-making-haircut-with-shaving-machine-young-man-standing-orange-wall_141793-48301.jpg", imageAlt: "Hair styling with products and brush"},
|
||||
]}
|
||||
title="Our Signature Services"
|
||||
description="From classic cuts to modern styles, our experienced barbers provide personalized grooming experiences tailored just for you."
|
||||
@@ -152,59 +113,25 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "basic-cut",
|
||||
tag: "Standard",
|
||||
tagIcon: Scissors,
|
||||
price: "$35",
|
||||
period: "per service",
|
||||
description: "A sharp, clean cut for a fresh everyday look.",
|
||||
button: {
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
featuresTitle: "Includes:",
|
||||
features: [
|
||||
"Precision Haircut",
|
||||
"Refreshing Hair Wash",
|
||||
"Hot Towel Finish",
|
||||
],
|
||||
id: "basic-cut", tag: "Standard", tagIcon: Scissors,
|
||||
price: "$35", period: "per service", description: "A sharp, clean cut for a fresh everyday look.", button: {
|
||||
text: "Book Now", href: "#contact"},
|
||||
featuresTitle: "Includes:", features: [
|
||||
"Precision Haircut", "Refreshing Hair Wash", "Hot Towel Finish"],
|
||||
},
|
||||
{
|
||||
id: "royal-package",
|
||||
tag: "Popular",
|
||||
tagIcon: Crown,
|
||||
price: "$70",
|
||||
period: "per service",
|
||||
description: "The ultimate grooming experience for refined gentlemen.",
|
||||
button: {
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
featuresTitle: "Includes:",
|
||||
features: [
|
||||
"Precision Haircut",
|
||||
"Classic Royal Shave",
|
||||
"Beard Trim & Shape",
|
||||
"Hair & Scalp Treatment",
|
||||
],
|
||||
id: "royal-package", tag: "Popular", tagIcon: Crown,
|
||||
price: "$70", period: "per service", description: "The ultimate grooming experience for refined gentlemen.", button: {
|
||||
text: "Book Now", href: "#contact"},
|
||||
featuresTitle: "Includes:", features: [
|
||||
"Precision Haircut", "Classic Royal Shave", "Beard Trim & Shape", "Hair & Scalp Treatment"],
|
||||
},
|
||||
{
|
||||
id: "beard-express",
|
||||
tag: "Quick Groom",
|
||||
tagIcon: Scissors,
|
||||
price: "$25",
|
||||
period: "per service",
|
||||
description: "Quick and precise beard grooming for a sharp look.",
|
||||
button: {
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
featuresTitle: "Includes:",
|
||||
features: [
|
||||
"Beard Trim & Line-up",
|
||||
"Moisturizing Balm",
|
||||
"Facial Hair Styling",
|
||||
],
|
||||
id: "beard-express", tag: "Quick Groom", tagIcon: Scissors,
|
||||
price: "$25", period: "per service", description: "Quick and precise beard grooming for a sharp look.", button: {
|
||||
text: "Book Now", href: "#contact"},
|
||||
featuresTitle: "Includes:", features: [
|
||||
"Beard Trim & Line-up", "Moisturizing Balm", "Facial Hair Styling"],
|
||||
},
|
||||
]}
|
||||
title="Pricing & Packages"
|
||||
@@ -219,45 +146,15 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Mark D.",
|
||||
handle: "@MarkD",
|
||||
testimonial: "Dunamis Barbershop always delivers. The attention to detail is unmatched, and I always leave feeling fresh and confident. Best barber in town!",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg?_wi=1",
|
||||
imageAlt: "Client Mark D.",
|
||||
},
|
||||
id: "1", name: "Mark D.", handle: "@MarkD", testimonial: "Dunamis Barbershop always delivers. The attention to detail is unmatched, and I always leave feeling fresh and confident. Best barber in town!", imageSrc: "http://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg?_wi=1", imageAlt: "Client Mark D."},
|
||||
{
|
||||
id: "2",
|
||||
name: "James K.",
|
||||
handle: "@JamesK",
|
||||
testimonial: "The atmosphere is great, and the barbers truly listen to what you want. My haircut is consistently perfect every time. Highly recommend!",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-handsome-guy-wearing-green-shirt-isolated-yellow-wall_141793-86933.jpg",
|
||||
imageAlt: "Client James K.",
|
||||
},
|
||||
id: "2", name: "James K.", handle: "@JamesK", testimonial: "The atmosphere is great, and the barbers truly listen to what you want. My haircut is consistently perfect every time. Highly recommend!", imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-handsome-guy-wearing-green-shirt-isolated-yellow-wall_141793-86933.jpg", imageAlt: "Client James K."},
|
||||
{
|
||||
id: "3",
|
||||
name: "Ethan R.",
|
||||
handle: "@EthanR",
|
||||
testimonial: "Finally found a barbershop that understands modern styles. The hot towel shave is a must-try – pure luxury!",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1626.jpg",
|
||||
imageAlt: "Client Ethan R.",
|
||||
},
|
||||
id: "3", name: "Ethan R.", handle: "@EthanR", testimonial: "Finally found a barbershop that understands modern styles. The hot towel shave is a must-try – pure luxury!", imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1626.jpg", imageAlt: "Client Ethan R."},
|
||||
{
|
||||
id: "4",
|
||||
name: "David L.",
|
||||
handle: "@DavidL",
|
||||
testimonial: "Professional, friendly, and skilled. Dunamis Barbershop sets the standard for male grooming. I wouldn't go anywhere else.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205929.jpg",
|
||||
imageAlt: "Client David L.",
|
||||
},
|
||||
id: "4", name: "David L.", handle: "@DavidL", testimonial: "Professional, friendly, and skilled. Dunamis Barbershop sets the standard for male grooming. I wouldn't go anywhere else.", imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205929.jpg", imageAlt: "Client David L."},
|
||||
{
|
||||
id: "5",
|
||||
name: "Chris B.",
|
||||
handle: "@ChrisB",
|
||||
testimonial: "From the moment you walk in, you feel valued. My beard has never looked better, thanks to their expert shaping.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg?_wi=2",
|
||||
imageAlt: "Client Chris B.",
|
||||
},
|
||||
id: "5", name: "Chris B.", handle: "@ChrisB", testimonial: "From the moment you walk in, you feel valued. My beard has never looked better, thanks to their expert shaping.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg?_wi=2", imageAlt: "Client Chris B."},
|
||||
]}
|
||||
title="What Our Clients Say"
|
||||
description="Don't just take our word for it. Hear from our satisfied clients about their Dunamis Barbershop experience."
|
||||
@@ -272,25 +169,13 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "faq1",
|
||||
title: "How do I book an appointment?",
|
||||
content: "You can easily book an appointment through our online booking system by clicking the 'Book Now' button, or by calling us directly.",
|
||||
},
|
||||
id: "faq1", title: "How do I book an appointment?", content: "You can easily book an appointment through our online booking system by clicking the 'Book Now' button, or by calling us directly."},
|
||||
{
|
||||
id: "faq2",
|
||||
title: "What services do you offer?",
|
||||
content: "We offer a full range of services including precision haircuts, classic royal shaves, beard trims, styling, and hair & scalp treatments.",
|
||||
},
|
||||
id: "faq2", title: "What services do you offer?", content: "We offer a full range of services including precision haircuts, classic royal shaves, beard trims, styling, and hair & scalp treatments."},
|
||||
{
|
||||
id: "faq3",
|
||||
title: "Do you accept walk-ins?",
|
||||
content: "While we welcome walk-ins, appointments are highly recommended to ensure you get your preferred time and barber, especially during peak hours.",
|
||||
},
|
||||
id: "faq3", title: "Do you accept walk-ins?", content: "While we welcome walk-ins, appointments are highly recommended to ensure you get your preferred time and barber, especially during peak hours."},
|
||||
{
|
||||
id: "faq4",
|
||||
title: "What products do you use?",
|
||||
content: "We use only high-quality, professional-grade grooming products that nourish your hair and skin, ensuring the best results for every client.",
|
||||
},
|
||||
id: "faq4", title: "What products do you use?", content: "We use only high-quality, professional-grade grooming products that nourish your hair and skin, ensuring the best results for every client."},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/brown-vintage-leather-chair-stylish-barber-shop_627829-6180.jpg"
|
||||
imageAlt="Interior of Dunamis Barbershop with chairs and mirrors"
|
||||
@@ -306,16 +191,13 @@ export default function LandingPage() {
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "rotated-rays-static",
|
||||
}}
|
||||
variant: "rotated-rays-static"}}
|
||||
tag="Book Now"
|
||||
title="Ready for a Fresh Look?"
|
||||
description="Schedule your appointment today and experience the unparalleled craftsmanship and style at Dunamis Barbershop."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book an Appointment",
|
||||
href: "https://example.com/booking",
|
||||
},
|
||||
text: "Book an Appointment", href: "https://example.com/booking"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -324,58 +206,35 @@ export default function LandingPage() {
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
title: "Services", items: [
|
||||
{
|
||||
label: "Haircuts",
|
||||
href: "#services",
|
||||
},
|
||||
label: "Haircuts", href: "#services"},
|
||||
{
|
||||
label: "Shaves",
|
||||
href: "#services",
|
||||
},
|
||||
label: "Shaves", href: "#services"},
|
||||
{
|
||||
label: "Beard Trims",
|
||||
href: "#services",
|
||||
},
|
||||
label: "Beard Trims", href: "#services"},
|
||||
{
|
||||
label: "Treatments",
|
||||
href: "#services",
|
||||
},
|
||||
label: "Treatments", href: "#services"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "About Us",
|
||||
items: [
|
||||
title: "About Us", items: [
|
||||
{
|
||||
label: "Our Story",
|
||||
href: "#about",
|
||||
},
|
||||
label: "Our Story", href: "#about"},
|
||||
{
|
||||
label: "Our Team",
|
||||
href: "#team",
|
||||
},
|
||||
label: "Our Team", href: "#team"},
|
||||
{
|
||||
label: "Testimonials",
|
||||
href: "#testimonials",
|
||||
},
|
||||
label: "Testimonials", href: "#testimonials"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
title: "Support", items: [
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
label: "FAQ", href: "#faq"},
|
||||
{
|
||||
label: "Contact Us",
|
||||
href: "#contact",
|
||||
},
|
||||
label: "Contact Us", href: "#contact"},
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
label: "Privacy Policy", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #f5f5f5;
|
||||
--background: #f5f4f0;
|
||||
--card: #ffffff;
|
||||
--foreground: #1c1c1c;
|
||||
--primary-cta: #341f51;
|
||||
--primary-cta-text: #f5f5f5;
|
||||
--secondary-cta: #ffffff;
|
||||
--secondary-cta-text: #1c1c1c;
|
||||
--accent: #6139e6;
|
||||
--background-accent: #b3a8e8;
|
||||
--foreground: #1a1a1a;
|
||||
--primary-cta: #2c2c2c;
|
||||
--primary-cta-text: #f5f4f0;
|
||||
--secondary-cta: #f5f4f0;
|
||||
--secondary-cta-text: #1a1a1a;
|
||||
--accent: #8a8a8a;
|
||||
--background-accent: #e8e6e1;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user