283 lines
19 KiB
TypeScript
283 lines
19 KiB
TypeScript
"use client";
|
|
|
|
import ReactLenis from "lenis/react";
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
|
import HeroSplitDoubleCarousel from "@/components/sections/hero/HeroSplitDoubleCarousel";
|
|
import FeatureBento from "@/components/sections/feature/FeatureBento";
|
|
import FeatureCardTwentySix from "@/components/sections/feature/FeatureCardTwentySix";
|
|
import FeatureCardSixteen from "@/components/sections/feature/FeatureCardSixteen";
|
|
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
|
|
import TeamCardFive from "@/components/sections/team/TeamCardFive";
|
|
import FaqBase from "@/components/sections/faq/FaqBase";
|
|
import FooterCard from "@/components/sections/footer/FooterCard";
|
|
import TestimonialCardSix from "@/components/sections/testimonial/TestimonialCardSix";
|
|
import ContactSplit from "@/components/sections/contact/ContactSplit";
|
|
import { Coffee, Espresso, Tally3, Cake, Laptop, Moon, Star, MapPin, CoffeeBean, ArrowUpRight, Phone, MessageCircle, Instagram, Facebook } from "lucide-react";
|
|
|
|
export default function WebAgency2Page() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="medium"
|
|
sizing="medium"
|
|
background="none"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="metallic"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="medium"
|
|
>
|
|
<ReactLenis root>
|
|
<NavbarLayoutFloatingOverlay
|
|
brandName="Fifty Fifty"
|
|
navItems={[
|
|
{ name: "Menu", id: "menu" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "Experiences", id: "experiences" },
|
|
{ name: "Gallery", id: "gallery" },
|
|
{ name: "Reviews", id: "reviews" },
|
|
{ name: "Visit Us", id: "visit-us" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
button={{ text: "Visit Us", href: "#visit-us" }}
|
|
/>
|
|
<HeroSplitDoubleCarousel
|
|
title="Crafted for Coffee Lovers"
|
|
description="Experience specialty coffee, handcrafted beverages, and unforgettable moments in the heart of Zamalek."
|
|
tag="Zamalek's Premier Coffee Destination"
|
|
tagIcon={Coffee}
|
|
tagAnimation="slide-up"
|
|
background={{ variant: "canvas-reveal" }}
|
|
buttons={[
|
|
{ text: "View Menu", href: "#menu" },
|
|
{ text: "Visit Us", href: "#visit-us" },
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
carouselPosition="right"
|
|
leftCarouselItems={[
|
|
{ imageSrc: "asset://hero_cinematic_coffee_1", imageAlt: "Barista pouring latte art" },
|
|
{ imageSrc: "asset://hero_cinematic_coffee_2", imageAlt: "Elegant coffee shop interior" },
|
|
{ imageSrc: "asset://hero_cinematic_coffee_3", imageAlt: "Close-up of coffee beans" },
|
|
{ imageSrc: "asset://hero_cinematic_coffee_4", imageAlt: "Person enjoying coffee" },
|
|
{ imageSrc: "asset://hero_cinematic_coffee_5", imageAlt: "Coffee cup on wooden table" },
|
|
]}
|
|
rightCarouselItems={[
|
|
{ imageSrc: "asset://hero_cinematic_coffee_6", imageAlt: "Aeropress coffee preparation" },
|
|
{ imageSrc: "asset://hero_cinematic_coffee_7", imageAlt: "Espresso machine in action" },
|
|
{ imageSrc: "asset://hero_cinematic_coffee_8", imageAlt: "Outdoor seating at coffee shop" },
|
|
{ imageSrc: "asset://hero_cinematic_coffee_9", imageAlt: "Hand holding a take-away coffee cup" },
|
|
]}
|
|
carouselItemClassName="!aspect-[3/4]"
|
|
/>
|
|
<FeatureBento
|
|
title="Our Story"
|
|
description="Fifty Fifty is a destination where exceptional coffee craftsmanship meets unparalleled comfort. We meticulously source premium beans, empower expert baristas, and use only the finest ingredients to create an unforgettable experience in Zamalek."
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="slide-up"
|
|
features={[
|
|
{
|
|
title: "Premium Single Origin Beans", description: "Sourced from the world's most renowned coffee regions, ensuring rich and distinct flavors in every cup.", bentoComponent: "media-stack", items: [
|
|
{ imageSrc: "asset://coffee_beans_bag", imageAlt: "Bag of premium coffee beans" },
|
|
{ imageSrc: "asset://coffee_plantation", imageAlt: "Coffee plantation field" },
|
|
{ imageSrc: "asset://barista_coffee_beans", imageAlt: "Barista selecting coffee beans" },
|
|
],
|
|
},
|
|
{
|
|
title: "Artisan Barista Craftsmanship", description: "Our skilled baristas are true artists, dedicated to perfecting every brew, from precise pour-overs to intricate latte art.", bentoComponent: "media-stack", items: [
|
|
{ imageSrc: "asset://barista_making_latte", imageAlt: "Barista pouring latte art" },
|
|
{ imageSrc: "asset://barista_pouring", imageAlt: "Barista pouring coffee in a professional setting" },
|
|
{ imageSrc: "asset://barista_smiling", imageAlt: "Smiling barista serving coffee" },
|
|
],
|
|
},
|
|
{
|
|
title: "Finest Quality Ingredients", description: "Beyond coffee, we use fresh, premium milk, natural sweeteners, and high-quality ingredients for all our beverages and pastries.", bentoComponent: "media-stack", items: [
|
|
{ imageSrc: "asset://fresh_milk_pour", imageAlt: "Fresh milk being poured" },
|
|
{ imageSrc: "asset://pastry_ingredients", imageAlt: "Fresh ingredients for pastries" },
|
|
{ imageSrc: "asset://dessert_plating", imageAlt: "Chef plating a dessert" },
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
<FeatureCardTwentySix
|
|
title="Our Signature Experiences"
|
|
description="Discover the distinct offerings that make Fifty Fifty a true coffee sanctuary, tailored for every moment."
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
cardClassName="!h-auto aspect-[4/5]"
|
|
features={[
|
|
{
|
|
title: "Specialty Coffee", description: "From pour-overs to cold brews, explore our meticulously crafted specialty coffee selection.", imageSrc: "asset://pour_over_coffee", imageAlt: "Pour over coffee brewing", buttonIcon: Coffee,
|
|
buttonHref: "#menu"},
|
|
{
|
|
title: "The Espresso Bar", description: "Classic espressos, macchiatos, and lattes perfected by our artisan baristas, rich and aromatic.", imageSrc: "asset://espresso_shot", imageAlt: "Perfect espresso shot", buttonIcon: Espresso,
|
|
buttonHref: "#menu"},
|
|
{
|
|
title: "Authentic Arabic Coffee", description: "Experience the rich heritage and distinct flavors of traditional Arabic coffee, brewed to perfection.", imageSrc: "asset://arabic_coffee_pot", imageAlt: "Traditional Arabic coffee pot", buttonIcon: Tally3,
|
|
buttonHref: "#menu"},
|
|
{
|
|
title: "Gourmet Desserts & Pastries", description: "Indulge in our exquisite selection of handcrafted cakes, tarts, and freshly baked pastries.", imageSrc: "asset://dessert_display", imageAlt: "Gourmet dessert display", buttonIcon: Cake,
|
|
buttonHref: "#menu"},
|
|
{
|
|
title: "The Cozy Workspace", description: "A tranquil environment perfect for remote work, meetings, or quiet contemplation with your coffee.", imageSrc: "asset://cozy_workspace_coffee", imageAlt: "Cozy coffee shop interior with laptop", buttonIcon: Laptop,
|
|
buttonHref: "#visit-us"},
|
|
{
|
|
title: "Late-Night Coffee", description: "Enjoy our full menu and a sophisticated ambiance, open daily until 2:00 AM for your evening cravings.", imageSrc: "asset://late_night_coffee_shop", imageAlt: "Elegant coffee shop at night", buttonIcon: Moon,
|
|
buttonHref: "#visit-us"},
|
|
]}
|
|
/>
|
|
<FeatureBento
|
|
title="A Taste of Our Menu"
|
|
description="Explore our curated selection, from classic espresso to innovative signature drinks and decadent desserts. Prices starting from EGP 50."
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="slide-up"
|
|
features={[
|
|
{
|
|
title: "Espresso Classics", description: "Rich, bold, and perfectly extracted shots. Starting from EGP 65.", bentoComponent: "media-stack", items: [{ imageSrc: "asset://espresso_menu_card", imageAlt: "Espresso shot with crema" }],
|
|
},
|
|
{
|
|
title: "Artisanal Pour-Overs", description: "Experience the nuanced flavors of our V60 and Chemex brews. Starting from EGP 80.", bentoComponent: "media-stack", items: [{ imageSrc: "asset://pourover_menu_card", imageAlt: "V60 coffee brewing" }],
|
|
},
|
|
{
|
|
title: "Fifty Fifty Signatures", description: "Unique handcrafted beverages you won't find anywhere else. Starting from EGP 90.", bentoComponent: "media-stack", items: [{ imageSrc: "asset://signature_menu_card", imageAlt: "Signature coffee drink" }],
|
|
},
|
|
{
|
|
title: "Decadent Desserts", description: "Indulge in our selection of gourmet cakes and tarts, baked fresh daily. Starting from EGP 80.", bentoComponent: "media-stack", items: [{ imageSrc: "asset://dessert_menu_card", imageAlt: "Chocolate cake slice" }],
|
|
},
|
|
]}
|
|
/>
|
|
<div id="reviews" data-section="reviews">
|
|
<TestimonialCardSix
|
|
title="What Our Customers Say"
|
|
description="Hear from our delighted guests about their experiences with our coffee, staff, and atmosphere."
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Ahmed K.", handle: "@ahmed_coffee", testimonial: "Fifty Fifty delivers exceptional coffee every time. The quality and depth of flavor are simply unmatched. A true gem for coffee lovers!", imageSrc: "asset://customer_avatar_1", imageAlt: "Ahmed K.", icon: Star
|
|
},
|
|
{
|
|
id: "2", name: "Laila S.", handle: "@laila_eats", testimonial: "The staff here are incredibly friendly and knowledgeable, always ready with a smile and a recommendation. They make every visit a pleasure!", imageSrc: "asset://customer_avatar_2", imageAlt: "Laila S.", icon: Star
|
|
},
|
|
{
|
|
id: "3", name: "Omar G.", handle: "@omar_explorer", testimonial: "The atmosphere at Fifty Fifty is so relaxing and inviting. It's my go-to spot for unwinding or getting some work done. Highly recommend!", imageSrc: "asset://customer_avatar_3", imageAlt: "Omar G.", icon: Star
|
|
},
|
|
{
|
|
id: "4", name: "Nour A.", handle: "@nour_reads", testimonial: "Their specialty coffee selection is outstanding. I've tried new brews here that I never thought I'd enjoy. A fantastic experience for true connoisseurs.", imageSrc: "asset://customer_avatar_4", imageAlt: "Nour A.", icon: Star
|
|
}
|
|
]}
|
|
animationType="slide-up"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
<MetricCardOne
|
|
title="Recognized for Excellence"
|
|
description="Dedicated to delivering the finest coffee experience in Zamalek, consistently rated among the best."
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
metrics={[
|
|
{ id: "rating", value: "4.8/5", title: "Customer Rating", description: "Consistently highly rated for quality and service.", icon: Star },
|
|
{ id: "location", value: "Zamalek", title: "Prime Location", description: "Nestled in the heart of Cairo's vibrant Zamalek district.", icon: MapPin },
|
|
{ id: "specialty", value: "Premium", title: "Specialty Coffee", description: "Curating the finest beans and artisanal brewing methods.", icon: CoffeeBean },
|
|
]}
|
|
/>
|
|
<FeatureCardSixteen
|
|
title="Immerse Yourself in Our World"
|
|
description="Step into the world of Fifty Fifty through our captivating visual journey. Explore the elegant design, vibrant moments, and the artistry behind every cup."
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="slide-up"
|
|
negativeCard={{
|
|
items: [
|
|
"Sophisticated interiors and design aesthetics", "Artisan coffee preparation in action", "Relaxing ambiance, perfect for contemplation", "Delectable pastries and gourmet desserts", "Community moments and social gatherings"],
|
|
}}
|
|
positiveCard={{
|
|
items: [
|
|
"Our signature handcrafted beverages", "Expert barista artistry and latte designs", "Inviting seating areas for every mood", "Freshly baked delights, made with passion", "The perfect spot for meetings or remote work"],
|
|
}}
|
|
/>
|
|
<TeamCardFive
|
|
title="Our Artisan Baristas"
|
|
description="Meet the passionate individuals who master the craft, ensuring every cup at Fifty Fifty is a masterpiece and every visit a pleasure."
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="slide-up"
|
|
mediaClassName="object-[65%_center]"
|
|
team={[
|
|
{ id: "1", name: "Aisha", role: "Head Barista", imageSrc: "asset://barista_female_1", imageAlt: "Aisha, Head Barista" },
|
|
{ id: "2", name: "Karim", role: "Latte Artist", imageSrc: "asset://barista_male_1", imageAlt: "Karim, Latte Artist" },
|
|
{ id: "3", name: "Nour", role: "Coffee Specialist", imageSrc: "asset://barista_female_2", imageAlt: "Nour, Coffee Specialist" },
|
|
]}
|
|
/>
|
|
<div id="visit-us" data-section="visit-us">
|
|
<FaqBase
|
|
title="Visit Us in Zamalek"
|
|
description="Find your way to Fifty Fifty, your premier coffee destination. Located at B-Zamalek, Abu El Feda Street, Zamalek, Cairo, Egypt. Use the button below for directions via Google Maps."
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
faqsAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "Get Directions", href: "https://www.google.com/maps/search/Fifty+Fifty+50%2F50+Specialty+Coffee,+B-Zamalek,+Abu+El+Feda+Street,+Zamalek,+Cairo,+Egypt", onClick: () => console.log("Get Directions clicked") },
|
|
{ text: "Call Us", href: "tel:+201001234567", onClick: () => console.log("Call Us clicked") }
|
|
]}
|
|
faqs={[
|
|
{ id: "1", title: "Where are you located?", content: "Fifty Fifty Specialty Coffee is located at B-Zamalek, Abu El Feda Street, Zamalek, Cairo, Egypt. We're easily accessible and a perfect spot to relax." },
|
|
{ id: "2", title: "What are your operating hours?", content: "We are open daily from early morning until 2:00 AM, offering a perfect spot for your morning coffee, afternoon meetings, or late-night gatherings." },
|
|
{ id: "3", title: "Do you offer Wi-Fi for remote work?", content: "Yes, we provide complimentary high-speed Wi-Fi, making Fifty Fifty an ideal environment for remote work and study." },
|
|
{ id: "4", title: "Is there parking available?", content: "While street parking is available, it can be limited. We recommend ride-sharing or public transport for ease of access in Zamalek." },
|
|
{ id: "5", title: "What landmarks are nearby?", content: "We are located near the Zamalek Bridge and the Aquarium Grotto Garden, making us a great stop during your exploration of Zamalek." },
|
|
]}
|
|
/>
|
|
</div>
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
tag="Connect With Us"
|
|
title="Reach Out to Fifty Fifty"
|
|
description="Have questions, feedback, or want to make a reservation? Fill out the form below or contact us directly. We'd love to hear from you!"
|
|
background={{ variant: "sparkles-gradient" }}
|
|
useInvertedBackground={false}
|
|
mediaAnimation="slide-up"
|
|
mediaPosition="right"
|
|
imageSrc="asset://coffee_cup_contact_us"
|
|
imageAlt="Contact Us"
|
|
inputPlaceholder="Enter your email"
|
|
buttonText="Send Message"
|
|
termsText="By sending a message, you agree to our privacy policy and terms of service."
|
|
onSubmit={(email) => console.log(`Contact form submitted with email: ${email}`)}
|
|
/>
|
|
</div>
|
|
<FooterCard
|
|
logoText="Fifty Fifty"
|
|
copyrightText="© 2024 | Fifty Fifty Specialty Coffee. All rights reserved."
|
|
socialLinks={[
|
|
{ icon: Instagram, href: "#", ariaLabel: "Instagram" },
|
|
{ icon: Facebook, href: "#", ariaLabel: "Facebook" },
|
|
{ icon: MessageCircle, href: "#", ariaLabel: "WhatsApp" }
|
|
]}
|
|
columns={[
|
|
{
|
|
title: "Explore", items: [
|
|
{ label: "Menu", href: "#menu" },
|
|
{ label: "About Us", href: "#about" },
|
|
{ label: "Experiences", href: "#experiences" },
|
|
{ label: "Gallery", href: "#gallery" },
|
|
{ label: "Reviews", href: "#reviews" }
|
|
],
|
|
},
|
|
{
|
|
title: "Visit", items: [
|
|
{ label: "Location", href: "#visit-us" },
|
|
{ label: "Hours", href: "#visit-us" },
|
|
{ label: "Contact", href: "#contact" },
|
|
],
|
|
}
|
|
]}
|
|
/>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|