238 lines
16 KiB
TypeScript
238 lines
16 KiB
TypeScript
"use client"
|
||
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||
import HeroBillboardGallery from "@/components/sections/hero/HeroBillboardGallery";
|
||
import AboutMetric from "@/components/sections/about/AboutMetric";
|
||
import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
|
||
import ProductCardOne from "@/components/sections/product/ProductCardOne";
|
||
import TestimonialCardSix from "@/components/sections/testimonial/TestimonialCardSix";
|
||
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
||
import FooterMedia from "@/components/sections/footer/FooterMedia";
|
||
import { Award, Car, Coffee, DoorOpen, Heart, Shield, Sparkles, Star, UtensilsCrossed, Zap } from "lucide-react";
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="icon-arrow"
|
||
defaultTextAnimation="reveal-blur"
|
||
borderRadius="rounded"
|
||
contentWidth="medium"
|
||
sizing="mediumLargeSizeMediumTitles"
|
||
background="noiseDiagonalGradient"
|
||
cardStyle="glass-depth"
|
||
primaryButtonStyle="double-inset"
|
||
secondaryButtonStyle="solid"
|
||
headingFontWeight="bold"
|
||
>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarLayoutFloatingInline
|
||
brandName="Elysian Restaurant"
|
||
navItems={[
|
||
{ name: "Home", id: "home" },
|
||
{ name: "Menu", id: "menu" },
|
||
{ name: "About", id: "about" },
|
||
{ name: "Experience", id: "experience" },
|
||
{ name: "Contact", id: "contact" }
|
||
]}
|
||
button={{ text: "Reserve Table", href: "#reserve" }}
|
||
animateOnLoad={true}
|
||
className="bg-opacity-95 backdrop-blur-md"
|
||
navItemClassName="text-foreground hover:text-secondary-cta transition-colors"
|
||
buttonClassName="bg-primary-cta hover:bg-primary-cta/90"
|
||
buttonTextClassName="text-primary-cta-text font-semibold"
|
||
/>
|
||
</div>
|
||
|
||
<div id="hero" data-section="hero" className="w-full bg-gradient-to-br from-background via-card to-background-accent/10">
|
||
<HeroBillboardGallery
|
||
title="Elysian Restaurant – Where Every Meal Feels Divine"
|
||
description="Experience exceptional dining inside the Golden Sands Hotel, Sharjah. Indulge in a harmonious blend of Arabic, Indian, and American flavors crafted with passion and precision."
|
||
background={{ variant: "plain" }}
|
||
buttons={[
|
||
{ text: "Reserve Your Table", href: "#reserve" },
|
||
{ text: "View Menu", href: "#menu" }
|
||
]}
|
||
buttonAnimation="blur-reveal"
|
||
mediaItems={[
|
||
{ imageSrc: "http://img.b2bpic.net/free-photo/vertical-view-delicious-tuna-dish-with-glass-wine-cheese-set_8353-10584.jpg?_wi=1", imageAlt: "Gourmet plated dish with elegant presentation and soft lighting" },
|
||
{ imageSrc: "http://img.b2bpic.net/free-photo/there-are-glasses-wine-water-table-with-white-cloth-are-ready-dining_613910-17447.jpg", imageAlt: "Luxury restaurant dining room with warm ambiance and sophisticated decor" },
|
||
{ imageSrc: "http://img.b2bpic.net/free-photo/friends-eating-conversating-restaurant_23-2148006713.jpg", imageAlt: "Happy guests enjoying a delightful meal together at our restaurant" }
|
||
]}
|
||
mediaAnimation="opacity"
|
||
className="min-h-screen"
|
||
containerClassName="max-w-7xl mx-auto"
|
||
titleClassName="text-5xl md:text-6xl font-bold text-foreground"
|
||
descriptionClassName="text-lg md:text-xl text-foreground/80 max-w-2xl"
|
||
buttonClassName="bg-primary-cta hover:bg-primary-cta/90 text-primary-cta-text px-8 py-3 rounded-lg transition-all"
|
||
buttonTextClassName="font-semibold"
|
||
/>
|
||
</div>
|
||
|
||
<div id="about" data-section="about" className="w-full bg-background py-16 md:py-24">
|
||
<AboutMetric
|
||
title="About Elysian Restaurant"
|
||
metrics={[
|
||
{ icon: Coffee, label: "Breakfast Buffet", value: "Fresh Daily" },
|
||
{ icon: UtensilsCrossed, label: "À la Carte Menu", value: "Premium Selection" },
|
||
{ icon: Car, label: "Valet Parking", value: "Complimentary" },
|
||
{ icon: DoorOpen, label: "Walk-ins Welcome", value: "Always Open" }
|
||
]}
|
||
metricsAnimation="blur-reveal"
|
||
useInvertedBackground={false}
|
||
containerClassName="max-w-6xl mx-auto px-4"
|
||
titleClassName="text-4xl md:text-5xl font-bold text-foreground mb-12"
|
||
metricsContainerClassName="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8"
|
||
metricCardClassName="bg-card rounded-lg p-6 hover:shadow-lg transition-shadow"
|
||
metricIconClassName="text-secondary-cta text-4xl mb-4"
|
||
metricLabelClassName="text-foreground font-semibold text-lg mb-2"
|
||
metricValueClassName="text-secondary-cta font-bold text-2xl"
|
||
/>
|
||
</div>
|
||
|
||
<div id="features" data-section="features" className="w-full bg-card py-16 md:py-24">
|
||
<FeatureHoverPattern
|
||
title="Why Choose Elysian"
|
||
description="Nestled in the heart of Sharjah's Golden Sands Hotel, Elysian Restaurant offers an unforgettable dining experience defined by exquisite cuisine, impeccable service, and warm hospitality."
|
||
features={[
|
||
{ icon: Sparkles, title: "Exceptional Culinary Artistry", description: "Each dish is thoughtfully crafted by our dedicated team, blending Arabic, Indian, and American flavors with premium ingredients and artistic presentation." },
|
||
{ icon: Heart, title: "Personalized Hospitality", description: "Our attentive team—Jacqueline, Su, Ahmed, and Nandan—ensures every detail of your dining experience is perfect, making you feel genuinely valued." },
|
||
{ icon: Shield, title: "Elegant Yet Accessible", description: "We believe luxury dining should be for everyone. Experience fine dining at reasonable prices in our relaxing, clean, and elegant ambiance." },
|
||
{ icon: Zap, title: "Convenient Prime Location", description: "Located within the prestigious Golden Sands Hotel with complimentary valet parking, ample parking, and welcome for walk-in guests." },
|
||
{ icon: Award, title: "Consistently Praised", description: "Guests rave about our exquisite food, impeccable service, and the genuine care we bring to every dining experience." }
|
||
]}
|
||
animationType="blur-reveal"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
containerClassName="max-w-7xl mx-auto px-4"
|
||
titleClassName="text-4xl md:text-5xl font-bold text-foreground mb-4"
|
||
descriptionClassName="text-lg text-foreground/80 mb-12 max-w-3xl"
|
||
/>
|
||
</div>
|
||
|
||
<div id="menu" data-section="menu" className="w-full bg-background py-16 md:py-24">
|
||
<ProductCardOne
|
||
title="Our Culinary Offerings"
|
||
description="Explore our diverse menu featuring signature dishes from Arabic, Indian, and American cuisines, each prepared with passion and premium ingredients."
|
||
products={[
|
||
{ id: "breakfast", name: "Breakfast Buffet", price: "Fresh Daily", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-delicious-dessert-table_23-2148941589.jpg?_wi=1", imageAlt: "Luxurious breakfast buffet with pastries, fruits, and fresh ingredients" },
|
||
{ id: "arabic", name: "Arabic Cuisine", price: "Premium Selection", imageSrc: "http://img.b2bpic.net/free-photo/meat-cotlet-with-vegetables-red-basilic_114579-3204.jpg?_wi=1", imageAlt: "Traditional Arabic dishes beautifully plated and presented" },
|
||
{ id: "indian", name: "Indian Specialties", price: "Aromatic & Spiced", imageSrc: "http://img.b2bpic.net/free-photo/top-view-yummy-eggplant-rolls-with-tomatoes-seasonings_140725-135304.jpg?_wi=1", imageAlt: "Authentic Indian cuisine with vibrant colors and aromatic spices" },
|
||
{ id: "american", name: "American Favorites", price: "Gourmet Selection", imageSrc: "http://img.b2bpic.net/free-photo/fried-meat-with-creamy-mushroom-sauce-rice_140725-2100.jpg", imageAlt: "Premium American cuisine with sophisticated plating" },
|
||
{ id: "desserts", name: "Indulgent Desserts", price: "Artisan Crafted", imageSrc: "http://img.b2bpic.net/free-photo/top-view-delicious-creamy-cake-with-chocolate-raisins-light-dark-floor_140725-136347.jpg?_wi=1", imageAlt: "Gourmet desserts with elegant plating and artistic presentation" }
|
||
]}
|
||
gridVariant="three-columns-all-equal-width"
|
||
animationType="blur-reveal"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
containerClassName="max-w-7xl mx-auto px-4"
|
||
titleClassName="text-4xl md:text-5xl font-bold text-foreground mb-4"
|
||
descriptionClassName="text-lg text-foreground/80 mb-12 max-w-3xl"
|
||
cardClassName="bg-card rounded-lg overflow-hidden hover:shadow-xl transition-shadow"
|
||
imageClassName="w-full h-64 object-cover"
|
||
cardNameClassName="text-xl font-bold text-foreground p-4"
|
||
cardPriceClassName="text-secondary-cta font-semibold px-4 pb-4"
|
||
/>
|
||
</div>
|
||
|
||
<div id="testimonials" data-section="testimonials" className="w-full bg-card py-16 md:py-24">
|
||
<TestimonialCardSix
|
||
title="Guest Testimonials"
|
||
description="Hear from our valued guests about their exceptional dining experiences at Elysian Restaurant."
|
||
testimonials={[
|
||
{ id: "testimonial-1", name: "Sarah Ahmed", handle: "@sarahexploresdubai", testimonial: "Never expected we could have such a beautiful experience! The food is exquisite, reasonably priced, and the hospitality is unmatched. Elysian truly feels divine.", imageSrc: "http://img.b2bpic.net/free-photo/vertical-view-delicious-tuna-dish-with-glass-wine-cheese-set_8353-10584.jpg?_wi=2", imageAlt: "Guest enjoying a beautifully plated dish", icon: Star },
|
||
{ id: "testimonial-2", name: "Ahmed Al Sayyed", handle: "@staycation_lover", testimonial: "Very good breakfast experience inside Golden Sands Hotel. Ahmed Al Sayyed is extremely helpful! The service was impeccable and the quality of food exceeded our expectations.", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-delicious-dessert-table_23-2148941589.jpg?_wi=2", imageAlt: "Luxurious breakfast buffet setup", icon: Star },
|
||
{ id: "testimonial-3", name: "Jacqueline Smith", handle: "@familydiningadventures", testimonial: "The best restaurant ever. People truly care about everyone – important and rare! From our server Jacqueline to the chefs, every person made us feel valued.", imageSrc: "http://img.b2bpic.net/free-photo/lounge-lobby-area-library-sales-center_105762-1780.jpg?_wi=1", imageAlt: "Elegant restaurant dining room interior", icon: Star },
|
||
{ id: "testimonial-4", name: "Nandan Kumar", handle: "@foodie_sharjah", testimonial: "Exceptional culinary artistry combined with genuine hospitality. Nandan provided personalized recommendations that perfectly matched our preferences. A truly divine dining experience.", imageSrc: "http://img.b2bpic.net/free-photo/meat-cotlet-with-vegetables-red-basilic_114579-3204.jpg?_wi=2", imageAlt: "Beautifully presented Arabic dishes", icon: Star },
|
||
{ id: "testimonial-5", name: "Su Chen", handle: "@luxury_dining_critic", testimonial: "Affordable indulgence at its finest. The blend of Arabic, Indian, and American flavors is masterfully executed. Su's attentiveness made our evening unforgettable.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-yummy-eggplant-rolls-with-tomatoes-seasonings_140725-135304.jpg?_wi=2", imageAlt: "Aromatic Indian cuisine with vibrant presentation", icon: Star },
|
||
{ id: "testimonial-6", name: "Michael Johnson", handle: "@hoteltravelers", testimonial: "A gem within the Golden Sands Hotel. The valet service is seamless, the atmosphere is sophisticated yet relaxing, and the food quality is outstanding. Highly recommended!", imageSrc: "http://img.b2bpic.net/free-photo/top-view-delicious-creamy-cake-with-chocolate-raisins-light-dark-floor_140725-136347.jpg?_wi=2", imageAlt: "Artisan crafted gourmet dessert", icon: Star }
|
||
]}
|
||
animationType="blur-reveal"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
speed={50}
|
||
topMarqueeDirection="left"
|
||
containerClassName="max-w-7xl mx-auto px-4"
|
||
titleClassName="text-4xl md:text-5xl font-bold text-foreground mb-4"
|
||
descriptionClassName="text-lg text-foreground/80 mb-12 max-w-3xl"
|
||
cardClassName="bg-card rounded-lg p-6 shadow-md hover:shadow-lg transition-shadow min-w-80"
|
||
testimonialClassName="text-foreground italic mb-4 line-clamp-3"
|
||
imageClassName="w-12 h-12 rounded-full object-cover"
|
||
nameClassName="font-bold text-foreground"
|
||
handleClassName="text-foreground/60 text-sm"
|
||
/>
|
||
</div>
|
||
|
||
<div id="contact" data-section="contact" className="w-full bg-background py-16 md:py-24">
|
||
<ContactCTA
|
||
tag="Make a Reservation"
|
||
tagIcon={undefined}
|
||
tagAnimation="blur-reveal"
|
||
title="Reserve Your Table Today"
|
||
description="Join us for an unforgettable dining experience. Whether you prefer to reserve in advance or walk in, we welcome you with open arms and exceptional hospitality."
|
||
buttons={[
|
||
{ text: "Call +971 6 XXX XXXX", href: "tel:+971600000000" },
|
||
{ text: "WhatsApp Booking", href: "https://wa.me/971600000000" }
|
||
]}
|
||
buttonAnimation="blur-reveal"
|
||
background={{ variant: "radial-gradient" }}
|
||
useInvertedBackground={false}
|
||
containerClassName="max-w-4xl mx-auto px-4"
|
||
titleClassName="text-4xl md:text-5xl font-bold text-foreground mb-4"
|
||
descriptionClassName="text-lg text-foreground/80 mb-8 max-w-2xl"
|
||
buttonContainerClassName="flex flex-col md:flex-row gap-4"
|
||
buttonClassName="bg-primary-cta hover:bg-primary-cta/90 text-primary-cta-text px-8 py-3 rounded-lg transition-all inline-block"
|
||
buttonTextClassName="font-semibold"
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer" className="w-full bg-foreground/95 text-background py-12">
|
||
<FooterMedia
|
||
imageSrc="http://img.b2bpic.net/free-photo/lounge-lobby-area-library-sales-center_105762-1780.jpg?_wi=2"
|
||
imageAlt="Elegant Elysian Restaurant dining interior"
|
||
columns={[
|
||
{
|
||
title: "Navigation", items: [
|
||
{ label: "Home", href: "#" },
|
||
{ label: "Menu", href: "#menu" },
|
||
{ label: "About", href: "#about" },
|
||
{ label: "Experience", href: "#experience" }
|
||
]
|
||
},
|
||
{
|
||
title: "Quick Links", items: [
|
||
{ label: "Reserve Table", href: "#reserve" },
|
||
{ label: "Location & Parking", href: "#" },
|
||
{ label: "Facilities", href: "#" },
|
||
{ label: "Private Events", href: "#" }
|
||
]
|
||
},
|
||
{
|
||
title: "Contact Info", items: [
|
||
{ label: "Golden Sands Hotel, Sharjah", href: "#" },
|
||
{ label: "Phone: +971 6 XXX XXXX", href: "tel:+971600000000" },
|
||
{ label: "Email: info@elysian.ae", href: "mailto:info@elysian.ae" },
|
||
{ label: "Hours: 7AM - 11PM Daily", href: "#" }
|
||
]
|
||
},
|
||
{
|
||
title: "Follow Us", items: [
|
||
{ label: "Instagram", href: "https://instagram.com" },
|
||
{ label: "Facebook", href: "https://facebook.com" },
|
||
{ label: "WhatsApp", href: "https://wa.me/971600000000" },
|
||
{ label: "Newsletter", href: "#" }
|
||
]
|
||
}
|
||
]}
|
||
logoText="Elysian Restaurant"
|
||
copyrightText="© 2025 Elysian Restaurant. All rights reserved. Golden Sands Hotel, Sharjah."
|
||
containerClassName="max-w-7xl mx-auto px-4"
|
||
logoTextClassName="text-2xl font-bold text-foreground"
|
||
columnTitleClassName="font-bold text-foreground mb-4 text-lg"
|
||
columnItemClassName="text-foreground/80 hover:text-secondary-cta transition-colors"
|
||
copyrightTextClassName="text-foreground/60 text-sm"
|
||
/>
|
||
</div>
|
||
</ThemeProvider>
|
||
);
|
||
} |