Files
92f1cd27-2b13-4fbc-a7df-093…/src/app/page.tsx
2026-05-07 14:23:20 +00:00

213 lines
11 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import SplitAbout from '@/components/sections/about/SplitAbout';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="expand-hover"
defaultTextAnimation="background-highlight"
borderRadius="soft"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="solid"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="glass"
headingFontWeight="extrabold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Inicio", id: "hero"},
{
name: "Sobre nosotros", id: "about"},
{
name: "Servicios", id: "services"},
{
name: "Contacto", id: "contact"},
]}
brandName="Los Chicos BCN"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardTestimonial
useInvertedBackground={false}
background={{
variant: "radial-gradient"}}
title="Barber Shop Los Chicos BCN"
description="Estilo, precisión y actitud en cada corte. La experiencia que te mereces en el corazón de Sant Andreu."
testimonials={[
{
name: "Carlos G.", handle: "@carlosg", testimonial: "¡Excelente servicio, ambiente increíble y cortes perfectos! 10/10", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-bearded-man-getting-shaved-with-straight-edge-razor-by-hairdresser-barbershop_1153-9769.jpg?_wi=1", imageAlt: "modern barber shop interior"},
{
name: "Marc R.", handle: "@marcr", testimonial: "Profesionales que escuchan lo que quieres y lo hacen perfecto.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/instruments-hairdresser-black-towel_23-2148181901.jpg?_wi=1", imageAlt: "modern barber shop interior"},
{
name: "David L.", handle: "@davidl", testimonial: "Trato cercano y resultado impecable. Volveré seguro.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/european-brutal-man-with-beard-cut-barbershop_343596-4697.jpg", imageAlt: "modern barber shop interior"},
{
name: "Alex P.", handle: "@alexp", testimonial: "El mejor degradado que me han hecho nunca. Repetiré.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/view-child-hair-salon_23-2150462476.jpg", imageAlt: "modern barber shop interior"},
{
name: "Javi M.", handle: "@javim", testimonial: "Barbería de confianza. Los chicos saben lo que hacen.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-confident-bearded-businessman-joyfully-looking-camera-while-talking-cellphone-restaurant-outdoor_574295-1311.jpg", imageAlt: "modern barber shop interior"},
]}
buttons={[
{
text: "Reservar cita por WhatsApp", href: "https://wa.me/34603249661"},
{
text: "Ver servicios", href: "#services"},
]}
imageSrc="http://img.b2bpic.net/free-photo/young-bearded-man-getting-shaved-with-straight-edge-razor-by-hairdresser-barbershop_1153-9769.jpg?_wi=2"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/hairstylist-cutting-customer-hair-helped-by-scissors_23-2148256966.jpg", alt: "Cliente 1"},
{
src: "http://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work_627829-7271.jpg", alt: "Cliente 2"},
{
src: "http://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work-close-up-nape_627829-7308.jpg", alt: "Cliente 3"},
{
src: "http://img.b2bpic.net/free-photo/man-barbershop_1303-5410.jpg", alt: "Cliente 4"},
{
src: "http://img.b2bpic.net/free-photo/close-up-view-young-afro-american-male-barber-wearing-uniform-combing-his-mustache_141793-117565.jpg", alt: "Cliente 5"},
]}
marqueeItems={[
{
type: "text", text: "PRECISIÓN"},
{
type: "text", text: "ESTILO"},
{
type: "text", text: "URBANO"},
{
type: "text", text: "CALIDAD"},
{
type: "text", text: "PROFESIONAL"},
]}
/>
</div>
<div id="about" data-section="about">
<SplitAbout
textboxLayout="split"
useInvertedBackground={false}
title="Nuestra esencia"
description="Barber Shop Los Chicos BCN es una barbería conocida por su excelente trato, ambiente relajado y cortes de alta calidad. Ofrecemos una experiencia personalizada con 43 reseñas de 5 estrellas."
bulletPoints={[
{
title: "Atención personalizada", description: "Un trato único para cada cliente."},
{
title: "Ambiente agradable", description: "Relájate mientras cuidamos tu imagen."},
{
title: "Profesionales expertos", description: "Dominio total de las últimas técnicas."},
]}
imageSrc="http://img.b2bpic.net/free-photo/instruments-hairdresser-black-towel_23-2148181901.jpg?_wi=2"
/>
</div>
<div id="services" data-section="services">
<FeatureCardEight
textboxLayout="default"
useInvertedBackground={false}
features={[
{
title: "Corte clásico", description: "El corte de toda la vida, ejecutado a la perfección.", imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-cutting-man-s-hair-barber-shop_23-2149186462.jpg"},
{
title: "Fade / Degradado", description: "Especialistas en degradados modernos y precisos.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-man-getting-haircut_23-2148224298.jpg"},
{
title: "Barba y perfilado", description: "Cuidado total para lucir una barba impecable.", imageSrc: "http://img.b2bpic.net/free-photo/bearded-man-holding-razor-need-shave-bristle_176420-16201.jpg"},
{
title: "Arreglo de cejas", description: "Define tu mirada con un perfilado natural.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-barber-s-hand-with-electric-trimmer_23-2147839804.jpg"},
{
title: "Tinte y mechas", description: "Cambios de estilo atrevidos y profesionales.", imageSrc: "http://img.b2bpic.net/free-photo/barber-drying-hair-unrecognizable-man_23-2147778789.jpg"},
{
title: "Paquete completo", description: "Corte de pelo y barba con el mejor trato.", imageSrc: "http://img.b2bpic.net/free-photo/pleased-slavic-middle-aged-male-barber-uniform-combing-beard-watering-with-spray-bottle-isolated-purple-wall_141793-82950.jpg"},
]}
title="Nuestros Servicios"
description="Elige el servicio que mejor se adapte a tu estilo."
/>
</div>
<div id="testimonial" data-section="testimonial">
<TestimonialCardFifteen
useInvertedBackground={false}
testimonial="La mejor experiencia en barbería que he tenido en años. Equipo impecable y profesional."
rating={5}
author="Javier M."
avatars={[
{
src: "http://img.b2bpic.net/free-photo/european-brutal-man-with-beard-cut-barbershop_343596-4697.jpg", alt: "Javier M"},
{
src: "http://img.b2bpic.net/free-photo/view-child-hair-salon_23-2150462476.jpg", alt: "David L"},
{
src: "http://img.b2bpic.net/free-photo/young-handsome-confident-bearded-businessman-joyfully-looking-camera-while-talking-cellphone-restaurant-outdoor_574295-1311.jpg", alt: "Marc R"},
{
src: "http://img.b2bpic.net/free-photo/confident-young-caucasian-male-barber-wearing-glasses-wavy-hair-band-uniform-holding-hair-clippers-isolated-crimson-background-with-copy-space_141793-31955.jpg", alt: "Carlos G"},
{
src: "http://img.b2bpic.net/free-photo/attractive-sporty-guy-by-window-athlete-posing-near-spacious-windows-gym-sports_78826-3420.jpg", alt: "Alex P"},
]}
ratingAnimation="blur-reveal"
avatarsAnimation="blur-reveal"
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "q1", title: "¿Necesito cita previa?", content: "Recomendamos cita previa para asegurar tu lugar."},
{
id: "q2", title: "¿Qué horarios tienen?", content: "Abierto de lunes a sábado hasta las 20:00."},
{
id: "q3", title: "¿Aceptan tarjeta?", content: "Sí, aceptamos todos los métodos de pago."},
]}
title="Preguntas frecuentes"
description="Resolvemos tus dudas principales."
faqsAnimation="blur-reveal"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={false}
background={{
variant: "plain"}}
title="Visítanos en Sant Andreu"
description="Avinguda Meridiana, 440, 08030 Barcelona. Abierto todos los días hasta las 20:00. ¡Te esperamos!"
mediaAnimation="slide-up"
mediaPosition="left"
inputPlaceholder="Tu email para info"
buttonText="Reservar ahora"
imageSrc="http://img.b2bpic.net/free-photo/groomed-bearded-man-with-tattooes-is-posing-dark-photo-studio_613910-3659.jpg"
tag="Contacto"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Los Chicos BCN"
leftLink={{
text: "WhatsApp", href: "https://wa.me/34603249661"}}
rightLink={{
text: "Mapa", href: "https://maps.app.goo.gl/..."}}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}