Merge version_3 into main #6
172
src/app/page.tsx
172
src/app/page.tsx
@@ -4,16 +4,12 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import { useState, useEffect } 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 } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
@@ -59,96 +55,96 @@ export default function LandingPage() {
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<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="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={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="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={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="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: 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="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: 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="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="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="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="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Paröle Pub & Food"
|
||||
copyrightText={t[lang as 'en' | 'es'].footer.copyright}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Paröle Pub & Food"
|
||||
copyrightText={t[lang as 'en' | 'es'].footer.copyright}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user