Files
5ed4a331-32c2-4672-bf06-7c4…/src/app/page.tsx
2025-12-26 14:21:42 +00:00

196 lines
7.3 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
import MediaSplitAbout from '@/components/sections/about/MediaSplitAbout';
import ProductCardSeven from '@/components/sections/product/ProductCardSeven';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import ContactText from '@/components/sections/contact/ContactText';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { Heart } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="mediumSmall"
sizing="mediumLargeSizeLargeTitles"
background="radialGradient"
cardStyle="solid"
primaryButtonStyle="flat"
secondaryButtonStyle="layered"
headingFontWeight="medium"
>
<div id="nav" data-section="nav">
<NavbarStyleCentered
brandName="CoffeeFlow"
navItems={[
{ name: "Home", id: "home" },
{ name: "About", id: "about" },
{ name: "Menu", id: "menu" },
{ name: "Contact", id: "contact" },
{ name: "Locations", id: "locations" }
]}
button={{ text: "Order Now", href: "menu" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroCarouselLogo
logoText="CoffeeFlow"
description="Your perfect brew awaits. Handcrafted espresso, creamy lattes, and seasonal specials made fresh daily."
buttons={[
{ text: "Browse Menu", href: "menu" },
{ text: "Reserve a Table", href: "contact" }
]}
slides={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766758395555-7mv6t2q9.jpg",
imageAlt: "Premium specialty latte with latte art"
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766758396928-lp7hxsr0.jpg",
imageAlt: "Fresh espresso shot being poured"
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766758398063-ipre35cv.jpg",
imageAlt: "Cozy coffee shop interior atmosphere"
}
]}
autoplayDelay={4000}
showDimOverlay={true}
/>
</div>
<div id="about" data-section="about">
<MediaSplitAbout
title="Crafted With Passion Since 2010"
description="CoffeeFlow represents our commitment to excellence in every cup. We source premium beans directly from ethical suppliers and roast them fresh to perfection. Our baristas are passionate about creating the perfect coffee experience for you."
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766758399249-5ptbosia.jpg"
imageAlt="Coffee beans and roasting process"
imagePosition="right"
buttons={[{ text: "Our Story", href: "#" }]}
useInvertedBackground="noInvert"
/>
</div>
<div id="menu" data-section="menu">
<ProductCardSeven
title="Signature Menu"
description="Expertly crafted beverages featuring our finest blends and seasonal creations"
textboxLayout="default"
useInvertedBackground="noInvert"
animationType="slide-up"
gridVariant="three-columns-all-equal-width"
products={[
{
id: "1",
name: "Classic Espresso",
price: "$3.50",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766757626429-ve9tnr36.jpg",
imageAlt: "Classic espresso shot"
},
{
id: "2",
name: "Signature Latte",
price: "$5.00",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766758400797-4e6y3l0g.jpg",
imageAlt: "Latte with latte art"
},
{
id: "3",
name: "Cold Brew Iced",
price: "$4.50",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766758402088-wj4zl5un.jpg",
imageAlt: "Refreshing iced cold brew"
}
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwelve
cardTitle="Beloved by Coffee Enthusiasts Everywhere"
cardTag="Customer Favorites"
cardTagIcon={Heart}
testimonials={[
{
id: "1",
name: "Sarah Mitchell",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766758403855-43mgv6tq.jpg",
imageAlt: "Sarah Mitchell"
},
{
id: "2",
name: "James Rodriguez",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766758404950-o6m20jnh.jpg",
imageAlt: "James Rodriguez"
},
{
id: "3",
name: "Emma Chen",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766758405904-aktvo27y.jpg",
imageAlt: "Emma Chen"
},
{
id: "4",
name: "Michael Thompson",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766758407286-habq6wfk.jpg",
imageAlt: "Michael Thompson"
}
]}
useInvertedBackground="noInvert"
/>
</div>
<div id="contact" data-section="contact">
<ContactText
text="Stop by our cafe to experience the perfect cup or connect with us online. We're here to serve you amazing coffee every day."
animationType="entrance-slide"
buttons={[
{ text: "Contact Us", href: "#" },
{ text: "Find a Location", href: "#" }
]}
useInvertedBackground="noInvert"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
columns={[
{
title: "Menu",
items: [
{ label: "Coffee Drinks", href: "#" },
{ label: "Pastries", href: "#" },
{ label: "Breakfast", href: "#" }
]
},
{
title: "Company",
items: [
{ label: "About Us", href: "about" },
{ label: "Locations", href: "#" },
{ label: "Careers", href: "#" }
]
},
{
title: "Connect",
items: [
{ label: "Contact", href: "contact" },
{ label: "Instagram", href: "#" },
{ label: "Facebook", href: "#" }
]
}
]}
logoText="CoffeeFlow"
copyrightText="© 2025 CoffeeFlow. All rights reserved."
/>
</div>
</ThemeProvider>
);
}