Merge version_1_1776440964010 into main #5
359
src/App.tsx
359
src/App.tsx
@@ -13,208 +13,175 @@ import { Award, Coffee, Flame, Zap } from "lucide-react";
|
||||
export default function App() {
|
||||
return (
|
||||
<>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarCentered
|
||||
logo="Ninja Coffee"
|
||||
navItems={[
|
||||
{
|
||||
name: "About", href: "#about"},
|
||||
{
|
||||
name: "Menu", href: "#menu"},
|
||||
{
|
||||
name: "Contact", href: "#contact"},
|
||||
]}
|
||||
ctaButton={{
|
||||
text: "Order Online", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarCentered
|
||||
logo="Ninja Coffee"
|
||||
navItems={[
|
||||
{ name: "About", href: "#about" },
|
||||
{ name: "Menu", href: "#menu" },
|
||||
{ name: "Contact", href: "#contact" },
|
||||
]}
|
||||
ctaButton={{ text: "Order Online", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
tag="Crafted with passion"
|
||||
title="Welcome to Ninja Coffee"
|
||||
description="Experience the true art of coffee in a cozy, artisanal environment. Every bean, every pour, every cup is crafted for perfection."
|
||||
primaryButton={{
|
||||
text: "Our Menu", href: "#menu"}}
|
||||
secondaryButton={{
|
||||
text: "Visit Us", href: "#contact"}}
|
||||
items={[
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=r5j7ws" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9a3s25" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=obojvl" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=q60h3l" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=bk92pa" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=au7kpw" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
tag="Crafted with passion"
|
||||
title="Welcome to Ninja Coffee"
|
||||
description="Experience the true art of coffee in a cozy, artisanal environment. Every bean, every pour, every cup is crafted for perfection."
|
||||
primaryButton={{ text: "Our Menu", href: "#menu" }}
|
||||
secondaryButton={{ text: "Visit Us", href: "#contact" }}
|
||||
items={[
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=r5j7ws" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9a3s25" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=obojvl" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=q60h3l" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=bk92pa" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=au7kpw" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutFeaturesSplit
|
||||
tag="Our Story"
|
||||
title="Craftsmanship in every cup"
|
||||
description="Ninja Coffee was born from a love of exceptional beans and precision brewing. We believe coffee is more than just a drink; it's a daily ritual of peace and inspiration."
|
||||
items={[
|
||||
{
|
||||
icon: Coffee,
|
||||
title: "Ethical Sourcing", description: "We partner directly with farmers to ensure fair trade and exceptional quality."},
|
||||
{
|
||||
icon: Flame,
|
||||
title: "Small-Batch Roast", description: "We roast our beans in small batches to preserve nuanced flavor profiles."},
|
||||
{
|
||||
icon: Flame,
|
||||
title: "Expert Brewing", description: "Our baristas are masters of their craft, ensuring consistent quality."},
|
||||
]}
|
||||
imageSrc={{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=h64lby" }}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<AboutFeaturesSplit
|
||||
tag="Our Story"
|
||||
title="Craftsmanship in every cup"
|
||||
description="Ninja Coffee was born from a love of exceptional beans and precision brewing. We believe coffee is more than just a drink; it's a daily ritual of peace and inspiration."
|
||||
items={[
|
||||
{ icon: Coffee, title: "Ethical Sourcing", description: "We partner directly with farmers to ensure fair trade and exceptional quality." },
|
||||
{ icon: Flame, title: "Small-Batch Roast", description: "We roast our beans in small batches to preserve nuanced flavor profiles." },
|
||||
{ icon: Flame, title: "Expert Brewing", description: "Our baristas are masters of their craft, ensuring consistent quality." },
|
||||
]}
|
||||
imageSrc={{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=h64lby" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeaturesDualMedia
|
||||
tag="The Ninja Experience"
|
||||
title="Why choose our coffee?"
|
||||
description="From bean to brew, we maintain the highest standards of quality and service."
|
||||
items={[
|
||||
{
|
||||
icon: Award,
|
||||
title: "Premium Beans", description: "Sourced from the best high-altitude farms across the globe.", mediaItems: [
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ui0w58" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=c0xlcr" },
|
||||
],
|
||||
},
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Perfect Extraction", description: "Precision temperature control and pressure for every single cup.", mediaItems: [
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=lwn8zy" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=338kv8" },
|
||||
],
|
||||
},
|
||||
{
|
||||
icon: Coffee,
|
||||
title: "Cozy Atmosphere", description: "A welcoming space designed for reading, working, or simply relaxing.", mediaItems: [
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=r3wn72" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=aab9f7" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="menu" data-section="menu">
|
||||
<PricingSplitCards
|
||||
tag="Our Menu"
|
||||
title="Artisanal Selection"
|
||||
description="Discover our signature brews and delightful treats."
|
||||
plans={[
|
||||
{
|
||||
tag: "Signature", price: "$4.50", period: "cup", description: "Classic house blend pour-over", primaryButton: {
|
||||
text: "Select", href: "#"},
|
||||
featuresTitle: "Included", features: [
|
||||
"Freshly roasted", "Single origin", "Organic"],
|
||||
},
|
||||
{
|
||||
tag: "Premium", price: "$5.50", period: "cup", description: "Nitro cold brew served with house syrup", primaryButton: {
|
||||
text: "Select", href: "#"},
|
||||
featuresTitle: "Included", features: [
|
||||
"Cold extracted", "Nitro infused", "Small batch"],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialTrustCard
|
||||
quote="Ninja Coffee is my morning sanctuary. The coffee is unmatched, and the staff are true artists."
|
||||
rating={5}
|
||||
author="Emily Carter"
|
||||
avatars={[
|
||||
{
|
||||
name: "User 1", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9ykgp6"},
|
||||
{
|
||||
name: "User 2", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=13ioax"},
|
||||
{
|
||||
name: "User 3", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=g1hyn5"},
|
||||
{
|
||||
name: "User 4", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=tge3lr"},
|
||||
{
|
||||
name: "User 5", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=gna8a4"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricsMinimalCards
|
||||
tag="Our Growth"
|
||||
title="Serving quality since 2015"
|
||||
metrics={[
|
||||
{
|
||||
value: "150k+", description: "Cups of coffee poured"},
|
||||
{
|
||||
value: "25+", description: "Single-origin beans sourced"},
|
||||
{
|
||||
value: "12", description: "Awards for brewing excellence"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSimple
|
||||
tag="Common Questions"
|
||||
title="Frequently Asked"
|
||||
description="Everything you need to know about our beans and shop."
|
||||
items={[
|
||||
{
|
||||
question: "Do you offer vegan milk options?", answer: "Yes, we offer almond, oat, and soy milk for all our coffee beverages."},
|
||||
{
|
||||
question: "Can I buy beans online?", answer: "Absolutely! Visit our online store to have your favorite blends shipped to your home."},
|
||||
{
|
||||
question: "Are you open on weekends?", answer: "Yes, we are open seven days a week, from 7am to 7pm."},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitEmail
|
||||
tag="Visit Us"
|
||||
title="Let's stay connected"
|
||||
description="Subscribe for updates on seasonal beans and brewing workshops."
|
||||
inputPlaceholder="Enter your email"
|
||||
buttonText="Subscribe"
|
||||
imageSrc={{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=2m6kja" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimpleMedia
|
||||
brand="Ninja Coffee"
|
||||
columns={[
|
||||
{
|
||||
title: "Products", items: [
|
||||
<div id="features" data-section="features">
|
||||
<FeaturesDualMedia
|
||||
tag="The Ninja Experience"
|
||||
title="Why choose our coffee?"
|
||||
description="From bean to brew, we maintain the highest standards of quality and service."
|
||||
items={[
|
||||
{
|
||||
label: "House Blend", href: "#"},
|
||||
icon: Award,
|
||||
title: "Premium Beans", description: "Sourced from the best high-altitude farms across the globe.", mediaItems: [
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ui0w58" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=c0xlcr" },
|
||||
],
|
||||
},
|
||||
{
|
||||
label: "Single Origin", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "About", items: [
|
||||
icon: Zap,
|
||||
title: "Perfect Extraction", description: "Precision temperature control and pressure for every single cup.", mediaItems: [
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=lwn8zy" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=338kv8" },
|
||||
],
|
||||
},
|
||||
{
|
||||
label: "Our Story", href: "#about"},
|
||||
icon: Coffee,
|
||||
title: "Cozy Atmosphere", description: "A welcoming space designed for reading, working, or simply relaxing.", mediaItems: [
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=r3wn72" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=aab9f7" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="menu" data-section="menu">
|
||||
<PricingSplitCards
|
||||
tag="Our Menu"
|
||||
title="Artisanal Selection"
|
||||
description="Discover our signature brews and delightful treats."
|
||||
plans={[
|
||||
{
|
||||
label: "Locations", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyright="© 2024 Ninja Coffee. All rights reserved."
|
||||
links={[
|
||||
{
|
||||
label: "Privacy Policy", href: "#"},
|
||||
{
|
||||
label: "Terms of Service", href: "#"},
|
||||
]}
|
||||
imageSrc={{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=43uk9y" }}
|
||||
/>
|
||||
</div>
|
||||
tag: "Signature", price: "$4.50", period: "cup", description: "Classic house blend pour-over", primaryButton: { text: "Select", href: "#" },
|
||||
featuresTitle: "Included", features: ["Freshly roasted", "Single origin", "Organic"],
|
||||
},
|
||||
{
|
||||
tag: "Premium", price: "$5.50", period: "cup", description: "Nitro cold brew served with house syrup", primaryButton: { text: "Select", href: "#" },
|
||||
featuresTitle: "Included", features: ["Cold extracted", "Nitro infused", "Small batch"],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialTrustCard
|
||||
quote="Ninja Coffee is my morning sanctuary. The coffee is unmatched, and the staff are true artists."
|
||||
rating={5}
|
||||
author="Emily Carter"
|
||||
avatars={[
|
||||
{ name: "User 1", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9ykgp6" },
|
||||
{ name: "User 2", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=13ioax" },
|
||||
{ name: "User 3", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=g1hyn5" },
|
||||
{ name: "User 4", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=tge3lr" },
|
||||
{ name: "User 5", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=gna8a4" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricsMinimalCards
|
||||
tag="Our Growth"
|
||||
title="Serving quality since 2015"
|
||||
metrics={[
|
||||
{ value: "150k+", description: "Cups of coffee poured" },
|
||||
{ value: "25+", description: "Single-origin beans sourced" },
|
||||
{ value: "12", description: "Awards for brewing excellence" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSimple
|
||||
tag="Common Questions"
|
||||
title="Frequently Asked"
|
||||
description="Everything you need to know about our beans and shop."
|
||||
items={[
|
||||
{ question: "Do you offer vegan milk options?", answer: "Yes, we offer almond, oat, and soy milk for all our coffee beverages." },
|
||||
{ question: "Can I buy beans online?", answer: "Absolutely! Visit our online store to have your favorite blends shipped to your home." },
|
||||
{ question: "Are you open on weekends?", answer: "Yes, we are open seven days a week, from 7am to 7pm." },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitEmail
|
||||
tag="Visit Us"
|
||||
title="Let's stay connected"
|
||||
description="Subscribe for updates on seasonal beans and brewing workshops."
|
||||
inputPlaceholder="Enter your email"
|
||||
buttonText="Subscribe"
|
||||
imageSrc={{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=2m6kja" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimpleMedia
|
||||
brand="Ninja Coffee"
|
||||
columns={[
|
||||
{
|
||||
title: "Products", items: [
|
||||
{ label: "House Blend", href: "#" },
|
||||
{ label: "Single Origin", href: "#" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "About", items: [
|
||||
{ label: "Our Story", href: "#about" },
|
||||
{ label: "Locations", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyright="© 2024 Ninja Coffee. All rights reserved."
|
||||
links={[
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
]}
|
||||
imageSrc={{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=43uk9y" }}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user