399 lines
13 KiB
TypeScript
399 lines
13 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
|
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
|
|
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
|
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
|
import { Award, Shield, Sparkles } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="elastic-effect"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="soft"
|
|
contentWidth="medium"
|
|
sizing="mediumLarge"
|
|
background="aurora"
|
|
cardStyle="gradient-bordered"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="normal"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{
|
|
name: "Home",
|
|
id: "hero",
|
|
},
|
|
{
|
|
name: "About",
|
|
id: "about",
|
|
},
|
|
{
|
|
name: "Menu",
|
|
id: "menu",
|
|
},
|
|
{
|
|
name: "Contact",
|
|
id: "contact",
|
|
},
|
|
]}
|
|
brandName="Felhi"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitDualMedia
|
|
background={{
|
|
variant: "radial-gradient",
|
|
}}
|
|
title="Authentic Flavors, Timeless Tradition."
|
|
description="Experience the true essence of Tunisian gastronomy at Felhi. Where heritage meets refined dining."
|
|
tag="Since 1995"
|
|
mediaItems={[
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/plate-fried-lamb-slices-with-yellow-red-green-bell-peppers-herbs_140725-8644.jpg?_wi=1",
|
|
imageAlt: "Traditional Tunisian Dish",
|
|
},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/restaurant-hall-with-turquoise-chairs-white-walls-french-windows-curtains_140725-8450.jpg?_wi=1",
|
|
imageAlt: "Elegant Dining Interior",
|
|
},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/mashed-chicken-soup-inside-transparent-bowl-served-with-marinated-food_114579-1541.jpg",
|
|
imageAlt: "Mashed chicken soup inside a transparent bowl served with marinated food",
|
|
},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/aubergine-roll-with-creamy-cheese-walnut_140725-10678.jpg",
|
|
imageAlt: "aubergine roll with creamy cheese and walnut",
|
|
},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/side-view-stuffed-vegetables-with-meat-rice-clay-bowl_140725-12056.jpg",
|
|
imageAlt: "Side view of stuffed vegetables with meat and rice in clay bowl",
|
|
},
|
|
]}
|
|
mediaAnimation="slide-up"
|
|
rating={5}
|
|
ratingText="Rated 5 stars by our guests"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MetricSplitMediaAbout
|
|
useInvertedBackground={true}
|
|
title="Our Passion for Excellence"
|
|
description="Felhi brings the vibrant culture of Tunisia to your plate. Using locally sourced ingredients to curate a dining journey that celebrates our roots."
|
|
metrics={[
|
|
{
|
|
value: "28",
|
|
title: "Years of Experience",
|
|
},
|
|
{
|
|
value: "50+",
|
|
title: "Traditional Recipes",
|
|
},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/chef-working-together-professional-kitchen_23-2149727993.jpg?_wi=1"
|
|
imageAlt="Chef preparing traditional food"
|
|
mediaAnimation="slide-up"
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwentyFive
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "Premium Ingredients",
|
|
description: "Hand-picked, local, organic produce.",
|
|
icon: Shield,
|
|
mediaItems: [
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/top-view-bowls-with-spices-turmeric-black-pepper-salt-red-pepper-powder-cut-vegetables-white-surface_140725-63077.jpg",
|
|
},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/mortar-pestle-near-spices_23-2147894645.jpg",
|
|
},
|
|
],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/plate-fried-lamb-slices-with-yellow-red-green-bell-peppers-herbs_140725-8644.jpg?_wi=2",
|
|
imageAlt: "fresh organic vegetables market produce",
|
|
},
|
|
{
|
|
title: "Artisan Chefs",
|
|
description: "Mastering the art of Tunisian spices.",
|
|
icon: Award,
|
|
mediaItems: [
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/male-chef-kitchen-cooking_23-2148934694.jpg",
|
|
},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/small-business-equipment-making-coffee_23-2149458146.jpg",
|
|
},
|
|
],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/restaurant-hall-with-turquoise-chairs-white-walls-french-windows-curtains_140725-8450.jpg?_wi=2",
|
|
imageAlt: "fresh organic vegetables market produce",
|
|
},
|
|
{
|
|
title: "Atmosphere",
|
|
description: "Elegant setting with warm hospitality.",
|
|
icon: Sparkles,
|
|
mediaItems: [
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-table-assortment-with-plant_23-2148914895.jpg",
|
|
},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/side-view-people-sitting-restaurant_23-2149930183.jpg",
|
|
},
|
|
],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/chef-working-together-professional-kitchen_23-2149727993.jpg?_wi=2",
|
|
imageAlt: "fresh organic vegetables market produce",
|
|
},
|
|
]}
|
|
title="What Defines Felhi"
|
|
description="Exquisite dining experiences curated for perfection."
|
|
/>
|
|
</div>
|
|
|
|
<div id="menu" data-section="menu">
|
|
<ProductCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground={true}
|
|
products={[
|
|
{
|
|
id: "p1",
|
|
brand: "Main",
|
|
name: "Couscous Royal",
|
|
price: "45 DT",
|
|
rating: 5,
|
|
reviewCount: "120",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/steamed-rice-plate-table-with-fish-pumpkin-side-view_141793-3196.jpg",
|
|
},
|
|
{
|
|
id: "p2",
|
|
brand: "Appetizer",
|
|
name: "Brik à l'Oeuf",
|
|
price: "12 DT",
|
|
rating: 5,
|
|
reviewCount: "89",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/top-view-baked-egg-breads-fresh-off-oven-brown-wooden-desk-dough-eggs-bread-bun-breakfast_140725-74379.jpg",
|
|
},
|
|
{
|
|
id: "p3",
|
|
brand: "Main",
|
|
name: "Mechouia Salad",
|
|
price: "15 DT",
|
|
rating: 4,
|
|
reviewCount: "65",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/top-view-fresh-apple-salad-bowl-dark-blue-background_140725-144771.jpg",
|
|
},
|
|
{
|
|
id: "p4",
|
|
brand: "Dessert",
|
|
name: "Makroudh Selection",
|
|
price: "8 DT",
|
|
rating: 5,
|
|
reviewCount: "150",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/tasty-sweet-biscuits-wooden-board_114579-41860.jpg",
|
|
},
|
|
{
|
|
id: "p5",
|
|
brand: "Main",
|
|
name: "Lamb Tagine",
|
|
price: "38 DT",
|
|
rating: 5,
|
|
reviewCount: "92",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/top-view-azerbaijani-dish-bozbash-lamb-stew-with-chickpeas_140725-5086.jpg",
|
|
},
|
|
{
|
|
id: "p6",
|
|
brand: "Drink",
|
|
name: "Mint Tea Pot",
|
|
price: "5 DT",
|
|
rating: 5,
|
|
reviewCount: "200",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-glass-with-hot-water-lemon_23-2148759249.jpg",
|
|
},
|
|
]}
|
|
title="Our Signature Menu"
|
|
description="Exquisite creations featuring Tunisian heritage."
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardEleven
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
metrics={[
|
|
{
|
|
id: "m1",
|
|
value: "12k+",
|
|
title: "Happy Guests",
|
|
description: "Served over the past two decades.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/informal-talk-with-best-friends-restaurant-warm-summer-day_8353-9702.jpg",
|
|
},
|
|
{
|
|
id: "m2",
|
|
value: "500",
|
|
title: "Events Hosted",
|
|
description: "Weddings and special occasions.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/luxurious-wedding-banquet-elegant-crockery-silverware-glassware-generated-by-ai_188544-17315.jpg",
|
|
},
|
|
{
|
|
id: "m3",
|
|
value: "4.9",
|
|
title: "Avg. Rating",
|
|
description: "Based on verified reviews.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/media-marketing-internet-digital-global_53876-132202.jpg",
|
|
},
|
|
]}
|
|
title="Our Journey in Numbers"
|
|
description="Building a legacy one dish at a time."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardFifteen
|
|
useInvertedBackground={true}
|
|
testimonial="An incredible experience. The flavors took me right back to Tunis. A must-visit place for any authentic food enthusiast."
|
|
rating={5}
|
|
author="Amine Ben Youssef"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/pleased-successful-female-administrator-office_273609-4124.jpg",
|
|
alt: "Sarah",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/modern-woman-smiling-close-up_23-2148369441.jpg",
|
|
alt: "John",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/beautiful-woman-carrying-shopping-bags_23-2148660763.jpg",
|
|
alt: "Emily",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/portrait-smiling-waitress_107420-12307.jpg",
|
|
alt: "Mike",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/attractive-young-woman-with-charming-smile-feeling-happy-free-after-graduating-university-relaxing-cafe-waiting-food-making-plans-future-ginger-woman-having-rest-indoors_273609-481.jpg",
|
|
alt: "Customer profile five",
|
|
},
|
|
]}
|
|
ratingAnimation="slide-up"
|
|
avatarsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitMedia
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "q1",
|
|
title: "Do I need a reservation?",
|
|
content: "Yes, for weekends we highly recommend booking in advance.",
|
|
},
|
|
{
|
|
id: "q2",
|
|
title: "Do you offer catering?",
|
|
content: "Absolutely, we cater for events large and small.",
|
|
},
|
|
{
|
|
id: "q3",
|
|
title: "Is the menu seasonal?",
|
|
content: "Yes, we update our ingredients based on local availability.",
|
|
},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/welcome-open-sign-hanging_23-2149168995.jpg"
|
|
title="Common Questions"
|
|
description="Everything you need to know about Felhi."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
useInvertedBackground={true}
|
|
title="Reserve Your Table"
|
|
description="Send us your request, and we will get back to you shortly."
|
|
inputs={[
|
|
{
|
|
name: "name",
|
|
type: "text",
|
|
placeholder: "Your Full Name",
|
|
},
|
|
{
|
|
name: "email",
|
|
type: "email",
|
|
placeholder: "Email Address",
|
|
},
|
|
{
|
|
name: "phone",
|
|
type: "tel",
|
|
placeholder: "Phone Number",
|
|
},
|
|
]}
|
|
textarea={{
|
|
name: "message",
|
|
placeholder: "Your message or special requests...",
|
|
}}
|
|
imageSrc="http://img.b2bpic.net/free-photo/couple-ordering-food-restaurant_23-2149269233.jpg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBase
|
|
columns={[
|
|
{
|
|
title: "Links",
|
|
items: [
|
|
{
|
|
label: "Home",
|
|
href: "#hero",
|
|
},
|
|
{
|
|
label: "Menu",
|
|
href: "#menu",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Contact",
|
|
items: [
|
|
{
|
|
label: "Reservation",
|
|
href: "#contact",
|
|
},
|
|
{
|
|
label: "Support",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
logoText="Felhi"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|