Files
38ce614f-66f2-4e67-a1a4-8d0…/src/app/page.tsx
2026-04-03 10:10:51 +00:00

284 lines
8.5 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactFaq from '@/components/sections/contact/ContactFaq';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterBase from '@/components/sections/footer/FooterBase';
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import { Coffee, Mail } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="directional-hover"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
contentWidth="smallMedium"
sizing="mediumLargeSizeMediumTitles"
background="blurBottom"
cardStyle="subtle-shadow"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="glass"
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "À propos",
id: "about",
},
{
name: "La carte",
id: "menu",
},
{
name: "Horaires",
id: "info",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="Creem"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitKpi
background={{
variant: "gradient-bars",
}}
title="L'art du café à Bastille."
description="Café de spécialité, pâtisseries maison et douceurs artisanales au cœur de Paris."
kpis={[
{
value: "100%",
label: "Fait Maison",
},
{
value: "Artisan",
label: "Torréfaction",
},
{
value: "16",
label: "Rue St-Antoine",
},
]}
enableKpiAnimation={true}
imageSrc="http://img.b2bpic.net/free-photo/coffee-making-items-arrangement_23-2148865610.jpg"
mediaAnimation="blur-reveal"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/barista-pouring-coffee-with-chemex_1220-7512.jpg",
alt: "Client 1",
},
{
src: "http://img.b2bpic.net/free-photo/coffee-making-items-arrangement_23-2148865610.jpg",
alt: "Client 2",
},
{
src: "http://img.b2bpic.net/free-photo/pieces-mixed-homemade-breads-presented-different-levels-wooden-table-as-samples-sale-made-from-sweet-potato_346278-830.jpg",
alt: "Client 3",
},
{
src: "http://img.b2bpic.net/free-photo/barista-pouring-coffee-with-chemex_1220-7512.jpg",
alt: "Client 4",
},
{
src: "http://img.b2bpic.net/free-photo/coffee-making-items-arrangement_23-2148865610.jpg",
alt: "Client 5",
},
]}
marqueeItems={[
{
type: "text",
text: "Torréfaction Fraîche",
},
{
type: "text",
text: "Ambiance Cosy",
},
{
type: "text",
text: "Pâtisserie Maison",
},
{
type: "text",
text: "Spécialité Café",
},
{
type: "text",
text: "Artisanat Parisien",
},
]}
/>
</div>
<div id="about" data-section="about">
<TestimonialAboutCard
useInvertedBackground={false}
tag="Notre histoire"
title="L'excellence en chaque tasse"
description="Niché au cœur du quartier Bastille-Marais, Creem est un coffee shop de spécialité où chaque tasse est préparée avec passion sur notre La Marzocco."
subdescription="Nos pâtisseries, cookies et cakes sont faits maison, chaque jour. Nous proposons aussi des options véganes gourmandes et des produits sélectionnés pour leur qualité exceptionnelle."
icon={Coffee}
imageSrc="http://img.b2bpic.net/free-photo/pieces-mixed-homemade-breads-presented-different-levels-wooden-table-as-samples-sale-made-from-sweet-potato_346278-830.jpg"
mediaAnimation="slide-up"
/>
</div>
<div id="menu" data-section="menu">
<ProductCardThree
animationType="slide-up"
textboxLayout="split"
gridVariant="uniform-all-items-equal"
useInvertedBackground={true}
products={[
{
id: "1",
name: "Espresso",
price: "3 €",
imageSrc: "http://img.b2bpic.net/free-photo/barista-pouring-coffee-with-chemex_1220-7512.jpg",
},
{
id: "2",
name: "Flat White",
price: "5 €",
imageSrc: "http://img.b2bpic.net/free-photo/barista-pouring-coffee-with-chemex_1220-7512.jpg",
},
{
id: "3",
name: "Latte",
price: "5.50 €",
imageSrc: "http://img.b2bpic.net/free-photo/barista-pouring-coffee-with-chemex_1220-7512.jpg",
},
{
id: "4",
name: "Matcha Latte",
price: "6 €",
imageSrc: "http://img.b2bpic.net/free-photo/barista-pouring-coffee-with-chemex_1220-7512.jpg",
},
{
id: "5",
name: "Cookie Maison",
price: "3.50 €",
imageSrc: "http://img.b2bpic.net/free-photo/barista-pouring-coffee-with-chemex_1220-7512.jpg",
},
{
id: "6",
name: "Cake Maison",
price: "4 €",
imageSrc: "http://img.b2bpic.net/free-photo/barista-pouring-coffee-with-chemex_1220-7512.jpg",
},
]}
title="La Carte"
description="Des créations simples et généreuses."
/>
</div>
<div id="info" data-section="info">
<ContactSplit
useInvertedBackground={false}
background={{
variant: "plain",
}}
tag="Contact"
title="Rendez-nous visite"
description="16 rue Saint-Antoine, 75004 Paris. Ouvert tous les jours."
imageSrc="http://img.b2bpic.net/free-photo/coffee-making-items-arrangement_23-2148865610.jpg"
mediaPosition="right"
mediaAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactFaq
animationType="slide-up"
useInvertedBackground={false}
ctaTitle="Des questions ?"
ctaDescription="Contactez-nous pour toute demande particulière, privatisation ou commande en gros."
ctaButton={{
text: "Nous contacter",
href: "mailto:hello@creem.coffee",
}}
ctaIcon={Mail}
faqs={[
{
id: "1",
title: "Proposez-vous du lait végétal ?",
content: "Oui, nous proposons du lait d'avoine et d'amande sans surcoût.",
},
{
id: "2",
title: "Est-ce que tout est fait maison ?",
content: "Absolument. Nos pâtisseries sont préparées chaque matin dans notre laboratoire.",
},
{
id: "3",
title: "Prenez-vous les réservations ?",
content: "Nous fonctionnons sans réservation pour garantir une rotation fluide et chaleureuse.",
},
{
id: "4",
title: "Le café est-il torréfié sur place ?",
content: "Nous travaillons avec des torréfacteurs partenaires rigoureusement sélectionnés pour leur éthique.",
},
{
id: "5",
title: "Puis-je travailler sur place ?",
content: "L'ambiance est conviviale, n'hésitez pas à venir vous installer avec votre ordinateur.",
},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
columns={[
{
title: "Navigation",
items: [
{
label: "À propos",
href: "#about",
},
{
label: "La carte",
href: "#menu",
},
{
label: "Horaires",
href: "#info",
},
],
},
{
title: "Contact",
items: [
{
label: "hello@creem.coffee",
href: "mailto:hello@creem.coffee",
},
{
label: "Instagram",
href: "https://instagram.com/creem.coffee",
},
],
},
]}
logoText="Creem"
copyrightText="© 2026 Creem Coffee Shop"
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}