249 lines
11 KiB
TypeScript
249 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 FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
|
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
|
|
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
|
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="rounded"
|
|
contentWidth="smallMedium"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="grid"
|
|
cardStyle="inset"
|
|
primaryButtonStyle="double-inset"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
navItems={[
|
|
{
|
|
name: "Inicio", id: "hero"},
|
|
{
|
|
name: "Carta", id: "menu"},
|
|
{
|
|
name: "Reservas", id: "contact"},
|
|
]}
|
|
brandName="GastroBar Pasión"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardGallery
|
|
background={{
|
|
variant: "gradient-bars"}}
|
|
title="GastroBar Pasión"
|
|
description="El sabor del norte en el corazón de la ciudad. Pinchos que no olvidarás. Chipirones que te harán volver. Reserva llamando al +34 900 123 456."
|
|
buttons={[
|
|
{
|
|
text: "Llamar para reservar", href: "tel:+34900123456"},
|
|
{
|
|
text: "Ver carta", href: "#menu"},
|
|
]}
|
|
mediaItems={[
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/seafood-salad-with-crabsters-cherry-tomatoes_114579-1718.jpg?_wi=1", imageAlt: "Ambiente del gastrobar"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/calamari-with-mango-sauce-with-nice-decoration-white-plate_1258-84913.jpg", imageAlt: "Chipirones a la plancha"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-mature-women-having-fun-time_23-2149232873.jpg", imageAlt: "Ambiente de la barra"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/tomato-soup-with-spicy-ingredient-top_114579-2430.jpg", imageAlt: "Pinchos variados"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/calamari-ring_1203-7802.jpg", imageAlt: "Cocina en vivo"},
|
|
]}
|
|
mediaAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSixteen
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Ana García", role: "Cliente habitual", company: "Local", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/vertical-photo-beautiful-lady-sitting-restaurant-smiling-camera_114579-92383.jpg"},
|
|
{
|
|
id: "2", name: "Carlos Ruiz", role: "Foodie", company: "Local", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-waitress-standing-counter_1170-668.jpg"},
|
|
{
|
|
id: "3", name: "Elena Torres", role: "Crítica", company: "Local", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/couples-celebrating-birthday_23-2149891048.jpg"},
|
|
{
|
|
id: "4", name: "Javier López", role: "Turista", company: "Local", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/people-cheering-with-wine-glasses-luxurious-restaurant_23-2150517446.jpg"},
|
|
{
|
|
id: "5", name: "Sofía Martín", role: "Local", company: "Local", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-asian-female-entrepreneur-sitting-table-cafe_1262-17235.jpg"},
|
|
]}
|
|
kpiItems={[
|
|
{
|
|
value: "4.7/5", label: "Rating medio"},
|
|
{
|
|
value: "500+", label: "Reseñas"},
|
|
{
|
|
value: "100%", label: "Pasión"},
|
|
]}
|
|
title="Una experiencia que engancha"
|
|
description="Lo que dicen nuestros comensales más exigentes."
|
|
/>
|
|
</div>
|
|
|
|
<div id="menu" data-section="menu">
|
|
<ProductCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="split-actions"
|
|
buttons={[
|
|
{ text: "Ver Carta Completa", href: "#menu" },
|
|
{ text: "Llamar para reservar", href: "tel:+34900123456" }
|
|
]}
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={true}
|
|
products={[
|
|
{
|
|
id: "1", brand: "Especialidad", name: "Chipirones a la plancha", price: "18€", rating: 5,
|
|
reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/tiger-prawn-with-spicy-sauce-with-nice-decoration_1258-84825.jpg"},
|
|
{
|
|
id: "2", brand: "Entrante", name: "Ensalada de bonito", price: "14€", rating: 5,
|
|
reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/top-view-tuna-fish-salad-with-lettuce-tomatoes-eggs-cucumber-onion-corn-dark-wooden-surface-horizontal_176474-930.jpg"},
|
|
{
|
|
id: "3", brand: "Principal", name: "Presa ibérica", price: "22€", rating: 5,
|
|
reviewCount: "95", imageSrc: "http://img.b2bpic.net/free-photo/from-fried-meat-with-fried-vegetables-orange-brandy-glass-white-plate_176474-2632.jpg"},
|
|
{
|
|
id: "4", brand: "Tradición", name: "Gildas", price: "3€", rating: 5,
|
|
reviewCount: "200", imageSrc: "http://img.b2bpic.net/free-photo/cheese-plate-with-delicious-tilsiter-cheese-snacks_114579-44309.jpg"},
|
|
{
|
|
id: "5", brand: "Selección", name: "Pinchos vascos", price: "4€", rating: 5,
|
|
reviewCount: "300", imageSrc: "http://img.b2bpic.net/free-photo/spanish-snack-tapas_1387-910.jpg"},
|
|
{
|
|
id: "6", brand: "Bodega", name: "Vinos del norte", price: "5€", rating: 5,
|
|
reviewCount: "150", imageSrc: "http://img.b2bpic.net/free-photo/tray-with-champagne-glasses-close-up_23-2148667932.jpg"},
|
|
]}
|
|
title="Lo que nos hace únicos"
|
|
description="Producto de primera. Cocina sin artificios. Sabor que habla solo."
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MetricSplitMediaAbout
|
|
useInvertedBackground={false}
|
|
title="No es solo comida. Es cómo te hacemos sentir."
|
|
description="Aquí no vienes solo a comer. Vienes a descubrir, a dejarte recomendar y a repetir. Un trato cercano, atento y profesional que convierte cada visita en algo especial."
|
|
metrics={[
|
|
{
|
|
value: "10+", title: "Años de pasión"},
|
|
{
|
|
value: "15", title: "Mesas"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/culinary-expert-commercial-kitchen-prepares-dish-with-fresh-basil-parsley_482257-124314.jpg"
|
|
mediaAnimation="slide-up"
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="social" data-section="social">
|
|
<SocialProofOne
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
names={[
|
|
"Guía Michelin", "Guía Repsol", "TripAdvisor", "Gourmet Awards", "Gastronomy Excellence", "City Foodie", "Local Quality"]}
|
|
title="Reconocimientos"
|
|
description="Calidad avalada por los expertos y nuestros clientes."
|
|
/>
|
|
</div>
|
|
|
|
<div id="fomo" data-section="fomo">
|
|
<MetricCardEleven
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
metrics={[
|
|
{
|
|
id: "1", value: "Limitado", title: "Aforo", description: "Reserva con antelación", imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-beverages-small-plants_23-2148437069.jpg"},
|
|
{
|
|
id: "2", value: "Alto", title: "Demanda", description: "Haz tu reserva ahora", imageSrc: "http://img.b2bpic.net/free-photo/side-view-breakfast-table-served-with-various-food-fried-eggs-with-tomatoes-sausages-cheese-fresh-salad-dessert-tea_140725-12147.jpg"},
|
|
{
|
|
id: "3", value: "Garantizado", title: "Sabor", description: "Producto de primera", imageSrc: "http://img.b2bpic.net/free-photo/plate-with-tasty-tartines_23-2147830555.jpg"},
|
|
]}
|
|
title="Siempre lleno"
|
|
description="Local pequeño. Mesas limitadas. Siempre lleno. Si encuentras sitio… aprovéchalo."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitMedia
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
faqs={[
|
|
{
|
|
id: "1", title: "¿Necesito reservar?", content: "Recomendamos llamar al +34 900 123 456 para asegurar tu mesa."},
|
|
{
|
|
id: "2", title: "¿Tienen opciones para celíacos?", content: "Sí, tenemos varias opciones sin gluten en nuestra carta."},
|
|
{
|
|
id: "3", title: "¿Dónde están ubicados?", content: "Estamos a solo unos pasos de la Plaza Mayor, en pleno centro."},
|
|
]}
|
|
title="Preguntas frecuentes"
|
|
description="Todo lo que necesitas saber antes de tu visita."
|
|
faqsAnimation="blur-reveal"
|
|
imageSrc="http://img.b2bpic.net/free-photo/seafood-salad-with-crabsters-cherry-tomatoes_114579-1718.jpg?_wi=2"
|
|
mediaAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "gradient-bars"}}
|
|
tag="Contacto"
|
|
title="Reserva telefónica"
|
|
description="La forma más rápida y segura de garantizar tu mesa es llamándonos directamente."
|
|
buttonText="+34 900 123 456"
|
|
onSubmit={() => window.location.href = "tel:+34900123456"}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterSimple
|
|
columns={[
|
|
{
|
|
title: "GastroBar Pasión", items: [
|
|
{
|
|
label: "Ubicación: Plaza Mayor", href: "#"},
|
|
{
|
|
label: "Reservas: +34 900 123 456", href: "tel:+34900123456"},
|
|
],
|
|
},
|
|
{
|
|
title: "Menú", items: [
|
|
{
|
|
label: "Ver Carta", href: "#menu"},
|
|
{
|
|
label: "Reservar: +34 900 123 456", href: "tel:+34900123456"},
|
|
],
|
|
},
|
|
]}
|
|
bottomLeftText="© 2024 GastroBar Pasión"
|
|
bottomRightText="Hecho con pasión"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |