Files
5e2746dd-69a9-45ad-8d55-e44…/src/app/page.tsx
2026-03-03 05:55:46 +00:00

255 lines
14 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import HeroLogoBillboard from "@/components/sections/hero/HeroLogoBillboard";
import TestimonialCardTwo from "@/components/sections/testimonial/TestimonialCardTwo";
import ProductCardOne from "@/components/sections/product/ProductCardOne";
import SplitAbout from "@/components/sections/about/SplitAbout";
import FeatureCardTwelve from "@/components/sections/feature/FeatureCardTwelve";
import FaqSplitText from "@/components/sections/faq/FaqSplitText";
import ContactFaq from "@/components/sections/contact/ContactFaq";
import FooterBase from "@/components/sections/footer/FooterBase";
import { Award, Heart, Home, Leaf, Phone, Sparkles, Users } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="text-shift"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="smallMedium"
sizing="largeSmallSizeMediumTitles"
background="floatingGradient"
cardStyle="subtle-shadow"
primaryButtonStyle="double-inset"
secondaryButtonStyle="glass"
headingFontWeight="extrabold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
brandName="El Bocado"
navItems={[
{ name: "Inicio", id: "hero" },
{ name: "Platos", id: "dishes" },
{ name: "Por Qué", id: "about" },
{ name: "Opiniones", id: "testimonials" },
{ name: "Contacto", id: "contact" }
]}
button={{
text: "Reservar", href: "#contact"
}}
/>
</div>
<div id="hero" data-section="hero">
<HeroLogoBillboard
logoText="El Bocado"
description="Tapas y Bocadillos Caseros con Servicio Excepcional. Comida de calidad, trato cercano y platos que te harán volver."
buttons={[
{ text: "Reservar Mesa", href: "#contact" },
{ text: "Llamar Ahora", href: "tel:+34912345678" }
]}
buttonAnimation="slide-up"
background={{ variant: "floatingGradient" }}
imageSrc="http://img.b2bpic.net/free-photo/side-view-saj-kebap-with-lamb-ribs-potatoes-colorful-bell-peppers-eggplants-wooden-board-table_140725-12834.jpg"
imageAlt="Interior acogedor del restaurante El Bocado"
mediaAnimation="opacity"
frameStyle="card"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwo
title="Qué Dicen Nuestros Clientes"
description="Testimonios de clientes que repiten habitualmente y confían en nosotros"
tag="Opiniones Verificadas"
tagAnimation="slide-up"
testimonials={[
{
id: "1", name: "María García", role: "Cliente Regular", testimonial: "Gran servicio. Repito habitualmente. Los huevos rotos con jamón son espectaculares.", imageSrc: "http://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg", imageAlt: "María García"
},
{
id: "2", name: "Juan López", role: "Familia", testimonial: "Muy rico y bien presentado. Atentos y amables. Perfecto para grupos.", imageSrc: "http://img.b2bpic.net/free-photo/pensive-person-alone-corridor-serious_1262-1042.jpg", imageAlt: "Juan López"
},
{
id: "3", name: "Carmen Rodríguez", role: "Cliente Local", testimonial: "Gran descubrimiento. Sin duda volveremos. Todo lo que probamos estuvo delicioso.", imageSrc: "http://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg", imageAlt: "Carmen Rodríguez"
},
{
id: "4", name: "Pedro Martínez", role: "Trabajador", testimonial: "Ideal para comer en la pausa del trabajo. Comida rápida, de calidad y muy sabrosa.", imageSrc: "http://img.b2bpic.net/free-photo/pensive-person-alone-corridor-serious_1262-1042.jpg", imageAlt: "Pedro Martínez"
},
{
id: "5", name: "Ana Fernández", role: "Cliente Regular", testimonial: "Muy satisfechos con el servicio y la comida. Repito cada semana.", imageSrc: "http://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg", imageAlt: "Ana Fernández"
},
{
id: "6", name: "Luis Jiménez", role: "Visitante", testimonial: "Auténtica comida española hecha con cariño. Recomendable 100%.", imageSrc: "http://img.b2bpic.net/free-photo/pensive-person-alone-corridor-serious_1262-1042.jpg", imageAlt: "Luis Jiménez"
}
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="dishes" data-section="dishes">
<ProductCardOne
title="Nuestros Platos Estrella"
description="Descubre nuestras especialidades caseras, cuidadosamente preparadas con ingredientes frescos"
tag="Especialidades"
tagAnimation="slide-up"
products={[
{
id: "1", name: "Huevos Rotos con Jamón", price: "12,50€", imageSrc: "http://img.b2bpic.net/free-photo/egg-with-sausage-pan-olive-cheese-top-view_141793-4412.jpg", imageAlt: "Huevos rotos con jamón serrano"
},
{
id: "2", name: "Bocadillo de Espinaca", price: "8,50€", imageSrc: "http://img.b2bpic.net/free-photo/side-view-sandwichs-with-sausage-cheese-plate_176474-120137.jpg", imageAlt: "Bocadillo casero de espinaca"
},
{
id: "3", name: "Tabla de Tapas Variadas", price: "18,00€", imageSrc: "http://img.b2bpic.net/free-photo/world-tapa-s-day-celebration-with-snacks_23-2149368929.jpg", imageAlt: "Tabla de tapas españolas variadas"
}
]}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="about" data-section="about">
<SplitAbout
title="¿Por Qué Elegir El Bocado?"
description="Somos más que un restaurante: somos un lugar donde los ingredientes de calidad, el servicio excepcional y el ambiente acogedor se unen para crear experiencias gastronómicas memorables."
tag="Nuestra Propuesta"
tagAnimation="slide-up"
bulletPoints={[
{
title: "Ingredientes Frescos", description: "Seleccionamos cuidadosamente cada ingrediente para garantizar frescura y calidad", icon: Leaf
},
{
title: "Patatas Naturales", description: "Cortamos y cocinamos nuestras patatas al momento para máxima calidad", icon: Sparkles
},
{
title: "Excelente Presentación", description: "Cada plato es preparado con atención al detalle y belleza visual", icon: Award
},
{
title: "Servicio Atento y Amable", description: "Nuestro equipo está comprometido con tu satisfacción y bienestar", icon: Heart
},
{
title: "Ideal para Grupos", description: "Perfecto para celebraciones, reuniones familiares y eventos especiales", icon: Users
},
{
title: "Ambiente Acogedor", description: "Un espacio cálido y tranquilo donde sentirse como en casa", icon: Home
}
]}
mediaAnimation="opacity"
textboxLayout="default"
useInvertedBackground={false}
imagePosition="right"
/>
</div>
<div id="cta-final" data-section="cta-final">
<FeatureCardTwelve
title="¿Te Apetece Comer Bien Hoy?"
description="Únete a nuestros clientes que repiten habitualmente. Reserva tu mesa o llámanos ahora."
features={[
{
id: "reserve", label: "Reserva", title: "Asegura tu mesa con una reserva", items: ["Disponibilidad garantizada", "Servicio personalizado", "Opciones para grupos"],
buttons: [{ text: "Reservar Ahora", href: "#contact" }]
},
{
id: "call", label: "Llamada", title: "Contacta con nosotros directamente", items: ["Respuesta inmediata", "Consultas especiales", "Información de menús"],
buttons: [{ text: "Llamar", href: "tel:+34912345678" }]
}
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitText
sideTitle="Preguntas Frecuentes"
sideDescription="Todo lo que necesitas saber sobre El Bocado"
faqs={[
{
id: "1", title: "¿Cuál es el horario de atención?", content: "Estamos abiertos de lunes a sábado de 12:00 a 23:00. Domingos de 12:00 a 22:00. Cerrados los lunes festivos."
},
{
id: "2", title: "¿Puedo hacer reservas para grupos?", content: "¡Por supuesto! Hacemos reservas para grupos de 6 o más personas. Te recomendamos llamar con anticipación para coordinar el menú y horario."
},
{
id: "3", title: "¿Ofrecen opciones vegetarianas?", content: "Sí, contamos con varias opciones vegetarianas. Consulta nuestro menú o llama para conocer las alternativas disponibles."
},
{
id: "4", title: "¿Tienen estacionamiento?", content: "Contamos con estacionamiento privado para nuestros clientes. Para grupos grandes, recomendamos indicarlo al hacer la reserva."
},
{
id: "5", title: "¿Se puede pagar con tarjeta?", content: "Sí, aceptamos tarjeta de crédito, débito y efectivo. También ofrecemos opciones de pago digital."
}
]}
faqsAnimation="slide-up"
textPosition="left"
useInvertedBackground={false}
animationType="smooth"
/>
</div>
<div id="contact" data-section="contact">
<ContactFaq
ctaTitle="Reserva tu Mesa"
ctaDescription="Contacta con nosotros para hacer tu reserva o si tienes preguntas especiales."
ctaButton={{ text: "Reservar Ahora", href: "#contact" }}
ctaIcon={Phone}
faqs={[
{
id: "reserve-1", title: "¿Cómo hago una reserva?", content: "Puedes llamarnos directamente al +34-912-345-678 o enviar un mensaje a través del formulario de contacto. También aceptamos reservas de último momento."
},
{
id: "reserve-2", title: "¿Hay descuentos para grupos?", content: "Ofrecemos menús especiales para grupos. Contacta con nosotros directamente para discutir opciones personalizadas y precios especiales."
},
{
id: "reserve-3", title: "¿Sirven eventos privados?", content: "Sí, podemos organizar eventos privados. Llama para consultar disponibilidad, opciones de menú y coordinación de tu evento especial."
}
]}
animationType="slide-up"
useInvertedBackground={false}
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
logoText="El Bocado"
copyrightText="© 2025 El Bocado | Restaurante Local de Tapas y Bocadillos"
columns={[
{
title: "Menú", items: [
{ label: "Inicio", href: "hero" },
{ label: "Platos", href: "dishes" },
{ label: "Por Qué", href: "about" },
{ label: "Opiniones", href: "testimonials" }
]
},
{
title: "Información", items: [
{ label: "Llamar", href: "tel:+34912345678" },
{ label: "Ubicación", href: "#" },
{ label: "Horarios", href: "#" },
{ label: "Reservas", href: "contact" }
]
},
{
title: "Legal", items: [
{ label: "Política de Privacidad", href: "#" },
{ label: "Términos de Servicio", href: "#" },
{ label: "Contacto", href: "contact" }
]
}
]}
/>
</div>
</ThemeProvider>
);
}