Merge version_3 into main #2
279
src/app/page.tsx
279
src/app/page.tsx
@@ -2,8 +2,9 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import { useState } from "react";
|
||||
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
|
||||
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
||||
@@ -14,6 +15,8 @@ import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
||||
import { Award, Star, Users } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
const [isReservationModalOpen, setIsReservationModalOpen] = useState(false);
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-stagger"
|
||||
@@ -28,140 +31,162 @@ export default function LandingPage() {
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Menu", id: "menu" },
|
||||
{ name: "Reservations", id: "contact" },
|
||||
]}
|
||||
brandName="Más Italian Taste"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Menu", id: "menu" },
|
||||
{ name: "Reservations", id: "contact" },
|
||||
]}
|
||||
brandName="Más Italian Taste"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{ variant: "plain" }}
|
||||
title="A True Taste of Italy"
|
||||
description="Experience authentic Roman culinary tradition in an immersive dining setting."
|
||||
buttons={[
|
||||
{ text: "View Menu", href: "#menu" },
|
||||
{ text: "Book a Table", href: "#contact" },
|
||||
]}
|
||||
carouselItems={[
|
||||
{ id: "1", imageSrc: "http://img.b2bpic.net/free-photo/tasty-boiled-spaghetti-with-sausages-orange-plate_114579-68478.jpg", imageAlt: "Carbonara" },
|
||||
{ id: "2", imageSrc: "http://img.b2bpic.net/free-photo/view-delicious-anime-style-pizza_23-2151061952.jpg", imageAlt: "Pizza" },
|
||||
{ id: "3", imageSrc: "http://img.b2bpic.net/free-photo/pieces-pizza-table_23-2147772070.jpg", imageAlt: "Risotto" },
|
||||
{ id: "4", imageSrc: "http://img.b2bpic.net/free-photo/top-view-delicious-cheesecake-with-strawberry-chocolate-plate-red-shawl-dark-isolated-background_140725-136688.jpg", imageAlt: "Tiramisu" },
|
||||
{ id: "5", imageSrc: "http://img.b2bpic.net/free-photo/horizontal-shot-plate-with-canapes-with-ham-cherry-tomatoes-black-olives-decorated-with-rucola-rucoli-plant-edible-vegetables-bacon-jamon-appetizers-menu-restaurant_7502-5815.jpg", imageAlt: "Bruschetta" },
|
||||
{ id: "6", imageSrc: "http://img.b2bpic.net/free-photo/delicious-high-quality-wine-still-life_23-2149710957.jpg", imageAlt: "Wine" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{ variant: "plain" }}
|
||||
title="A True Taste of Italy"
|
||||
description="Experience authentic Roman culinary tradition in an immersive dining setting."
|
||||
buttons={[
|
||||
{ text: "View Menu", href: "#menu" },
|
||||
{ text: "Book a Table", onClick: () => setIsReservationModalOpen(true) },
|
||||
]}
|
||||
carouselItems={[
|
||||
{ id: "1", imageSrc: "http://img.b2bpic.net/free-photo/tasty-boiled-spaghetti-with-sausages-orange-plate_114579-68478.jpg", imageAlt: "Carbonara" },
|
||||
{ id: "2", imageSrc: "http://img.b2bpic.net/free-photo/view-delicious-anime-style-pizza_23-2151061952.jpg", imageAlt: "Pizza" },
|
||||
{ id: "3", imageSrc: "http://img.b2bpic.net/free-photo/pieces-pizza-table_23-2147772070.jpg", imageAlt: "Risotto" },
|
||||
{ id: "4", imageSrc: "http://img.b2bpic.net/free-photo/top-view-delicious-cheesecake-with-strawberry-chocolate-plate-red-shawl-dark-isolated-background_140725-136688.jpg", imageAlt: "Tiramisu" },
|
||||
{ id: "5", imageSrc: "http://img.b2bpic.net/free-photo/horizontal-shot-plate-with-canapes-with-ham-cherry-tomatoes-black-olives-decorated-with-rucola-rucoli-plant-edible-vegetables-bacon-jamon-appetizers-menu-restaurant_7502-5815.jpg", imageAlt: "Bruschetta" },
|
||||
{ id: "6", imageSrc: "http://img.b2bpic.net/free-photo/delicious-high-quality-wine-still-life_23-2149710957.jpg", imageAlt: "Wine" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={true}
|
||||
title="Our Story"
|
||||
description={[
|
||||
"Más Italian Taste was born from a passion for authentic Roman traditions. Every dish we serve is a tribute to the craftsmanship of our ancestors, brought to life by master chefs in the heart of Rome.", "We believe that fine dining is not just about the meal, but the journey of flavors and the warmth of the hospitality that surrounds it."]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={true}
|
||||
title="Our Story"
|
||||
description={[
|
||||
"Más Italian Taste was born from a passion for authentic Roman traditions. Every dish we serve is a tribute to the craftsmanship of our ancestors, brought to life by master chefs in the heart of Rome.",
|
||||
"We believe that fine dining is not just about the meal, but the journey of flavors and the warmth of the hospitality that surrounds it."]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="menu" data-section="menu">
|
||||
<ProductCardTwo
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "1", brand: "Signature", name: "Roman Carbonara", price: "€22", rating: 5, reviewCount: "1.2k", imageSrc: "http://img.b2bpic.net/free-photo/pasta-salad-with-tuna-corn-olives-bowl_123827-37213.jpg" },
|
||||
{ id: "2", brand: "Authentic", name: "Truffle Pizza", price: "€28", rating: 5, reviewCount: "890", imageSrc: "http://img.b2bpic.net/free-photo/close-up-melted-cheese-pizza_23-2149286881.jpg" },
|
||||
{ id: "3", brand: "Classic", name: "Wild Mushroom Risotto", price: "€25", rating: 4, reviewCount: "750", imageSrc: "http://img.b2bpic.net/free-photo/sideview-pasta-with-tomato-sauce-parmesan-cheese-white-bowl_140725-11824.jpg" },
|
||||
{ id: "4", brand: "Dolce", name: "Artisan Tiramisu", price: "€20", rating: 5, reviewCount: "2.1k", imageSrc: "http://img.b2bpic.net/free-photo/cake-cake-with-berries-powdered-sugar-chocolate-waffles-green-sauce_140725-73660.jpg" },
|
||||
{ id: "5", brand: "Antipasti", name: "Tuscan Bruschetta", price: "€20", rating: 4, reviewCount: "500", imageSrc: "http://img.b2bpic.net/free-photo/two-tasty-toast-with-fried-vegetables-wooden-plate_114579-86082.jpg" },
|
||||
{ id: "6", brand: "Primi", name: "Handmade Lasagna", price: "€26", rating: 5, reviewCount: "1.5k", imageSrc: "http://img.b2bpic.net/free-photo/tasty-spaghetti-with-sliced-sausages-black-bowl_114579-68535.jpg" },
|
||||
]}
|
||||
title="Interactive Menu"
|
||||
description="Explore our curated selection of signature Italian dishes."
|
||||
/>
|
||||
</div>
|
||||
<div id="menu" data-section="menu">
|
||||
<ProductCardTwo
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "1", brand: "Signature", name: "Roman Carbonara", price: "€22", rating: 5, reviewCount: "1.2k", imageSrc: "http://img.b2bpic.net/free-photo/pasta-salad-with-tuna-corn-olives-bowl_123827-37213.jpg" },
|
||||
{ id: "2", brand: "Authentic", name: "Truffle Pizza", price: "€28", rating: 5, reviewCount: "890", imageSrc: "http://img.b2bpic.net/free-photo/close-up-melted-cheese-pizza_23-2149286881.jpg" },
|
||||
{ id: "3", brand: "Classic", name: "Wild Mushroom Risotto", price: "€25", rating: 4, reviewCount: "750", imageSrc: "http://img.b2bpic.net/free-photo/sideview-pasta-with-tomato-sauce-parmesan-cheese-white-bowl_140725-11824.jpg" },
|
||||
{ id: "4", brand: "Dolce", name: "Artisan Tiramisu", price: "€20", rating: 5, reviewCount: "2.1k", imageSrc: "http://img.b2bpic.net/free-photo/cake-cake-with-berries-powdered-sugar-chocolate-waffles-green-sauce_140725-73660.jpg" },
|
||||
{ id: "5", brand: "Antipasti", name: "Tuscan Bruschetta", price: "€20", rating: 4, reviewCount: "500", imageSrc: "http://img.b2bpic.net/free-photo/two-tasty-toast-with-fried-vegetables-wooden-plate_114579-86082.jpg" },
|
||||
{ id: "6", brand: "Primi", name: "Handmade Lasagna", price: "€26", rating: 5, reviewCount: "1.5k", imageSrc: "http://img.b2bpic.net/free-photo/tasty-spaghetti-with-sliced-sausages-black-bowl_114579-68535.jpg" },
|
||||
]}
|
||||
title="Interactive Menu"
|
||||
description="Explore our curated selection of signature Italian dishes."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="depth-3d"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{ id: "1", value: "4.8", title: "Guest Rating", description: "Across 5,000+ reviews", icon: Star },
|
||||
{ id: "2", value: "20", title: "Years Tradition", description: "Of Roman heritage", icon: Award },
|
||||
{ id: "3", value: "150", title: "Daily Guests", description: "Creating memories", icon: Users },
|
||||
]}
|
||||
title="Dine With Excellence"
|
||||
description="Consistently recognized as a premier destination for authentic Roman dining."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="depth-3d"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{ id: "1", value: "4.8", title: "Guest Rating", description: "Across 5,000+ reviews", icon: Star },
|
||||
{ id: "2", value: "20", title: "Years Tradition", description: "Of Roman heritage", icon: Award },
|
||||
{ id: "3", value: "150", title: "Daily Guests", description: "Creating memories", icon: Users },
|
||||
]}
|
||||
title="Dine With Excellence"
|
||||
description="Consistently recognized as a premier destination for authentic Roman dining."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
animationType="depth-3d"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Elena Rossi", role: "Food Critic", company: "La Cucina", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/boiled-spaghetti-with-sliced-sausages-blue-plate_114579-68443.jpg" },
|
||||
{ id: "2", name: "Markus Weber", role: "Traveler", company: "Globetrotter", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/bacon-arugula-leaves-pizza-with-slices-yellow-bell-pepper-tomato_23-2148076089.jpg" },
|
||||
{ id: "3", name: "Sarah Miller", role: "Food Blogger", company: "Tasteful", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/side-view-mushroom-pasta-dark-round_176474-3153.jpg" },
|
||||
{ id: "4", name: "Luca Moretti", role: "Local Resident", company: "Roman Life", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-delicious-cheesecake-with-strawberry-chocolate-plate-bowls_140725-105618.jpg" },
|
||||
{ id: "5", name: "Sofia Conti", role: "Chef", company: "Culinary Lab", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/top-view-cherry-cake-slices-with-cream-fresh-cherries-inside-round-plate-pink-desk-cake-biscuit-sugar_140725-28437.jpg" },
|
||||
]}
|
||||
kpiItems={[
|
||||
{ value: "4.8/5", label: "Avg Rating" },
|
||||
{ value: "5000+", label: "Happy Guests" },
|
||||
{ value: "Top 10", label: "Rome Dining" },
|
||||
]}
|
||||
title="Guest Experiences"
|
||||
description="Discover why our guests return to our tables in Rome."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
animationType="depth-3d"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Elena Rossi", role: "Food Critic", company: "La Cucina", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/boiled-spaghetti-with-sliced-sausages-blue-plate_114579-68443.jpg" },
|
||||
{ id: "2", name: "Markus Weber", role: "Traveler", company: "Globetrotter", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/bacon-arugula-leaves-pizza-with-slices-yellow-bell-pepper-tomato_23-2148076089.jpg" },
|
||||
{ id: "3", name: "Sarah Miller", role: "Food Blogger", company: "Tasteful", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/side-view-mushroom-pasta-dark-round_176474-3153.jpg" },
|
||||
{ id: "4", name: "Luca Moretti", role: "Local Resident", company: "Roman Life", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-delicious-cheesecake-with-strawberry-chocolate-plate-bowls_140725-105618.jpg" },
|
||||
{ id: "5", name: "Sofia Conti", role: "Chef", company: "Culinary Lab", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/top-view-cherry-cake-slices-with-cream-fresh-cherries-inside-round-plate-pink-desk-cake-biscuit-sugar_140725-28437.jpg" },
|
||||
]}
|
||||
kpiItems={[
|
||||
{ value: "4.8/5", label: "Avg Rating" },
|
||||
{ value: "5000+", label: "Happy Guests" },
|
||||
{ value: "Top 10", label: "Rome Dining" },
|
||||
]}
|
||||
title="Guest Experiences"
|
||||
description="Discover why our guests return to our tables in Rome."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="gallery" data-section="gallery">
|
||||
<BlogCardOne
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
title="Atmosphere & Vibe"
|
||||
description="Step into our world of elegance and tradition."
|
||||
blogs={[
|
||||
{ id: "g1", category: "Gallery", title: "The Dining Room", excerpt: "Elegant modern setting.", imageSrc: "http://img.b2bpic.net/free-photo/classic-luxury-style-restaurant-with-tables-chairs_140725-9389.jpg", authorName: "Más", authorAvatar: "http://img.b2bpic.net/free-photo/wide-restaurant-hall-with-wooden-table-chairs-6-persons_140725-8910.jpg", date: "2024" },
|
||||
{ id: "g2", category: "Gallery", title: "Our Garden Terrace", excerpt: "Relaxing outdoor dining.", imageSrc: "http://img.b2bpic.net/free-photo/there-are-glasses-wine-water-table-with-white-cloth-are-ready-dining_613910-3426.jpg", authorName: "Más", authorAvatar: "http://img.b2bpic.net/free-photo/wine-splashes-glass-standing-black-background_1304-2873.jpg", date: "2024" },
|
||||
{ id: "g3", category: "Gallery", title: "The Chef's Corner", excerpt: "Craftsmanship at work.", imageSrc: "http://img.b2bpic.net/free-photo/various-dessert-glass-white-wine_140725-4306.jpg", authorName: "Más", authorAvatar: "http://img.b2bpic.net/free-photo/side-view-table-with-cheese-plate-pate-it_140725-12866.jpg", date: "2024" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="gallery" data-section="gallery">
|
||||
<BlogCardOne
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
title="Atmosphere & Vibe"
|
||||
description="Step into our world of elegance and tradition."
|
||||
blogs={[
|
||||
{ id: "g1", category: "Gallery", title: "The Dining Room", excerpt: "Elegant modern setting.", imageSrc: "http://img.b2bpic.net/free-photo/classic-luxury-style-restaurant-with-tables-chairs_140725-9389.jpg", authorName: "Más", authorAvatar: "http://img.b2bpic.net/free-photo/wide-restaurant-hall-with-wooden-table-chairs-6-persons_140725-8910.jpg", date: "2024" },
|
||||
{ id: "g2", category: "Gallery", title: "Our Garden Terrace", excerpt: "Relaxing outdoor dining.", imageSrc: "http://img.b2bpic.net/free-photo/there-are-glasses-wine-water-table-with-white-cloth-are-ready-dining_613910-3426.jpg", authorName: "Más", authorAvatar: "http://img.b2bpic.net/free-photo/wine-splashes-glass-standing-black-background_1304-2873.jpg", date: "2024" },
|
||||
{ id: "g3", category: "Gallery", title: "The Chef's Corner", excerpt: "Craftsmanship at work.", imageSrc: "http://img.b2bpic.net/free-photo/various-dessert-glass-white-wine_140725-4306.jpg", authorName: "Más", authorAvatar: "http://img.b2bpic.net/free-photo/side-view-table-with-cheese-plate-pate-it_140725-12866.jpg", date: "2024" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Visit Us"
|
||||
title="Reserve Your Table"
|
||||
description="Open until 1 AM daily. Located in the heart of Rome. Book your reservation today."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/luxurious-wedding-banquet-elegant-crockery-silverware-glassware-generated-by-ai_188544-17315.jpg"
|
||||
buttonText="Reserve Now"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
title="Reserve Your Table"
|
||||
description="Open until 1 AM daily. Let us know when you'd like to visit."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Full Name", required: true },
|
||||
{ name: "date", type: "date", placeholder: "Date", required: true },
|
||||
{ name: "time", type: "time", placeholder: "Time", required: true }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/luxurious-wedding-banquet-elegant-crockery-silverware-glassware-generated-by-ai_188544-17315.jpg"
|
||||
buttonText="Submit Request"
|
||||
onSubmit={(data) => { console.log("Reservation requested:", data); setIsReservationModalOpen(false); }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Más Italian Taste"
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "Contact Us", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Más Italian Taste"
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "Contact Us", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
{isReservationModalOpen && (
|
||||
<div className="fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/50">
|
||||
<div className="bg-white p-6 rounded-lg max-w-md w-full">
|
||||
<ContactSplitForm
|
||||
title="Book Your Table"
|
||||
description="Fill out the form below to confirm your reservation."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Full Name", required: true },
|
||||
{ name: "guests", type: "number", placeholder: "Number of Guests", required: true },
|
||||
{ name: "date", type: "date", placeholder: "Date", required: true },
|
||||
{ name: "time", type: "time", placeholder: "Time", required: true }
|
||||
]}
|
||||
buttonText="Confirm Reservation"
|
||||
onSubmit={(data) => { console.log("Reservation confirmed:", data); setIsReservationModalOpen(false); }}
|
||||
/>
|
||||
<button onClick={() => setIsReservationModalOpen(false)} className="mt-4 w-full">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user