259 lines
12 KiB
TypeScript
259 lines
12 KiB
TypeScript
"use client"
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import HeroLogo from '@/components/sections/hero/HeroLogo';
|
|
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
|
|
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import FaqBase from '@/components/sections/faq/FaqBase';
|
|
import ContactText from '@/components/sections/contact/ContactText';
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import { Coffee, Sparkles, CheckCircle, Star, Award } from 'lucide-react';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-shift"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="mediumLarge"
|
|
sizing="mediumLarge"
|
|
background="floatingGradient"
|
|
cardStyle="soft-shadow"
|
|
primaryButtonStyle="diagonal-gradient"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="bold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
brandName="Artisan Coffee"
|
|
navItems={[
|
|
{ name: "Home", id: "home" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "Menu", id: "menu" },
|
|
{ name: "Events", id: "events" }
|
|
]}
|
|
button={{ text: "Order Online", href: "#contact" }}
|
|
animateOnLoad={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogo
|
|
logoText="Artisan Coffee, Crafted Daily"
|
|
description="Experience the finest specialty coffee in an inviting atmosphere where every cup tells a story of quality, passion, and expertise."
|
|
buttons={[
|
|
{ text: "Explore Our Menu", href: "#menu" },
|
|
{ text: "Visit Us Today", href: "#contact" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
imageSrc="http://img.b2bpic.net/free-photo/young-girl-dressed-elegant-gray-dress-holds-cup-takeaway-coffee-looking-away-while-standing-room-with-loft-interior_613910-6277.jpg"
|
|
imageAlt="Artisan coffee shop espresso station with professional barista equipment"
|
|
showDimOverlay={false}
|
|
ariaLabel="Welcome to Artisan Coffee Shop - Hero Section"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextSplitAbout
|
|
title="Roasted to Perfection"
|
|
description={[
|
|
"Since 2015, we've been dedicated to sourcing the world's finest coffee beans and roasting them to perfection. Our passion for coffee extends from the origin farms to your cup.", "Every bean is carefully selected, freshly roasted in small batches, and brewed with precision. We believe in transparency, sustainability, and building relationships with our coffee farmer partners worldwide."
|
|
]}
|
|
buttons={[
|
|
{ text: "Learn Our Story", href: "#" }
|
|
]}
|
|
useInvertedBackground={true}
|
|
showBorder={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardFour
|
|
title="Our Premium Collections"
|
|
description="Discover our curated selection of single-origin and signature blend coffees, each offering a unique flavor profile."
|
|
tag="Featured Blends"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
products={[
|
|
{
|
|
id: "espresso-blend", name: "Midnight Espresso", price: "$16", variant: "Dark Roast", imageSrc: "http://img.b2bpic.net/free-photo/coffee-bag-mockup_23-2151989760.jpg", imageAlt: "Midnight Espresso single origin coffee bag"
|
|
},
|
|
{
|
|
id: "latte-classic", name: "Silky Latte", price: "$6", variant: "Hot or Iced", imageSrc: "http://img.b2bpic.net/free-photo/cup-cappuccino-with-coffee-beans-cake-table_141793-1295.jpg", imageAlt: "Silky Latte with beautiful latte art"
|
|
},
|
|
{
|
|
id: "cold-brew", name: "Cold Brew Concentrate", price: "$14", variant: "Ready-to-Drink", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-with-tasty-kombucha_23-2150210097.jpg", imageAlt: "Cold brew concentrate bottled and chilled"
|
|
}
|
|
]}
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
buttons={[
|
|
{ text: "View All Products", href: "#" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardSixteen
|
|
title="Why Coffee Lovers Choose Us"
|
|
description="From bean selection to brewing technique, we've mastered every detail to deliver an exceptional coffee experience."
|
|
positiveCard={{
|
|
items: [
|
|
"Single-origin, traceable coffee beans", "In-house small-batch roasting", "Expert baristas with certifications", "Sustainable and ethical sourcing", "Freshly brewed to order"
|
|
]
|
|
}}
|
|
negativeCard={{
|
|
items: [
|
|
"Mass-produced generic blends", "Stale pre-roasted inventory", "Inconsistent beverage quality", "Unknown origin or practices", "Pre-made bulk brewing"
|
|
]
|
|
}}
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
tag="Quality Commitment"
|
|
tagIcon={CheckCircle}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "Our Process", href: "#" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwelve
|
|
testimonials={[
|
|
{
|
|
id: "testimonial-1", name: "Sarah Martinez", imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-holding-disposable-coffee-cup_107420-12333.jpg", imageAlt: "Sarah Martinez customer testimonial"
|
|
},
|
|
{
|
|
id: "testimonial-2", name: "James Chen", imageSrc: "http://img.b2bpic.net/free-photo/bearded-man-white-t-shirt-holding-coffee-cup-happy-positive-standing-green-wall_141793-81975.jpg", imageAlt: "James Chen customer testimonial"
|
|
},
|
|
{
|
|
id: "testimonial-3", name: "Emma Wilson", imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-young-woman-sitting-table-with-takeaway-coffee-cup-wooden-table_23-2148148125.jpg", imageAlt: "Emma Wilson customer testimonial"
|
|
},
|
|
{
|
|
id: "testimonial-4", name: "Michael Johnson", imageSrc: "http://img.b2bpic.net/free-photo/man-having-latte-cafe_23-2147689239.jpg", imageAlt: "Michael Johnson customer testimonial"
|
|
}
|
|
]}
|
|
cardTitle="Loved by Coffee Enthusiasts"
|
|
cardTag="Customer Reviews"
|
|
cardTagIcon={Star}
|
|
cardAnimation="slide-up"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="social-proof" data-section="social-proof">
|
|
<SocialProofOne
|
|
title="Recognized for Excellence"
|
|
description="Our commitment to quality has earned recognition from industry leaders and coffee enthusiasts worldwide."
|
|
tag="Awards & Recognition"
|
|
tagIcon={Award}
|
|
tagAnimation="slide-up"
|
|
names={[
|
|
"Best Specialty Coffee 2024", "Barista Championship Winner", "Sustainable Roaster Certified", "Coffee Excellence Award", "Best Local Coffee Shop", "Green Business Certified", "Roaster of the Year"
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
speed={40}
|
|
showCard={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqBase
|
|
title="Common Questions"
|
|
description="Everything you need to know about our coffee, services, and coffee shop experience."
|
|
tag="FAQ"
|
|
tagAnimation="slide-up"
|
|
faqs={[
|
|
{
|
|
id: "faq-1", title: "What makes your coffee different?", content: "We source single-origin beans from carefully selected farms, roast them fresh in small batches, and brew each cup to order. Our baristas are trained to bring out the unique flavor profile of each coffee."
|
|
},
|
|
{
|
|
id: "faq-2", title: "Do you offer subscription services?", content: "Yes! Our coffee subscription service delivers freshly roasted beans to your door monthly. You can choose from our rotating selection of single-origin and signature blends."
|
|
},
|
|
{
|
|
id: "faq-3", title: "Are you environmentally sustainable?", content: "Absolutely. We're committed to sustainable practices including eco-friendly packaging, direct trade relationships with farmers, and minimal waste operations."
|
|
},
|
|
{
|
|
id: "faq-4", title: "Do you offer barista training?", content: "Yes, we offer professional barista certification courses and workshops for coffee enthusiasts looking to deepen their knowledge and skills."
|
|
},
|
|
{
|
|
id: "faq-5", title: "Can I host private events?", content: "Our space is available for private coffee tastings, corporate events, and special occasions. Contact us for details and pricing."
|
|
},
|
|
{
|
|
id: "faq-6", title: "What's your WiFi password?", content: "We provide free WiFi for all customers. Ask our baristas at the counter for the password when you visit."
|
|
}
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
faqsAnimation="slide-up"
|
|
showCard={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactText
|
|
text="Ready to experience exceptional coffee? Visit us today or reach out to learn more about our offerings, events, and coffee experiences."
|
|
animationType="entrance-slide"
|
|
buttons={[
|
|
{ text: "Visit Our Location", href: "#" },
|
|
{ text: "Send us an Email", href: "mailto:hello@artisancoffee.com" }
|
|
]}
|
|
background={{ variant: "radial-gradient" }}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBase
|
|
logoText="Artisan Coffee"
|
|
copyrightText="© 2025 Artisan Coffee Shop | All Rights Reserved"
|
|
columns={[
|
|
{
|
|
title: "Navigation", items: [
|
|
{ label: "Home", href: "#home" },
|
|
{ label: "About", href: "#about" },
|
|
{ label: "Menu", href: "#menu" },
|
|
{ label: "Events", href: "#events" }
|
|
]
|
|
},
|
|
{
|
|
title: "Contact", items: [
|
|
{ label: "Phone", href: "tel:+1234567890" },
|
|
{ label: "Email", href: "mailto:hello@artisancoffee.com" },
|
|
{ label: "Location", href: "#" },
|
|
{ label: "Hours", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Community", items: [
|
|
{ label: "Blog", href: "#" },
|
|
{ label: "Events", href: "#" },
|
|
{ label: "Careers", href: "#" },
|
|
{ label: "Shop", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Legal", items: [
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms of Service", href: "#" },
|
|
{ label: "Sustainability", href: "#" },
|
|
{ label: "Contact", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |