391 lines
13 KiB
TypeScript
391 lines
13 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
|
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
|
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
|
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
|
import { CakeSlice, Coffee, Croissant } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="soft"
|
|
contentWidth="small"
|
|
sizing="largeSmallSizeMediumTitles"
|
|
background="blurBottom"
|
|
cardStyle="gradient-mesh"
|
|
primaryButtonStyle="shadow"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="bold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{
|
|
name: "Home",
|
|
id: "#home",
|
|
},
|
|
{
|
|
name: "About",
|
|
id: "#about",
|
|
},
|
|
{
|
|
name: "Menu",
|
|
id: "#menu",
|
|
},
|
|
{
|
|
name: "Shop",
|
|
id: "#shop",
|
|
},
|
|
{
|
|
name: "Testimonials",
|
|
id: "#testimonials",
|
|
},
|
|
{
|
|
name: "FAQ",
|
|
id: "#faq",
|
|
},
|
|
{
|
|
name: "Contact",
|
|
id: "#contact",
|
|
},
|
|
]}
|
|
brandName="The Daily Grind"
|
|
bottomLeftText="Freshly Brewed"
|
|
bottomRightText="info@thedailygrind.com"
|
|
/>
|
|
</div>
|
|
|
|
<div id="home" data-section="home">
|
|
<HeroLogoBillboard
|
|
background={{
|
|
variant: "radial-gradient",
|
|
}}
|
|
logoText="The Daily Grind"
|
|
description="Your daily dose of handcrafted coffee and delicious treats, brewed with passion."
|
|
buttons={[
|
|
{
|
|
text: "View Menu",
|
|
href: "#menu",
|
|
},
|
|
{
|
|
text: "Order Online",
|
|
href: "#contact",
|
|
},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/close-up-young-adult-enjoying-warm-drink_23-2149134379.jpg?_wi=1"
|
|
imageAlt="A cup of coffee with latte art"
|
|
mediaAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TestimonialAboutCard
|
|
useInvertedBackground={true}
|
|
tag="Our Story"
|
|
title="Crafting Joy in Every Cup"
|
|
description="More than just a coffee shop, The Daily Grind is a community hub where quality coffee meets warm hospitality. We source premium beans and brew each cup with precision and care, creating an unforgettable experience."
|
|
subdescription="From our cozy ambiance to our friendly baristas, every detail is designed to make you feel at home. Join us for your daily ritual or a relaxing break."
|
|
icon={Coffee}
|
|
imageSrc="http://img.b2bpic.net/free-photo/barista-pouring-milk-into-coffee-coffee-shop_1303-19413.jpg?_wi=1"
|
|
imageAlt="Barista pouring latte art"
|
|
mediaAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="menu" data-section="menu">
|
|
<FeatureCardTen
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "Espresso Delights",
|
|
description: "Classic and custom espresso-based drinks, perfectly crafted.",
|
|
media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/assorted-coffee-cups-textured-background_53876-176761.jpg",
|
|
imageAlt: "Collection of espresso drinks",
|
|
},
|
|
items: [
|
|
{
|
|
icon: Coffee,
|
|
text: "Latte",
|
|
},
|
|
{
|
|
icon: Coffee,
|
|
text: "Cappuccino",
|
|
},
|
|
{
|
|
icon: Coffee,
|
|
text: "Americano",
|
|
},
|
|
],
|
|
reverse: false,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-young-adult-enjoying-warm-drink_23-2149134379.jpg?_wi=2",
|
|
imageAlt: "espresso drinks dark background",
|
|
},
|
|
{
|
|
title: "Specialty Brews",
|
|
description: "Unique coffee experiences, from refreshing cold brews to pour-overs.",
|
|
media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/anime-coffee-shop-illustration_23-2151764632.jpg",
|
|
imageAlt: "Specialty coffee drinks",
|
|
},
|
|
items: [
|
|
{
|
|
icon: Coffee,
|
|
text: "Cold Brew",
|
|
},
|
|
{
|
|
icon: Coffee,
|
|
text: "Pour Over",
|
|
},
|
|
{
|
|
icon: Coffee,
|
|
text: "Iced Mocha",
|
|
},
|
|
],
|
|
reverse: true,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/barista-pouring-milk-into-coffee-coffee-shop_1303-19413.jpg?_wi=2",
|
|
imageAlt: "espresso drinks dark background",
|
|
},
|
|
{
|
|
title: "Fresh Pastries",
|
|
description: "Baked fresh daily, perfect companions to your coffee.",
|
|
media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-delicious-desserts-coffee_23-2149304447.jpg",
|
|
imageAlt: "Assortment of fresh pastries",
|
|
},
|
|
items: [
|
|
{
|
|
icon: Croissant,
|
|
text: "Croissant",
|
|
},
|
|
{
|
|
icon: Muffin,
|
|
text: "Blueberry Muffin",
|
|
},
|
|
{
|
|
icon: CakeSlice,
|
|
text: "Scone",
|
|
},
|
|
],
|
|
reverse: false,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/coffee-bags-indoors-branding-concept_23-2151881019.jpg?_wi=1",
|
|
imageAlt: "espresso drinks dark background",
|
|
},
|
|
]}
|
|
title="Our Signature Menu"
|
|
description="Explore our diverse range of handcrafted beverages and freshly baked goods."
|
|
tag="Taste the Difference"
|
|
/>
|
|
</div>
|
|
|
|
<div id="shop" data-section="shop">
|
|
<ProductCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
useInvertedBackground={true}
|
|
products={[
|
|
{
|
|
id: "product-1",
|
|
name: "Ethiopian Yirgacheffe Beans",
|
|
price: "$18.00",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/spice-seed-seasoning-dark-caffeine_1172-456.jpg",
|
|
imageAlt: "Bag of Ethiopian Yirgacheffe coffee beans",
|
|
},
|
|
{
|
|
id: "product-2",
|
|
name: "Dark Roast Espresso Blend",
|
|
price: "$16.00",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/coffee-bags-indoors-branding-concept_23-2151881019.jpg?_wi=2",
|
|
imageAlt: "Bag of dark roast espresso blend coffee beans",
|
|
},
|
|
{
|
|
id: "product-3",
|
|
name: "The Daily Grind Mug",
|
|
price: "$12.00",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/mockup-coffee-beans-form-word-coffee-cup-espresso-top-view_169016-53886.jpg",
|
|
imageAlt: "Ceramic coffee mug with The Daily Grind logo",
|
|
},
|
|
{
|
|
id: "product-4",
|
|
name: "French Press Coffee Maker",
|
|
price: "$25.00",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-holding-kettle_23-2148551570.jpg",
|
|
imageAlt: "Glass French press coffee maker",
|
|
},
|
|
{
|
|
id: "product-5",
|
|
name: "Decaf Colombian Supremo",
|
|
price: "$17.00",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/woman-hands-getly-seal-blank-bulk-packages_346278-556.jpg",
|
|
imageAlt: "Bag of decaffeinated Colombian Supremo coffee beans",
|
|
},
|
|
{
|
|
id: "product-6",
|
|
name: "Insulated Travel Tumbler",
|
|
price: "$20.00",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-couple-holding-drinking-cups_23-2148223472.jpg",
|
|
imageAlt: "Insulated travel coffee tumbler",
|
|
},
|
|
]}
|
|
title="Take The Grind Home"
|
|
description="Browse our selection of premium coffee beans, brewing essentials, and merchandise."
|
|
tag="Shop Our Selection"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardFifteen
|
|
useInvertedBackground={false}
|
|
testimonial="The Daily Grind has truly changed my morning routine. Their coffee is simply the best in town, and the staff always greets me with a smile. It's more than just a coffee shop; it's a community."
|
|
rating={5}
|
|
author="Emily R."
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/beautiful-african-american-female-with-broad-pleasant-smile-rests-sidewalk-cafe-alone-enjoys-good-rest-summer-vacation_273609-3491.jpg",
|
|
alt: "Emily R.",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/sip-coffee-house_329181-14555.jpg",
|
|
alt: "John D.",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/thoughtful-beautiful-brunette-female-wearing-elegant-black-dress-wrist-watch-touching-neck-while-enjoying-nice-time-alone-coffee-break-sitting-cafe-table-with-mug-dessert-it_273609-81.jpg",
|
|
alt: "Sarah P.",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/stylish-businesswoman-with-laptop-sitting-cafe-working-computer-managing-business-drin_1258-126127.jpg",
|
|
alt: "Michael B.",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/portrait-beautiful-asian-woman-with-smartphone-relaxing-cafe-sitting-enjoying-coffee-while-using-mobile-phone_1258-122952.jpg",
|
|
alt: "Maria S.",
|
|
},
|
|
]}
|
|
ratingAnimation="blur-reveal"
|
|
avatarsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitText
|
|
useInvertedBackground={true}
|
|
faqs={[
|
|
{
|
|
id: "faq-1",
|
|
title: "Do you offer dairy-free milk options?",
|
|
content: "Yes, we offer a variety of dairy-free milk alternatives including almond, oat, and soy milk for all our espresso-based beverages.",
|
|
},
|
|
{
|
|
id: "faq-2",
|
|
title: "Can I order online for pickup?",
|
|
content: "Absolutely! You can place your order through our website or mobile app for quick and convenient pickup at our counter.",
|
|
},
|
|
{
|
|
id: "faq-3",
|
|
title: "Do you have Wi-Fi available?",
|
|
content: "Yes, complimentary high-speed Wi-Fi is available for all our customers. Feel free to work or relax while enjoying your coffee.",
|
|
},
|
|
]}
|
|
sideTitle="Frequently Asked Questions"
|
|
sideDescription="Find answers to common questions about our coffee, services, and policies."
|
|
faqsAnimation="slide-up"
|
|
textPosition="left"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "plain",
|
|
}}
|
|
tag="Visit Us"
|
|
title="Connect with The Daily Grind"
|
|
description="We'd love to hear from you! Stop by our shop, give us a call, or send us a message through the form below."
|
|
imageSrc="http://img.b2bpic.net/free-photo/cafe-sibiu-romania_1268-20583.jpg"
|
|
imageAlt="Coffee shop exterior with map overlay"
|
|
mediaAnimation="slide-up"
|
|
inputPlaceholder="Your message"
|
|
buttonText="Send Message"
|
|
termsText="By sending a message, you agree to our Privacy Policy."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBase
|
|
columns={[
|
|
{
|
|
title: "Explore",
|
|
items: [
|
|
{
|
|
label: "Home",
|
|
href: "#home",
|
|
},
|
|
{
|
|
label: "Menu",
|
|
href: "#menu",
|
|
},
|
|
{
|
|
label: "About Us",
|
|
href: "#about",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Connect",
|
|
items: [
|
|
{
|
|
label: "Contact",
|
|
href: "#contact",
|
|
},
|
|
{
|
|
label: "Instagram",
|
|
href: "https://instagram.com",
|
|
},
|
|
{
|
|
label: "Facebook",
|
|
href: "https://facebook.com",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Shop",
|
|
items: [
|
|
{
|
|
label: "Coffee Beans",
|
|
href: "#shop",
|
|
},
|
|
{
|
|
label: "Merchandise",
|
|
href: "#shop",
|
|
},
|
|
{
|
|
label: "Gift Cards",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
logoText="The Daily Grind"
|
|
copyrightText="© 2024 The Daily Grind. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|