Files
8bbcd181-3fa0-4fad-9405-cbe…/src/app/page.tsx
2026-05-05 06:03:08 +00:00

368 lines
11 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
import MediaAbout from '@/components/sections/about/MediaAbout';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="compact"
sizing="largeSmallSizeLargeTitles"
background="floatingGradient"
cardStyle="glass-elevated"
primaryButtonStyle="shadow"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home",
id: "#home",
},
{
name: "About",
id: "#about",
},
{
name: "Menu",
id: "#menu",
},
{
name: "Contact",
id: "#contact",
},
]}
brandName="Mila Cafe"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardGallery
background={{
variant: "gradient-bars",
}}
title="Welcome to Mila Cafe"
description="Discover a place where every cup tells a story. Freshly roasted coffee, handmade pastries, and a warm community await you."
buttons={[
{
text: "Visit Us",
href: "#contact",
},
]}
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-sitting-table_23-2148773522.jpg",
imageAlt: "cozy cafe interior warm lighting",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/delicious-coffee-cup-plate_23-2149703763.jpg",
imageAlt: "barista preparing artisanal coffee",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/croissants-with-chocolate-filling-wooden-board_114579-77537.jpg",
imageAlt: "pastries display in cafe",
},
]}
mediaAnimation="blur-reveal"
/>
</div>
<div id="about" data-section="about">
<MediaAbout
useInvertedBackground={false}
title="Our Passion for Coffee"
description="At Mila Cafe, we believe that coffee is more than just a drink; it's a bridge that connects people. We source only the finest beans from sustainable farms, roasting them to perfection to bring out unique, nuanced profiles in every brew."
imageSrc="http://img.b2bpic.net/free-photo/table-chairs-bar_107420-65857.jpg"
imageAlt="friendly barista greeting customer"
/>
</div>
<div id="features" data-section="features">
<FeatureCardTwentyThree
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
features={[
{
id: "1",
title: "Ethically Sourced",
tags: [
"Sustainable",
"Premium",
],
imageSrc: "http://img.b2bpic.net/free-photo/top-view-coffee-beans-black-pan-dark-surface_176474-554.jpg",
imageAlt: "Top view coffee beans in black pan",
},
{
id: "2",
title: "Handcrafted Pastries",
tags: [
"Baked Daily",
"Fresh",
],
imageSrc: "http://img.b2bpic.net/free-photo/croissants-with-coffee-beans-honey-dipper-plaster-cutting-board-flat-lay_176474-8231.jpg",
imageAlt: "Croissants with coffee and beans",
},
{
id: "3",
title: "Cozy Atmosphere",
tags: [
"Community",
"Relax",
],
imageSrc: "http://img.b2bpic.net/free-photo/interior-modern-cafe-with-sofas-chairs-tables_169016-36774.jpg",
imageAlt: "Interior of a modern cafe",
},
]}
title="The Mila Experience"
description="Experience the difference of artisanal quality."
/>
</div>
<div id="menu" data-section="menu">
<ProductCardTwo
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{
id: "1",
brand: "Mila",
name: "Signature Espresso",
price: "$4.50",
rating: 5,
reviewCount: "120",
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-friends-drinking-coffee_23-2148395430.jpg",
},
{
id: "2",
brand: "Mila",
name: "Lavender Latte",
price: "$5.50",
rating: 5,
reviewCount: "85",
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-entrepreneur-working_23-2148366585.jpg",
},
{
id: "3",
brand: "Mila",
name: "Cold Brew",
price: "$5.00",
rating: 4,
reviewCount: "210",
imageSrc: "http://img.b2bpic.net/free-photo/buffet-breakfast-with-sweets_116348-94.jpg",
},
{
id: "4",
brand: "Mila",
name: "Almond Croissant",
price: "$4.00",
rating: 5,
reviewCount: "95",
imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-drinking-coffee_52683-119034.jpg",
},
{
id: "5",
brand: "Mila",
name: "Avocado Toast",
price: "$9.00",
rating: 5,
reviewCount: "150",
imageSrc: "http://img.b2bpic.net/free-photo/roasted-coffee-beans-table-closeup_250435-1137.jpg",
},
{
id: "6",
brand: "Mila",
name: "Morning Muffin",
price: "$3.50",
rating: 4,
reviewCount: "70",
imageSrc: "http://img.b2bpic.net/free-photo/white-coffee-cup-with-eyeglasses-book-wooden-table_23-2147892948.jpg",
},
]}
title="Our Menu Favorites"
description="Hand-picked favorites for your daily ritual."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSix
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
testimonials={[
{
id: "1",
name: "Sarah J.",
handle: "@sarahj",
testimonial: "The best coffee in town. Mila Cafe is my home away from home.",
imageSrc: "http://img.b2bpic.net/free-photo/laughing-woman-drinking-cafe_23-2147785363.jpg",
},
{
id: "2",
name: "Mike R.",
handle: "@miker",
testimonial: "Consistently excellent coffee and the friendliest baristas!",
imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-making-coffee_23-2150354576.jpg",
},
{
id: "3",
name: "Emily C.",
handle: "@emilyc",
testimonial: "Their almond croissant is a game changer. Highly recommend.",
imageSrc: "http://img.b2bpic.net/free-photo/charming-woman-drinking-hot-beverage-cafe_23-2147785358.jpg",
},
{
id: "4",
name: "David L.",
handle: "@davidl",
testimonial: "Perfect spot to work or catch up with friends. Love the vibe.",
imageSrc: "http://img.b2bpic.net/free-photo/stylish-caucasian-bearded-student-headwear-drinking-cappuccino-alone-modern-outdoor-coffee-shop-sunny-day-waiting-his-girlfriend-join-him_273609-1750.jpg",
},
{
id: "5",
name: "Jessica B.",
handle: "@jessb",
testimonial: "A truly artisanal experience in every cup.",
imageSrc: "http://img.b2bpic.net/free-photo/lovely-woman-smelling-drink-cafe_23-2147785362.jpg",
},
]}
title="Loved by Our Community"
description="What our patrons have to say."
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "1",
title: "Do you offer oat milk?",
content: "Yes, we offer oat, almond, and soy milk alternatives.",
},
{
id: "2",
title: "Is your coffee organic?",
content: "We prioritize organic and fair-trade beans whenever possible.",
},
{
id: "3",
title: "Do you have Wi-Fi?",
content: "Yes, we offer free high-speed Wi-Fi for all our customers.",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/nice-female-barista-making-raf-coffee-smiling-cheerfully-looking-happy_176420-7876.jpg"
title="Commonly Asked"
description="Questions you might have."
faqsAnimation="slide-up"
imageAlt="coffee expert consulting customer"
/>
</div>
<div id="social-proof" data-section="social-proof">
<SocialProofOne
textboxLayout="default"
useInvertedBackground={true}
names={[
"The Daily Grind",
"Bean Magazine",
"Coffee Connoisseur",
"Urban Eats",
"Morning Brew Weekly",
"Cafe Trends",
"Local Flavor Guides",
]}
title="Proudly Supported By"
description="Trusted by local experts and partners."
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
useInvertedBackground={false}
title="Get in Touch"
description="Questions? Feedback? Say hello!"
inputs={[
{
name: "name",
type: "text",
placeholder: "Your Name",
required: true,
},
{
name: "email",
type: "email",
placeholder: "Email Address",
required: true,
},
]}
textarea={{
name: "message",
placeholder: "How can we help?",
rows: 4,
required: true,
}}
imageSrc="http://img.b2bpic.net/free-photo/trendy-bakery-shop_53876-23440.jpg"
imageAlt="coffee shop exterior facade"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{
items: [
{
label: "About Us",
href: "#about",
},
{
label: "Our Menu",
href: "#menu",
},
{
label: "Contact",
href: "#contact",
},
],
},
{
items: [
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms of Service",
href: "#",
},
],
},
]}
logoText="Mila Cafe"
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}