Merge version_1_1776941413428 into main #2
393
src/App.tsx
393
src/App.tsx
@@ -13,279 +13,144 @@ import { Coffee, Facebook, Heart, Instagram, Twitter, Zap } from "lucide-react";
|
||||
export default function App() {
|
||||
return (
|
||||
<>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarCentered
|
||||
logo="Coco Coffee"
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
name: "Menu",
|
||||
href: "#menu",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
ctaButton={{
|
||||
text: "Visit Us",
|
||||
href: "#contact",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarCentered
|
||||
logo="Coco Coffee"
|
||||
navItems={[
|
||||
{ name: "About", href: "#about" },
|
||||
{ name: "Menu", href: "#menu" },
|
||||
{ name: "Contact", href: "#contact" },
|
||||
]}
|
||||
ctaButton={{
|
||||
text: "Visit Us", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCenteredLogos
|
||||
tag="Since 2024"
|
||||
title="Crafted with love, served with care."
|
||||
description="Experience the perfect blend of luxury and warmth at Coco. Our beans are sourced ethically and brewed to perfection."
|
||||
primaryButton={{
|
||||
text: "View Menu",
|
||||
href: "#menu",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Our Story",
|
||||
href: "#about",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCenteredLogos
|
||||
tag="Since 2024"
|
||||
title="Crafted with love, served with care."
|
||||
description="Experience the perfect blend of luxury and warmth at Coco. Our beans are sourced ethically and brewed to perfection."
|
||||
primaryButton={{
|
||||
text: "View Menu", href: "#menu"}}
|
||||
secondaryButton={{
|
||||
text: "Our Story", href: "#about"}}
|
||||
logos={[]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutFeaturesSplit
|
||||
tag="Our Philosophy"
|
||||
title="More than just a cup of coffee"
|
||||
description="We believe in community, quality, and a touch of magic. Every cup of Coco tells a story."
|
||||
items={[
|
||||
{
|
||||
icon: Coffee,
|
||||
title: "Sustainably Sourced",
|
||||
description: "Working directly with farmers to ensure fair trade.",
|
||||
},
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Precision Brewing",
|
||||
description: "Technique matters. Our baristas are master artisans.",
|
||||
},
|
||||
{
|
||||
icon: Heart,
|
||||
title: "Inclusive Space",
|
||||
description: "A home for everyone in the neighborhood.",
|
||||
},
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=832x7z"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<AboutFeaturesSplit
|
||||
tag="Our Philosophy"
|
||||
title="More than just a cup of coffee"
|
||||
description="We believe in community, quality, and a touch of magic. Every cup of Coco tells a story."
|
||||
items={[
|
||||
{ icon: "Coffee", title: "Sustainably Sourced", description: "Working directly with farmers to ensure fair trade." },
|
||||
{ icon: "Zap", title: "Precision Brewing", description: "Technique matters. Our baristas are master artisans." },
|
||||
{ icon: "Heart", title: "Inclusive Space", description: "A home for everyone in the neighborhood." },
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=832x7z"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeaturesFlipCards
|
||||
tag="The Coco Difference"
|
||||
title="Why we are different"
|
||||
description="Exquisite details that make every visit memorable."
|
||||
items={[
|
||||
{
|
||||
title: "Fresh Roasts",
|
||||
descriptions: [
|
||||
"Roasted daily on-site.",
|
||||
"Maximum freshness guaranteed.",
|
||||
],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=09ve0c&_wi=1",
|
||||
},
|
||||
{
|
||||
title: "Artisanal Pastries",
|
||||
descriptions: [
|
||||
"Baked fresh every morning.",
|
||||
"Perfect pair for your brew.",
|
||||
],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=mypzdm&_wi=1",
|
||||
},
|
||||
{
|
||||
title: "Cozy Atmosphere",
|
||||
descriptions: [
|
||||
"Warm lights and quiet corners.",
|
||||
"The ideal place to work.",
|
||||
],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=q370ow&_wi=1",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeaturesFlipCards
|
||||
tag="The Coco Difference"
|
||||
title="Why we are different"
|
||||
description="Exquisite details that make every visit memorable."
|
||||
items={[
|
||||
{
|
||||
title: "Fresh Roasts", descriptions: ["Roasted daily on-site.", "Maximum freshness guaranteed."],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=09ve0c"},
|
||||
{
|
||||
title: "Artisanal Pastries", descriptions: ["Baked fresh every morning.", "Perfect pair for your brew."],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=mypzdm"},
|
||||
{
|
||||
title: "Cozy Atmosphere", descriptions: ["Warm lights and quiet corners.", "The ideal place to work."],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=q370ow"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="menu" data-section="menu">
|
||||
<ProductRatingCards
|
||||
tag="Our Menu"
|
||||
title="Signature Brews"
|
||||
description="Our most popular selections, crafted for every palate."
|
||||
products={[
|
||||
{
|
||||
brand: "Coco",
|
||||
name: "Signature Cold Brew",
|
||||
price: "$5.00",
|
||||
rating: 5,
|
||||
reviewCount: "120",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=09ve0c&_wi=2",
|
||||
},
|
||||
{
|
||||
brand: "Coco",
|
||||
name: "Creamy Lavender Latte",
|
||||
price: "$6.50",
|
||||
rating: 5,
|
||||
reviewCount: "85",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=mypzdm&_wi=2",
|
||||
},
|
||||
{
|
||||
brand: "Coco",
|
||||
name: "Classic Espresso",
|
||||
price: "$3.50",
|
||||
rating: 4,
|
||||
reviewCount: "200",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=q370ow&_wi=2",
|
||||
},
|
||||
{
|
||||
brand: "Coco",
|
||||
name: "Coco Mocha",
|
||||
price: "$5.50",
|
||||
rating: 5,
|
||||
reviewCount: "95",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=vletjv",
|
||||
},
|
||||
{
|
||||
brand: "Coco",
|
||||
name: "Iced Vanilla Latte",
|
||||
price: "$5.75",
|
||||
rating: 4,
|
||||
reviewCount: "60",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=s4cy2f",
|
||||
},
|
||||
{
|
||||
brand: "Coco",
|
||||
name: "Hand-Pour Over",
|
||||
price: "$7.00",
|
||||
rating: 5,
|
||||
reviewCount: "40",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5iuhfr",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="menu" data-section="menu">
|
||||
<ProductRatingCards
|
||||
tag="Our Menu"
|
||||
title="Signature Brews"
|
||||
description="Our most popular selections, crafted for every palate."
|
||||
products={[
|
||||
{ brand: "Coco", name: "Signature Cold Brew", price: "$5.00", rating: 5, reviewCount: "120", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=09ve0c" },
|
||||
{ brand: "Coco", name: "Creamy Lavender Latte", price: "$6.50", rating: 5, reviewCount: "85", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=mypzdm" },
|
||||
{ brand: "Coco", name: "Classic Espresso", price: "$3.50", rating: 4, reviewCount: "200", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=q370ow" },
|
||||
{ brand: "Coco", name: "Coco Mocha", price: "$5.50", rating: 5, reviewCount: "95", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=vletjv" },
|
||||
{ brand: "Coco", name: "Iced Vanilla Latte", price: "$5.75", rating: 4, reviewCount: "60", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=s4cy2f" },
|
||||
{ brand: "Coco", name: "Hand-Pour Over", price: "$7.00", rating: 5, reviewCount: "40", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5iuhfr" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricsMinimalCards
|
||||
tag="By the Numbers"
|
||||
metrics={[
|
||||
{
|
||||
value: "10k+",
|
||||
description: "Cups Served",
|
||||
},
|
||||
{
|
||||
value: "15",
|
||||
description: "Local Farmers",
|
||||
},
|
||||
{
|
||||
value: "5",
|
||||
description: "Years of Passion",
|
||||
},
|
||||
]}
|
||||
title="Our Impact"
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricsMinimalCards
|
||||
tag="By the Numbers"
|
||||
metrics={[
|
||||
{ value: "10k+", description: "Cups Served" },
|
||||
{ value: "15", description: "Local Farmers" },
|
||||
{ value: "5", description: "Years of Passion" },
|
||||
]}
|
||||
title="Our Impact"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialQuoteCards
|
||||
tag="Loved by locals"
|
||||
title="What our customers say"
|
||||
description="See why Coco is the heart of the morning."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Sarah J.",
|
||||
role: "Designer",
|
||||
quote: "The best lavender latte I've ever had!",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=t9tmto",
|
||||
},
|
||||
{
|
||||
name: "Mark D.",
|
||||
role: "Architect",
|
||||
quote: "Perfect atmosphere for getting my morning work done.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z6iemj",
|
||||
},
|
||||
{
|
||||
name: "Emily R.",
|
||||
role: "Artist",
|
||||
quote: "Coco is my happy place, every single day.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=s0ypxy",
|
||||
},
|
||||
{
|
||||
name: "David W.",
|
||||
role: "Writer",
|
||||
quote: "Exceptional coffee, even better staff.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=4nkwg1",
|
||||
},
|
||||
{
|
||||
name: "Jessica L.",
|
||||
role: "Teacher",
|
||||
quote: "A true community gem in our area.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9jasjb",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialQuoteCards
|
||||
tag="Loved by locals"
|
||||
title="What our customers say"
|
||||
description="See why Coco is the heart of the morning."
|
||||
testimonials={[
|
||||
{ name: "Sarah J.", role: "Designer", quote: "The best lavender latte I've ever had!", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=t9tmto" },
|
||||
{ name: "Mark D.", role: "Architect", quote: "Perfect atmosphere for getting my morning work done.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z6iemj" },
|
||||
{ name: "Emily R.", role: "Artist", quote: "Coco is my happy place, every single day.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=s0ypxy" },
|
||||
{ name: "David W.", role: "Writer", quote: "Exceptional coffee, even better staff.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=4nkwg1" },
|
||||
{ name: "Jessica L.", role: "Teacher", quote: "A true community gem in our area.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9jasjb" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
tag="Questions?"
|
||||
title="We've got answers"
|
||||
description="Common inquiries about our roasting and shop process."
|
||||
items={[
|
||||
{
|
||||
question: "Are you dog friendly?",
|
||||
answer: "Absolutely! We love welcoming furry friends.",
|
||||
},
|
||||
{
|
||||
question: "Do you offer oat milk?",
|
||||
answer: "Yes, we have a variety of plant-based milks.",
|
||||
},
|
||||
{
|
||||
question: "Can I host an event here?",
|
||||
answer: "Contact us to discuss our space rental options.",
|
||||
},
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=rdpno8"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
tag="Questions?"
|
||||
title="We've got answers"
|
||||
description="Common inquiries about our roasting and shop process."
|
||||
items={[
|
||||
{ question: "Are you dog friendly?", answer: "Absolutely! We love welcoming furry friends." },
|
||||
{ question: "Do you offer oat milk?", answer: "Yes, we have a variety of plant-based milks." },
|
||||
{ question: "Can I host an event here?", answer: "Contact us to discuss our space rental options." },
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=rdpno8"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitEmail
|
||||
tag="Get in touch"
|
||||
title="Visit us today"
|
||||
description="Subscribe for special weekly offers and news."
|
||||
inputPlaceholder="Enter your email"
|
||||
buttonText="Subscribe"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=netoj0"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitEmail
|
||||
tag="Get in touch"
|
||||
title="Visit us today"
|
||||
description="Subscribe for special weekly offers and news."
|
||||
inputPlaceholder="Enter your email"
|
||||
buttonText="Subscribe"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=netoj0"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMinimal
|
||||
brand="Coco Coffee"
|
||||
copyright="© 2024 Coco Coffee. All rights reserved."
|
||||
socialLinks={[
|
||||
{
|
||||
icon: Instagram,
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
icon: Twitter,
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
icon: Facebook,
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMinimal
|
||||
brand="Coco Coffee"
|
||||
copyright="© 2024 Coco Coffee. All rights reserved."
|
||||
socialLinks={[
|
||||
{ icon: "Instagram", href: "#" },
|
||||
{ icon: "Twitter", href: "#" },
|
||||
{ icon: "Facebook", href: "#" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user