Files
3ba0f386-6e5b-43f7-a6e7-175…/src/app/page.tsx
Nikolay Pecheniev cc884d57dd Initial commit
2025-12-24 14:11:38 +02:00

278 lines
11 KiB
TypeScript

"use client"
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Coffee, Heart, Sparkles, Award, Star, HelpCircle, Mail } from "lucide-react";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import AboutPhoneTimeline from '@/components/sections/about/AboutPhoneTimeline';
import ProductCardFive from '@/components/sections/product/ProductCardFive';
import MetricCardFive from '@/components/sections/metrics/MetricCardFive';
import TestimonialCardNine from '@/components/sections/testimonial/TestimonialCardNine';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="text-shift"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="medium"
sizing="large"
background="noiseDiagonalGradient"
cardStyle="elevated-accent"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="outline"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
brandName="Happy Drink"
navItems={[
{ name: "Home", id: "hero" },
{ name: "About", id: "about" },
{ name: "Menu", id: "product" },
{ name: "Contact", id: "contact" }
]}
button={{
text: "Order Now",
href: "#product"
}}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboard
title="Welcome to Happy Drink"
description="Your favorite local coffeeshop serving premium coffee and delicious beverages since 2015. Start your day with our signature blends."
tag="Freshly Brewed"
tagIcon={Coffee}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766573455855-cm2t3mby.jpg"
imageAlt="Happy Drink signature coffee cup"
frameStyle="card"
buttons={[
{ text: "Explore Menu", href: "#product" },
{ text: "Find Us", href: "#contact" }
]}
/>
</div>
<div id="about" data-section="about">
<AboutPhoneTimeline
tag="Our Story"
title="Crafting Coffee Experiences Since 2015"
description="Happy Drink started as a passion project to bring specialty coffee to our community. We source only the finest beans, roast them fresh, and serve them with care. Our cozy space is designed for connection, creativity, and great conversations."
tagIcon={Heart}
textboxLayout="default"
phoneOne={{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766414398769-qosxsyx5.jpg"
}}
phoneTwo={{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766414398769-qosxsyx5.jpg"
}}
useInvertedBackground="noInvert"
buttons={[
{ text: "Learn More", href: "#contact" }
]}
/>
</div>
<div id="product" data-section="product">
<ProductCardFive
title="Our Menu"
description="Discover our carefully curated selection of premium coffee beverages and drinks."
tag="Featured"
tagIcon={Sparkles}
products={[
{
id: "espresso",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766578236066-x2lfljr9.jpg",
imageAlt: "Espresso shot",
button: { text: "Order" },
isFavorited: false
},
{
id: "cappuccino",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766578237183-y8j8u6bf.jpg",
imageAlt: "Cappuccino with latte art",
button: { text: "Order" },
isFavorited: false
},
{
id: "iced-coffee",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766578238311-p756xkem.jpg",
imageAlt: "Iced cold brew",
button: { text: "Order" },
isFavorited: false
}
]}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground="noInvert"
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardFive
title="Why Choose Happy Drink"
description=""
tag="Our Impact"
tagIcon={Award}
metrics={[
{
id: "1",
value: "10K+",
description: "Happy customers enjoying our coffee every month"
},
{
id: "2",
value: "50+",
description: "Specialty drinks crafted by our expert baristas"
},
{
id: "3",
value: "9 Years",
description: "Of serving the finest coffee to our community"
}
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground="noInvert"
/>
</div>
<div id="testimonial" data-section="testimonial">
<TestimonialCardNine
title="What Our Customers Say"
description="Join thousands of satisfied customers who visit Happy Drink daily."
tag="Reviews"
tagIcon={Star}
textboxLayout="default"
useInvertedBackground="noInvert"
testimonials={[
{
id: "1",
quote: "The best coffee in town! The baristas are friendly and remember your order. Happy Drink is my daily morning ritual.",
name: "Sarah Johnson",
role: "Regular Customer",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766414400514-5et2yg01.jpg"
},
{
id: "2",
quote: "Fantastic atmosphere and quality drinks. I bring my laptop here to work and always leave feeling inspired.",
name: "Michael Chen",
role: "Freelancer",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766508650951-kaj1cbih.jpg"
},
{
id: "3",
quote: "The owners really care about their craft. You can taste the quality in every cup. Worth every penny!",
name: "Emily Rodriguez",
role: "Coffee Enthusiast",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766578240153-v8phsdtg.jpg"
},
{
id: "4",
quote: "Best place to catch up with friends. Great ambiance, excellent service, and delicious drinks. Highly recommended!",
name: "David Thompson",
role: "Community Member",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766565662495-bt8vf9hb.jpg"
}
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
title="Frequently Asked Questions"
description="Find answers to common questions about Happy Drink."
tag="Help"
tagIcon={HelpCircle}
textboxLayout="default"
useInvertedBackground="noInvert"
faqs={[
{
id: "1",
title: "What are your hours of operation?",
content: "We're open Monday to Friday 6:30 AM - 7:00 PM, Saturday 7:00 AM - 8:00 PM, and Sunday 7:00 AM - 6:00 PM. We're closed on major holidays."
},
{
id: "2",
title: "Do you offer loyalty rewards?",
content: "Yes! Join our Happy Drink Rewards program and earn points with every purchase. Collect 10 points to get a free drink of your choice."
},
{
id: "3",
title: "Are your drinks customizable?",
content: "Absolutely! We can customize any drink to your preferences including milk alternatives, extra shots, sweetness level, and more."
},
{
id: "4",
title: "Do you serve food items?",
content: "We offer a selection of pastries, sandwiches, and snacks to pair with your beverage. Check our menu for daily specials."
},
{
id: "5",
title: "Can I book your space for events?",
content: "Yes! We offer private event bookings for small groups. Please contact us at info@happydrink.com for more details."
},
{
id: "6",
title: "Do you have WiFi available?",
content: "Free high-speed WiFi is available to all customers. Password is displayed at the counter."
}
]}
animationType="smooth"
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
tag="Get In Touch"
title="Join Our Coffee Community"
description="Subscribe to our newsletter for exclusive deals, new menu items, and coffee tips delivered to your inbox."
tagIcon={Mail}
useInvertedBackground="noInvert"
inputPlaceholder="Enter your email"
buttonText="Subscribe"
termsText="We respect your privacy. You can unsubscribe anytime."
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
copyrightText="© 2025 Happy Drink. All rights reserved."
columns={[
{
title: "Location",
items: [
{ label: "123 Coffee Street, Downtown", href: "#" },
{ label: "(555) 123-4567", href: "#" },
{ label: "info@happydrink.com", href: "#" }
]
},
{
title: "Hours",
items: [
{ label: "Mon-Fri: 6:30 AM - 7:00 PM", href: "#" },
{ label: "Sat: 7:00 AM - 8:00 PM", href: "#" },
{ label: "Sun: 7:00 AM - 6:00 PM", href: "#" }
]
},
{
title: "Quick Links",
items: [
{ label: "Menu", href: "#product" },
{ label: "About Us", href: "#about" },
{ label: "Contact", href: "#contact" },
{ label: "Rewards Program", href: "#" }
]
}
]}
/>
</div>
</ThemeProvider>
);
}