253 lines
14 KiB
TypeScript
253 lines
14 KiB
TypeScript
"use client"
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
|
|
import MediaAbout from '@/components/sections/about/MediaAbout';
|
|
import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
|
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
|
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
|
import FaqBase from '@/components/sections/faq/FaqBase';
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
|
import { Sparkles } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="icon-arrow"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="medium"
|
|
sizing="mediumLarge"
|
|
background="grid"
|
|
cardStyle="solid"
|
|
primaryButtonStyle="double-inset"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="normal"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{ name: "Hero", id: "hero-section" },
|
|
{ name: "About", id: "about-section" },
|
|
{ name: "Feature", id: "features-section" },
|
|
{ name: "Product", id: "product-section" },
|
|
{ name: "Testimonial", id: "testimonials-section" },
|
|
{ name: "Faq", id: "faq-section" },
|
|
{ name: "Contact", id: "contact-section" }
|
|
]}
|
|
brandName="Warm & Crumb Bakery"
|
|
bottomLeftText="Global Community"
|
|
bottomRightText="hello@warmandcrumb.com"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero-section" data-section="hero-section">
|
|
<HeroOverlay
|
|
title="Artisan Baked Goods Delivered to Your Door"
|
|
description="Experience the warmth of homemade bread, freshly baked pastries, and custom cakes made with love using time-honored techniques and the finest ingredients."
|
|
tag="Fresh Daily"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "Order Now", href: "#product-section" },
|
|
{ text: "Visit Us", href: "#contact-section" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
imageSrc="https://img.b2bpic.net/free-photo/modern-bakery-shop-with-assortment-bread-shelf_169016-37564.jpg"
|
|
imageAlt="Warm, inviting bakery interior with fresh bread and pastries on display"
|
|
textPosition="bottom-left"
|
|
showDimOverlay={true}
|
|
showBlur={true}
|
|
ariaLabel="Welcome to our cozy bakery"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about-section" data-section="about-section">
|
|
<MediaAbout
|
|
title="Our Story & Artisanal Craft"
|
|
description="Since 1998, we've been crafting exceptional baked goods with passion and precision. Each loaf, cookie, and pastry is made using traditional techniques and the finest ingredients sourced from local farms. Our commitment to quality means every bite tells a story of dedication and love."
|
|
tag="Since 1998"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "View Our Products", href: "#product-section" },
|
|
{ text: "Visit Our Bakery", href: "#contact-section" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
imageSrc="https://img.b2bpic.net/free-photo/baker-forming-dough-sphere-wooden-board_74855-5658.jpg"
|
|
imageAlt="Artisan bakers preparing fresh bread and pastries in our cozy bakery kitchen"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features-section" data-section="features-section">
|
|
<FeatureCardMedia
|
|
title="Our Artisanal Baking Process"
|
|
description="Discover the passion and craftsmanship behind every loaf, cookie, and pastry we create."
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
id: "feature-1", title: "Handcrafted Ingredients", description: "We source only the finest organic ingredients, ensuring each bite is bursting with flavor and quality.", tag: "Premium Quality", imageSrc: "https://img.b2bpic.net/free-photo/bakery_23-2148011598.jpg", imageAlt: "Fresh organic ingredients being prepared by bakers"
|
|
},
|
|
{
|
|
id: "feature-2", title: "Traditional Techniques", description: "Our recipes are passed down through generations, bringing time-honored methods to your table.", tag: "Timeless Recipes", imageSrc: "https://img.b2bpic.net/free-photo/painting-inspiration-supplies-placed-ready-be-painted-canvas_482257-115978.jpg", imageAlt: "Baker using traditional baking techniques"
|
|
},
|
|
{
|
|
id: "feature-3", title: "Daily Freshness", description: "Each item is baked fresh daily, guaranteeing maximum taste and texture for every customer.", tag: "Made Fresh Daily", imageSrc: "https://img.b2bpic.net/free-photo/crispy-butter-cookies-pain-au-chocolat-metallic-tray_114579-22141.jpg", imageAlt: "Freshly baked bread displayed in the bakery"
|
|
}
|
|
]}
|
|
animationType="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="product-section" data-section="product-section">
|
|
<ProductCardOne
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="slide-up"
|
|
title="Artisanal Baked Goods"
|
|
description="Discover our handcrafted selection of fresh-baked breads, pastries, and desserts made with the finest ingredients and traditional techniques."
|
|
tag="Fresh Daily"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="blur-reveal"
|
|
buttons={[{ text: "View Full Menu", href: "#" }]}
|
|
buttonAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{
|
|
id: "croissant", name: "Butter Croissant", price: "$3.50", imageSrc: "https://img.b2bpic.net/free-photo/homemade-croissants-board-marble-table_114579-45274.jpg", imageAlt: "Delicious butter croissant with golden flaky layers"
|
|
},
|
|
{
|
|
id: "chocolate-cookie", name: "Chocolate Chip Cookie", price: "$2.25", imageSrc: "https://img.b2bpic.net/free-photo/plate-with-fresh-cookies-from-oven_23-2148837150.jpg", imageAlt: "Warm chocolate chip cookie with melted chocolate chips"
|
|
},
|
|
{
|
|
id: "blueberry-muffin", name: "Blueberry Muffin", price: "$3.00", imageSrc: "https://img.b2bpic.net/free-photo/muffins-with-black-currant_661915-152.jpg", imageAlt: "Fresh blueberry muffin with plump blueberries on top"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials-section" data-section="testimonials-section">
|
|
<TestimonialCardOne
|
|
testimonials={[
|
|
{
|
|
id: "testimonial-1", name: "Sarah Johnson", role: "Bakery Owner", company: "Sweet Crumb Bakery", rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/man-baker-kitchen-by-pastry-cart_1303-32295.jpg", imageAlt: "Sarah Johnson, owner of Sweet Crumb Bakery"
|
|
},
|
|
{
|
|
id: "testimonial-2", name: "Michael Chen", role: "Food Blogger", company: "Tasty Bites Weekly", rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/portrait-family-having-fun-kitchen_329181-5378.jpg", imageAlt: "Michael Chen, food blogger at Tasty Bites Weekly"
|
|
},
|
|
{
|
|
id: "testimonial-3", name: "Emma Rodriguez", role: "Mother & Home Baker", company: "Family Recipes", rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/close-up-friends-holding-cupcakes_23-2148263251.jpg", imageAlt: "Emma Rodriguez, mother and home baker"
|
|
},
|
|
{
|
|
id: "testimonial-4", name: "David Thompson", role: "Local Restaurant Chef", company: "The Golden Fork", rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/man-baker-with-fresh-bread-baker-house_1303-32273.jpg", imageAlt: "David Thompson, chef at The Golden Fork restaurant"
|
|
}
|
|
]}
|
|
carouselMode="buttons"
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
title="What Our Customers Say"
|
|
description="Hear from our beloved community about their delightful experiences with our artisanal baked goods."
|
|
tag="Customer Favorites"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
buttons={[{ text: "View All Reviews", href: "#" }]}
|
|
buttonAnimation="slide-up"
|
|
textboxLayout="inline-image"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq-section" data-section="faq-section">
|
|
<FaqBase
|
|
title="Frequently Asked Questions"
|
|
description="Find answers to common questions about our bakery, products, and services. We're here to help make your baking experience delightful."
|
|
faqs={[
|
|
{
|
|
id: "faq-1", title: "What types of baked goods do you offer?", content: "We specialize in artisanal breads, pastries, cakes, and seasonal specialties. Our menu changes with the seasons to bring you fresh, high-quality ingredients."
|
|
},
|
|
{
|
|
id: "faq-2", title: "How can I place an order?", content: "You can place orders online through our website or by calling us directly. We also offer custom orders for special occasions and events."
|
|
},
|
|
{
|
|
id: "faq-3", title: "Do you offer gluten-free options?", content: "Yes, we have a selection of gluten-free breads and pastries made with premium ingredients to ensure they're just as delicious as our regular offerings."
|
|
},
|
|
{
|
|
id: "faq-4", title: "What are your store hours?", content: "Our bakery is open Monday through Saturday from 7:00 AM to 7:00 PM, and Sunday from 8:00 AM to 5:00 PM. We're closed on major holidays."
|
|
},
|
|
{
|
|
id: "faq-5", title: "Can I customize my order?", content: "Absolutely! We love creating custom cakes, cookies, and other baked goods for birthdays, weddings, and corporate events. Contact us for more details."
|
|
}
|
|
]}
|
|
faqsAnimation="slide-up"
|
|
textboxLayout="inline-image"
|
|
useInvertedBackground={false}
|
|
showCard={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact-section" data-section="contact-section">
|
|
<ContactSplitForm
|
|
title="Get In Touch With Us"
|
|
description="Have questions or want to place an order? Reach out to our friendly team and we'll get back to you as soon as possible."
|
|
inputs={[
|
|
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
|
{ name: "email", type: "email", placeholder: "Your Email", required: true },
|
|
{ name: "phone", type: "tel", placeholder: "Your Phone Number" }
|
|
]}
|
|
textarea={{
|
|
name: "message", placeholder: "Your Message", rows: 5,
|
|
required: true
|
|
}}
|
|
useInvertedBackground={false}
|
|
imageSrc="https://img.b2bpic.net/free-photo/bakery-with-display-pastries-pastries_188544-40882.jpg"
|
|
imageAlt="Bakery team welcoming customers"
|
|
mediaAnimation="slide-up"
|
|
mediaPosition="left"
|
|
buttonText="Send Message"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer-section" data-section="footer-section">
|
|
<FooterMedia
|
|
imageSrc="https://img.b2bpic.net/free-photo/vertical-shot-delicious-sponge-cake_181624-31125.jpg"
|
|
imageAlt="Cozy bakery interior with warm lighting and fresh bread displayed on wooden shelves"
|
|
columns={[
|
|
{
|
|
title: "Explore", items: [
|
|
{ label: "Home", href: "#hero-section" },
|
|
{ label: "Our Story", href: "#about-section" },
|
|
{ label: "Products", href: "#product-section" },
|
|
{ label: "Testimonials", href: "#testimonials-section" }
|
|
]
|
|
},
|
|
{
|
|
title: "Support", items: [
|
|
{ label: "Contact Us", href: "#contact-section" },
|
|
{ label: "FAQs", href: "#faq-section" },
|
|
{ label: "Delivery Info", href: "#" },
|
|
{ label: "Returns & Exchanges", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Connect", items: [
|
|
{ label: "Instagram", href: "#" },
|
|
{ label: "Facebook", href: "#" },
|
|
{ label: "Newsletter", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
logoText="Sweet Crumb Bakery"
|
|
copyrightText="© 2025 Sweet Crumb Bakery | Crafted with Love & Flour"
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |