Merge version_1_1776441980765 into main #2
363
src/App.tsx
363
src/App.tsx
@@ -13,264 +13,139 @@ import { Award, Shield, Sparkles, Star, Zap } from "lucide-react";
|
||||
export default function App() {
|
||||
return (
|
||||
<>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarCentered
|
||||
logo="SweetCrumb"
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
name: "Specialties",
|
||||
href: "#features",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
href: "#testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
ctaButton={{
|
||||
text: "Order Online",
|
||||
href: "#contact",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarCentered
|
||||
logo="SweetCrumb"
|
||||
navItems={[
|
||||
{ name: "About", href: "#about" },
|
||||
{ name: "Specialties", href: "#features" },
|
||||
{ name: "Testimonials", href: "#testimonials" },
|
||||
{ name: "Contact", href: "#contact" },
|
||||
]}
|
||||
ctaButton={{ text: "Order Online", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
tag="Freshly Baked Every Morning"
|
||||
title="Experience Artisanal Baking in Every Bite"
|
||||
description="We blend traditional techniques with the finest locally sourced ingredients to bring you bread and pastries that warm the soul."
|
||||
primaryButton={{
|
||||
text: "Our Menu",
|
||||
href: "#features",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Visit Us",
|
||||
href: "#contact",
|
||||
}}
|
||||
imageSrc="https://pixabay.com/get/gae3890478b30636238a96f95bfcf2caa6f9e461edaa6b079ca31c2083c6738f91e3f19ccb5f2887458ad3254408b6dbcf3c928a032569e4749f177036fcdaf82_1280.jpg?_wi=1"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
tag="Freshly Baked Every Morning"
|
||||
title="Experience Artisanal Baking in Every Bite"
|
||||
description="We blend traditional techniques with the finest locally sourced ingredients to bring you bread and pastries that warm the soul."
|
||||
primaryButton={{ text: "Our Menu", href: "#features" }}
|
||||
secondaryButton={{ text: "Visit Us", href: "#contact" }}
|
||||
imageSrc="https://pixabay.com/get/gae3890478b30636238a96f95bfcf2caa6f9e461edaa6b079ca31c2083c6738f91e3f19ccb5f2887458ad3254408b6dbcf3c928a032569e4749f177036fcdaf82_1280.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMediaOverlay
|
||||
tag="Our Story"
|
||||
title="A Legacy of Flour and Passion"
|
||||
description="Founded in 1985, SweetCrumb started as a small family kitchen. Today, we continue our commitment to slow fermentation and hand-shaped loaves."
|
||||
primaryButton={{
|
||||
text: "Learn More",
|
||||
href: "#about",
|
||||
}}
|
||||
imageSrc="https://pixabay.com/get/gfb895af5a079a668015d7147d479cf276695a733bd3cdb33fc303f5c66784c986e29fbe858991fc9249efe71501c3df3034a9e8e3a2d550221f26dc8e41797f6_1280.jpg?_wi=1"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<AboutMediaOverlay
|
||||
tag="Our Story"
|
||||
title="A Legacy of Flour and Passion"
|
||||
description="Founded in 1985, SweetCrumb started as a small family kitchen. Today, we continue our commitment to slow fermentation and hand-shaped loaves."
|
||||
primaryButton={{ text: "Learn More", href: "#about" }}
|
||||
imageSrc="https://pixabay.com/get/gfb895af5a079a668015d7147d479cf276695a733bd3cdb33fc303f5c66784c986e29fbe858991fc9249efe71501c3df3034a9e8e3a2d550221f26dc8e41797f6_1280.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeaturesDualMedia
|
||||
tag="Our Specialties"
|
||||
title="Handcrafted Daily Wonders"
|
||||
description="From crisp sourdough to flaky butter croissants, our selection is designed to delight your senses every single day."
|
||||
items={[
|
||||
{
|
||||
icon: Sparkles,
|
||||
title: "Buttery Pastries",
|
||||
description: "Laminated doughs folded with high-quality European butter for maximum flakiness.",
|
||||
mediaItems: [
|
||||
<div id="features" data-section="features">
|
||||
<FeaturesDualMedia
|
||||
tag="Our Specialties"
|
||||
title="Handcrafted Daily Wonders"
|
||||
description="From crisp sourdough to flaky butter croissants, our selection is designed to delight your senses every single day."
|
||||
items={[
|
||||
{
|
||||
imageSrc: "https://pixabay.com/get/g1546216fe83356cc0c85b3c2af2b18be3fe8bbe06af5a9b62e00da1064ecfadd21903024097413a8b6b7c96c193d893fa3eb2c3ceb53557e9f2e44a1ecc15678_1280.jpg",
|
||||
icon: Sparkles,
|
||||
title: "Buttery Pastries", description: "Laminated doughs folded with high-quality European butter for maximum flakiness.", mediaItems: [
|
||||
{ imageSrc: "https://pixabay.com/get/g1546216fe83356cc0c85b3c2af2b18be3fe8bbe06af5a9b62e00da1064ecfadd21903024097413a8b6b7c96c193d893fa3eb2c3ceb53557e9f2e44a1ecc15678_1280.jpg" },
|
||||
{ imageSrc: "https://pixabay.com/get/geded089d0d5db9666f9b38dd399ec58e3fe7ea26c65a3dd0581215b3aab5dcabb4d9bb3ad49110cc23fc4bd81dd5df9d3bb51cea8bfb2cb57c6b97f1c368aef1_1280.jpg" }
|
||||
]
|
||||
},
|
||||
{
|
||||
imageSrc: "https://pixabay.com/get/geded089d0d5db9666f9b38dd399ec58e3fe7ea26c65a3dd0581215b3aab5dcabb4d9bb3ad49110cc23fc4bd81dd5df9d3bb51cea8bfb2cb57c6b97f1c368aef1_1280.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "https://pixabay.com/get/gae3890478b30636238a96f95bfcf2caa6f9e461edaa6b079ca31c2083c6738f91e3f19ccb5f2887458ad3254408b6dbcf3c928a032569e4749f177036fcdaf82_1280.jpg?_wi=2",
|
||||
imageAlt: "fresh croissants tray warm lighting",
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Artisan Sourdough",
|
||||
description: "Long-fermented natural leaven bread that is easy to digest and full of flavor.",
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "https://pixabay.com/get/gfb35f30b32b5a583fee45eabe4b8c7c03fe081023b7d3f2fe91f0cdd9bce2577ca7f108720f99b42e452e7b1a243fd316bcaba02a0a4deb5c32542f3bf3f5739_1280.jpg",
|
||||
icon: Shield,
|
||||
title: "Artisan Sourdough", description: "Long-fermented natural leaven bread that is easy to digest and full of flavor.", mediaItems: [
|
||||
{ imageSrc: "https://pixabay.com/get/gfb35f30b32b5a583fee45eabe4b8c7c03fe081023b7d3f2fe91f0cdd9bce2577ca7f108720f99b42e452e7b1a243fd316bcaba02a0a4deb5c32542f3bf3f5739_1280.jpg" },
|
||||
{ imageSrc: "https://pixabay.com/get/ga0f1a2b8bc808e8cbfcb51c3585ffa9c572a2a0bd89e8483d5af3c9e5eaf15785d34c5d7cc1a8dc5a7ad376aebf6f9b172ae219bd7b805641458931ab6e85758_1280.jpg" }
|
||||
]
|
||||
},
|
||||
{
|
||||
imageSrc: "https://pixabay.com/get/ga0f1a2b8bc808e8cbfcb51c3585ffa9c572a2a0bd89e8483d5af3c9e5eaf15785d34c5d7cc1a8dc5a7ad376aebf6f9b172ae219bd7b805641458931ab6e85758_1280.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "https://pixabay.com/get/gfb895af5a079a668015d7147d479cf276695a733bd3cdb33fc303f5c66784c986e29fbe858991fc9249efe71501c3df3034a9e8e3a2d550221f26dc8e41797f6_1280.jpg?_wi=2",
|
||||
imageAlt: "fresh croissants tray warm lighting",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
title: "Seasonal Desserts",
|
||||
description: "Fruit-forward tarts and cakes that change with the local harvest schedule.",
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "https://pixabay.com/get/gf4e3fbed4cdbcc5feb9895b5a3e2604335cb805b46d213a833e41cfd297b1ff5cdc0d0e14c7d51f731d488e857aedf467987e256f1fd90276fb06daabf0df60e_1280.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://pixabay.com/get/g6dfcf6e3ea3f1000017223169f93cbb0fe67fd2a9f84640e587d4ec03638b8baf6ca8c5c8cd672c9be89544f74497d6cd5cb1c9c8ac883a2a2c384ba6bce034b_1280.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "https://pixabay.com/get/g883c41e4111d9995486dee6b67a9a6ffb0279af3d46cebc480c45a4ecc64e82319b2b96fd351bf503810bb4cc7547521287b55474cfe187f268a988e95e37500_1280.jpg?_wi=1",
|
||||
imageAlt: "fresh croissants tray warm lighting",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
icon: Award,
|
||||
title: "Seasonal Desserts", description: "Fruit-forward tarts and cakes that change with the local harvest schedule.", mediaItems: [
|
||||
{ imageSrc: "https://pixabay.com/get/gf4e3fbed4cdbcc5feb9895b5a3e2604335cb805b46d213a833e41cfd297b1ff5cdc0d0e14c7d51f731d488e857aedf467987e256f1fd90276fb06daabf0df60e_1280.jpg" },
|
||||
{ imageSrc: "https://pixabay.com/get/g6dfcf6e3ea3f1000017223169f93cbb0fe67fd2a9f84640e587d4ec03638b8baf6ca8c5c8cd672c9be89544f74497d6cd5cb1c9c8ac883a2a2c384ba6bce034b_1280.jpg" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialDetailedCards
|
||||
tag="Testimonials"
|
||||
title="What Our Neighbors Say"
|
||||
description="Heartfelt feedback from the community that keeps us waking up at 3 AM every morning."
|
||||
testimonials={[
|
||||
{
|
||||
title: "Best in town!",
|
||||
quote: "The sourdough is unmatched. I drive 20 minutes every Saturday just to get a loaf.",
|
||||
name: "Elena Rodriguez",
|
||||
role: "Local Resident",
|
||||
imageSrc: "https://pixabay.com/get/g4d3df70a712e59fac32e65fa5560601de8e320d1e6c6b16aa2432107ccba8128433758af3c7dd2b986beb6a5db8ea114f52a7f5b709de75e1d5224aeaf057251_1280.jpg",
|
||||
},
|
||||
{
|
||||
title: "Pure magic.",
|
||||
quote: "Their croissants remind me of the ones I had in Paris. Absolutely authentic.",
|
||||
name: "Mark Henderson",
|
||||
role: "Food Blogger",
|
||||
imageSrc: "https://pixabay.com/get/g7c7bd0add6d83470e864782b7c09d7aeea43922938efb19d46fd64858168ec969cede31bf236da284e6991abdc4d6063413483f0e9a67116a76311ce7554a71e_1280.jpg",
|
||||
},
|
||||
{
|
||||
title: "My morning ritual.",
|
||||
quote: "The coffee and almond tart combo is the only way to start my day.",
|
||||
name: "Sarah Chen",
|
||||
role: "Creative Director",
|
||||
imageSrc: "https://pixabay.com/get/g23bc3a088567ebd6d449bbe98b3082c936d62fca5eb3b79a53f4f775af86c00bbf65e9dfaae5707a800a4ebb18a40ec0aec9c571d86b3bd4680f654579ecd186_1280.jpg",
|
||||
},
|
||||
{
|
||||
title: "Fantastic service.",
|
||||
quote: "Always welcomed with a smile, regardless of how busy they are.",
|
||||
name: "James Wilson",
|
||||
role: "Teacher",
|
||||
imageSrc: "https://pixabay.com/get/gd6eedf08e03f0010f0256736254d86f012eb1d9edf77d885c2f3eb6fd9e15eb50925b86d84cb52d46955712b2a0bf6759c115538404979de45b835ccc7259fa8_1280.jpg",
|
||||
},
|
||||
{
|
||||
title: "True artisan.",
|
||||
quote: "You can taste the quality of ingredients in every bite of their rye bread.",
|
||||
name: "Linda Peterson",
|
||||
role: "Home Cook",
|
||||
imageSrc: "https://pixabay.com/get/ge3dea6dba3fa0aaf4b8a7b0834e56a44dad55fd2ce1192d9c613b752f976bdebbad75c1984cf7508af328ebeb45cb6605261db83257d693e2a118305bd900637_1280.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialDetailedCards
|
||||
tag="Testimonials"
|
||||
title="What Our Neighbors Say"
|
||||
description="Heartfelt feedback from the community that keeps us waking up at 3 AM every morning."
|
||||
testimonials={[
|
||||
{ title: "Best in town!", quote: "The sourdough is unmatched. I drive 20 minutes every Saturday just to get a loaf.", name: "Elena Rodriguez", role: "Local Resident", imageSrc: "https://pixabay.com/get/g4d3df70a712e59fac32e65fa5560601de8e320d1e6c6b16aa2432107ccba8128433758af3c7dd2b986beb6a5db8ea114f52a7f5b709de75e1d5224aeaf057251_1280.jpg" },
|
||||
{ title: "Pure magic.", quote: "Their croissants remind me of the ones I had in Paris. Absolutely authentic.", name: "Mark Henderson", role: "Food Blogger", imageSrc: "https://pixabay.com/get/g7c7bd0add6d83470e864782b7c09d7aeea43922938efb19d46fd64858168ec969cede31bf236da284e6991abdc4d6063413483f0e9a67116a76311ce7554a71e_1280.jpg" },
|
||||
{ title: "My morning ritual.", quote: "The coffee and almond tart combo is the only way to start my day.", name: "Sarah Chen", role: "Creative Director", imageSrc: "https://pixabay.com/get/g23bc3a088567ebd6d449bbe98b3082c936d62fca5eb3b79a53f4f775af86c00bbf65e9dfaae5707a800a4ebb18a40ec0aec9c571d86b3bd4680f654579ecd186_1280.jpg" },
|
||||
{ title: "Fantastic service.", quote: "Always welcomed with a smile, regardless of how busy they are.", name: "James Wilson", role: "Teacher", imageSrc: "https://pixabay.com/get/gd6eedf08e03f0010f0256736254d86f012eb1d9edf77d885c2f3eb6fd9e15eb50925b86d84cb52d46955712b2a0bf6759c115538404979de45b835ccc7259fa8_1280.jpg" },
|
||||
{ title: "True artisan.", quote: "You can taste the quality of ingredients in every bite of their rye bread.", name: "Linda Peterson", role: "Home Cook", imageSrc: "https://pixabay.com/get/ge3dea6dba3fa0aaf4b8a7b0834e56a44dad55fd2ce1192d9c613b752f976bdebbad75c1984cf7508af328ebeb45cb6605261db83257d693e2a118305bd900637_1280.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricsIconCards
|
||||
tag="Our Impact"
|
||||
title="Quality in Numbers"
|
||||
description="Our passion results in consistent quality that our customers rely on daily."
|
||||
metrics={[
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Loaves Baked Daily",
|
||||
value: "450+",
|
||||
},
|
||||
{
|
||||
icon: Star,
|
||||
title: "Happy Neighbors",
|
||||
value: "10k+",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
title: "Years Baking",
|
||||
value: "39",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricsIconCards
|
||||
tag="Our Impact"
|
||||
title="Quality in Numbers"
|
||||
description="Our passion results in consistent quality that our customers rely on daily."
|
||||
metrics={[
|
||||
{ icon: Zap, title: "Loaves Baked Daily", value: "450+" },
|
||||
{ icon: Star, title: "Happy Neighbors", value: "10k+" },
|
||||
{ icon: Award, title: "Years Baking", value: "39" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSimple
|
||||
tag="Questions"
|
||||
title="Frequently Asked"
|
||||
description="Common inquiries about our baking processes and shop hours."
|
||||
items={[
|
||||
{
|
||||
question: "Do you offer gluten-free options?",
|
||||
answer: "While we are a flour-heavy environment, we do have selected flourless items.",
|
||||
},
|
||||
{
|
||||
question: "How long does your sourdough last?",
|
||||
answer: "Stored properly, our sourdough will maintain its quality for up to 4 days.",
|
||||
},
|
||||
{
|
||||
question: "Can I pre-order for events?",
|
||||
answer: "Absolutely! Reach out via our contact form at least 48 hours in advance.",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSimple
|
||||
tag="Questions"
|
||||
title="Frequently Asked"
|
||||
description="Common inquiries about our baking processes and shop hours."
|
||||
items={[
|
||||
{ question: "Do you offer gluten-free options?", answer: "While we are a flour-heavy environment, we do have selected flourless items." },
|
||||
{ question: "How long does your sourdough last?", answer: "Stored properly, our sourdough will maintain its quality for up to 4 days." },
|
||||
{ question: "Can I pre-order for events?", answer: "Absolutely! Reach out via our contact form at least 48 hours in advance." }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofMarquee
|
||||
tag="Recognized By"
|
||||
title="A Community Favorite"
|
||||
description="Proudly featured in local and national food publications for our dedication to craft."
|
||||
names={[
|
||||
"Eater Local",
|
||||
"The Daily Crust",
|
||||
"Bakery Weekly",
|
||||
"City Food Guide",
|
||||
"Morning Delights",
|
||||
"Artisan Monthly",
|
||||
"The Bread Chronicle",
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofMarquee
|
||||
tag="Recognized By"
|
||||
title="A Community Favorite"
|
||||
description="Proudly featured in local and national food publications for our dedication to craft."
|
||||
names={["Eater Local", "The Daily Crust", "Bakery Weekly", "City Food Guide", "Morning Delights", "Artisan Monthly", "The Bread Chronicle"]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
tag="Visit Us"
|
||||
title="Get In Touch"
|
||||
description="Have a large order or a special request? We'd love to hear from you."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Email Address",
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "Your message",
|
||||
rows: 4,
|
||||
required: true,
|
||||
}}
|
||||
buttonText="Send Message"
|
||||
imageSrc="https://pixabay.com/get/g883c41e4111d9995486dee6b67a9a6ffb0279af3d46cebc480c45a4ecc64e82319b2b96fd351bf503810bb4cc7547521287b55474cfe187f268a988e95e37500_1280.jpg?_wi=2"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
tag="Visit Us"
|
||||
title="Get In Touch"
|
||||
description="Have a large order or a special request? We'd love to hear from you."
|
||||
inputs={[{ name: "name", type: "text", placeholder: "Your Name", required: true }, { name: "email", type: "email", placeholder: "Email Address", required: true }]}
|
||||
textarea={{ name: "message", placeholder: "Your message", rows: 4, required: true }}
|
||||
buttonText="Send Message"
|
||||
imageSrc="https://pixabay.com/get/g883c41e4111d9995486dee6b67a9a6ffb0279af3d46cebc480c45a4ecc64e82319b2b96fd351bf503810bb4cc7547521287b55474cfe187f268a988e95e37500_1280.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMinimal
|
||||
brand="SweetCrumb Bakery"
|
||||
copyright="© 2024 SweetCrumb Bakery. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMinimal
|
||||
brand="SweetCrumb Bakery"
|
||||
copyright="© 2024 SweetCrumb Bakery. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user