191 lines
12 KiB
TypeScript
191 lines
12 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 FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
|
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
|
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
|
|
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-bubble"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="mediumSmall"
|
|
sizing="medium"
|
|
background="blurBottom"
|
|
cardStyle="gradient-bordered"
|
|
primaryButtonStyle="diagonal-gradient"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="medium"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
navItems={[
|
|
{ name: "About", id: "about" },
|
|
{ name: "Menu", id: "menu" },
|
|
{ name: "Testimonials", id: "testimonials" },
|
|
{ name: "Contact", id: "contact" },
|
|
]}
|
|
brandName="Brew & Bean"
|
|
button={{ text: "Order Online" }}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardTestimonial
|
|
background={{ variant: "radial-gradient" }}
|
|
title="Coffee Crafted With Passion"
|
|
description="Experience the perfect blend of tradition and modernity in every cup. Sustainably sourced, expertly roasted, and served with love."
|
|
testimonials={[
|
|
{ name: "Sarah Miller", handle: "@sarahcoffee", testimonial: "The best coffee I've had in years. The atmosphere is just perfect.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/hot-cup-coffee-with-cream-pistachios_140725-7357.jpg", imageAlt: "cozy cafe interior warm lighting" },
|
|
{ name: "James Chen", handle: "@jc_design", testimonial: "A hidden gem. My daily go-to for remote work and amazing latte art.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/tasty-tiramisu-ingredients-arrangement_23-2149549739.jpg", imageAlt: "cozy cafe interior warm lighting" },
|
|
{ name: "Emily P.", handle: "@emilypa", testimonial: "Finally, a place that takes their beans as seriously as their community.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/coffee-beans-background_23-2148093890.jpg", imageAlt: "cozy cafe interior warm lighting" },
|
|
{ name: "Marcus V.", handle: "@mv_vibes", testimonial: "The staff are incredibly welcoming, and the vibe is unmatched.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/empty-wood-chair-restaurant_1339-5949.jpg", imageAlt: "cozy cafe interior warm lighting" },
|
|
{ name: "Elena D.", handle: "@elena_daily", testimonial: "Sourcing matters, and you can truly taste the quality here.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/high-angle-chocolate-cake-with-blueberry-tarts-coffee_23-2148689765.jpg", imageAlt: "cozy cafe interior warm lighting" },
|
|
]}
|
|
buttons={[{ text: "View Menu", href: "#menu" }, { text: "Visit Us", href: "#contact" }]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/hot-cup-coffee-with-cream-pistachios_140725-7357.jpg"
|
|
avatars={[
|
|
{ src: "http://img.b2bpic.net/free-photo/open-book-breakfast-time_23-2148171388.jpg", alt: "Customer portrait 1" },
|
|
{ src: "http://img.b2bpic.net/free-photo/office-desktop-with-coffee-cup_23-2148166671.jpg", alt: "Customer portrait 2" },
|
|
{ src: "http://img.b2bpic.net/free-photo/cups-lamp-near-twig_23-2147811206.jpg", alt: "Customer portrait 3" },
|
|
{ src: "http://img.b2bpic.net/free-photo/top-view-cup-tea-with-branch_23-2148193447.jpg", alt: "Customer portrait 4" },
|
|
{ src: "http://img.b2bpic.net/free-photo/glad-young-woman-with-paper-cup-room_23-2148180656.jpg", alt: "Customer portrait 5" },
|
|
]}
|
|
marqueeItems={[
|
|
{ type: "text", text: "Ethically Sourced" },
|
|
{ type: "text", text: "Artisanal Roasts" },
|
|
{ type: "text", text: "Sustainable Farming" },
|
|
{ type: "text", text: "Premium Quality" },
|
|
{ type: "text", text: "Expertly Brewed" },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<InlineImageSplitTextAbout
|
|
useInvertedBackground={false}
|
|
heading={[
|
|
{ type: "text", content: "Our Philosophy" },
|
|
{ type: "image", src: "http://img.b2bpic.net/free-photo/tasty-tiramisu-ingredients-arrangement_23-2149549739.jpg" },
|
|
{ type: "text", content: "is Simple." },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardMedia
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
features={[
|
|
{ id: "f1", title: "Sustainably Sourced", description: "Ethically traded beans from small family farms.", tag: "Top Pick", imageSrc: "http://img.b2bpic.net/free-photo/coffee-beans-background_23-2148093890.jpg" },
|
|
{ id: "f2", title: "Artisanal Roasting", description: "Small batches roasted to perfection daily.", tag: "Process", imageSrc: "http://img.b2bpic.net/free-photo/empty-wood-chair-restaurant_1339-5949.jpg" },
|
|
{ id: "f3", title: "Fresh Pastries", description: "Hand-crafted treats delivered every morning.", tag: "Menu", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-chocolate-cake-with-blueberry-tarts-coffee_23-2148689765.jpg" },
|
|
]}
|
|
title="Why Choose Brew & Bean?"
|
|
description="From farm to cup, we prioritize quality and connection at every step."
|
|
/>
|
|
</div>
|
|
|
|
<div id="menu" data-section="menu">
|
|
<ProductCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{ id: "p1", brand: "Coffee", name: "Signature Arabica", price: "$4.50", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/cup-coffee-piece-burlap_114579-20057.jpg" },
|
|
{ id: "p2", brand: "Beverage", name: "House Cold Brew", price: "$5.00", rating: 4, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/glass-with-delicious-bubble-tea-glass_23-2149870654.jpg" },
|
|
{ id: "p3", brand: "Retail", name: "Roast Beans Bag", price: "$18.00", rating: 5, reviewCount: "210", imageSrc: "http://img.b2bpic.net/free-photo/coffee-beans-background_23-2148116660.jpg" },
|
|
{ id: "p4", brand: "Bakery", name: "Almond Croissant", price: "$3.75", rating: 5, reviewCount: "95", imageSrc: "http://img.b2bpic.net/free-photo/front-view-yummy-fruity-cakes-with-cookies-cup-tea-dark-space_140725-95442.jpg" },
|
|
{ id: "p5", brand: "Bakery", name: "Lemon Poppy Cake", price: "$4.25", rating: 5, reviewCount: "65", imageSrc: "http://img.b2bpic.net/free-photo/top-view-delicious-cream-cake-with-sliced-fruits-pie-sweet-tea_140725-100231.jpg" },
|
|
{ id: "p6", brand: "Bakery", name: "Blueberry Muffin", price: "$3.50", rating: 4, reviewCount: "70", imageSrc: "http://img.b2bpic.net/free-photo/top-view-chocolate-eclairs-oval-plate-cup-o-tea-strawberries-saucer-tarts-cinnamon-dried-lemons-dark-wooden-ground_140725-90831.jpg" },
|
|
]}
|
|
title="Our Signature Menu"
|
|
description="Discover a selection of premium coffees and house-made treats."
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardFourteen
|
|
useInvertedBackground={true}
|
|
title="Our Impact"
|
|
tag="Trusted By Thousands"
|
|
metrics={[
|
|
{ id: "m1", value: "15k+", description: "Cups served monthly" },
|
|
{ id: "m2", value: "20+", description: "Local farm partners" },
|
|
{ id: "m3", value: "5", description: "Years of excellence" },
|
|
]}
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardFive
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{ id: "t1", name: "Alice D.", date: "Oct 2024", title: "Coffee Lover", quote: "The perfect start to my mornings.", tag: "Regular", avatarSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-is-using-app-her-smartphone-device-send-text-message-near-business-buildings_158595-6785.jpg", imageSrc: "http://img.b2bpic.net/free-photo/hot-cup-coffee-with-cream-pistachios_140725-7357.jpg", imageAlt: "happy customer drinking coffee" },
|
|
{ id: "t2", name: "Mark V.", date: "Sept 2024", title: "Remote Worker", quote: "Great internet and even better coffee.", tag: "Daily", avatarSrc: "http://img.b2bpic.net/free-photo/beauty-smiling-curly-woman-hat-talking-by-smartphone-with-coffee-hand_171337-12009.jpg", imageSrc: "http://img.b2bpic.net/free-photo/tasty-tiramisu-ingredients-arrangement_23-2149549739.jpg", imageAlt: "happy customer drinking coffee" },
|
|
{ id: "t3", name: "Elena R.", date: "Aug 2024", title: "Design Enthusiast", quote: "Stunning aesthetics, lovely vibes.", tag: "Fan", avatarSrc: "http://img.b2bpic.net/free-photo/people-working-elegant-cozy-office-space_23-2149548679.jpg", imageSrc: "http://img.b2bpic.net/free-photo/coffee-beans-background_23-2148093890.jpg", imageAlt: "happy customer drinking coffee" },
|
|
{ id: "t4", name: "Paul S.", date: "July 2024", title: "Regular", quote: "Consistent quality every single time.", tag: "Loyal", avatarSrc: "http://img.b2bpic.net/free-photo/young-woman-drinking-coffee-urban-cafe_158595-686.jpg", imageSrc: "http://img.b2bpic.net/free-photo/empty-wood-chair-restaurant_1339-5949.jpg", imageAlt: "happy customer drinking coffee" },
|
|
{ id: "t5", name: "Chloe L.", date: "June 2024", title: "Blogger", quote: "A must-visit for cafe lovers.", tag: "Influencer", avatarSrc: "http://img.b2bpic.net/free-photo/front-view-beautiful-smiling-girls_23-2148656013.jpg", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-chocolate-cake-with-blueberry-tarts-coffee_23-2148689765.jpg", imageAlt: "happy customer drinking coffee" },
|
|
]}
|
|
title="Kind Words"
|
|
description="What our wonderful community says about us."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitMedia
|
|
textboxLayout="split"
|
|
useInvertedBackground={true}
|
|
faqs={[
|
|
{ id: "q1", title: "Do you offer Wi-Fi?", content: "Yes, we provide high-speed Wi-Fi for all our guests." },
|
|
{ id: "q2", title: "Are you pet-friendly?", content: "Absolutely! We love welcoming furry friends on our outdoor patio." },
|
|
{ id: "q3", title: "Do you have vegan options?", content: "We offer a variety of plant-based milks and vegan pastries." },
|
|
]}
|
|
mediaAnimation="slide-up"
|
|
title="Common Questions"
|
|
description="Everything you need to know before you arrive."
|
|
faqsAnimation="slide-up"
|
|
imageSrc="http://img.b2bpic.net/free-photo/smiling-barista-brewing-coffee_23-2147775918.jpg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
useInvertedBackground={false}
|
|
title="Get in Touch"
|
|
description="Have questions or want to inquire about events?"
|
|
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?", required: true }}
|
|
imageSrc="http://img.b2bpic.net/free-photo/smiling-bartender-with-hot-beverage_23-2147795634.jpg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="Brew & Bean"
|
|
copyrightText="© 2025 Brew & Bean Inc."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|