Merge version_1_1776350641361 into main #1
346
src/App.tsx
346
src/App.tsx
@@ -12,248 +12,122 @@ import { Award, Coffee, Users } from "lucide-react";
|
||||
export default function App() {
|
||||
return (
|
||||
<>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarCentered
|
||||
logo="Likola"
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Features",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
ctaButton={{
|
||||
text: "Order Now",
|
||||
href: "#contact",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarCentered
|
||||
logo="Likola"
|
||||
navItems={[
|
||||
{ name: "About", href: "#about" },
|
||||
{ name: "Features", href: "#features" },
|
||||
{ name: "Contact", href: "#contact" },
|
||||
]}
|
||||
ctaButton={{
|
||||
text: "Order Now", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplit
|
||||
tag="Crafted with Passion"
|
||||
title="Welcome to Likola Coffee"
|
||||
description="Experience the authentic taste of artisan roasted coffee, sourced ethically and brewed to perfection for your daily journey."
|
||||
primaryButton={{
|
||||
text: "Discover Our Menu",
|
||||
href: "#features",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Visit Us",
|
||||
href: "#contact",
|
||||
}}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=baxj6q"
|
||||
imageAlt="fresh artisan coffee beans dark roast"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplit
|
||||
tag="Crafted with Passion"
|
||||
title="Welcome to Likola Coffee"
|
||||
description="Experience the authentic taste of artisan roasted coffee, sourced ethically and brewed to perfection for your daily journey."
|
||||
primaryButton={{ text: "Discover Our Menu", href: "#features" }}
|
||||
secondaryButton={{ text: "Visit Us", href: "#contact" }}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=baxj6q"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMediaOverlay
|
||||
tag="Our Story"
|
||||
title="From Seed to Your Cup"
|
||||
description="Likola was born from a simple desire to share the finest specialty coffees from around the world. We partner with small-scale farmers to ensure every cup supports sustainable livelihoods."
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=853aqu"
|
||||
imageAlt="organic coffee plantation morning light"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<AboutMediaOverlay
|
||||
tag="Our Story"
|
||||
title="From Seed to Your Cup"
|
||||
description="Likola was born from a simple desire to share the finest specialty coffees from around the world. We partner with small-scale farmers to ensure every cup supports sustainable livelihoods."
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=853aqu"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeaturesFlipCards
|
||||
tag="Our Speciality"
|
||||
title="Why Choose Likola?"
|
||||
description="We take pride in our process, from careful sourcing to precision brewing, ensuring the best flavor profiles in every batch."
|
||||
items={[
|
||||
{
|
||||
title: "Premium Sourcing",
|
||||
descriptions: [
|
||||
"High-altitude coffee cherries.",
|
||||
"Ethical direct trade partners.",
|
||||
"Strict quality control at origin.",
|
||||
],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=xtutky",
|
||||
},
|
||||
{
|
||||
title: "Precision Roasting",
|
||||
descriptions: [
|
||||
"Small-batch artisan techniques.",
|
||||
"Temperature-controlled precision.",
|
||||
"Flavor-focused roast profiles.",
|
||||
],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=0dbump",
|
||||
},
|
||||
{
|
||||
title: "Sustainable Future",
|
||||
descriptions: [
|
||||
"Eco-friendly packaging options.",
|
||||
"Support for local farmer communities.",
|
||||
"Compostable waste practices.",
|
||||
],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=a43jqo",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricsGradientCards
|
||||
tag="Our Impact"
|
||||
title="Coffee by the Numbers"
|
||||
description="Our commitment to excellence and community transparency."
|
||||
metrics={[
|
||||
{
|
||||
value: "15K+",
|
||||
title: "Cups Served",
|
||||
description: "Happy coffee lovers served daily.",
|
||||
icon: Coffee,
|
||||
},
|
||||
{
|
||||
value: "20+",
|
||||
title: "Farmers Supported",
|
||||
description: "Direct trade partnerships active.",
|
||||
icon: Users,
|
||||
},
|
||||
{
|
||||
value: "5",
|
||||
title: "Awards Won",
|
||||
description: "Recognized for quality standards.",
|
||||
icon: Award,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialDetailedCards
|
||||
tag="Reviews"
|
||||
title="What Our Community Says"
|
||||
description="Hear stories from our loyal coffee family."
|
||||
testimonials={[
|
||||
{
|
||||
title: "Amazing Roast",
|
||||
quote: "The best espresso I have had in years. The flavor profile is incredibly balanced.",
|
||||
name: "Alice M.",
|
||||
role: "Coffee Enthusiast",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=f4xsq7",
|
||||
},
|
||||
{
|
||||
title: "Morning Essential",
|
||||
quote: "Likola has become my go-to spot every morning. The staff is always so welcoming.",
|
||||
name: "Robert B.",
|
||||
role: "Creative Writer",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8athad",
|
||||
},
|
||||
{
|
||||
title: "Great Quality",
|
||||
quote: "I appreciate the ethical sourcing and the consistent roast quality every time.",
|
||||
name: "Sarah L.",
|
||||
role: "Marketing Manager",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qk9t6z",
|
||||
},
|
||||
{
|
||||
title: "Perfect Atmosphere",
|
||||
quote: "The shop is beautiful and the coffee is even better. A true local gem.",
|
||||
name: "David K.",
|
||||
role: "Software Developer",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7swpue",
|
||||
},
|
||||
{
|
||||
title: "Ethical Choice",
|
||||
quote: "Knowing my coffee is sustainably sourced makes every sip even better.",
|
||||
name: "Elena V.",
|
||||
role: "Graphic Designer",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=tikmsr",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
tag="Support"
|
||||
title="Frequently Asked Questions"
|
||||
description="Curious about our processes or sourcing? Find your answers here."
|
||||
items={[
|
||||
{
|
||||
question: "Where do you source your beans?",
|
||||
answer: "We work directly with farmers in Ethiopia, Colombia, and Indonesia to get the best beans.",
|
||||
},
|
||||
{
|
||||
question: "Are your bags recyclable?",
|
||||
answer: "Yes, our new packaging range is fully compostable and environmentally conscious.",
|
||||
},
|
||||
{
|
||||
question: "Do you offer wholesale?",
|
||||
answer: "Yes, we partner with cafes and businesses. Please reach out via our contact form.",
|
||||
},
|
||||
{
|
||||
question: "Can I buy beans online?",
|
||||
answer: "We are launching our online store next month, stay tuned for updates.",
|
||||
},
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=v97jmb"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitEmail
|
||||
tag="Stay Updated"
|
||||
title="Join the Likola Newsletter"
|
||||
description="Receive news about new roasts, events, and community updates directly in your inbox."
|
||||
inputPlaceholder="enter your email address..."
|
||||
buttonText="Subscribe"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=nxpkxb"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBasic
|
||||
columns={[
|
||||
{
|
||||
title: "Likola Coffee",
|
||||
items: [
|
||||
<div id="features" data-section="features">
|
||||
<FeaturesFlipCards
|
||||
tag="Our Speciality"
|
||||
title="Why Choose Likola?"
|
||||
description="We take pride in our process, from careful sourcing to precision brewing, ensuring the best flavor profiles in every batch."
|
||||
items={[
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
title: "Premium Sourcing", descriptions: ["High-altitude coffee cherries.", "Ethical direct trade partners.", "Strict quality control at origin."],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=xtutky"},
|
||||
{
|
||||
label: "Our Process",
|
||||
href: "#features",
|
||||
},
|
||||
title: "Precision Roasting", descriptions: ["Small-batch artisan techniques.", "Temperature-controlled precision.", "Flavor-focused roast profiles."],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=0dbump"},
|
||||
{
|
||||
label: "Community",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Social",
|
||||
items: [
|
||||
{
|
||||
label: "Instagram",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Facebook",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Twitter",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
leftText="© 2024 Likola Coffee. All rights reserved."
|
||||
rightText="Crafted with care."
|
||||
/>
|
||||
</div>
|
||||
title: "Sustainable Future", descriptions: ["Eco-friendly packaging options.", "Support for local farmer communities.", "Compostable waste practices."],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=a43jqo"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricsGradientCards
|
||||
tag="Our Impact"
|
||||
title="Coffee by the Numbers"
|
||||
description="Our commitment to excellence and community transparency."
|
||||
metrics={[
|
||||
{ value: "15K+", title: "Cups Served", description: "Happy coffee lovers served daily.", icon: Coffee },
|
||||
{ value: "20+", title: "Farmers Supported", description: "Direct trade partnerships active.", icon: Users },
|
||||
{ value: "5", title: "Awards Won", description: "Recognized for quality standards.", icon: Award },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialDetailedCards
|
||||
tag="Reviews"
|
||||
title="What Our Community Says"
|
||||
description="Hear stories from our loyal coffee family."
|
||||
testimonials={[
|
||||
{ title: "Amazing Roast", quote: "The best espresso I have had in years. The flavor profile is incredibly balanced.", name: "Alice M.", role: "Coffee Enthusiast", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=f4xsq7" },
|
||||
{ title: "Morning Essential", quote: "Likola has become my go-to spot every morning. The staff is always so welcoming.", name: "Robert B.", role: "Creative Writer", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8athad" },
|
||||
{ title: "Great Quality", quote: "I appreciate the ethical sourcing and the consistent roast quality every time.", name: "Sarah L.", role: "Marketing Manager", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qk9t6z" },
|
||||
{ title: "Perfect Atmosphere", quote: "The shop is beautiful and the coffee is even better. A true local gem.", name: "David K.", role: "Software Developer", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7swpue" },
|
||||
{ title: "Ethical Choice", quote: "Knowing my coffee is sustainably sourced makes every sip even better.", name: "Elena V.", role: "Graphic Designer", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=tikmsr" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
tag="Support"
|
||||
title="Frequently Asked Questions"
|
||||
description="Curious about our processes or sourcing? Find your answers here."
|
||||
items={[
|
||||
{ question: "Where do you source your beans?", answer: "We work directly with farmers in Ethiopia, Colombia, and Indonesia to get the best beans." },
|
||||
{ question: "Are your bags recyclable?", answer: "Yes, our new packaging range is fully compostable and environmentally conscious." },
|
||||
{ question: "Do you offer wholesale?", answer: "Yes, we partner with cafes and businesses. Please reach out via our contact form." },
|
||||
{ question: "Can I buy beans online?", answer: "We are launching our online store next month, stay tuned for updates." },
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=v97jmb"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitEmail
|
||||
tag="Stay Updated"
|
||||
title="Join the Likola Newsletter"
|
||||
description="Receive news about new roasts, events, and community updates directly in your inbox."
|
||||
inputPlaceholder="enter your email address..."
|
||||
buttonText="Subscribe"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=nxpkxb"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBasic
|
||||
columns={[
|
||||
{ title: "Likola Coffee", items: [{ label: "About Us", href: "#about" }, { label: "Our Process", href: "#features" }, { label: "Community", href: "#" }] },
|
||||
{ title: "Social", items: [{ label: "Instagram", href: "#" }, { label: "Facebook", href: "#" }, { label: "Twitter", href: "#" }] },
|
||||
]}
|
||||
leftText="© 2024 Likola Coffee. All rights reserved."
|
||||
rightText="Crafted with care."
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user