Files
7955cbc8-021d-4357-b92a-8f2…/src/app/page.tsx
2026-04-22 07:01:04 +00:00

198 lines
9.9 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import FooterCard from '@/components/sections/footer/FooterCard';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import MediaAbout from '@/components/sections/about/MediaAbout';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import { Award, Coffee, Globe } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="elastic-effect"
defaultTextAnimation="reveal-blur"
borderRadius="pill"
contentWidth="mediumSmall"
sizing="largeSizeMediumTitles"
background="grid"
cardStyle="gradient-bordered"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="glass"
headingFontWeight="extrabold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{ name: "About", id: "about" },
{ name: "Menu", id: "products" },
{ name: "Testimonials", id: "testimonials" },
{ name: "Contact", id: "contact" },
]}
brandName="Brew & Bean"
button={{ text: "Order Now", href: "#products" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplit
background={{ variant: "gradient-bars" }}
title="Your Morning, Perfectly Brewed"
description="Experience the art of specialty coffee in the heart of the city. Hand-roasted beans, expert baristas, and a cozy atmosphere await you."
buttons={[{ text: "Explore Menu", href: "#products" }]}
imageSrc="http://img.b2bpic.net/free-photo/woman-works-cafe-evening_1153-3549.jpg"
imageAlt="Artisanal coffee experience"
mediaAnimation="blur-reveal"
avatars={[
{ src: "http://img.b2bpic.net/free-photo/young-business-woman-drinking-coffee-outdoors_1303-11352.jpg", alt: "Customer profile 1" },
{ src: "http://img.b2bpic.net/free-photo/cosy-moments-happy-young-woman-sits-kitchen-with-cup-freshly-brewed-coffee-smiling-looking_1258-201673.jpg", alt: "Customer profile 2" },
{ src: "http://img.b2bpic.net/free-photo/young-woman-drinking-coffee-using-phone_1303-22502.jpg", alt: "Customer profile 3" },
{ src: "http://img.b2bpic.net/free-photo/portrait-young-latin-woman-enjoying-drinking-cup-coffee-coffee-shop_58466-16247.jpg", alt: "Customer profile 4" },
{ src: "http://img.b2bpic.net/free-photo/portrait-smiling-woman-drinks-coffee-stands-kitchen-enjoys-delicious-cup-cappuccino_1258-193533.jpg", alt: "Customer profile 5" },
]}
avatarText="Loved by 10,000+ coffee enthusiasts"
marqueeItems={[
{ type: "text", text: "Ethically Sourced" },
{ type: "text", text: "Small Batch Roast" },
{ type: "text", text: "Expertly Brewed" },
{ type: "text", text: "Cozy Atmosphere" },
{ type: "text", text: "Fair Trade Certified" },
]}
/>
</div>
<div id="about" data-section="about">
<MediaAbout
useInvertedBackground={false}
title="Passionate About Every Sip"
description="We source our beans from sustainable farms and roast them in small batches to ensure maximum flavor. Every cup is a testament to our dedication to coffee excellence."
imageSrc="http://img.b2bpic.net/free-photo/barista-pouring-milk-into-coffee-coffee-shop_1303-19413.jpg"
imageAlt="Barista hand-crafting a beverage"
/>
</div>
<div id="features" data-section="features">
<FeatureCardNine
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
features={[
{
title: "Ethically Sourced", description: "Beans sourced from organic, fair-trade farms.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-dark-roasted-coffee-beans_84443-72316.jpg" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/side-view-brown-coffee-beans-sack-rustic-table_141793-6965.jpg" }
},
{
title: "Master Baristas", description: "Highly trained experts in brewing science.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/male-barista-preparing-coffee_23-2148824432.jpg" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/side-view-hand-pouring-milk-glass_23-2149870651.jpg" }
},
{
title: "Cozy Ambience", description: "Designed for relaxation and connection.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/antique-ceiling-lamp_1203-804.jpg" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/cafe-bar-hotel-loft-style_1150-10724.jpg" }
},
]}
showStepNumbers={true}
title="Why Our Coffee Stands Out"
description="We believe coffee is more than a caffeine fix—its an experience."
/>
</div>
<div id="products" data-section="products">
<ProductCardFour
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
products={[
{ id: "p1", name: "Signature Espresso", price: "$3.50", variant: "Rich & Intense", imageSrc: "http://img.b2bpic.net/free-photo/cup-latte-coffee-with-frothy-foam-wooden-background_23-2148209223.jpg" },
{ id: "p2", name: "Velvet Cappuccino", price: "$4.50", variant: "Creamy & Balanced", imageSrc: "http://img.b2bpic.net/free-photo/hot-latte_74190-2680.jpg" },
{ id: "p3", name: "Classic Americano", price: "$3.75", variant: "Smooth & Strong", imageSrc: "http://img.b2bpic.net/free-photo/man-enjoying-cup-hot-coffee-cafe_53876-88441.jpg" },
{ id: "p4", name: "Signature Mocha", price: "$5.00", variant: "Chocolaty & Sweet", imageSrc: "http://img.b2bpic.net/free-photo/beating-chocolate_23-2148148754.jpg" },
{ id: "p5", name: "Iced Vanilla Latte", price: "$5.50", variant: "Chilled & Refreshing", imageSrc: "http://img.b2bpic.net/free-photo/perfect-iced-latte_53876-31301.jpg" },
{ id: "p6", name: "Flat White", price: "$4.25", variant: "Silky & Bold", imageSrc: "http://img.b2bpic.net/free-photo/coffee-cup_1339-4976.jpg" },
]}
title="Crafted Daily for You"
description="From classic espressos to creative specialties, discover your new favorite."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={true}
metrics={[
{ id: "m1", value: "10K+", title: "Cups Served", description: "Happy customers daily.", icon: Coffee },
{ id: "m2", value: "50+", title: "Coffee Origins", description: "From around the globe.", icon: Globe },
{ id: "m3", value: "12", title: "Roast Profiles", description: "Carefully perfected recipes.", icon: Award },
]}
title="By the Numbers"
description="Our impact on your daily routine."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardFifteen
useInvertedBackground={false}
testimonial="The best coffee I've had in a long time! The atmosphere is incredibly cozy and perfect for working or catching up with friends."
rating={5}
author="Sarah Miller"
avatars={[
{ src: "http://img.b2bpic.net/free-photo/cheerful-young-woman-enjoying-coffee-summer_1262-4770.jpg", alt: "Sarah Miller" },
{ src: "http://img.b2bpic.net/free-photo/close-up-portrait-beautiful-smiling-woman-holding-cup-coffee-posing-kitchen-enjoying_1258-194971.jpg", alt: "Michael Chen" },
{ src: "http://img.b2bpic.net/free-photo/woman-sitting-table-with-coffee_273609-12717.jpg", alt: "Alex Rivera" },
{ src: "http://img.b2bpic.net/free-photo/woman-drinking-hot-chocolate-cafe_23-2149944044.jpg", alt: "Emily Chen" },
{ src: "http://img.b2bpic.net/free-photo/smiling-asian-girl-barista-standing-apron-uniform-giving-you-cup-coffee-made-drink_1258-199302.jpg", alt: "Jason Park" },
]}
ratingAnimation="slide-up"
avatarsAnimation="blur-reveal"
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
textboxLayout="default"
useInvertedBackground={true}
faqs={[
{ id: "f1", title: "What beans do you use?", content: "We exclusively use fair-trade organic Arabica beans." },
{ id: "f2", title: "Do you offer vegan milk?", content: "Yes, we offer almond, soy, and oat milk alternatives." },
{ id: "f3", title: "Can I order online?", content: "Yes, please use our mobile app or website ordering portal." },
]}
title="Common Questions"
description="Get answers to your brewing queries."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
useInvertedBackground={false}
title="Visit Us Today"
description="Come grab a cup and say hello. We look forward to meeting you!"
inputs={[
{ name: "name", type: "text", placeholder: "Your Name", required: true },
{ name: "email", type: "email", placeholder: "Your Email", required: true },
]}
imageSrc="http://img.b2bpic.net/free-photo/romantic-date-couple-love-cafe-happy-couple-love-enjoying-romantic-moment_8353-6650.jpg"
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Brew & Bean"
copyrightText="© 2025 Brew & Bean. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}