bender/632f43cf-5c68-4dc4-9cbc-99c40e29a9a8
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Merge version_2 into main

Browse Source 
Merge version_2 into main
This commit was merged in pull request #3.
This commit is contained in:
bender
2026-04-20 23:18:27 +00:00
parent f4187c814c cc4ef06072
commit 19e1e6502e
2 changed files with 58 additions and 200 deletions
Download Patch File Download Diff File Expand all files Collapse all files

246
src/app/page.tsx
View File

@@ -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>

12
src/app/styles/variables.css
View File

@@ -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);