Update src/app/page.tsx
This commit is contained in:
377
src/app/page.tsx
377
src/app/page.tsx
@@ -27,278 +27,127 @@ export default function LandingPage() {
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Menu",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Barista's Centre"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Menu", id: "products" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="Barista's Centre"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogo
|
||||
logoText="Barista's Centre"
|
||||
description="Excellence in every cup. Located in the heart of Urbain Nord, we bring you the finest coffee experience."
|
||||
buttons={[
|
||||
{
|
||||
text: "View Menu",
|
||||
href: "#products",
|
||||
},
|
||||
{
|
||||
text: "Visit Us",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/woman-enjoying-cup-cappuccino_23-2148354685.jpg?_wi=1"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogo
|
||||
logoText="Barista's Centre"
|
||||
description="Excellence in every cup. Located in the heart of Urbain Nord, we bring you the finest coffee experience."
|
||||
buttons={[{ text: "View Menu", href: "#products" }, { text: "Visit Us", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/woman-enjoying-cup-cappuccino_23-2148354685.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Our Passion for Coffee"
|
||||
description="Founded with a mission to bring high-quality specialty coffee to the Urbain Nord community. We source only the best beans, roasted to perfection."
|
||||
metrics={[
|
||||
{
|
||||
value: "10+",
|
||||
title: "Coffee Varieties",
|
||||
},
|
||||
{
|
||||
value: "5k+",
|
||||
title: "Happy Customers",
|
||||
},
|
||||
{
|
||||
value: "5",
|
||||
title: "Expert Baristas",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/male-barista-brewing-coffee-alternative-method-pour_176420-55133.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Our Passion for Coffee"
|
||||
description="Founded with a mission to bring high-quality specialty coffee to the Urbain Nord community. We source only the best beans, roasted to perfection."
|
||||
metrics={[{ value: "10+", title: "Coffee Varieties" }, { value: "5k+", title: "Happy Customers" }, { value: "5", title: "Expert Baristas" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/male-barista-brewing-coffee-alternative-method-pour_176420-55133.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardMedia
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Fresh Roast",
|
||||
description: "Locally roasted beans daily.",
|
||||
tag: "Quality",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-beautiful-woman-with-coffee-cup_23-2149708101.jpg",
|
||||
imageAlt: "Low angle beautiful woman with coffee cup",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Expert Baristas",
|
||||
description: "Trained professionals behind every cup.",
|
||||
tag: "Expertise",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-enjoying-cup-cappuccino_23-2148354685.jpg?_wi=2",
|
||||
imageAlt: "Low angle beautiful woman with coffee cup",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Cozy Atmosphere",
|
||||
description: "The perfect urban retreat.",
|
||||
tag: "Ambiance",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/male-barista-brewing-coffee-alternative-method-pour_176420-55133.jpg?_wi=2",
|
||||
imageAlt: "Low angle beautiful woman with coffee cup",
|
||||
},
|
||||
]}
|
||||
title="Why Choose Us"
|
||||
description="We take pride in our process and commitment to excellence."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardMedia
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "f1", title: "Fresh Roast", description: "Locally roasted beans daily.", tag: "Quality", imageSrc: "http://img.b2bpic.net/free-photo/low-angle-beautiful-woman-with-coffee-cup_23-2149708101.jpg", imageAlt: "Low angle beautiful woman with coffee cup" },
|
||||
{ id: "f2", title: "Expert Baristas", description: "Trained professionals behind every cup.", tag: "Expertise", imageSrc: "http://img.b2bpic.net/free-photo/woman-enjoying-cup-cappuccino_23-2148354685.jpg", imageAlt: "Low angle beautiful woman with coffee cup" },
|
||||
{ id: "f3", title: "Cozy Atmosphere", description: "The perfect urban retreat.", tag: "Ambiance", imageSrc: "http://img.b2bpic.net/free-photo/male-barista-brewing-coffee-alternative-method-pour_176420-55133.jpg", imageAlt: "Low angle beautiful woman with coffee cup" }
|
||||
]}
|
||||
title="Why Choose Us"
|
||||
description="We take pride in our process and commitment to excellence."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardThree
|
||||
textboxLayout="split"
|
||||
gridVariant="two-columns-alternating-heights"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Signature Espresso",
|
||||
price: "4.50",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/coffee-cup_74190-96.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Classic Cappuccino",
|
||||
price: "5.50",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photo-tasty-cake-with-glass-cappuccino-focus_197531-6734.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Iced Americano",
|
||||
price: "4.00",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/refreshing-iced-coffee-with-milk-dark-marble_84443-84850.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Latte Macchiato",
|
||||
price: "5.75",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/steamy-black-coffee-rustic-wooden-mug-generated-by-ai_188544-13429.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "House Blend Black",
|
||||
price: "3.50",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-roasted-coffee-beans-lights-with-blurred-edges_181624-14430.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Luxury Mocha",
|
||||
price: "6.00",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-little-yummy-cake-with-sugar-powder-cherries-along-with-milk-coffee-light-desk-fruit-cake-biscuit-sweet-color_140725-30752.jpg",
|
||||
},
|
||||
]}
|
||||
title="Our Signature Drinks"
|
||||
description="Explore our curated coffee menu designed for the true coffee lover."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="two-columns-alternating-heights"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "Signature Espresso", price: "4.50", imageSrc: "http://img.b2bpic.net/free-photo/coffee-cup_74190-96.jpg" },
|
||||
{ id: "p2", name: "Classic Cappuccino", price: "5.50", imageSrc: "http://img.b2bpic.net/free-photo/photo-tasty-cake-with-glass-cappuccino-focus_197531-6734.jpg" },
|
||||
{ id: "p3", name: "Iced Americano", price: "4.00", imageSrc: "http://img.b2bpic.net/free-photo/refreshing-iced-coffee-with-milk-dark-marble_84443-84850.jpg" },
|
||||
{ id: "p4", name: "Latte Macchiato", price: "5.75", imageSrc: "http://img.b2bpic.net/free-photo/steamy-black-coffee-rustic-wooden-mug-generated-by-ai_188544-13429.jpg" },
|
||||
{ id: "p5", name: "House Blend Black", price: "3.50", imageSrc: "http://img.b2bpic.net/free-photo/closeup-roasted-coffee-beans-lights-with-blurred-edges_181624-14430.jpg" },
|
||||
{ id: "p6", name: "Luxury Mocha", price: "6.00", imageSrc: "http://img.b2bpic.net/free-photo/top-view-little-yummy-cake-with-sugar-powder-cherries-along-with-milk-coffee-light-desk-fruit-cake-biscuit-sweet-color_140725-30752.jpg" }
|
||||
]}
|
||||
title="Our Signature Drinks"
|
||||
description="Explore our curated coffee menu designed for the true coffee lover."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah Ahmed",
|
||||
handle: "@sarah",
|
||||
testimonial: "The best espresso in the neighborhood!",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-drinking-coffee-outside-cafe-holding-laptop_1303-18780.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Youssef Ben",
|
||||
handle: "@youssef",
|
||||
testimonial: "Great atmosphere for working and quality coffee.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/thrilled-confident-manager-business-attire-celebrates-victorious-milestone_482257-111932.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Lina Mansour",
|
||||
handle: "@lina",
|
||||
testimonial: "I love the latte art and the friendly staff.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beauty-book-tenderness-cute-chair_1150-1189.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Ahmed Salem",
|
||||
handle: "@ahmed",
|
||||
testimonial: "My morning coffee ritual is incomplete without this spot.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-drinking-coffee_23-2148973383.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Nadia Jaber",
|
||||
handle: "@nadia",
|
||||
testimonial: "Perfect brew every single time.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/girl-is-sitting-cafe-with-cup-coffee-tea-photo-with-shadows_231208-5209.jpg",
|
||||
},
|
||||
]}
|
||||
showRating={true}
|
||||
title="What Our Clients Say"
|
||||
description="Real experiences from our coffee lovers in Urbain Nord."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Sarah Ahmed", handle: "@sarah", testimonial: "The best espresso in the neighborhood!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-drinking-coffee-outside-cafe-holding-laptop_1303-18780.jpg" },
|
||||
{ id: "t2", name: "Youssef Ben", handle: "@youssef", testimonial: "Great atmosphere for working and quality coffee.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/thrilled-confident-manager-business-attire-celebrates-victorious-milestone_482257-111932.jpg" },
|
||||
{ id: "t3", name: "Lina Mansour", handle: "@lina", testimonial: "I love the latte art and the friendly staff.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/beauty-book-tenderness-cute-chair_1150-1189.jpg" },
|
||||
{ id: "t4", name: "Ahmed Salem", handle: "@ahmed", testimonial: "My morning coffee ritual is incomplete without this spot.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-drinking-coffee_23-2148973383.jpg" },
|
||||
{ id: "t5", name: "Nadia Jaber", handle: "@nadia", testimonial: "Perfect brew every single time.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/girl-is-sitting-cafe-with-cup-coffee-tea-photo-with-shadows_231208-5209.jpg" }
|
||||
]}
|
||||
showRating={true}
|
||||
title="What Our Clients Say"
|
||||
description="Real experiences from our coffee lovers in Urbain Nord."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Do you offer vegan milk?",
|
||||
content: "Yes, we offer oat, almond, and soy milk alternatives.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Are you open on weekends?",
|
||||
content: "Yes, we are open seven days a week from 8:00 AM to 10:00 PM.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Do you have free Wi-Fi?",
|
||||
content: "Absolutely, perfect for students and remote workers.",
|
||||
},
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Have questions? We've got answers."
|
||||
faqsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "q1", title: "Do you offer vegan milk?", content: "Yes, we offer oat, almond, and soy milk alternatives." },
|
||||
{ id: "q2", title: "Are you open on weekends?", content: "Yes, we are open seven days a week from 8:00 AM to 10:00 PM." },
|
||||
{ id: "q3", title: "Do you have free Wi-Fi?", content: "Absolutely, perfect for students and remote workers." }
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Have questions? We've got answers."
|
||||
faqsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Visit Us"
|
||||
description="Find us in Centre Urbain Nord, Tunis."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Your Email",
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "How can we help?",
|
||||
rows: 4,
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/exterior-shopfront-city_53876-144723.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Visit Us"
|
||||
description="Find us in Centre Urbain Nord, Tunis."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Your Email", required: true }
|
||||
]}
|
||||
textarea={{ name: "message", placeholder: "How can we help?", rows: 4 }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/exterior-shopfront-city_53876-144723.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Barista's Centre"
|
||||
leftLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Contact Us",
|
||||
href: "#contact",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Barista's Centre"
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "Contact Us", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user