Update src/app/page.tsx
This commit is contained in:
130
src/app/page.tsx
130
src/app/page.tsx
@@ -2,6 +2,8 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import { useState } from "react";
|
||||
import { X, ExternalLink } from "lucide-react";
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||||
import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
|
||||
@@ -15,6 +17,15 @@ import TextAbout from '@/components/sections/about/TextAbout';
|
||||
import { Clock, Flame, MapPin, MessageSquare, Star } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
const [isMenuOpen, setIsMenuOpen] = useState(false);
|
||||
|
||||
const menuItems = [
|
||||
{ name: "Kebab Clásico", price: "5.50€" },
|
||||
{ name: "Dürum de Pollo", price: "6.00€" },
|
||||
{ name: "Pita Falafel", price: "5.00€" },
|
||||
{ name: "Pizza Barbacoa", price: "8.00€" },
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-bubble"
|
||||
@@ -33,12 +44,30 @@ export default function LandingPage() {
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "Inicio", id: "hero" },
|
||||
{ name: "Ver Carta", id: "products" },
|
||||
{ name: "Ver Carta", id: "menu-popup" },
|
||||
{ name: "Opiniones", id: "testimonials" },
|
||||
{ name: "Contacto", id: "contact" },
|
||||
]}
|
||||
brandName="Tchey"
|
||||
/>
|
||||
{isMenuOpen && (
|
||||
<div className="fixed inset-0 z-50 flex items-center justify-center bg-black/80 p-4">
|
||||
<div className="w-full max-w-md rounded-2xl bg-white p-8 text-black">
|
||||
<div className="flex justify-between items-center mb-6">
|
||||
<h2 className="text-2xl font-bold">Nuestra Carta</h2>
|
||||
<button onClick={() => setIsMenuOpen(false)}><X /></button>
|
||||
</div>
|
||||
<ul className="space-y-4">
|
||||
{menuItems.map((item, idx) => (
|
||||
<li key={idx} className="flex justify-between border-b pb-2">
|
||||
<span>{item.name}</span>
|
||||
<span className="font-bold">{item.price}</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
@@ -48,114 +77,43 @@ export default function LandingPage() {
|
||||
description="El kebab de barrio más querido de Barcelona. Sabor real, precio honesto, abierto hasta tarde para ti."
|
||||
leftCarouselItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/turkish-doner-inside-round-bread-with-french-fries-yogurt_114579-1423.jpg", imageAlt: "Kebab rotisserie" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/shaurma-with-meat-marinated-food_114579-2122.jpg", imageAlt: "Durum chicken" },
|
||||
]}
|
||||
rightCarouselItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/lule-kebab-fried-potato-with-vegetables-onion_141793-688.jpg", imageAlt: "Kebab plate" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/arabic-kebab-sandwich-high-view-food_23-2148651083.jpg", imageAlt: "Durum chicken" },
|
||||
]}
|
||||
buttons={[
|
||||
{ text: "Ver Carta", href: "#products" },
|
||||
]}
|
||||
avatarText="Más de 800 clientes felices"
|
||||
marqueeItems={[
|
||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/view-delicious-shawarma-dish_23-2151805527.jpg", alt: "Kebab brand" },
|
||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/doner-kebab-roasting-spti_53876-34017.jpg", alt: "Fresh meat brand" },
|
||||
]}
|
||||
buttons={[{ text: "Ver Carta", onClick: () => setIsMenuOpen(true) }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Más que un kebab, una institución en Barcelona"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about"><TextAbout title="Más que un kebab, una institución en Barcelona" /></div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={false}
|
||||
title="Platos Destacados"
|
||||
products={[
|
||||
{ id: "1", name: "Kebab Clásico", price: "5.50€", imageSrc: "http://img.b2bpic.net/free-photo/two-pieces-beef-steaks-served-lavash-with-species_114579-1990.jpg" },
|
||||
{ id: "2", name: "Dürum de Pollo", price: "6.00€", imageSrc: "http://img.b2bpic.net/free-photo/roasted-meat-with-flapjack-served-with-pickles_140725-1210.jpg" },
|
||||
{ id: "3", name: "Pita Falafel", price: "5.00€", imageSrc: "http://img.b2bpic.net/free-photo/arabic-kebab-sandwich-sauce-pita-bread_23-2148651101.jpg" },
|
||||
{ id: "4", name: "Pizza Barbacoa", price: "8.00€", imageSrc: "http://img.b2bpic.net/free-photo/top-view-meat-pizza-with-bell-pepper-barbecue-sauce-tray_140725-11546.jpg" },
|
||||
]}
|
||||
title="Platos Destacados"
|
||||
description="Desde 5€, sabor auténtico para todos los bolsillos."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureBorderGlow
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ icon: Clock, title: "Abierto hasta tarde", description: "Tu hambre no espera, y nosotros tampoco." },
|
||||
{ icon: MapPin, title: "Ubicación ideal", description: "Carrer del Consell de Cent 455, Barcelona." },
|
||||
]}
|
||||
title="Por qué elegirnos"
|
||||
description="Calidad, cercanía y el mejor sabor de la ciudad."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "1", value: "838+", title: "Reseñas", description: "Comentarios de clientes satisfechos", icon: MessageSquare },
|
||||
{ id: "2", value: "4.3", title: "Estrellas", description: "Valoración media de los clientes", icon: Star },
|
||||
{ id: "3", value: "100%", title: "Sabor real", description: "Recetas tradicionales de calidad", icon: Flame },
|
||||
]}
|
||||
title="Números que hablan por sí solos"
|
||||
description="La confianza de nuestros vecinos."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFifteen
|
||||
useInvertedBackground={false}
|
||||
testimonial="Combo durum patatas y bebida 6.50, simplemente brutal, además son muy majos"
|
||||
rating={5}
|
||||
author="Cliente Tchey"
|
||||
avatars={[]}
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "2", title: "¿Cuál es el precio medio?", content: "Los platos principales van de 5€ a 10€." },
|
||||
{ id: "3", title: "¿Tienen opciones vegetarianas?", content: "Sí, nuestra pita falafel es una excelente opción." },
|
||||
]}
|
||||
title="Preguntas frecuentes"
|
||||
description="Todo lo que necesitas saber sobre nosotros."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Visítanos"
|
||||
description="Carrer del Consell de Cent 455, Barcelona. Teléfono: 932 45 12 21"
|
||||
inputs={[
|
||||
{ name: "nombre", type: "text", placeholder: "Tu nombre" },
|
||||
{ name: "email", type: "email", placeholder: "Tu email" },
|
||||
]}
|
||||
textarea={{ name: "mensaje", placeholder: "Tu mensaje" }}
|
||||
/>
|
||||
<div className="py-20">
|
||||
<h2 className="text-center text-4xl font-bold mb-10">¿Dónde estamos?</h2>
|
||||
<div className="flex flex-col items-center gap-6">
|
||||
<div className="w-full max-w-2xl h-80 bg-gray-200 rounded-xl overflow-hidden">
|
||||
<iframe width="100%" height="100%" src="https://maps.google.com/maps?q=Carrer+del+Consell+de+Cent+455,Barcelona&output=embed"></iframe>
|
||||
</div>
|
||||
<a href="https://www.google.com/maps/dir/?api=1&destination=Carrer+del+Consell+de+Cent+455,Barcelona" target="_blank" className="inline-flex items-center gap-2 bg-primary-cta text-white px-6 py-3 rounded-full font-bold">
|
||||
Cómo llegar <ExternalLink size={18} />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
|
||||
Reference in New Issue
Block a user