202 lines
11 KiB
TypeScript
202 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
|
import HeroCentered from "@/components/sections/hero/HeroCentered";
|
|
import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
|
|
import ProductCardFour from "@/components/sections/product/ProductCardFour";
|
|
import TestimonialCardTen from "@/components/sections/testimonial/TestimonialCardTen";
|
|
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
|
|
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
|
|
import FooterBase from "@/components/sections/footer/FooterBase";
|
|
import { Star, DollarSign, MapPin } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="expand-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="rounded"
|
|
contentWidth="mediumLarge"
|
|
sizing="largeSizeMediumTitles"
|
|
background="circleGradient"
|
|
cardStyle="gradient-radial"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
brandName="Al Ostedh"
|
|
navItems={[
|
|
{ name: "Menu", id: "featured" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "Reviews", id: "testimonials" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
button={{ text: "Call Now", href: "tel:+21671234567" }}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroCentered
|
|
title="Authentic Tunisian Cuisine in the Heart of Tunis"
|
|
description="Experience the flavors of local tradition at Al Ostedh. Premium meals at budget-friendly prices. Open daily for lunch and dinner."
|
|
background={{ variant: "radial-gradient" }}
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/vegetable-salad-with-tomato-sauteed-bell-peppers-parsley-lemon-olive-oil_141793-2288.jpg", alt: "Delicious Tunisian food dish"
|
|
}
|
|
]}
|
|
buttons={[
|
|
{ text: "Call Now: +216 71 123 4567", href: "tel:+21671234567" },
|
|
{ text: "Reserve Table", href: "#contact" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
ariaLabel="Al Ostedh Restaurant hero section"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextSplitAbout
|
|
title="Our Story"
|
|
description={[
|
|
"Al Ostedh has been a beloved local gem in Tunis for over a decade, serving authentic Tunisian cuisine with a passion for quality and tradition.", "Every dish is prepared fresh using locally-sourced ingredients, honoring time-tested recipes passed down through generations. We believe dining should be affordable, welcoming, and memorable.", "Located at 15 Rue de La Palestine, our intimate restaurant welcomes families, couples, and friends seeking genuine Tunisian hospitality and flavor."
|
|
]}
|
|
useInvertedBackground={false}
|
|
ariaLabel="About Al Ostedh Restaurant"
|
|
/>
|
|
</div>
|
|
|
|
<div id="featured" data-section="featured">
|
|
<ProductCardFour
|
|
title="Featured Dishes"
|
|
description="Discover our most popular menu items loved by locals and visitors alike"
|
|
products={[
|
|
{
|
|
id: "couscous-royale", name: "Couscous Royale", price: "TND 18", variant: "Lamb & Vegetables", imageSrc: "http://img.b2bpic.net/free-photo/top-view-boiled-rice-plate-with-boiled-potatoes-pumpkin_141793-3942.jpg", imageAlt: "Couscous Royale with lamb and fresh vegetables"
|
|
},
|
|
{
|
|
id: "brik-egg", name: "Brik à l'Œuf", price: "TND 12", variant: "Crispy Pastry", imageSrc: "http://img.b2bpic.net/free-photo/georgian-penovani-khachapuri-layered-board-marble_114579-86953.jpg", imageAlt: "Golden crispy brik with egg filling"
|
|
},
|
|
{
|
|
id: "tagine-lamb", name: "Tagine Agneau", price: "TND 16", variant: "Slow-Cooked Lamb", imageSrc: "http://img.b2bpic.net/free-photo/top-view-from-afar-pilaf-pilaf-tablecloth-tomatoes-garlic-lemon-oil-fork_140725-78897.jpg", imageAlt: "Traditional tagine with tender lamb"
|
|
}
|
|
]}
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
ariaLabel="Featured dishes section"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTen
|
|
title="What Our Guests Say"
|
|
description="Real reviews from satisfied customers who've enjoyed authentic Tunisian dining at Al Ostedh"
|
|
testimonials={[
|
|
{
|
|
id: "testimonial-1", title: "Excellent Food & Service", quote: "The couscous was absolutely delicious and the prices are so reasonable. We'll definitely be back!", name: "Fatima Ben Ali", role: "Local Resident", imageSrc: "http://img.b2bpic.net/free-photo/pretty-attractive-young-mixed-race-model-with-large-afro-wearing-navy-jacket-her-naked-body-shorts_633478-1216.jpg", imageAlt: "Fatima Ben Ali"
|
|
},
|
|
{
|
|
id: "testimonial-2", title: "Authentic & Welcoming", quote: "Best brik I've had in years. The staff treated us like family. Highly recommended!", name: "Sophie Moreau", role: "Tourist", imageSrc: "http://img.b2bpic.net/free-photo/business-woman-standing_1187-1543.jpg", imageAlt: "Sophie Moreau"
|
|
},
|
|
{
|
|
id: "testimonial-3", title: "Perfect for Special Occasions", quote: "We celebrated our anniversary here. The atmosphere is warm and the food is exceptional.", name: "Mohamed Saidi", role: "Regular Customer", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-posing-studio_23-2150275677.jpg", imageAlt: "Mohamed Saidi"
|
|
},
|
|
{
|
|
id: "testimonial-4", title: "Must-Visit Local Treasure", quote: "Authentic Tunisian cuisine at affordable prices. A true gem in the heart of Tunis!", name: "Aisha Zahra", role: "Food Enthusiast", imageSrc: "http://img.b2bpic.net/free-photo/happy-bearded-man-busines-clothes-with-crossed-arms-looking-camera-gray_171337-11335.jpg", imageAlt: "Aisha Zahra"
|
|
}
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
ariaLabel="Customer testimonials section"
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardOne
|
|
title="Why Choose Al Ostedh"
|
|
description="Trusted by locals and visitors for authentic taste, value, and hospitality"
|
|
metrics={[
|
|
{
|
|
id: "rating", value: "4.3★", title: "Excellent Rating", description: "Rated 4.3 out of 5 from 200+ reviews", icon: Star
|
|
},
|
|
{
|
|
id: "price", value: "TND 10-20", title: "Budget Friendly", description: "Authentic meals at affordable local prices", icon: DollarSign
|
|
},
|
|
{
|
|
id: "location", value: "Central", title: "Prime Location", description: "15 Rue de La Palestine, easy access & parking", icon: MapPin
|
|
}
|
|
]}
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
ariaLabel="Restaurant trust metrics section"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
title="Reserve Your Table or Send Inquiry"
|
|
description="Book a table online or send us a message. We'll respond quickly to confirm your reservation."
|
|
inputs={[
|
|
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
|
{ name: "phone", type: "tel", placeholder: "+216 XX XXX XXXX", required: true },
|
|
{ name: "date", type: "date", placeholder: "Preferred Date", required: true },
|
|
{ name: "time", type: "time", placeholder: "Preferred Time", required: true }
|
|
]}
|
|
textarea={{
|
|
name: "message", placeholder: "Special requests or dietary restrictions...", rows: 4
|
|
}}
|
|
useInvertedBackground={false}
|
|
imageSrc="http://img.b2bpic.net/free-photo/high-angle-teacups-antique-store_23-2149640750.jpg"
|
|
imageAlt="Al Ostedh Restaurant interior dining area"
|
|
mediaAnimation="slide-up"
|
|
mediaPosition="right"
|
|
buttonText="Reserve Now"
|
|
ariaLabel="Contact and reservation form"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBase
|
|
logoText="Al Ostedh"
|
|
copyrightText="© 2025 Al Ostedh Restaurant | All rights reserved"
|
|
columns={[
|
|
{
|
|
title: "Location", items: [
|
|
{ label: "15 Rue de La Palestine, Tunis 1002", href: "https://maps.google.com/?q=15+Rue+de+La+Palestine+Tunis" },
|
|
{ label: "Get Directions", href: "https://maps.google.com/?q=15+Rue+de+La+Palestine+Tunis" }
|
|
]
|
|
},
|
|
{
|
|
title: "Contact", items: [
|
|
{ label: "Phone: +216 71 123 4567", href: "tel:+21671234567" },
|
|
{ label: "WhatsApp: +216 71 123 4567", href: "https://wa.me/21671234567" },
|
|
{ label: "Email: info@alostedh.tn", href: "mailto:info@alostedh.tn" }
|
|
]
|
|
},
|
|
{
|
|
title: "Hours", items: [
|
|
{ label: "Lunch: 12:00 PM - 3:00 PM", href: "#" },
|
|
{ label: "Dinner: 6:00 PM - 11:00 PM", href: "#" },
|
|
{ label: "Closed Mondays", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Legal", items: [
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms of Service", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
ariaLabel="Site footer"
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|