Files
c47fdd9c-e03a-46d0-90dc-d31…/src/app/page.tsx
2026-05-10 15:01:46 +00:00

450 lines
14 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import { Award, CheckCircle, Flame, Leaf, Shield, ShieldCheck, Sparkles, Wheat } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="text-shift"
defaultTextAnimation="background-highlight"
borderRadius="soft"
contentWidth="medium"
sizing="largeSizeMediumTitles"
background="aurora"
cardStyle="layered-gradient"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="radial-glow"
headingFontWeight="light"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Inicio",
id: "#hero",
},
{
name: "Nosotros",
id: "#about",
},
{
name: "Productos",
id: "#products",
},
{
name: "Contacto",
id: "#contact",
},
]}
brandName="Panadería la Providencia"
button={{
text: "Hacer Pedido",
href: "#contact",
}}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplit
background={{
variant: "gradient-bars",
}}
title="Tradición y Calidad en Cada Rebanada"
description="Pan artesanal horneado diariamente con ingredientes naturales y mucho amor. Experimenta el sabor auténtico de la Panadería la Providencia."
buttons={[
{
text: "Ver Catálogo",
href: "#products",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/baker-s-hand-shifting-flour-with-sieve-bread-dough_23-2147872728.jpg?_wi=1"
imageAlt="freshly baked sourdough bread wooden table"
mediaAnimation="slide-up"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/woman-kneads-dough-make-pizza-wooden-cooking-concept_1150-4702.jpg",
alt: "Woman kneads dough for make pizza on wooden. Cooking concept.",
},
{
src: "http://img.b2bpic.net/free-photo/top-view-flour-wooden-surface_23-2148018421.jpg",
alt: "Top view of flour on wooden surface",
},
{
src: "http://img.b2bpic.net/free-photo/beautiful-person-food-young-people_1303-611.jpg",
alt: "beautiful person food young people",
},
{
src: "http://img.b2bpic.net/free-photo/top-view-arrangement-homemade-bread-flour_23-2148438706.jpg",
alt: "Top view arrangement for homemade bread and flour",
},
{
src: "http://img.b2bpic.net/free-photo/woman-smiling_1187-3196.jpg",
alt: "Woman smiling",
},
]}
avatarText="Más de 500 clientes felices"
marqueeItems={[
{
type: "text-icon",
text: "Masa Madre",
icon: Wheat,
},
{
type: "text-icon",
text: "Artesanal",
icon: Award,
},
{
type: "text-icon",
text: "Recién horneado",
icon: Flame,
},
{
type: "text-icon",
text: "Ingredientes locales",
icon: Leaf,
},
{
type: "text-icon",
text: "Sin conservantes",
icon: ShieldCheck,
},
]}
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={false}
title="Más de 30 Años Hornenado Historias"
description="Desde nuestra fundación, nos hemos dedicado a mantener vivas las técnicas de panadería tradicional, combinando la paciencia de las largas fermentaciones con la frescura de insumos locales."
metrics={[
{
value: "30+",
title: "Años de experiencia",
},
{
value: "15k+",
title: "Panes horneados",
},
{
value: "100%",
title: "Ingredientes naturales",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/baked-breads-buns-kept-shelf_1170-2315.jpg?_wi=1"
imageAlt="baker kneading dough flour clouds"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
/>
</div>
<div id="products" data-section="products">
<ProductCardThree
animationType="slide-up"
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={true}
products={[
{
id: "p1",
name: "Sourdough Clásico",
price: "$4.50",
imageSrc: "http://img.b2bpic.net/free-photo/sliced-loaf-artisan-sourdough-bread-cutting-board-top-view-vertical-frame_166373-2967.jpg?_wi=1",
},
{
id: "p2",
name: "Croissant de Mantequilla",
price: "$2.50",
imageSrc: "http://img.b2bpic.net/free-photo/croissant-juice-breakfast_23-2147717709.jpg",
},
{
id: "p3",
name: "Pain au Chocolat",
price: "$3.00",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-dessert-with-chocolate-chips_23-2149644649.jpg",
},
{
id: "p4",
name: "Ciabatta Rústica",
price: "$3.50",
imageSrc: "http://img.b2bpic.net/free-photo/bread-loaf-red-tablecloth-marble-table_114579-56597.jpg",
},
{
id: "p5",
name: "Baguette Tradicional",
price: "$2.00",
imageSrc: "http://img.b2bpic.net/free-photo/fresh-baked-homemade-baguette-bread_114579-91569.jpg",
},
{
id: "p6",
name: "Pan Integral de Centeno",
price: "$5.00",
imageSrc: "http://img.b2bpic.net/free-photo/slicing-artisan-bread-straw-lining-top-view-pieces-fresh-homemade-sourdough-bread-healthy-healthy-cuisine_166373-3248.jpg",
},
]}
title="Nuestras Especialidades"
description="Descubre nuestra selección de panes, bollería y especialidades dulces horneadas con el mayor cuidado."
/>
</div>
<div id="features" data-section="features">
<FeatureCardTen
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
features={[
{
title: "Masa Madre",
description: "Fermentación lenta natural de 48 horas.",
media: {
imageSrc: "http://img.b2bpic.net/free-photo/top-view-delicious-baked-bread-white-cloth_23-2148438714.jpg",
},
items: [
{
icon: Sparkles,
text: "Saludable",
},
{
icon: CheckCircle,
text: "Digestión fácil",
},
],
reverse: false,
imageSrc: "http://img.b2bpic.net/free-photo/baker-s-hand-shifting-flour-with-sieve-bread-dough_23-2147872728.jpg?_wi=2",
imageAlt: "sourdough artisan loaf bread",
},
{
title: "Horno de Piedra",
description: "El sabor único de leña y piedra.",
media: {
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-bread-wooden-table_23-2148544831.jpg",
},
items: [
{
icon: Award,
text: "Sabor auténtico",
},
{
icon: CheckCircle,
text: "Corteza crujiente",
},
],
reverse: true,
imageSrc: "http://img.b2bpic.net/free-photo/baked-breads-buns-kept-shelf_1170-2315.jpg?_wi=2",
imageAlt: "sourdough artisan loaf bread",
},
{
title: "Sin Conservantes",
description: "Solo harina, agua, sal y tiempo.",
media: {
imageSrc: "http://img.b2bpic.net/free-photo/pile-french-baguettes_176420-7285.jpg",
},
items: [
{
icon: Shield,
text: "Sin aditivos",
},
{
icon: CheckCircle,
text: "Natural",
},
],
reverse: false,
imageSrc: "http://img.b2bpic.net/free-photo/sliced-loaf-artisan-sourdough-bread-cutting-board-top-view-vertical-frame_166373-2967.jpg?_wi=2",
imageAlt: "sourdough artisan loaf bread",
},
]}
title="Por Qué Elegirnos"
description="Nuestra dedicación se nota en cada detalle."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardTwo
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={true}
metrics={[
{
id: "m1",
value: "100%",
description: "Satisfacción garantizada",
},
{
id: "m2",
value: "50+",
description: "Recetas tradicionales",
},
{
id: "m3",
value: "12",
description: "Premios nacionales",
},
]}
title="Nuestros Logros"
description="El respaldo de una comunidad que ama el buen pan."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSixteen
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
testimonials={[
{
id: "1",
name: "María G.",
role: "Clienta regular",
company: "Vecina local",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/baker-keeping-tray-baked-buns-shelf_1170-2238.jpg",
},
{
id: "2",
name: "Carlos M.",
role: "Fan del Sourdough",
company: "Comensal",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-brunette-woman-sitting-with-coffee-using-smartphone-cafe-chatting_1258-199048.jpg",
},
{
id: "3",
name: "Lucía P.",
role: "Chef",
company: "Restaurante",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-woman-serving-pastry-cake-female-customer-coffee-shop_23-2148028059.jpg",
},
{
id: "4",
name: "Jorge A.",
role: "Cliente",
company: "Comensal",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/teen-age-youth-style-self-expression-concept-portrait-positive-happy-teenage-girl-with-bob-pinkish-hairstyle-facial-piercing-relaxing-indoors_343059-3781.jpg",
},
{
id: "5",
name: "Ana R.",
role: "Cliente",
company: "Comensal",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/happy-redhead-woman-eating-some-street-food_23-2148952874.jpg",
},
]}
kpiItems={[
{
value: "4.9/5",
label: "Calificación",
},
{
value: "1k+",
label: "Reseñas",
},
{
value: "98%",
label: "Lealtad",
},
]}
title="Lo que dicen nuestros clientes"
description="Nuestros clientes son parte de nuestra familia."
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
textboxLayout="default"
useInvertedBackground={true}
faqs={[
{
id: "f1",
title: "¿Tienen servicio a domicilio?",
content: "Sí, realizamos entregas en todo el municipio.",
},
{
id: "f2",
title: "¿El pan tiene conservantes?",
content: "No, todos nuestros panes son libres de aditivos químicos.",
},
{
id: "f3",
title: "¿Puedo reservar pedidos especiales?",
content: "Claro, contáctanos con 24 horas de antelación.",
},
]}
title="Preguntas Frecuentes"
description="Resolvemos tus dudas sobre nuestros procesos."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactText
useInvertedBackground={false}
background={{
variant: "rotated-rays-static-grid",
}}
text="¡Haz tu pedido hoy mismo!"
buttons={[
{
text: "WhatsApp",
href: "https://wa.me/1234567890",
},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="Panadería la Providencia"
columns={[
{
title: "Enlaces",
items: [
{
label: "Inicio",
href: "#hero",
},
{
label: "Productos",
href: "#products",
},
],
},
{
title: "Legal",
items: [
{
label: "Privacidad",
href: "#",
},
{
label: "Términos",
href: "#",
},
],
},
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}