Merge version_2 into main #2
265
src/app/page.tsx
265
src/app/page.tsx
@@ -31,22 +31,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Menu",
|
||||
id: "#menu",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "#testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Menu", id: "#menu" },
|
||||
{ name: "Testimonials", id: "#testimonials" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="Mila Cafe"
|
||||
/>
|
||||
@@ -54,20 +42,12 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
background={{ variant: "plain" }}
|
||||
logoText="Mila Cafe"
|
||||
description="Artisanal coffee and warm pastries in the heart of the city. Join us for a moment of peace."
|
||||
description="Modern Minimalist, Warm Welcoming, and Clean Layout design style for your morning coffee."
|
||||
buttons={[
|
||||
{
|
||||
text: "Explore Menu",
|
||||
href: "#menu",
|
||||
},
|
||||
{
|
||||
text: "Visit Us",
|
||||
href: "#contact",
|
||||
},
|
||||
{ text: "Explore Menu", href: "#menu" },
|
||||
{ text: "Contact Us", href: "#contact" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/dreamy-stylish-girl-with-blonde-hair-pink-lips-sitting-coffee-shop-with-wooden-chairs-table-she-holds-cup-cofee-touches-her-hair_197531-102.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
@@ -77,8 +57,8 @@ export default function LandingPage() {
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Our Story"
|
||||
description="Started in 2015, Mila Cafe brings the finest roast to your cup. We prioritize sustainable sourcing and hand-crafted techniques."
|
||||
title="About Our Space"
|
||||
description="Welcome to Mila Cafe. We believe in minimalist design and the finest coffee culture to create a warm, welcoming experience for everyone."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-barista-with-coffee-beans_23-2148865559.jpg?_wi=1"
|
||||
/>
|
||||
</div>
|
||||
@@ -90,211 +70,71 @@ export default function LandingPage() {
|
||||
gridVariant="two-columns-alternating-heights"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Classic Croissant",
|
||||
price: "$4.50",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-enjoying-cup-hot-coffee-cafe_53876-88441.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Almond Danish",
|
||||
price: "$5.00",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fresh-baked-butter-croissants-display-cafe_53876-121720.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Single Origin Pour Over",
|
||||
price: "$6.00",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-enjoying-food_23-2149304458.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Iced Oat Milk Latte",
|
||||
price: "$6.50",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/iced-cappuccino_1339-1610.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Lemon Poppyseed Cake",
|
||||
price: "$5.50",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-delicious-sweets-plate_23-2149192047.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Cappuccino",
|
||||
price: "$5.00",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/bar-still-life-with-cakes-table_23-2147821330.jpg",
|
||||
},
|
||||
{ id: "p1", name: "Classic Croissant", price: "$4.50", imageSrc: "http://img.b2bpic.net/free-photo/man-enjoying-cup-hot-coffee-cafe_53876-88441.jpg?_wi=1" },
|
||||
{ id: "p2", name: "Almond Danish", price: "$5.00", imageSrc: "http://img.b2bpic.net/free-photo/fresh-baked-butter-croissants-display-cafe_53876-121720.jpg?_wi=1" },
|
||||
{ id: "p3", name: "Pour Over", price: "$6.00", imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-enjoying-food_23-2149304458.jpg?_wi=1" },
|
||||
{ id: "p4", name: "Oat Latte", price: "$6.50", imageSrc: "http://img.b2bpic.net/free-photo/iced-cappuccino_1339-1610.jpg" }
|
||||
]}
|
||||
title="Our Menu"
|
||||
description="Delicious coffee and house-made pastries."
|
||||
title="Menu"
|
||||
description="Our artisanal selection."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Alice M.",
|
||||
date: "Oct 2024",
|
||||
title: "Coffee Lover",
|
||||
quote: "The best cortado I've had in the city.",
|
||||
tag: "Regular",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-asian-woman-apron-barista-giving-you-cup-coffee-working-cafe-serving_1258-199256.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/dreamy-stylish-girl-with-blonde-hair-pink-lips-sitting-coffee-shop-with-wooden-chairs-table-she-holds-cup-cofee-touches-her-hair_197531-102.jpg?_wi=2",
|
||||
imageAlt: "happy customer drinking coffee",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Ben T.",
|
||||
date: "Sep 2024",
|
||||
title: "Morning Routine",
|
||||
quote: "Perfect atmosphere for starting my day.",
|
||||
tag: "Regular",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-is-using-app-her-smartphone-device-send-text-message-near-business-buildings_158595-6785.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-barista-with-coffee-beans_23-2148865559.jpg?_wi=2",
|
||||
imageAlt: "happy customer drinking coffee",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Clara S.",
|
||||
date: "Aug 2024",
|
||||
title: "Foodie",
|
||||
quote: "Their pastries are always fresh and flaky.",
|
||||
tag: "Foodie",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/cute-woman-cafe-eating-smiling_624325-1577.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-enjoying-cup-hot-coffee-cafe_53876-88441.jpg?_wi=2",
|
||||
imageAlt: "happy customer drinking coffee",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "David R.",
|
||||
date: "Jul 2024",
|
||||
title: "Designer",
|
||||
quote: "Love the minimalist vibe here.",
|
||||
tag: "Digital Nomad",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/work-after-breakfast_1098-15186.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fresh-baked-butter-croissants-display-cafe_53876-121720.jpg?_wi=2",
|
||||
imageAlt: "happy customer drinking coffee",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Elena W.",
|
||||
date: "Jun 2024",
|
||||
title: "Student",
|
||||
quote: "Great service and delicious coffee.",
|
||||
tag: "Student",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/female-colleagues-discussing-data-cafe-outdoor-multiracial-female-persons-analyzing-productive-strategy-business-projecting-using-documents-street-cafe_1157-48363.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-enjoying-food_23-2149304458.jpg?_wi=2",
|
||||
imageAlt: "happy customer drinking coffee",
|
||||
},
|
||||
{ id: "t1", name: "Alice M.", date: "Oct 2024", title: "Local", quote: "The warmest place in town.", tag: "Regular", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-asian-woman-apron-barista-giving-you-cup-coffee-working-cafe-serving_1258-199256.jpg" },
|
||||
{ id: "t2", name: "Ben T.", date: "Sep 2024", title: "Foodie", quote: "Simply perfect.", tag: "Regular", avatarSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-is-using-app-her-smartphone-device-send-text-message-near-business-buildings_158595-6785.jpg" }
|
||||
]}
|
||||
title="Loved by locals"
|
||||
description="Hear what our wonderful regulars say about us."
|
||||
title="Testimonials"
|
||||
description="What our guests have to say."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "10k+",
|
||||
description: "Cups served monthly",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "15+",
|
||||
description: "Local bean partners",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "8+",
|
||||
description: "Years of craft",
|
||||
},
|
||||
{ id: "m1", value: "10k+", description: "Cups served" },
|
||||
{ id: "m2", value: "15", description: "Bean partners" },
|
||||
{ id: "m3", value: "8", description: "Years brewing" }
|
||||
]}
|
||||
title="Our Impact"
|
||||
description="A few numbers about our craft."
|
||||
title="Metrics"
|
||||
description="Our commitment in numbers."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="proof" data-section="proof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"Artisan Coffee Guild",
|
||||
"Fair Trade Alliance",
|
||||
"Local Farm Co-op",
|
||||
"Gourmet Bakery Group",
|
||||
"Specialty Roasters Union",
|
||||
"Organic Network",
|
||||
"City Business Alliance",
|
||||
]}
|
||||
title="Recognized for quality"
|
||||
description="We are proud to work with the best."
|
||||
names={["Artisan Coffee Guild", "Fair Trade", "Local Coffee Network"]}
|
||||
title="Partners"
|
||||
description="Recognized for our quality."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Do you have Wi-Fi?",
|
||||
content: "Yes, we offer free high-speed Wi-Fi.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Are you pet friendly?",
|
||||
content: "We welcome well-behaved pets on our terrace.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Do you offer catering?",
|
||||
content: "Yes, please contact us for inquiries.",
|
||||
},
|
||||
{ id: "q1", title: "Free Wi-Fi?", content: "Yes, we offer fast, free Wi-Fi for all customers." },
|
||||
{ id: "q2", title: "Pet Friendly?", content: "Yes, we welcome pets on our terrace!" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/cute-stylish-family-summer-city_1157-19953.jpg"
|
||||
title="Common Questions"
|
||||
description="Everything you need to know."
|
||||
title="Questions"
|
||||
description="Answers to what you might ask."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Say Hello"
|
||||
description="We'd love to hear from you."
|
||||
title="Contact"
|
||||
description="Send us a message or visit us."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Email Address",
|
||||
required: true,
|
||||
},
|
||||
{ name: "name", type: "text", placeholder: "Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Email", required: true }
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "Message",
|
||||
}}
|
||||
textarea={{ name: "message", placeholder: "Your message here..." }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/coffee-maker-machine-table_23-2148937231.jpg"
|
||||
/>
|
||||
</div>
|
||||
@@ -303,37 +143,10 @@ export default function LandingPage() {
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/pair-sunglasses-table-by-sea-sunset_181624-27113.jpg"
|
||||
logoText="Mila Cafe"
|
||||
columns={[
|
||||
{
|
||||
title: "Links",
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Menu",
|
||||
href: "#menu",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Connect",
|
||||
items: [
|
||||
{
|
||||
label: "Instagram",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Facebook",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
columns={[{ title: "Links", items: [{ label: "About", href: "#about" }, { label: "Menu", href: "#menu" }] }]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user