Initial commit
This commit is contained in:
314
src/app/page.tsx
Normal file
314
src/app/page.tsx
Normal file
@@ -0,0 +1,314 @@
|
||||
"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="invertDefault"
|
||||
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"
|
||||
titleClassName="text-3xl md:text-4xl font-bold"
|
||||
descriptionClassName="text-base md:text-lg"
|
||||
/>
|
||||
</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="invertDefault"
|
||||
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="invertDefault"
|
||||
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="invertDefault"
|
||||
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>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user