Files
4db8a8d5-056c-4bcd-ba7e-ee7…/src/app/page.tsx
2026-02-25 22:55:18 +00:00

190 lines
10 KiB
TypeScript

"use client"
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactText from '@/components/sections/contact/ContactText';
import FooterCard from '@/components/sections/footer/FooterCard';
import { Coffee, Sparkles, Star, HelpCircle, Instagram, Facebook, Twitter } from 'lucide-react';
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="shift-hover"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
contentWidth="smallMedium"
sizing="largeSmallSizeLargeTitles"
background="none"
cardStyle="glass-depth"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="solid"
headingFontWeight="bold"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
brandName="Barista"
navItems={[
{ name: "Home", id: "home" },
{ name: "About", id: "about" },
{ name: "Menu", id: "features" },
{ name: "FAQ", id: "faq" },
{ name: "Contact", id: "contact" }
]}
bottomLeftText="Premium Coffee Culture"
bottomRightText="hello@barista.local"
/>
</div>
<div id="hero" data-section="hero">
<HeroLogo
logoText="Barista"
description="Artisanal coffee crafted with passion. Experience the finest premium blends and specialty drinks in a warm, welcoming atmosphere."
buttons={[
{ text: "View Menu", href: "#features" },
{ text: "Reserve Table", href: "contact" }
]}
imageSrc="http://img.b2bpic.net/free-photo/close-up-hands-preparing-drink-with-milk_23-2148865605.jpg"
imageAlt="Premium coffee with latte art"
showDimOverlay={true}
buttonAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
tag="Our Story"
tagIcon={Coffee}
title="Craft Coffee Excellence Since 2015"
description="Barista began with a simple mission: to bring authentic, expertly crafted coffee to our community. Each cup tells a story of carefully sourced beans, traditional brewing methods, and baristas who take pride in their craft. We believe that great coffee is more than a beverage—it's an experience that connects people."
metrics={[
{ value: "15+", title: "Years of Coffee Excellence" },
{ value: "5000+", title: "Happy Customers Monthly" }
]}
imageSrc="http://img.b2bpic.net/free-photo/confident-young-indian-man-black-shirt-standing-cafe_627829-5462.jpg"
imageAlt="Warm coffeeshop interior"
useInvertedBackground={false}
mediaAnimation="slide-up"
metricsAnimation="slide-up"
tagAnimation="opacity"
/>
</div>
<div id="features" data-section="features">
<FeatureCardTwentyThree
title="Signature Menu Items"
description="Explore our carefully curated selection of premium coffee drinks and pastries"
tag="Menu"
tagIcon={Sparkles}
features={[
{
id: "1", title: "Premium Bean Selection", tags: ["Single Origin", "Ethically Sourced"],
imageSrc: "http://img.b2bpic.net/free-photo/coffee-beans-glass-jar-black-background-closeup-selective-focus-vertical-frame-roasting-preparing-coffee-vertical-frame_166373-2289.jpg", imageAlt: "Premium roasted coffee beans"
},
{
id: "2", title: "Expert Brewing Techniques", tags: ["Specialty Methods", "Precision Crafted"],
imageSrc: "http://img.b2bpic.net/free-photo/male-barista-brewing-coffee-alternative-method-pour_176420-14715.jpg", imageAlt: "Professional barista brewing coffee"
},
{
id: "3", title: "Fresh Artisan Pastries", tags: ["Daily Baked", "Local Partners"],
imageSrc: "http://img.b2bpic.net/free-photo/breakfast-set-flat-lay-with-croissant-raspberry-jam-food-photography_53876-108045.jpg", imageAlt: "Fresh pastry selection"
}
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
tagAnimation="opacity"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSix
title="What Coffee Lovers Say"
description="Real stories from our community of passionate coffee enthusiasts"
tag="Reviews"
tagIcon={Star}
testimonials={[
{
id: "1", name: "Sarah Mitchell", handle: "@sarahloves_coffee", testimonial: "The best coffee I've ever had. Every visit feels like coming home. The baristas truly care about their craft.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1", imageAlt: "Sarah Mitchell"
},
{
id: "2", name: "James Chen", handle: "@espresso_enthusiast", testimonial: "Premium quality beans, exceptional service, and such a warm atmosphere. Barista has become my daily favorite.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=2", imageAlt: "James Chen"
},
{
id: "3", name: "Emma Rodriguez", handle: "@coffee_explorer", testimonial: "The attention to detail in every cup is remarkable. I've traveled to many countries and Barista stands up to the best.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=3", imageAlt: "Emma Rodriguez"
},
{
id: "4", name: "Michael Park", handle: "@artisancoffee", testimonial: "Finally found a place that understands the nuances of specialty coffee. A true gem in our community.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=4", imageAlt: "Michael Park"
}
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
speed={40}
topMarqueeDirection="left"
tagAnimation="opacity"
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
title="Frequently Asked Questions"
description="Everything you need to know about Barista"
tag="Help"
tagIcon={HelpCircle}
faqs={[
{
id: "1", title: "What makes your coffee special?", content: "We source single-origin, ethically-traded beans from the world's finest coffee regions. Each batch is expertly roasted in-house and brewed using traditional methods that bring out the unique character of every blend."
},
{
id: "2", title: "Do you offer dairy-free options?", content: "Absolutely! We provide almond, oat, coconut, and soy milk alternatives for all our coffee drinks. Our baristas are happy to customize any beverage to suit your preferences."
},
{
id: "3", title: "Can I order custom coffee blends?", content: "Yes! We offer custom blend consultations for our regular customers. Visit us in person or call ahead to discuss your flavor preferences, and our coffee experts will create the perfect blend for you."
},
{
id: "4", title: "What are your operating hours?", content: "We're 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. Closed on major holidays."
},
{
id: "5", title: "Do you have seating for meetings?", content: "Yes! We have a comfortable seating area perfect for casual meetings, studying, or just enjoying your coffee. For groups larger than 8, please call ahead to reserve table space."
}
]}
textboxLayout="default"
useInvertedBackground={false}
faqsAnimation="slide-up"
animationType="smooth"
tagAnimation="opacity"
/>
</div>
<div id="contact" data-section="contact">
<ContactText
text="Ready to experience exceptional coffee? Visit Barista today and discover your new favorite brew. We're excited to welcome you to our community."
animationType="entrance-slide"
buttons={[
{ text: "Get Directions", href: "#" },
{ text: "Call Us", href: "#" }
]}
background={{ variant: "plain" }}
useInvertedBackground={false}
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Barista"
copyrightText="© 2025 Barista. Crafting Premium Coffee Since 2015."
socialLinks={[
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" }
]}
/>
</div>
</ThemeProvider>
);
}