311 lines
12 KiB
TypeScript
311 lines
12 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
|
|
import ParallaxAbout from '@/components/sections/about/ParallaxAbout';
|
|
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
|
|
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
|
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
|
import ContactFaq from '@/components/sections/contact/ContactFaq';
|
|
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
|
import { Coffee, Heart, Sparkles, Star, HelpCircle, MapPin } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="directional-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="rounded"
|
|
contentWidth="smallMedium"
|
|
sizing="mediumLarge"
|
|
background="dotGrid"
|
|
cardStyle="inset"
|
|
primaryButtonStyle="layered-depth"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="light"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
brandName="BrewBliss"
|
|
navItems={[
|
|
{ name: "Home", id: "home" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "Menu", id: "menu" },
|
|
{ name: "Testimonials", id: "testimonials" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
button={{
|
|
text: "Order Now",
|
|
href: "contact"
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitKpi
|
|
title="Premium Coffee Experience"
|
|
description="Discover our hand-roasted coffee and artisan pastries in a welcoming atmosphere"
|
|
tag="Welcome to BrewBliss"
|
|
tagIcon={Coffee}
|
|
kpis={[
|
|
{ value: "15+", label: "Years of Excellence" },
|
|
{ value: "5000+", label: "Happy Customers" },
|
|
{ value: "20+", label: "Coffee Varieties" }
|
|
]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766669033364-oshgsamg.jpg"
|
|
imageAlt="Premium coffee and espresso"
|
|
imagePosition="right"
|
|
buttons={[
|
|
{ text: "View Menu", href: "menu" },
|
|
{ text: "Visit Us", href: "contact" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<ParallaxAbout
|
|
title="Our Coffee Story"
|
|
description="Founded in 2009, BrewBliss has been dedicated to sourcing the finest coffee beans from around the world and brewing them to perfection. Every cup tells a story of passion, craftsmanship, and community."
|
|
tag="About Us"
|
|
tagIcon={Heart}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766757624210-dktsrkpg.jpg"
|
|
imageAlt="Coffee shop interior with warm ambiance"
|
|
buttons={[
|
|
{ text: "Learn More", href: "#" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="menu" data-section="menu">
|
|
<FeatureCardThree
|
|
title="Our Signature Menu"
|
|
description="Each drink is crafted with precision and love"
|
|
tag="Menu"
|
|
tagIcon={Sparkles}
|
|
features={[
|
|
{
|
|
id: "01",
|
|
title: "Espresso",
|
|
description: "Bold, rich, and intensely flavored. Single or double shot of our signature blend.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766757627443-w0fb2b6v.jpg",
|
|
imageAlt: "Espresso shot"
|
|
},
|
|
{
|
|
id: "02",
|
|
title: "Cappuccino",
|
|
description: "Perfectly balanced espresso with steamed milk and velvety foam.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766757626429-ve9tnr36.jpg",
|
|
imageAlt: "Cappuccino with latte art"
|
|
},
|
|
{
|
|
id: "03",
|
|
title: "Mocha",
|
|
description: "Rich espresso combined with smooth chocolate and creamy milk.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766757628796-fiyrx5jc.jpg",
|
|
imageAlt: "Mocha with chocolate drizzle"
|
|
},
|
|
{
|
|
id: "04",
|
|
title: "Cold Brew",
|
|
description: "Smooth, refreshing cold-steeped coffee over ice. Perfect for warm days.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766757630003-0zm4d7rm.jpg",
|
|
imageAlt: "Cold brew iced coffee"
|
|
}
|
|
]}
|
|
textboxLayout="default"
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardThirteen
|
|
title="What Our Customers Say"
|
|
description="Join thousands of satisfied coffee lovers who visit us daily"
|
|
tag="Testimonials"
|
|
tagIcon={Star}
|
|
showRating={true}
|
|
testimonials={[
|
|
{
|
|
id: "1",
|
|
name: "Emma Wilson",
|
|
handle: "@emmaw",
|
|
testimonial: "The best coffee shop in town! Every visit feels special with their friendly staff and amazing drinks.",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766757633840-bzsqf3fp.jpg",
|
|
imageAlt: "Emma Wilson"
|
|
},
|
|
{
|
|
id: "2",
|
|
name: "James Chen",
|
|
handle: "@jchen",
|
|
testimonial: "Their espresso is perfection. I've tried many places, but BrewBliss stands out for quality and consistency.",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766757634920-5uwhcylh.jpg",
|
|
imageAlt: "James Chen"
|
|
},
|
|
{
|
|
id: "3",
|
|
name: "Sophie Martinez",
|
|
handle: "@sophiem",
|
|
testimonial: "Cozy atmosphere, excellent pastries, and coffee that tastes like it was made just for me. Highly recommend!",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766757636331-6khl59ne.jpg",
|
|
imageAlt: "Sophie Martinez"
|
|
},
|
|
{
|
|
id: "4",
|
|
name: "Michael Brown",
|
|
handle: "@mbrown",
|
|
testimonial: "I come here every morning. It's become my favorite spot to start the day. Great place to work too!",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766757638102-2q33zp91.jpg",
|
|
imageAlt: "Michael Brown"
|
|
},
|
|
{
|
|
id: "5",
|
|
name: "Lisa Anderson",
|
|
handle: "@lisaand",
|
|
testimonial: "The staff really cares about getting your order right. They remember regulars and always have a warm smile.",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766757639186-rikejdrf.jpg",
|
|
imageAlt: "Lisa Anderson"
|
|
},
|
|
{
|
|
id: "6",
|
|
name: "David Park",
|
|
handle: "@dpark",
|
|
testimonial: "Premium coffee at fair prices. You can taste the quality in every sip. This is my go-to place!",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766757640295-2ylvl3h4.jpg",
|
|
imageAlt: "David Park"
|
|
}
|
|
]}
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqDouble
|
|
title="Frequently Asked Questions"
|
|
description="Find answers to common questions about BrewBliss"
|
|
tag="Help"
|
|
tagIcon={HelpCircle}
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
animationType="smooth"
|
|
faqs={[
|
|
{
|
|
id: "1",
|
|
title: "What are your opening hours?",
|
|
content: "We are open Monday through Friday from 6:00 AM to 8:00 PM, Saturday from 7:00 AM to 9:00 PM, and Sunday from 8:00 AM to 7:00 PM. We're closed on major holidays."
|
|
},
|
|
{
|
|
id: "2",
|
|
title: "Do you offer WiFi?",
|
|
content: "Yes! We provide free high-speed WiFi for all our customers. Just ask at the counter for the password."
|
|
},
|
|
{
|
|
id: "3",
|
|
title: "Can I order online for pickup?",
|
|
content: "Currently, we accept orders in-person or by phone. We're working on launching an online ordering system soon. Please call us at (555) 123-4567 to place a phone order."
|
|
},
|
|
{
|
|
id: "4",
|
|
title: "Do you have vegan options?",
|
|
content: "Absolutely! We offer almond, oat, soy, and coconut milk alternatives for all our drinks. Many of our pastries are also vegan-friendly."
|
|
},
|
|
{
|
|
id: "5",
|
|
title: "Can I host an event at BrewBliss?",
|
|
content: "We'd love to host your event! For private bookings and catering inquiries, please contact us at events@brewbliss.com or visit us in person to discuss details."
|
|
},
|
|
{
|
|
id: "6",
|
|
title: "What payment methods do you accept?",
|
|
content: "We accept all major credit cards, debit cards, mobile payments (Apple Pay, Google Pay), and cash."
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactFaq
|
|
ctaTitle="Visit Us Today"
|
|
ctaDescription="Stop by BrewBliss for a warm welcome and your favorite coffee"
|
|
ctaButton={{
|
|
text: "Get Directions",
|
|
href: "#"
|
|
}}
|
|
ctaIcon={MapPin}
|
|
useInvertedBackground="noInvert"
|
|
animationType="slide-up"
|
|
accordionAnimationType="smooth"
|
|
faqs={[
|
|
{
|
|
id: "1",
|
|
title: "Where are you located?",
|
|
content: "BrewBliss is located at 123 Main Street, Downtown. We're easy to find with ample street parking and nearby public transit access."
|
|
},
|
|
{
|
|
id: "2",
|
|
title: "What's your contact information?",
|
|
content: "Phone: (555) 123-4567 | Email: hello@brewbliss.com | Hours: Mon-Fri 6AM-8PM, Sat 7AM-9PM, Sun 8AM-7PM"
|
|
},
|
|
{
|
|
id: "3",
|
|
title: "Do you offer catering services?",
|
|
content: "Yes! We provide catering for corporate events, meetings, and private celebrations. Contact our events team at events@brewbliss.com for more details."
|
|
},
|
|
{
|
|
id: "4",
|
|
title: "Can I buy whole bean coffee?",
|
|
content: "We sell our signature blends in whole bean bags at the counter. You can also order online for in-store pickup."
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseCard
|
|
logoText="BrewBliss"
|
|
copyrightText="© 2024 BrewBliss Coffee. All rights reserved."
|
|
columns={[
|
|
{
|
|
title: "Quick Links",
|
|
items: [
|
|
{ label: "Home", href: "#home" },
|
|
{ label: "Menu", href: "#menu" },
|
|
{ label: "About", href: "#about" },
|
|
{ label: "Contact", href: "#contact" }
|
|
]
|
|
},
|
|
{
|
|
title: "Company",
|
|
items: [
|
|
{ label: "About Us", href: "#about" },
|
|
{ label: "Careers", href: "#" },
|
|
{ label: "Press", href: "#" },
|
|
{ label: "Blog", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Legal",
|
|
items: [
|
|
{ label: "Terms of Service", href: "#" },
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Cookie Policy", href: "#" },
|
|
{ label: "Contact", href: "#contact" }
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|