312 lines
16 KiB
TypeScript
312 lines
16 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
|
|
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import FeatureProcessSteps from '@/components/sections/feature/FeatureProcessSteps';
|
|
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
|
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
|
import FaqBase from '@/components/sections/faq/FaqBase';
|
|
import ContactFaq from '@/components/sections/contact/ContactFaq';
|
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
|
import { Coffee, Sparkles, Flame, Heart, MessageCircle } from "lucide-react";
|
|
|
|
export default function BrewHavenPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-bubble"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="medium"
|
|
sizing="medium"
|
|
background="floatingGradient"
|
|
cardStyle="gradient-bordered"
|
|
primaryButtonStyle="inset-glow"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="bold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
brandName="Brew Haven"
|
|
navItems={[
|
|
{ name: "About", id: "about" },
|
|
{ name: "Menu", id: "products" },
|
|
{ name: "How We Work", id: "feature" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
button={{
|
|
text: "Reserve Table", href: "#contact"
|
|
}}
|
|
className="rounded-full backdrop-blur-md bg-opacity-90"
|
|
navItemClassName="text-sm font-medium transition-colors"
|
|
buttonClassName="px-6 py-2 rounded-full font-semibold"
|
|
buttonTextClassName="font-bold"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardRotatedCarousel
|
|
title="Craft Coffee, Crafted With Care"
|
|
description="Experience the finest specialty coffee in an intimate, welcoming space. From bean selection to the perfect pour, every detail matters."
|
|
tag="Specialty Coffee"
|
|
tagIcon={Coffee}
|
|
buttons={[
|
|
{ text: "Explore Menu", href: "#products" },
|
|
{ text: "Visit Us", href: "#contact" }
|
|
]}
|
|
carouselItems={[
|
|
{
|
|
id: "1", imageSrc: "https://img.b2bpic.net/free-photo/close-up-cup-coffee-with-wooden-background_23-2148251640.jpg", imageAlt: "Fresh espresso shot"
|
|
},
|
|
{
|
|
id: "2", imageSrc: "https://img.b2bpic.net/free-photo/cup-coffee-with-white-saucer_114579-16848.jpg", imageAlt: "Smooth cappuccino"
|
|
},
|
|
{
|
|
id: "3", imageSrc: "https://img.b2bpic.net/free-photo/yellow-cup-with-beverage-near-coffee-beans_23-2148180237.jpg", imageAlt: "Specialty latte"
|
|
},
|
|
{
|
|
id: "4", imageSrc: "https://img.b2bpic.net/free-photo/coffee-cup_74190-2687.jpg", imageAlt: "Barista crafting espresso"
|
|
},
|
|
{
|
|
id: "5", imageSrc: "https://img.b2bpic.net/free-photo/top-view-cup-coffee-half-empty-inside-black-cup-brown-wooden-table-drink-coffee-liquid_140725-27964.jpg", imageAlt: "Latte art creation"
|
|
},
|
|
{
|
|
id: "6", imageSrc: "https://img.b2bpic.net/free-photo/closeup-shot-cup-coffee-white-saucer-with-metal-spoon_181624-27779.jpg", imageAlt: "Premium coffee beans"
|
|
}
|
|
]}
|
|
autoPlay={true}
|
|
autoPlayInterval={4000}
|
|
className="w-full"
|
|
containerClassName="relative"
|
|
titleClassName="text-4xl md:text-5xl font-bold"
|
|
descriptionClassName="text-base md:text-lg text-opacity-90"
|
|
buttonClassName="px-6 py-2 rounded-full font-semibold"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<InlineImageSplitTextAbout
|
|
heading={[
|
|
{ type: "text", content: "Where passion for" },
|
|
{
|
|
type: "image", src: "https://img.b2bpic.net/free-photo/empty-wood-chair-restaurant_1339-5949.jpg", alt: "Our cozy cafe"
|
|
},
|
|
{ type: "text", content: "meets exceptional quality" }
|
|
]}
|
|
useInvertedBackground="noInvert"
|
|
buttons={[
|
|
{ text: "Learn Our Story", href: "#feature" }
|
|
]}
|
|
className="w-full"
|
|
containerClassName="py-12 md:py-20"
|
|
headingClassName="text-3xl md:text-4xl font-bold"
|
|
imageWrapperClassName="mx-2"
|
|
imageClassName="rounded-lg shadow-lg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardFour
|
|
title="Our Signature Menu"
|
|
description="Hand-crafted beverages made with premium, ethically-sourced coffee beans"
|
|
tag="Popular Drinks"
|
|
tagIcon={Sparkles}
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
products={[
|
|
{
|
|
id: "1", name: "Classic Espresso", price: "$3.50", variant: "Rich, Bold, Single Shot", imageSrc: "https://img.b2bpic.net/free-photo/close-up-aromatic-coffee-plate_23-2148349623.jpg", imageAlt: "Espresso shot"
|
|
},
|
|
{
|
|
id: "2", name: "Velvety Cappuccino", price: "$4.75", variant: "Creamy, Balanced, Milk Foam", imageSrc: "https://img.b2bpic.net/free-photo/double-espresso-coffee-mug-with-cinnamon-sticks-coffee-beans-wooden-board_181624-57625.jpg", imageAlt: "Cappuccino with latte art"
|
|
},
|
|
{
|
|
id: "3", name: "Smooth Americano", price: "$3.75", variant: "Mellow, Aromatic, Water-Diluted", imageSrc: "https://img.b2bpic.net/free-photo/delicious-quality-coffee-cup_23-2150691441.jpg", imageAlt: "Americano in ceramic cup"
|
|
}
|
|
]}
|
|
className="w-full"
|
|
containerClassName="py-12 md:py-20"
|
|
/>
|
|
</div>
|
|
|
|
<div id="feature" data-section="feature">
|
|
<FeatureProcessSteps
|
|
title="Our Coffee Craftsmanship"
|
|
description="From sourcing premium beans to the perfect cup, every step in our process is deliberate, thoughtful, and designed to bring out the best flavors."
|
|
tag="The Art of Coffee"
|
|
tagIcon={Flame}
|
|
steps={[
|
|
{
|
|
number: "01", title: "Premium Bean Selection", description: "We source ethically-grown, single-origin coffee beans from sustainable farms around the world, selecting only the highest quality lots.", tag: "Foundation"
|
|
},
|
|
{
|
|
number: "02", title: "Expert Roasting", description: "Our master roasters carefully develop each batch to perfection, bringing out unique flavor profiles and ensuring consistent quality with every roast.", tag: "Precision"
|
|
},
|
|
{
|
|
number: "03", title: "Fresh Grinding & Brewing", description: "Beans are ground moments before brewing to preserve aroma and flavor. Each cup is crafted by our trained baristas with meticulous attention to detail.", tag: "Craft"
|
|
}
|
|
]}
|
|
useInvertedBackground="noInvert"
|
|
className="w-full"
|
|
containerClassName="py-12 md:py-20"
|
|
titleClassName="text-3xl md:text-4xl font-bold"
|
|
descriptionClassName="text-base md:text-lg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardEleven
|
|
title="Our Impact"
|
|
description="Building a thriving community of coffee enthusiasts and supporting sustainable practices"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
animationType="slide-up"
|
|
metrics={[
|
|
{
|
|
id: "1", value: "5,000+", title: "Daily Cups Served", description: "Crafted with care every single day", imageSrc: "https://img.b2bpic.net/free-photo/group-friends-ordering-restaurant_23-2150520068.jpg", imageAlt: "Busy cafe with customers"
|
|
},
|
|
{
|
|
id: "2", value: "15 Years", title: "Of Excellence", description: "Perfecting our craft and serving our community", imageSrc: "https://img.b2bpic.net/free-photo/tattooed-barista-hand-holds-raw-green-coffee-beans-from-white-plastic-basket-cotton-bags-europalet-warehouse_346278-886.jpg", imageAlt: "Premium coffee quality"
|
|
}
|
|
]}
|
|
className="w-full"
|
|
containerClassName="py-12 md:py-20"
|
|
titleClassName="text-3xl md:text-4xl font-bold"
|
|
descriptionClassName="text-base md:text-lg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwelve
|
|
cardTitle="Loved by thousands of coffee enthusiasts around the world"
|
|
cardTag="Customer Love"
|
|
cardTagIcon={Heart}
|
|
useInvertedBackground="noInvert"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Mitchell", imageSrc: "https://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman_1262-20882.jpg", imageAlt: "Sarah Mitchell"
|
|
},
|
|
{
|
|
id: "2", name: "James Rodriguez", imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageAlt: "James Rodriguez"
|
|
},
|
|
{
|
|
id: "3", name: "Emma Chen", imageSrc: "https://img.b2bpic.net/free-photo/close-up-businessman-with-tie_1098-2867.jpg", imageAlt: "Emma Chen"
|
|
},
|
|
{
|
|
id: "4", name: "Michael Thompson", imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-woman-work-portrait_23-2149304144.jpg", imageAlt: "Michael Thompson"
|
|
},
|
|
{
|
|
id: "5", name: "Lisa Anderson", imageSrc: "https://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5367.jpg", imageAlt: "Lisa Anderson"
|
|
}
|
|
]}
|
|
className="w-full"
|
|
containerClassName="py-12 md:py-20"
|
|
cardTitleClassName="text-2xl md:text-3xl font-bold"
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqBase
|
|
title="Frequently Asked Questions"
|
|
description="Find answers to common questions about our coffee, hours, and services"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
animationType="smooth"
|
|
faqs={[
|
|
{
|
|
id: "1", title: "What makes your coffee special?", content: "We source single-origin, ethically-grown beans from premium farms worldwide. Each batch is roasted in-house to perfection, and every cup is crafted fresh by our trained baristas using precise brewing techniques."
|
|
},
|
|
{
|
|
id: "2", title: "Do you offer alternative milks?", content: "Yes! We offer almond milk, oat milk, coconut milk, and soy milk for all our espresso-based drinks. Ask our baristas for recommendations based on your preference."
|
|
},
|
|
{
|
|
id: "3", title: "Can I book a private event?", content: "Absolutely. We host private tastings, team meetings, and special events. Please contact us at events@brewhaven.com or call our location directly to discuss your needs."
|
|
},
|
|
{
|
|
id: "4", title: "Do you sell whole beans to take home?", content: "Yes, we offer whole bean coffee in 1lb and 5lb bags. Our selection rotates based on seasonal roasts and single-origin offerings. Staff can help you find the perfect beans for your taste preferences."
|
|
},
|
|
{
|
|
id: "5", title: "What are your operating hours?", content: "We're open Monday-Friday 6:30 AM - 7:00 PM, Saturday 8:00 AM - 6:00 PM, and Sunday 8:00 AM - 5:00 PM. We're closed on major holidays."
|
|
},
|
|
{
|
|
id: "6", title: "Do you offer training or coffee workshops?", content: "Yes! We offer barista training, home brewing courses, and coffee tasting workshops. Check our website for upcoming dates or contact us to schedule a private session."
|
|
}
|
|
]}
|
|
className="w-full"
|
|
containerClassName="py-12 md:py-20"
|
|
titleClassName="text-3xl md:text-4xl font-bold"
|
|
descriptionClassName="text-base md:text-lg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactFaq
|
|
ctaTitle="Get In Touch"
|
|
ctaDescription="Have questions? Want to reserve a table or learn about our private events? Reach out to our team."
|
|
ctaButton={{
|
|
text: "Send Message", href: "mailto:hello@brewhaven.com"
|
|
}}
|
|
ctaIcon={MessageCircle}
|
|
useInvertedBackground="noInvert"
|
|
animationType="slide-up"
|
|
accordionAnimationType="smooth"
|
|
faqs={[
|
|
{
|
|
id: "1", title: "What's the best way to contact you?", content: "You can reach us via email at hello@brewhaven.com, call us at (555) 123-4567, or visit us in person at 123 Main Street. We're also responsive on social media @brewhaven."
|
|
},
|
|
{
|
|
id: "2", title: "How quickly do you respond to messages?", content: "We aim to respond to all messages within 2 business hours during operating hours. For after-hours inquiries, we'll get back to you the next morning."
|
|
},
|
|
{
|
|
id: "3", title: "Can I gift cards to friends?", content: "Absolutely! Gift cards are available in denominations from $10 to $100. Purchase them in-store or contact us for digital delivery options."
|
|
}
|
|
]}
|
|
className="w-full"
|
|
containerClassName="py-12 md:py-20"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterMedia
|
|
imageSrc="https://img.b2bpic.net/free-photo/table-set-dinning-table_1339-3441.jpg"
|
|
imageAlt="Brew Haven storefront"
|
|
logoText="Brew Haven"
|
|
copyrightText="© 2025 Brew Haven. All rights reserved."
|
|
columns={[
|
|
{
|
|
title: "Company", items: [
|
|
{ label: "About Us", href: "#about" },
|
|
{ label: "Our Story", href: "#feature" },
|
|
{ label: "Careers", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Menu", items: [
|
|
{ label: "Coffee", href: "#products" },
|
|
{ label: "Pastries", href: "#products" },
|
|
{ label: "Drinks", href: "#products" }
|
|
]
|
|
},
|
|
{
|
|
title: "Connect", items: [
|
|
{ label: "Instagram", href: "https://instagram.com" },
|
|
{ label: "Contact Us", href: "#contact" },
|
|
{ label: "Gift Cards", href: "#contact" }
|
|
]
|
|
}
|
|
]}
|
|
className="w-full"
|
|
containerClassName="relative"
|
|
mediaWrapperClassName="h-64 md:h-96 overflow-hidden"
|
|
logoTextClassName="text-2xl md:text-3xl font-bold"
|
|
columnsClassName="grid grid-cols-1 md:grid-cols-3 gap-8"
|
|
columnTitleClassName="font-bold text-lg mb-4"
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |