Merge version_2 into main
Merge version_2 into main
This commit was merged in pull request #3.
This commit is contained in:
246
src/app/page.tsx
246
src/app/page.tsx
@@ -2,11 +2,11 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import AboutMetric from '@/components/sections/about/AboutMetric';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||||
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import HeroCentered from '@/components/sections/hero/HeroCentered';
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
|
||||
@@ -31,16 +31,11 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Services", id: "services"},
|
||||
{
|
||||
name: "Gallery", id: "gallery"},
|
||||
{
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Contact", id: "contact"},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Latin Barber Shop"
|
||||
/>
|
||||
@@ -48,45 +43,27 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{
|
||||
variant: "radial-gradient"}}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
title="Precision Cuts. Clean Fades. Staten Island’s Local Barbershop."
|
||||
description="Affordable haircuts, fresh fades, and friendly service. Walk in anytime or call now to secure your spot."
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313014.jpg", alt: "Barber Shop"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/different-razors-table_23-2147736988.jpg", alt: "Barber Shop"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313019.jpg", alt: "Barber Shop"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/company-employee-analyzing-financial-charts-graphs-office-working-business-growth-development-male-worker-planning-marketing-analysis-project-statistics-startegy-close-up_482257-42058.jpg", alt: "Barber Shop"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313012.jpg", alt: "Barber Shop"},
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313014.jpg", alt: "Barber Shop" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/different-razors-table_23-2147736988.jpg", alt: "Barber Shop" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313019.jpg", alt: "Barber Shop" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/company-employee-analyzing-financial-charts-graphs-office-working-business-growth-development-male-worker-planning-marketing-analysis-project-statistics-startegy-close-up_482257-42058.jpg", alt: "Barber Shop" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313012.jpg", alt: "Barber Shop" },
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Call Now", href: "tel:7187201978"},
|
||||
{
|
||||
text: "Get Directions", href: "https://maps.google.com/?q=14+St+Pauls+Ave+Staten+Island+NY+10301"},
|
||||
{ text: "Call Now", href: "tel:7187201978" },
|
||||
{ text: "Get Directions", href: "https://maps.google.com/?q=14+St+Pauls+Ave+Staten+Island+NY+10301" },
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text-icon", text: "Professional Fades", icon: Sparkles,
|
||||
},
|
||||
{
|
||||
type: "text-icon", text: "Walk-ins Welcome", icon: CheckCircle,
|
||||
},
|
||||
{
|
||||
type: "text-icon", text: "Open 7 Days", icon: CalendarDays,
|
||||
},
|
||||
{
|
||||
type: "text-icon", text: "Expert Barbers", icon: Scissors,
|
||||
},
|
||||
{
|
||||
type: "text-icon", text: "Affordable Rates", icon: DollarSign,
|
||||
},
|
||||
{ type: "text-icon", text: "Professional Fades", icon: Sparkles },
|
||||
{ type: "text-icon", text: "Walk-ins Welcome", icon: CheckCircle },
|
||||
{ type: "text-icon", text: "Open 7 Days", icon: CalendarDays },
|
||||
{ type: "text-icon", text: "Expert Barbers", icon: Scissors },
|
||||
{ type: "text-icon", text: "Affordable Rates", icon: DollarSign },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -97,179 +74,60 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "1", title: "Haircut", price: "$25+", period: "", features: [
|
||||
"Basic cut", "Clean finish"],
|
||||
button: {
|
||||
text: "Call Now", href: "tel:7187201978"},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/working-tools-barber-master_651396-126.jpg", imageAlt: "Working tools of barber master"},
|
||||
{
|
||||
id: "2", title: "Skin Fade", price: "$30+", period: "", features: [
|
||||
"Detailed fade", "Premium finish"],
|
||||
button: {
|
||||
text: "Call Now", href: "tel:7187201978"},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313014.jpg", imageAlt: "Working tools of barber master"},
|
||||
{
|
||||
id: "3", title: "Beard Trim", price: "$15+", period: "", features: [
|
||||
"Line up", "Detail work"],
|
||||
button: {
|
||||
text: "Call Now", href: "tel:7187201978"},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-barbershop-concept_23-2148506215.jpg", imageAlt: "Working tools of barber master"},
|
||||
{
|
||||
id: "4", title: "Haircut + Beard", price: "$40+", period: "", features: [
|
||||
"Full service", "Sharp look"],
|
||||
button: {
|
||||
text: "Call Now", href: "tel:7187201978"},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hairdressing-supplies-wooden-background_23-2147711598.jpg", imageAlt: "Working tools of barber master"},
|
||||
{
|
||||
id: "5", title: "Kids Haircut", price: "$20+", period: "", features: [
|
||||
"Patient service", "Fresh cut"],
|
||||
button: {
|
||||
text: "Call Now", href: "tel:7187201978"},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-customer-waiting-haircut_23-2148256975.jpg", imageAlt: "Working tools of barber master"},
|
||||
{
|
||||
id: "6", title: "Shape Up", price: "$10+", period: "", features: [
|
||||
"Edge up", "Clean lines"],
|
||||
button: {
|
||||
text: "Call Now", href: "tel:7187201978"},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-man-getting-haircut_23-2148224298.jpg", imageAlt: "Working tools of barber master"},
|
||||
{ id: "1", title: "Haircut", price: "$25+", period: "", features: ["Basic cut", "Clean finish"], button: { text: "Call Now", href: "tel:7187201978" }, imageSrc: "http://img.b2bpic.net/free-photo/working-tools-barber-master_651396-126.jpg", imageAlt: "Working tools" },
|
||||
{ id: "2", title: "Skin Fade", price: "$30+", period: "", features: ["Detailed fade", "Premium finish"], button: { text: "Call Now", href: "tel:7187201978" }, imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313014.jpg", imageAlt: "Working tools" },
|
||||
]}
|
||||
title="Our Services"
|
||||
description="Prices are starting points. Call for exact pricing."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="gallery" data-section="gallery">
|
||||
<FeatureCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Fades", description: "Expert skin fades.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/front-view-barbershop-concept_23-2148506215.jpg" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/hairdressing-supplies-wooden-background_23-2147711598.jpg" }
|
||||
},
|
||||
{
|
||||
title: "Detail", description: "Crisp line-ups.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/side-view-customer-waiting-haircut_23-2148256975.jpg" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-man-getting-haircut_23-2148224298.jpg" }
|
||||
},
|
||||
{
|
||||
title: "Atmosphere", description: "Authentic shop vibe.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work_627829-7351.jpg" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/different-razors-table_23-2147736988.jpg" }
|
||||
},
|
||||
]}
|
||||
showStepNumbers={false}
|
||||
title="Fresh Cuts. Real Style."
|
||||
description="See the precision and quality in every look we provide."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="why-us" data-section="why-us">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Why Latin Barber Shop?"
|
||||
metrics={[
|
||||
{
|
||||
icon: Scissors,
|
||||
label: "Skilled Barbers", value: "Expert"},
|
||||
{
|
||||
icon: DollarSign,
|
||||
label: "Affordable Price", value: "Fair"},
|
||||
{
|
||||
icon: Users,
|
||||
label: "Walk-Ins", value: "Easy"},
|
||||
{
|
||||
icon: CalendarDays,
|
||||
label: "Open Daily", value: "7 Days"},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
description="Quality haircuts and grooming for every client."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialCardTen
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", title: "Staten Island Local", quote: "Best spot for a quick fade. Always consistent.", name: "Alex R.", role: "Local", imageSrc: "http://img.b2bpic.net/free-photo/young-man-getting-his-beard-styled-barber_23-2148985714.jpg"},
|
||||
{
|
||||
id: "2", title: "Fast Service", quote: "Walked in and got a great haircut immediately.", name: "Brian M.", role: "Regular", imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-selfcare-products_23-2149313016.jpg"},
|
||||
{
|
||||
id: "3", title: "Affordable", quote: "Great prices, even better service. My favorite shop.", name: "Carlos D.", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/professional-hairdresser-modeling-beard-barbershop-close-up-photo_613910-18429.jpg"},
|
||||
{
|
||||
id: "4", title: "Clean Lines", quote: "Barbers here actually listen to what you want.", name: "David L.", role: "Local", imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-man-getting-haircut_23-2148506327.jpg"},
|
||||
{
|
||||
id: "5", title: "Friendly", quote: "Local shop with a welcoming vibe for everyone.", name: "Eddie V.", role: "Regular", imageSrc: "http://img.b2bpic.net/free-photo/close-up-details-hairdresser-salon_23-2149205861.jpg"},
|
||||
]}
|
||||
title="Our Community"
|
||||
description="Latin Barber Shop is a trusted neighborhood staple known for clean cuts, friendly service, and affordable prices."
|
||||
/>
|
||||
<MetricSplitMediaAbout
|
||||
title="Our Story & Credentials"
|
||||
description="Serving Staten Island for over 10 years, Latin Barber Shop was founded on the principles of precision, community, and respect. We bring traditional barbering techniques to the modern era."
|
||||
metrics={[
|
||||
{ title: "Years Served", value: "10+" },
|
||||
{ title: "Happy Clients", value: "5000+" },
|
||||
{ title: "Daily Cuts", value: "40+" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work_627829-7351.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "1", title: "Do you take walk-ins?", content: "Yes, walk-ins are always welcome. Just stop by."},
|
||||
{
|
||||
id: "2", title: "Do I need an appointment?", content: "No appointment is required, but you can call ahead."},
|
||||
{
|
||||
id: "3", title: "What services do you offer?", content: "We offer haircuts, fades, beard trims, and shape ups."},
|
||||
{
|
||||
id: "4", title: "What are your hours?", content: "We are open daily from 10:00 AM to 8:00 PM."},
|
||||
{ id: "1", title: "Do you take walk-ins?", content: "Yes, we welcome all walk-ins during our business hours." },
|
||||
{ id: "2", title: "What payment methods do you accept?", content: "We accept cash and major credit cards." },
|
||||
{ id: "3", title: "Do you offer beard grooming?", content: "Yes, we offer premium beard trims and lineup services." },
|
||||
]}
|
||||
sideTitle="Questions?"
|
||||
sideTitle="FAQ"
|
||||
sideDescription="Commonly asked questions about our shop."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain"}}
|
||||
tag="Visit Us"
|
||||
title="Latin Barber Shop"
|
||||
description="14 St Pauls Ave, Staten Island, NY 10301 | (718) 720-1978 | Open Daily: 10AM - 8PM"
|
||||
background={{ variant: "plain" }}
|
||||
tag="Contact Us"
|
||||
title="Reach Out Today"
|
||||
description="Visit us at 14 St Pauls Ave, Staten Island. Open Mon-Sun, 10AM - 8PM. Call us at (718) 720-1978."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Home", href: "#hero"},
|
||||
{
|
||||
label: "Services", href: "#services"},
|
||||
{
|
||||
label: "Gallery", href: "#gallery"},
|
||||
{
|
||||
label: "Contact", href: "#contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "14 St Pauls Ave", href: "https://maps.google.com/?q=14+St+Pauls+Ave+Staten+Island+NY+10301"},
|
||||
{
|
||||
label: "(718) 720-1978", href: "tel:7187201978"},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Mon-Sun: 10AM-8PM", href: "#"},
|
||||
{
|
||||
label: "Walk-Ins Welcome", href: "#"},
|
||||
],
|
||||
},
|
||||
],
|
||||
logoText="Latin Barber Shop"
|
||||
/>
|
||||
<FooterBaseCard
|
||||
logoText="Latin Barber Shop"
|
||||
columns={[
|
||||
{ title: "Quick Links", items: [{ label: "Home", href: "#hero" }, { label: "Services", href: "#services" }] },
|
||||
{ title: "Contact", items: [{ label: "(718) 720-1978", href: "tel:7187201978" }, { label: "Directions", href: "https://maps.google.com/?q=14+St+Pauls+Ave+Staten+Island+NY+10301" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
|
||||
@@ -11,14 +11,14 @@
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #0a0a0a;
|
||||
--card: #1a1a1a;
|
||||
--foreground: #f5f5f5;
|
||||
--primary-cta: #B82B40;
|
||||
--card: #171717;
|
||||
--foreground: #ffffff;
|
||||
--primary-cta: #d4af37;
|
||||
--primary-cta-text: #ffffff;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta: #8b0000;
|
||||
--secondary-cta-text: #f5f5f5;
|
||||
--accent: #FFD700;
|
||||
--background-accent: #262626;
|
||||
--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