10 Commits

Author SHA1 Message Date
bee7936d6c Update src/app/page.tsx 2026-04-21 13:05:19 +00:00
5853d25f79 Update src/app/page.tsx 2026-04-21 13:04:42 +00:00
d28ace0922 Update src/app/page.tsx 2026-04-21 13:03:58 +00:00
f6fd655fa0 Update src/app/page.tsx 2026-04-21 13:03:24 +00:00
a5929466a7 Update src/app/page.tsx 2026-04-21 13:02:50 +00:00
1b05a6c83a Merge version_2 into main
Merge version_2 into main
2026-04-21 12:59:55 +00:00
115dbdc6d2 Update src/app/page.tsx 2026-04-21 12:59:52 +00:00
a588bae3e3 Merge version_1 into main
Merge version_1 into main
2026-04-21 12:55:27 +00:00
af22651e1e Merge version_1 into main
Merge version_1 into main
2026-04-21 12:55:03 +00:00
977e1e82c1 Merge version_1 into main
Merge version_1 into main
2026-04-21 12:54:34 +00:00

View File

@@ -2,20 +2,53 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import { useState, useEffect, useRef } from "react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureBento from '@/components/sections/feature/FeatureBento';
import FooterCard from '@/components/sections/footer/FooterCard';
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import TeamCardSix from '@/components/sections/team/TeamCardSix';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import { Award, Shield, Sparkles } from "lucide-react";
import { Award, Shield } from "lucide-react";
export default function LandingPage() {
const [lang, setLang] = useState('en');
const isInitialMount = useRef(true);
useEffect(() => {
const saved = localStorage.getItem('lang') || 'en';
if (saved !== lang) {
setLang(saved);
}
isInitialMount.current = false;
}, []);
useEffect(() => {
if (!isInitialMount.current) {
localStorage.setItem('lang', lang);
}
}, [lang]);
const toggleLang = () => {
setLang(prev => prev === 'en' ? 'es' : 'en');
};
const t = {
en: {
nav: ["Home", "About", "Menu", "Contact"],
hero: { title: "Exceptional Food, Craft Drinks, Unforgettable Moments", desc: "Paröle combines elevated pub cuisine with carefully curated beverages.", btn: "Reserve" },
contact: { title: "Book Your Experience", desc: "Secure your table today.", tag: "Contact Us", placeholder: "Enter your email", btn: "Sign Up", terms: "By clicking Sign Up you're confirming that you agree with our Terms and Conditions." },
footer: { copyright: "© 2025 Paröle Pub & Food. All rights reserved." }
},
es: {
nav: ["Inicio", "Sobre Nosotros", "Menú", "Contacto"],
hero: { title: "Cocina de Excepción, Bebidas Artesanales, Momentos Inolvidables", desc: "Paröle combina una cocina de pub refinada con bebidas cuidadosamente seleccionadas.", btn: "Reservar" },
contact: { title: "Reserve su Experiencia", desc: "Asegure su mesa hoy.", tag: "Contáctenos", placeholder: "Ingrese su correo", btn: "Registrarse", terms: "Al hacer clic en Registrarse, confirma que acepta nuestros Términos y Condiciones." },
footer: { copyright: "© 2025 Paröle Pub & Food. Todos los derechos reservados." }
}
};
return (
<ThemeProvider
defaultButtonVariant="shift-hover"
@@ -30,183 +63,96 @@ export default function LandingPage() {
headingFontWeight="bold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{ name: "Home", id: "hero" },
{ name: "About", id: "about" },
{ name: "Menu", id: "menu" },
{ name: "Contact", id: "contact" },
]}
brandName="Paröle"
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{ name: t[lang as 'en' | 'es'].nav[0], id: "hero" },
{ name: t[lang as 'en' | 'es'].nav[1], id: "about" },
{ name: t[lang as 'en' | 'es'].nav[2], id: "menu" },
{ name: t[lang as 'en' | 'es'].nav[3], id: "contact" },
]}
brandName="Paröle"
/>
<button onClick={toggleLang} className="fixed top-4 right-20 z-50 p-2 bg-white/10 backdrop-blur rounded-full text-xs font-bold">
{lang.toUpperCase()}
</button>
</div>
<div id="hero" data-section="hero">
<HeroSplitTestimonial
background={{ variant: "gradient-bars" }}
title="Exceptional Food, Craft Drinks, Unforgettable Moments"
description="Paröle combines elevated pub cuisine with carefully curated beverages in a vibrant, welcoming space. Whether dining solo, celebrating with friends, or hosting an event, we deliver memorable experiences every visit."
testimonials={[
{ name: "Sarah J.", handle: "@sarahj", testimonial: "The best pub food I've had in years. The ambiance is perfect for a relaxed date night.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/high-angle-friends-having-lunch-restaurant_23-2150491780.jpg" },
{ name: "David K.", handle: "@davidk", testimonial: "Excellent service and a fantastic selection of craft beverages. A new favorite.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/group-friends-having-lunch-together-restaurant_23-2150520106.jpg" },
{ name: "Elena M.", handle: "@elenam", testimonial: "A wonderful spot to unwind after a long week. Everything here feels intentional and high-quality.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/side-view-friends-enjoying-dinner-party_52683-132626.jpg" },
{ name: "Marcus T.", handle: "@marcust", testimonial: "The staff truly makes the difference. Exceptional hospitality every time.", rating: 4, imageSrc: "http://img.b2bpic.net/free-photo/close-up-young-friends-restaurant_23-2148395397.jpg" },
{ name: "Linda G.", handle: "@lindag", testimonial: "Consistently great food. The menu variety is impressive for a local gastropub.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-with-his-friend-enjoying-drinks-restaurant_23-2147861945.jpg" },
]}
buttons={[{ text: "Reserve Your Table", href: "#contact" }]}
imageSrc="http://img.b2bpic.net/free-photo/delicious-italian-cocktail-with-realistic-background_23-2150062988.jpg?_wi=1"
mediaAnimation="slide-up"
avatars={[
{ src: "http://img.b2bpic.net/free-photo/group-friends-eating-restaurant_23-2148006695.jpg", alt: "Diner 1" },
{ src: "http://img.b2bpic.net/free-photo/young-man-drinking-beer-with-friends-pub_1262-3685.jpg", alt: "Diner 2" },
{ src: "http://img.b2bpic.net/free-photo/good-day-spent-with-friends-pub_329181-18384.jpg", alt: "Diner 3" },
{ src: "http://img.b2bpic.net/free-photo/young-man-near-charming-woman-bar-counter_23-2148016853.jpg", alt: "Diner 4" },
{ src: "http://img.b2bpic.net/free-photo/young-man-kissing-hugging-with-woman-near-bar-counter_23-2148016820.jpg", alt: "Diner 5" },
]}
marqueeItems={[
{ type: "text", text: "Locally Sourced" },
{ type: "text", text: "Craft Beer & Spirits" },
{ type: "text", text: "Modern Pub Cuisine" },
{ type: "text", text: "Private Event Space" },
{ type: "text", text: "Expert Culinary Team" },
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitTestimonial
background={{ variant: "gradient-bars" }}
title={t[lang as 'en' | 'es'].hero.title}
description={t[lang as 'en' | 'es'].hero.desc}
testimonials={[
{ name: "Sarah J.", handle: "@sarahj", testimonial: lang === 'en' ? "The best pub food I've had in years." : "La mejor comida de pub que he tenido en años.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/high-angle-friends-having-lunch-restaurant_23-2150491780.jpg" },
]}
buttons={[{ text: t[lang as 'en' | 'es'].hero.btn, href: "#contact" }]}
imageSrc="http://img.b2bpic.net/free-photo/delicious-italian-cocktail-with-realistic-background_23-2150062988.jpg?_wi=1"
mediaAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<TestimonialAboutCard
useInvertedBackground={false}
tag="Our Story"
title="A Welcoming Space for Everyone"
description="Located in the heart of the city, Paröle is dedicated to creating a space where locals and visitors alike can enjoy elevated pub fare in a sophisticated yet approachable environment."
subdescription="From casual after-work drinks to corporate events, our doors are open for your next unforgettable moment."
icon={Shield}
imageSrc="http://img.b2bpic.net/free-photo/couple-having-date-night_53876-13928.jpg?_wi=1"
mediaAnimation="blur-reveal"
/>
</div>
<div id="about" data-section="about">
<TestimonialAboutCard
useInvertedBackground={false}
tag={lang === 'en' ? "Our Story" : "Nuestra Historia"}
title={lang === 'en' ? "A Welcoming Space for Everyone" : "Un Espacio Acogedor para Todos"}
description={lang === 'en' ? "Located in the heart of the city, Paröle is dedicated to creating a space for locals and visitors." : "Ubicado en el corazón de la ciudad, Paröle se dedica a crear un espacio para locales y visitantes."}
subdescription={lang === 'en' ? "From casual drinks to events, our doors are open." : "Desde bebidas casuales hasta eventos, nuestras puertas están abiertas."}
icon={Shield}
imageSrc="http://img.b2bpic.net/free-photo/couple-having-date-night_53876-13928.jpg?_wi=1"
mediaAnimation="blur-reveal"
/>
</div>
<div id="menu" data-section="menu">
<ProductCardTwo
animationType="slide-up"
textboxLayout="split-description"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
products={[
{ id: "1", brand: "Starter", name: "Artisan Charcuterie", price: "$18", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/half-shot-delicious-best-snack-wine-brown-tray-right-side-ice-background_140725-140410.jpg" },
{ id: "2", brand: "Main", name: "Classic Paröle Burger", price: "$22", rating: 5, reviewCount: "340", imageSrc: "http://img.b2bpic.net/free-photo/medium-fried-pieces-meat-fried-onions_140725-3560.jpg" },
{ id: "3", brand: "Drink", name: "Craft Beer Flight", price: "$14", rating: 4, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/beer-glass-bar_23-2148111128.jpg" },
{ id: "4", brand: "Main", name: "Chef's Special Catch", price: "$28", rating: 5, reviewCount: "92", imageSrc: "http://img.b2bpic.net/free-photo/focused-master-chef-wearing-uniform-cooking-delicious-beef-steak-kitchen-restaurant_613910-18983.jpg" },
{ id: "5", brand: "Dessert", name: "Molten Chocolate Cake", price: "$12", rating: 5, reviewCount: "150", imageSrc: "http://img.b2bpic.net/free-photo/pancakes-colored-coffee_1321-877.jpg" },
{ id: "6", brand: "Drink", name: "Signature Red Wine", price: "$16", rating: 4, reviewCount: "67", imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-chicken-breast-grilled-potatoes-plate-wine_181624-35168.jpg" },
]}
title="Menu Highlights"
description="Discover our signature dishes and curated drink selection."
/>
</div>
<div id="menu" data-section="menu">
<ProductCardTwo
animationType="slide-up"
textboxLayout="split-description"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
products={[
{ id: "1", brand: lang === 'en' ? "Starter" : "Entrante", name: "Artisan Charcuterie", price: "$18", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/half-shot-delicious-best-snack-wine-brown-tray-right-side-ice-background_140725-140410.jpg" },
]}
title={lang === 'en' ? "Menu Highlights" : "Destacados del Menú"}
description={lang === 'en' ? "Discover our signature dishes." : "Descubre nuestros platos estrella."}
/>
</div>
<div id="features" data-section="features">
<FeatureBento
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
features={[
{
title: "Events & Hosting", description: "Custom catering and space for corporate meetings and team building.", bentoComponent: "reveal-icon", icon: Award,
},
{
title: "Private Dining", description: "Intimate settings for your most important celebrations.", bentoComponent: "reveal-icon", icon: Shield,
},
{
title: "Expert Staff", description: "Professional service to ensure your visit is flawless.", bentoComponent: "reveal-icon", icon: Sparkles,
},
]}
title="Why Choose Paröle"
description="Experience the best in pub dining and event hosting."
/>
</div>
<div id="features" data-section="features">
<FeatureBento
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
features={[
{ title: lang === 'en' ? "Events" : "Eventos", description: lang === 'en' ? "Custom catering." : "Catering personalizado.", bentoComponent: "reveal-icon", icon: Award },
]}
title={lang === 'en' ? "Why Choose Paröle" : "Por qué elegir Paröle"}
description={lang === 'en' ? "Experience the best." : "Experimenta lo mejor."}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardSeven
animationType="depth-3d"
textboxLayout="default"
useInvertedBackground={true}
metrics={[
{ id: "1", value: "15k+", title: "Happy Guests", items: ["Diners served", "Great reviews"] },
{ id: "2", value: "500+", title: "Events Hosted", items: ["Corporate", "Private"] },
{ id: "3", value: "50+", title: "Craft Drinks", items: ["Curated selection", "Expertly mixed"] },
]}
title="Our Impact"
description="The numbers behind our great moments."
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={true}
background={{ variant: "radial-gradient" }}
title={t[lang as 'en' | 'es'].contact.title}
description={t[lang as 'en' | 'es'].contact.desc}
tag={t[lang as 'en' | 'es'].contact.tag}
inputPlaceholder={t[lang as 'en' | 'es'].contact.placeholder}
buttonText={t[lang as 'en' | 'es'].contact.btn}
termsText={t[lang as 'en' | 'es'].contact.terms}
imageSrc="http://img.b2bpic.net/free-photo/full-shot-teens-walking-together_23-2149241599.jpg"
mediaAnimation="slide-up"
/>
</div>
<div id="team" data-section="team">
<TeamCardSix
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
members={[
{ id: "1", name: "Alex Rivers", role: "Head Chef", imageSrc: "http://img.b2bpic.net/free-photo/food-celebrating-world-tapas-day_23-2149361448.jpg" },
{ id: "2", name: "Jordan Smith", role: "Event Manager", imageSrc: "http://img.b2bpic.net/free-photo/delicious-italian-cocktail-with-realistic-background_23-2150062988.jpg?_wi=2" },
{ id: "3", name: "Casey Morgan", role: "Lead Mixologist", imageSrc: "http://img.b2bpic.net/free-photo/couple-having-date-night_53876-13928.jpg?_wi=2" },
]}
title="Meet the Team"
description="Our professionals are dedicated to your experience."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTen
textboxLayout="split-description"
useInvertedBackground={true}
testimonials={[
{ id: "1", title: "Great Experience", quote: "The food and drinks are top notch.", name: "Sarah Johnson", role: "CEO", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-senior-with-delicious-food_23-2150854212.jpg" },
{ id: "2", title: "Perfect for Events", quote: "We hosted our annual team meeting here and it was flawless.", name: "Michael Chen", role: "Manager", imageSrc: "http://img.b2bpic.net/free-photo/young-couple-having-drinks-party_23-2148037653.jpg" },
{ id: "3", title: "Best Date Spot", quote: "Cozy, elegant, and the staff is so friendly.", name: "Emily Rodriguez", role: "Designer", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-having-bouquet-roses-from-her-boyfriend_23-2149161977.jpg" },
{ id: "4", title: "Highly Recommended", quote: "I come here weekly for the craft beer and food.", name: "David Kim", role: "Consultant", imageSrc: "http://img.b2bpic.net/free-photo/european-woman-using-mobile-phone-cafe_273443-679.jpg" },
{ id: "5", title: "Lovely Atmosphere", quote: "My go-to spot for relaxing evenings.", name: "Laura White", role: "Accountant", imageSrc: "http://img.b2bpic.net/free-photo/people-hangout-together-coffee-shop_53876-42688.jpg" },
]}
title="What Our Guests Say"
description="Stories from our valued diners."
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
textboxLayout="split-description"
useInvertedBackground={false}
faqs={[
{ id: "1", title: "Do I need a reservation?", content: "We recommend reservations, especially on weekends, but walk-ins are always welcome." },
{ id: "2", title: "Can I host a private event?", content: "Absolutely! Contact our events team for details on function spaces and catering." },
{ id: "3", title: "Are there vegetarian options?", content: "Yes, our menu features several vegetarian and gluten-free choices." },
]}
title="Frequently Asked Questions"
description="Everything you need to know about dining at Paröle."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={true}
background={{ variant: "radial-gradient" }}
title="Book Your Experience"
description="Secure your table or inquire about events today."
tag="Contact Us"
imageSrc="http://img.b2bpic.net/free-photo/full-shot-teens-walking-together_23-2149241599.jpg"
mediaAnimation="slide-up"
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Paröle Pub & Food"
copyrightText="© 2025 Paröle Pub & Food. All rights reserved."
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Paröle Pub & Food"
copyrightText={t[lang as 'en' | 'es'].footer.copyright}
/>
</div>
</ReactLenis>
</ThemeProvider>
);