bender/a4e13382-dbdd-462d-a117-6be590858a3c
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-04-17 05:30:03 +00:00
parent 64a95eec47
commit 1e9faef12b
1 changed files with 129 additions and 190 deletions
Download Patch File Download Diff File Expand all files Collapse all files

319
src/app/page.tsx
View File

@@ -1,8 +1,4 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import { Coffee, Wifi, Award } from "lucide-react";
import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
@@ -12,192 +8,135 @@ import TestimonialCardSixteen from '@/components/sections/testimonial/Testimonia
import TeamCardFive from '@/components/sections/team/TeamCardFive';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Coffee, Wifi, Award } from 'lucide-react';
export default function Page() {
const navItems = [
{ name: 'Menu', id: '#menu' },
{ name: 'About', id: '#about' },
{ name: 'Visit', id: '#visit' }
];
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="directional-hover"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
contentWidth="mediumLarge"
sizing="largeSmall"
background="noiseDiagonalGradient"
cardStyle="solid"
primaryButtonStyle="flat"
secondaryButtonStyle="radial-glow"
headingFontWeight="bold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Hero", id: "hero" },
{ name: "About", id: "about" },
{ name: "Menu", id: "menu" },
{ name: "Vibe", id: "vibe" },
{ name: "Reviews", id: "reviews" },
{ name: "Team", id: "team" },
{ name: "Visit", id: "visit" }
]}
brandName="Foxy Cafe"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardTestimonial
useInvertedBackground={false}
background={{ variant: "plain" }}
title="Where every cup tells a story."
description="Specialty coffee, honest food, and a space that feels like yours — in the heart of Madinat Zayed."
testimonials={[
{ name: "Gypseaaa", handle: "@gypseaaa", testimonial: "Best coffee and food served by skilled baristas and friendly waitstaff.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-dress-cafe_273609-4088.jpg" },
{ name: "A. Almansoori", handle: "@almansoori", testimonial: "The halloumi sandwich is the best I've ever had!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-having-lunch-restaurant_23-2150491912.jpg" },
{ name: "R. Almansoori", handle: "@ralmansoori", testimonial: "Big thanks to Paul for his excellent service — professional, friendly, and perfect.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13320.jpg" },
{ name: "M Al Hammadi", handle: "@malhammadi", testimonial: "Everything good, best matcha in MZ.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-redhead-female-barista-small-coffee-shop_613910-1440.jpg" },
{ name: "Mohamed Alkaabi", handle: "@malkaabi", testimonial: "Food: Amazing, big portions. Coffee: Thanks to Barista Rein.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/outdoor-fashion-portrait-beautiful-young-girl-drinking-tea-coffee-alone_231208-6291.jpg" }
]}
buttons={[{ text: "View Our Menu", href: "#menu" }, { text: "Find Us", href: "#visit" }]}
imageSrc="http://img.b2bpic.net/free-photo/young-barista-standing-bar-counter-smelling-filter-coffee-while-dreamily-looking-aside-cafe_574295-3474.jpg"
imageAlt="cozy specialty coffee shop interior"
avatars={[
{ src: "http://img.b2bpic.net/free-photo/young-woman-using-looking-smartphone-with-feeling-happy_1150-4006.jpg", alt: "customer portrait" },
{ src: "http://img.b2bpic.net/free-photo/positive-gorgeous-young-female-feels-happy-coffee-shop_273609-2792.jpg", alt: "happy cafe guest" },
{ src: "http://img.b2bpic.net/free-photo/beautiful-girl-with-long-hair-is-sittting-table-terrace-cafe-she-wears-white-dress-with-bare-shoulders-red-lipstick-she-is-smiling-camera_197531-663.jpg", alt: "coffee enthusiast" },
{ src: "http://img.b2bpic.net/free-photo/cute-elegant-calm-happy-woman-green-summer-dress-sits-with-coffee-cafe-enjoying-morning_343596-3668.jpg", alt: "relaxed customer" },
{ src: "http://img.b2bpic.net/free-photo/full-shot-smiley-senior-woman-bistro_23-2149356832.jpg", alt: "happy visitor" }
]}
marqueeItems={[
{ type: "text", text: "Artisan Coffee" },
{ type: "text", text: "Fresh Ingredients" },
{ type: "text", text: "Warm Atmosphere" },
{ type: "text", text: "Community Focused" },
{ type: "text", text: "Specialty Brews" }
]}
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={true}
title="Craft, Food, People."
description="Our core philosophy revolves around exceptional ingredients, precise preparation, and a team that genuinely cares about your morning."
metrics={[{ value: "Specialty", title: "Coffee" }, { value: "Authentic", title: "Food" }, { value: "Expert", title: "People" }]}
mediaAnimation="slide-up"
metricsAnimation="blur-reveal"
imageSrc="http://img.b2bpic.net/free-photo/preparation-coffee-cezve-hot-sand-coffee-bar_23-2148209259.jpg"
imageAlt="Preparation of coffee in cezve on hot sand at coffee bar"
/>
</div>
<div id="menu" data-section="menu">
<ProductCardTwo
animationType="slide-up"
textboxLayout="split"
gridVariant="two-columns-alternating-heights"
useInvertedBackground={false}
products={[
{ id: "1", brand: "Coffee", name: "V60 Filter Coffee", price: "AED 24.69", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/portrait-pretty-young-woman-sitting_171337-17101.jpg" },
{ id: "2", brand: "Coffee", name: "Cold Brew", price: "AED 24.69", rating: 5, reviewCount: "98", imageSrc: "http://img.b2bpic.net/free-photo/barista-preparing-beverage_23-2149458036.jpg" },
{ id: "3", brand: "Matcha", name: "Organic Matcha", price: "AED 27.16", rating: 5, reviewCount: "150", imageSrc: "http://img.b2bpic.net/free-photo/empty-bench-restaurant_23-2147871253.jpg" },
{ id: "4", brand: "Food", name: "Halloumi Sandwich", price: "AED 28.89", rating: 5, reviewCount: "200", imageSrc: "http://img.b2bpic.net/free-photo/you-get-it-it-s-so-funny_329181-2916.jpg" },
{ id: "5", brand: "Food", name: "Avocado Toast", price: "AED 33.33", rating: 5, reviewCount: "110", imageSrc: "http://img.b2bpic.net/free-photo/wooden-furniture-with-cup-coffee_1203-1682.jpg" },
{ id: "6", brand: "Coffee", name: "Americano", price: "AED 16.05", rating: 5, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/top-view-cup-coffee-with-cookies-cotton-flowers_23-2148720030.jpg" }
]}
title="Something for every mood."
description="A curated selection of our signature coffees and signature bites."
/>
</div>
<div id="vibe" data-section="vibe">
<FeatureCardTwentyFive
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={true}
features={[
{ title: "Cozy Seating", description: "Comfortable corners.", icon: Coffee, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/beautifully-made-cappuccino-served-with-flower-art-foam-shot-from-overhead-view_181624-1793.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/woman-hands-works-with-coffee-mashine_140725-1290.jpg" }] },
{ title: "Fast WiFi", description: "Perfect for work.", icon: Wifi, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/coffee-cup-coffee-shop-vintage-style_1150-695.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/digital-lavender-style-interior-design_23-2151561231.jpg" }] },
{ title: "Premium Coffee", description: "Earns every dirham.", icon: Award, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/crop-female-with-snack-near-dessert-book_23-2147888754.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/humorous-talks-with-close-friends-dinner-hot-spring-day-cafe_8353-10001.jpg" }] }
]}
title="A place to work, rest, and savour."
description="Whether you're deep in a deadline or just need a moment — Foxy Cafe is your quiet corner."
/>
</div>
<div id="reviews" data-section="reviews">
<TestimonialCardSixteen
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
testimonials={[
{ id: "1", name: "Gypseaaa", role: "Local Guide", company: "Madinat Zayed", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-dress-cafe_273609-4088.jpg" },
{ id: "2", name: "A. Almansoori", role: "Regular", company: "Abu Dhabi", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-having-lunch-restaurant_23-2150491912.jpg" },
{ id: "3", name: "R. Almansoori", role: "Visitor", company: "Abu Dhabi", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13320.jpg" },
{ id: "4", name: "M Al Hammadi", role: "Local", company: "Madinat Zayed", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-redhead-female-barista-small-coffee-shop_613910-1440.jpg" },
{ id: "5", name: "Mohamed Alkaabi", role: "Foodie", company: "Abu Dhabi", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/outdoor-fashion-portrait-beautiful-young-girl-drinking-tea-coffee-alone_231208-6291.jpg" }
]}
kpiItems={[
{ value: "500+", label: "Happy Guests" },
{ value: "100%", label: "Quality Assured" },
{ value: "4.9/5", label: "Google Rating" }
]}
title="What our guests say."
description="Heartfelt feedback from our community in Madinat Zayed."
/>
</div>
<div id="team" data-section="team">
<TeamCardFive
animationType="slide-up"
textboxLayout="inline-image"
useInvertedBackground={true}
team={[
{ id: "1", name: "Nikita", role: "Hospitality", imageSrc: "http://img.b2bpic.net/free-photo/handsome-young-man-wearing-trendy-hat-sitting-wooden-table-coffee-shop_273609-1622.jpg" },
{ id: "2", name: "Rein", role: "Lead Barista", imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-with-apron-holding-empty-cup_23-2148366627.jpg" },
{ id: "3", name: "Paul", role: "Barista", imageSrc: "http://img.b2bpic.net/free-photo/playful-man-posing-with-coffee-cups_23-2148366684.jpg" },
{ id: "4", name: "Gigi Johnson", role: "Guest Experience", imageSrc: "http://img.b2bpic.net/free-photo/attractive-fashionable-young-man-with-beard-having-coffee-modern-cafe_273609-1929.jpg" }
]}
title="The people behind every perfect cup."
description="Our baristas are the heart of our artisan cafe experience."
/>
</div>
<div id="visit" data-section="visit">
<ContactSplit
useInvertedBackground={false}
background={{ variant: "plain" }}
tag="Visit Us"
title="Find Foxy Cafe"
description="Madinat Zayed, Abu Dhabi, UAE. Open daily 7 AM – 11 PM. Delivery via Talabat. Ladies always welcome."
mediaAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-photo/young-attractive-woman-striped-trench-coat-happily-talking-cellphone-sitting-near-big-window-while-spending-time-modern-cafe_574295-4851.jpg"
imageAlt="Young attractive woman in striped trench coat happily talking on cellphone sitting near big window while spending time in modern cafe"
/>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="http://img.b2bpic.net/free-photo/cappuccino-coffee-with-art-latte-spoon-wooden-background_23-2147893299.jpg"
logoText="Foxy Cafe"
columns={[
{
title: "Navigation", items: [
{ label: "Menu", href: "#menu" },
{ label: "About", href: "#about" },
{ label: "Visit", href: "#visit" }
]
},
{
title: "Social", items: [
{ label: "Instagram", href: "#" },
{ label: "TikTok", href: "#" },
{ label: "Google", href: "#" }
]
}
]}
copyrightText="© 2025 Foxy Cafe. All rights reserved."
/>
</div>
</ReactLenis>
<ThemeProvider>
<div id="nav" data-section="nav">
<NavbarStyleCentered navItems={navItems} brandName="Foxy Cafe" />
</div>
<div id="hero" data-section="hero">
<HeroBillboardTestimonial
useInvertedBackground={false}
background={{ variant: 'plain' }}
title="Where every cup tells a story."
description="Specialty coffee, honest food, and a space that feels like yours — in the heart of Madinat Zayed."
testimonials={[
{ name: "Gypseaaa", handle: "@gypseaaa", testimonial: "Best coffee and food served by skilled baristas and friendly waitstaff.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-dress-cafe_273609-4088.jpg" },
{ name: "A. Almansoori", handle: "@almansoori", testimonial: "The halloumi sandwich is the best I've ever had!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-having-lunch-restaurant_23-2150491912.jpg" },
{ name: "R. Almansoori", handle: "@ralmansoori", testimonial: "Big thanks to Paul for his excellent service — professional, friendly, and perfect.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13320.jpg" },
{ name: "M Al Hammadi", handle: "@malhammadi", testimonial: "Everything good, best matcha in MZ.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-redhead-female-barista-small-coffee-shop_613910-1440.jpg" },
{ name: "Mohamed Alkaabi", handle: "@malkaabi", testimonial: "Food: Amazing, big portions. Coffee: Thanks to Barista Rein.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/outdoor-fashion-portrait-beautiful-young-girl-drinking-tea-coffee-alone_231208-6291.jpg" }
]}
buttons={[{ text: "View Our Menu", href: "#menu" }, { text: "Find Us", href: "#visit" }]}
imageSrc="http://img.b2bpic.net/free-photo/young-barista-standing-bar-counter-smelling-filter-coffee-while-dreamily-looking-aside-cafe_574295-3474.jpg"
imageAlt="cozy specialty coffee shop interior"
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={true}
title="Craft, Food, People."
description="Our core philosophy revolves around exceptional ingredients, precise preparation, and a team that genuinely cares about your morning."
metrics={[{ value: "Specialty", title: "Coffee" }, { value: "Authentic", title: "Food" }, { value: "Expert", title: "People" }]}
mediaAnimation="slide-up"
metricsAnimation="blur-reveal"
imageSrc="http://img.b2bpic.net/free-photo/preparation-coffee-cezve-hot-sand-coffee-bar_23-2148209259.jpg"
imageAlt="Preparation of coffee in cezve on hot sand at coffee bar"
/>
</div>
<div id="menu" data-section="menu">
<ProductCardTwo
animationType="slide-up"
textboxLayout="split"
gridVariant="two-columns-alternating-heights"
useInvertedBackground={false}
products={[
{ id: "1", brand: "Coffee", name: "V60 Filter Coffee", price: "AED 24.69", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/portrait-pretty-young-woman-sitting_171337-17101.jpg" },
{ id: "2", brand: "Coffee", name: "Cold Brew", price: "AED 24.69", rating: 5, reviewCount: "98", imageSrc: "http://img.b2bpic.net/free-photo/barista-preparing-beverage_23-2149458036.jpg" },
{ id: "3", brand: "Matcha", name: "Organic Matcha", price: "AED 27.16", rating: 5, reviewCount: "150", imageSrc: "http://img.b2bpic.net/free-photo/empty-bench-restaurant_23-2147871253.jpg" },
{ id: "4", brand: "Food", name: "Halloumi Sandwich", price: "AED 28.89", rating: 5, reviewCount: "200", imageSrc: "http://img.b2bpic.net/free-photo/you-get-it-it-s-so-funny_329181-2916.jpg" },
{ id: "5", brand: "Food", name: "Avocado Toast", price: "AED 33.33", rating: 5, reviewCount: "110", imageSrc: "http://img.b2bpic.net/free-photo/wooden-furniture-with-cup-coffee_1203-1682.jpg" },
{ id: "6", brand: "Coffee", name: "Americano", price: "AED 16.05", rating: 5, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/top-view-cup-coffee-with-cookies-cotton-flowers_23-2148720030.jpg" }
]}
title="Something for every mood."
description="A curated selection of our signature coffees and signature bites."
/>
</div>
<div id="vibe" data-section="vibe">
<FeatureCardTwentyFive
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={true}
title="A place to work, rest, and savour."
description="Whether you're deep in a deadline or just need a moment — Foxy Cafe is your quiet corner."
features={[
{ title: "Cozy Seating", description: "Comfortable corners.", icon: Coffee, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/beautifully-made-cappuccino-served-with-flower-art-foam-shot-from-overhead-view_181624-1793.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/woman-hands-works-with-coffee-mashine_140725-1290.jpg" }] },
{ title: "Fast WiFi", description: "Perfect for work.", icon: Wifi, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/coffee-cup-coffee-shop-vintage-style_1150-695.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/digital-lavender-style-interior-design_23-2151561231.jpg" }] },
{ title: "Premium Coffee", description: "Earns every dirham.", icon: Award, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/crop-female-with-snack-near-dessert-book_23-2147888754.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/humorous-talks-with-close-friends-dinner-hot-spring-day-cafe_8353-10001.jpg" }] }
]}
/>
</div>
<div id="reviews" data-section="reviews">
<TestimonialCardSixteen
textboxLayout="default"
useInvertedBackground={false}
title="What our guests say."
description="Heartfelt feedback from our community in Madinat Zayed."
kpiItems={[{ value: "500+", label: "Happy Guests" }, { value: "100%", label: "Quality Assured" }, { value: "4.9/5", label: "Google Rating" }]}
animationType="slide-up"
testimonials={[
{ id: "1", name: "Gypseaaa", role: "Local Guide", company: "Madinat Zayed", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-dress-cafe_273609-4088.jpg" },
{ id: "2", name: "A. Almansoori", role: "Regular", company: "Abu Dhabi", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-having-lunch-restaurant_23-2150491912.jpg" },
{ id: "3", name: "R. Almansoori", role: "Visitor", company: "Abu Dhabi", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13320.jpg" },
{ id: "4", name: "M Al Hammadi", role: "Local", company: "Madinat Zayed", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-redhead-female-barista-small-coffee-shop_613910-1440.jpg" },
{ id: "5", name: "Mohamed Alkaabi", role: "Foodie", company: "Abu Dhabi", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/outdoor-fashion-portrait-beautiful-young-girl-drinking-tea-coffee-alone_231208-6291.jpg" }
]}
/>
</div>
<div id="team" data-section="team">
<TeamCardFive
animationType="slide-up"
textboxLayout="inline-image"
useInvertedBackground={true}
title="The people behind every perfect cup."
description="Our baristas are the heart of our artisan cafe experience."
team={[
{ id: "1", name: "Nikita", role: "Hospitality", imageSrc: "http://img.b2bpic.net/free-photo/handsome-young-man-wearing-trendy-hat-sitting-wooden-table-coffee-shop_273609-1622.jpg" },
{ id: "2", name: "Rein", role: "Lead Barista", imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-with-apron-holding-empty-cup_23-2148366627.jpg" },
{ id: "3", name: "Paul", role: "Barista", imageSrc: "http://img.b2bpic.net/free-photo/playful-man-posing-with-coffee-cups_23-2148366684.jpg" },
{ id: "4", name: "Gigi Johnson", role: "Guest Experience", imageSrc: "http://img.b2bpic.net/free-photo/attractive-fashionable-young-man-with-beard-having-coffee-modern-cafe_273609-1929.jpg" }
]}
/>
</div>
<div id="visit" data-section="visit">
<ContactSplit
title="Find Foxy Cafe"
description="Madinat Zayed, Abu Dhabi, UAE. Open daily 7 AM – 11 PM. Delivery via Talabat. Ladies always welcome."
tag="Visit Us"
mediaAnimation="slide-up"
useInvertedBackground={false}
background={{ variant: 'plain' }}
imageSrc="http://img.b2bpic.net/free-photo/young-attractive-woman-striped-trench-coat-happily-talking-cellphone-sitting-near-big-window-while-spending-time-modern-cafe_574295-4851.jpg"
/>
</div>
<div id="footer" data-section="footer">
<FooterMedia
logoText="Foxy Cafe"
imageSrc="http://img.b2bpic.net/free-photo/cappuccino-coffee-with-art-latte-spoon-wooden-background_23-2147893299.jpg"
columns={[
{ title: "Navigation", items: [{ label: "Menu", href: "#menu" }, { label: "About", href: "#about" }, { label: "Visit", href: "#visit" }] },
{ title: "Social", items: [{ label: "Instagram", href: "#" }, { label: "TikTok", href: "#" }, { label: "Google", href: "#" }] }
]}
/>
</div>
</ThemeProvider>
);
}
}