Files
e4b33ac8-3118-4c8a-bcd7-b67…/src/app/page.tsx
2026-06-10 22:18:50 +00:00

232 lines
11 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import TextAbout from '@/components/sections/about/TextAbout';
import { Sparkles } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="directional-hover"
defaultTextAnimation="reveal-blur"
borderRadius="pill"
contentWidth="compact"
sizing="mediumSizeLargeTitles"
background="circleGradient"
cardStyle="soft-shadow"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="radial-glow"
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{
name: "Inicio", id: "#inicio"},
{
name: "Servicios", id: "#servicios"},
{
name: "Testimonios", id: "#testimonios"},
{
name: "Precios", id: "#precios"},
{
name: "Contacto", id: "#contacto"},
]}
brandName="Amigo Perruqueria"
/>
</div>
<div id="inicio" data-section="inicio">
<HeroSplitDualMedia
background={{
variant: "downward-rays-static"}}
title="Amigo Perruqueria"
description="Tu barbería de confianza en Santa Coloma de Gramenet. Estilo impecable, atención personalizada y resultados que superan tus expectativas. ¡Descubre la diferencia!"
tag="Excelencia en Cortes"
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149220553.jpg", imageAlt: "Barber cutting a client's hair"},
{
imageSrc: "http://img.b2bpic.net/free-photo/young-man-barber-shop-after-getting-haircut_23-2149186513.jpg", imageAlt: "Modern barbershop interior"}
]}
mediaAnimation="slide-up"
rating={4.7}
ratingText="Basado en 13 reseñas de Google"
/>
</div>
<div id="about" data-section="about">
<TextAbout
useInvertedBackground={false}
tag="Quiénes Somos"
title="Tu Estilo, Nuestra Pasión: La Esencia de Amigo Perruqueria"
/>
</div>
<div id="servicios" data-section="servicios">
<FeatureCardSix
textboxLayout="default"
useInvertedBackground={true}
features={[
{
title: "Corte de Caballero Clásico", description: "Precisión y estilo en cada detalle. El corte perfecto para un look atemporal.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-using-styling-tools_23-2149141730.jpg", imageAlt: "Man getting a classic haircut"},
{
title: "Afeitado y Arreglo de Barba", description: "Experimenta el ritual clásico con toallas calientes y productos premium para una barba impecable.", imageSrc: "http://img.b2bpic.net/free-photo/bearded-man-near-blurred-stylist_23-2147778876.jpg", imageAlt: "Barber trimming a man's beard"},
{
title: "Tratamientos Capilares Personalizados", description: "Salud y fuerza para tu cabello con soluciones adaptadas a tus necesidades.", imageSrc: "http://img.b2bpic.net/free-photo/young-bearded-man-washing-head-by-hairdresser-while-sitting-chair-barbershop-barber-soul_627829-6369.jpg", imageAlt: "Man receiving hair treatment"},
]}
title="Dominamos el Arte del Estilo Masculino"
description="Desde un corte clásico hasta las últimas tendencias, nuestros servicios están diseñados para realzar tu personalidad."
tag="Servicios"
/>
</div>
<div id="testimonios" data-section="testimonios">
<TestimonialCardSix
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "1", name: "Valentín", handle: "@valentin_c", testimonial: "La mejor peluquería calidad precio, corte impoluto. El trato del peluquero es inmejorable, una persona súper extrovertida, servicial, trabaja rápido y es muy buena persona.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-happy-man-looking-camera-shaving-his-face-with-electric-razor_23-2148088271.jpg", imageAlt: "Client Valentín"},
{
id: "2", name: "Rolando", handle: "@rolando_p", testimonial: "El servicio es muy bueno y a precios muy ajustados, muy buena atención.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-hair-salon_23-2150665451.jpg", imageAlt: "Client Rolando"},
{
id: "3", name: "Carlos L.", handle: "@carlos_l", testimonial: "Siempre salgo contento. El peluquero es un crack, rápido y eficiente.", imageSrc: "http://img.b2bpic.net/free-photo/handsome-young-bearded-man-smiling-looking-away-while-professional-barber-giving-him-haircut-copyspace_7502-5640.jpg", imageAlt: "Client Carlos L."},
{
id: "4", name: "David M.", handle: "@david_m", testimonial: "Gran ambiente y profesionalidad. Sin duda mi peluquería de referencia.", imageSrc: "http://img.b2bpic.net/free-photo/grandparent-learning-use-technology_23-2149402591.jpg", imageAlt: "Client David M."},
{
id: "5", name: "Rafa S.", handle: "@rafa_s", testimonial: "Cortes modernos y precios justos. Totalmente recomendable.", imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205929.jpg", imageAlt: "Client Rafa S."},
{
id: "6", name: "Jose A.", handle: "@jose_a", testimonial: "Un trato excelente y un corte perfecto cada vez. ¡No lo cambio por nada!", imageSrc: "http://img.b2bpic.net/free-photo/encouraged-cheerful-middle-eastern-guy-chanting-raise-hands-rejoice_176420-20446.jpg", imageAlt: "Client Jose A."},
]}
title="Confianza que se Refleja en Cada Sonrisa"
description="Escucha lo que nuestros clientes satisfechos tienen que decir sobre la experiencia Amigo Perruqueria."
/>
</div>
<div id="precios" data-section="precios">
<PricingCardEight
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
plans={[
{
id: "corte-caballero", badge: "Clásico", price: "15€", subtitle: "El corte de pelo tradicional que nunca falla.", buttons: [
{
text: "Reservar Corte", href: "#contacto"},
],
features: [
"Corte de pelo a medida", "Lavado y secado", "Asesoramiento de estilo"],
},
{
id: "corte-barba", badge: "Popular", badgeIcon: Sparkles,
price: "25€", subtitle: "El look completo para un estilo definido y pulido.", buttons: [
{
text: "Reservar Ahora", href: "#contacto"},
],
features: [
"Corte de pelo a medida", "Arreglo de barba con navaja", "Toalla caliente y productos premium"],
},
{
id: "experiencia-premium", badge: "Completo", price: "35€", subtitle: "La experiencia definitiva para el cuidado masculino.", buttons: [
{
text: "Reservar Experiencia", href: "#contacto"},
],
features: [
"Corte de pelo a medida", "Arreglo de barba completo", "Masaje capilar y tratamiento hidratante"],
},
]}
title="Servicios de Calidad a Precios Competitivos"
description="Invierte en tu imagen con la mejor relación calidad-precio de Santa Coloma."
tag="Nuestras Tarifas"
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardTwo
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
metrics={[
{
id: "experience", value: "5+", description: "Años de Experiencia"},
{
id: "clients", value: "1000+", description: "Clientes Satisfechos"},
{
id: "rating", value: "4.7/5", description: "Valoración en Google"},
]}
title="Comprometidos con la Excelencia"
description="Más que solo números, son el reflejo de nuestro compromiso y la confianza de nuestros clientes."
tag="Nuestros Números"
animationType="slide-up"
/>
</div>
<div id="contacto" data-section="contacto">
<ContactCenter
useInvertedBackground={true}
background={{
variant: "plain"}}
tag="Visítanos"
title="Tu Próxima Transformación te Espera"
description="Encuéntranos en Carrer de Rafael de Casanovas, 68, 08921 Santa Coloma de Gramenet, Barcelona. Abrimos a las 9:00. ¡Te esperamos para darte el mejor look!"
inputPlaceholder="Tu correo electrónico"
buttonText="Reservar Cita"
termsText="Al reservar, aceptas nuestros Términos y Condiciones."
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
logoText="Amigo Perruqueria"
columns={[
{
title: "Servicios", items: [
{
label: "Corte Caballero", href: "#servicios"},
{
label: "Afeitado de Barba", href: "#servicios"},
{
label: "Tratamientos", href: "#servicios"},
],
},
{
title: "Información", items: [
{
label: "Quiénes Somos", href: "#about"},
{
label: "Precios", href: "#precios"},
{
label: "Testimonios", href: "#testimonios"},
],
},
{
title: "Contacto", items: [
{
label: "Dirección", href: "#contacto"},
{
label: "Horario", href: "#contacto"},
{
label: "Reservar", href: "#contacto"},
],
},
]}
copyrightText="© 2024 Amigo Perruqueria. Todos los derechos reservados."
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}