Files
ce941e18-a2d4-4332-8ac2-96e…/src/app/page.tsx
2026-03-11 19:59:18 +00:00

352 lines
15 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import HeroLogo from "@/components/sections/hero/HeroLogo";
import SplitAbout from "@/components/sections/about/SplitAbout";
import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
import MetricCardEleven from "@/components/sections/metrics/MetricCardEleven";
import TestimonialCardTen from "@/components/sections/testimonial/TestimonialCardTen";
import FooterMedia from "@/components/sections/footer/FooterMedia";
import Link from "next/link";
import { Flame, Leaf, Award, Heart, Utensils, Wine, Cake, Zap } from "lucide-react";
export default function HomePage() {
const navItems = [
{ name: "Home", id: "home" },
{ name: "Menu", id: "/menu" },
{ name: "About", id: "about" },
{ name: "Gallery", id: "gallery" },
{ name: "Contact", id: "contact" },
];
const footerColumns = [
{
title: "Quick Links",
items: [
{ label: "Home", href: "/" },
{ label: "Menu", href: "/menu" },
{ label: "About", href: "#about" },
{ label: "Gallery", href: "#gallery" },
{ label: "Contact", href: "#contact" },
],
},
{
title: "Contact Info",
items: [
{ label: "Phone: +91-674-XXX-XXXX", href: "#" },
{ label: "Email: info@spiceandsoul.com", href: "mailto:info@spiceandsoul.com" },
{ label: "WhatsApp Order", href: "https://wa.me/91XXXXXXXXXX" },
{ label: "Location: Bhubaneswar, Odisha", href: "#" },
],
},
{
title: "Follow Us",
items: [
{ label: "Instagram", href: "https://instagram.com/spiceandsoul" },
{ label: "Facebook", href: "https://facebook.com/spiceandsoul" },
{ label: "Google Reviews", href: "#" },
{ label: "Subscribe", href: "#" },
],
},
];
return (
<ThemeProvider
defaultButtonVariant="hover-magnetic"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="compact"
sizing="mediumSizeLargeTitles"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={navItems}
button={{ text: "Order Now", href: "#contact" }}
brandName="Spice & Soul"
/>
</div>
<div id="hero" data-section="hero">
<HeroLogo
logoText="Spice & Soul"
description="Authentic Indian cuisine crafted with love and traditional spices. Experience culinary excellence in the heart of Bhubaneswar."
buttons={[
{ text: "Order Now", href: "#contact" },
{ text: "Book a Table", href: "#contact" },
]}
imageSrc="http://img.b2bpic.net/free-photo/pre-prepared-food-showcasing-ready-eat-delicious-meals-go_23-2151246077.jpg"
imageAlt="Delicious Indian curry dish"
showDimOverlay={true}
buttonAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<SplitAbout
title="About Our Restaurant"
description="Welcome to Spice & Soul, Bhubaneswar's premier destination for authentic Indian cuisine. Our story began with a passion for bringing traditional flavors and modern culinary techniques together."
tag="Our Heritage"
textboxLayout="default"
useInvertedBackground={false}
bulletPoints={[
{
title: "Traditional Recipes",
description:
"Recipes passed down through generations, prepared with authentic spices and techniques",
icon: Flame,
},
{
title: "Fresh Ingredients",
description:
"We source the finest ingredients daily from local suppliers to ensure quality and freshness",
icon: Leaf,
},
{
title: "Expert Chefs",
description:
"Our award-winning chefs bring decades of culinary expertise to every dish",
icon: Award,
},
{
title: "Warm Hospitality",
description:
"Every guest is treated like family with personalized service and attention to detail",
icon: Heart,
},
]}
imageSrc="http://img.b2bpic.net/free-photo/empty-dining-table-restaurant_53876-64723.jpg"
imageAlt="Restaurant interior ambiance"
mediaAnimation="slide-up"
imagePosition="right"
buttons={[{ text: "Learn More", href: "#menu" }]}
buttonAnimation="slide-up"
/>
</div>
<div id="menu" data-section="menu">
<FeatureHoverPattern
title="Our Specialties"
description="Explore our carefully curated menu featuring authentic Indian dishes, from traditional starters to delectable desserts"
tag="Menu"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
features={[
{
icon: Utensils,
title: "Starters",
description:
"Crispy samosas, pakoras, and kebabs prepared fresh with aromatic spices",
},
{
icon: Flame,
title: "Main Courses",
description:
"Creamy curries, tandoori specialties, and biryanis cooked to perfection",
},
{
icon: Wine,
title: "Beverages",
description:
"Traditional lassi, fresh fruit juices, and authentic Indian chai",
},
{
icon: Cake,
title: "Desserts",
description:
"Sweet gulab jamun, kheer, and traditional Indian mithai",
},
{
icon: Leaf,
title: "Vegetarian",
description:
"Paneer dishes, vegetable curries, and plant-based specialties",
},
{
icon: Zap,
title: "Signature Picks",
description:
"Chef's special recommendations for an unforgettable dining experience",
},
]}
/>
</div>
<div id="gallery" data-section="gallery">
<MetricCardEleven
title="Experience Spice & Soul"
description="Discover the ambiance, artistry, and authentic flavors that make our restaurant special"
tag="Gallery"
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
metrics={[
{
id: "1",
value: "15+",
title: "Years of Excellence",
description: "Serving the Bhubaneswar community",
imageSrc:
"http://img.b2bpic.net/free-photo/table-decorated-christmas_1162-202.jpg",
imageAlt: "Restaurant interior with warm lighting",
},
{
id: "2",
value: "50+",
title: "Menu Items",
description: "Authentic Indian cuisine varieties",
imageSrc:
"http://img.b2bpic.net/free-photo/chef-chopping-vegetables-cutting-board-preparing-ingredients_482257-121189.jpg",
imageAlt: "Modern restaurant kitchen and seating",
},
{
id: "3",
value: "5000+",
title: "Happy Customers",
description: "Satisfied guests enjoying meals",
imageSrc:
"http://img.b2bpic.net/free-photo/lovely-family-enjoying-new-year-party_23-2149173249.jpg",
imageAlt: "Customers dining and enjoying food",
},
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTen
title="What Our Customers Say"
description="Real experiences from our valued guests who visit us regularly"
tag="Reviews"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "1",
title: "Best Curry in Town",
quote:
"The butter chicken here is absolutely divine! Every bite melts in your mouth. The service is impeccable and the ambiance is perfect for family dinners. Highly recommend!",
name: "Priya Sharma",
role: "Local Food Blogger",
imageSrc:
"http://img.b2bpic.net/free-photo/portrait-happy-business-woman-posing-outdoors_23-2148603030.jpg",
imageAlt: "Priya Sharma",
},
{
id: "2",
title: "Authentic Flavors",
quote:
"Finally found a restaurant that serves authentic Indian food! The spices are perfect, not too overwhelming, and the staff treats you like family. Worth every rupee!",
name: "Rajesh Patel",
role: "Business Executive",
imageSrc:
"http://img.b2bpic.net/free-photo/portrait-cheerful-teenage-girl-sitting-cafe_1262-3048.jpg",
imageAlt: "Rajesh Patel",
},
{
id: "3",
title: "Perfect for Celebrations",
quote:
"We celebrated our anniversary here last month. The food was exceptional, the service was outstanding, and the entire evening was magical. We'll be back!",
name: "Anjali Mishra",
role: "College Professor",
imageSrc:
"http://img.b2bpic.net/free-photo/middle-aged-hispanic-business-person_23-2151098593.jpg",
imageAlt: "Anjali Mishra",
},
{
id: "4",
title: "A Hidden Gem",
quote:
"This place exceeded all my expectations. Fresh ingredients, traditional recipes, and the most welcoming staff I've encountered. Definitely my new favorite restaurant!",
name: "Vikram Singh",
role: "Software Engineer",
imageSrc:
"http://img.b2bpic.net/free-photo/browneyed-stylish-brunet-bearded-man-white-shirt-checkered-jacket-smiles-looks-into-camera-orange-background_197531-29376.jpg",
imageAlt: "Vikram Singh",
},
]}
/>
</div>
<div id="contact" data-section="contact">
{/* ContactSplit is used as a contact form section but we'll use FooterMedia as the contact section instead since it provides better newsletter integration */}
<div className="mx-auto px-4 md:px-6 py-16 md:py-24">
<div className="text-center mb-12">
<p className="text-sm font-semibold text-orange-500 mb-4">Get in Touch</p>
<h2 className="text-4xl md:text-5xl font-semibold mb-4">
Reserve Your Table or Order Online
</h2>
<p className="text-lg text-foreground/70 max-w-2xl mx-auto">
Book a memorable dining experience or place your order for delivery. Our team is ready to serve you with authentic Indian cuisine and warm hospitality.
</p>
</div>
<div className="grid md:grid-cols-2 gap-8 max-w-4xl mx-auto">
<div>
<h3 className="text-2xl font-semibold mb-6">Contact Information</h3>
<div className="space-y-4">
<p className="text-foreground/80">
<strong>Phone:</strong> <a href="tel:+91674XXXXXX" className="text-orange-500 hover:underline">+91-674-XXX-XXXX</a>
</p>
<p className="text-foreground/80">
<strong>Email:</strong> <a href="mailto:info@spiceandsoul.com" className="text-orange-500 hover:underline">info@spiceandsoul.com</a>
</p>
<p className="text-foreground/80">
<strong>Location:</strong> Bhubaneswar, Odisha, India
</p>
<p className="text-foreground/80">
<strong>WhatsApp:</strong> <a href="https://wa.me/91XXXXXXXXXX" target="_blank" rel="noopener noreferrer" className="text-orange-500 hover:underline">Order on WhatsApp</a>
</p>
</div>
<div className="mt-8">
<h4 className="font-semibold mb-4">Follow Us</h4>
<div className="flex gap-4">
<a href="https://instagram.com/spiceandsoul" target="_blank" rel="noopener noreferrer" className="text-orange-500 hover:underline">Instagram</a>
<a href="https://facebook.com/spiceandsoul" target="_blank" rel="noopener noreferrer" className="text-orange-500 hover:underline">Facebook</a>
</div>
</div>
</div>
<div className="bg-gradient-to-br from-orange-50 to-white rounded-lg p-8 border border-orange-100">
<h3 className="text-2xl font-semibold mb-6">Newsletter Signup</h3>
<p className="text-foreground/70 mb-6">
Subscribe to receive updates about our special offers, new menu items, and restaurant events.
</p>
<form className="space-y-4">
<input
type="email"
placeholder="Enter your email"
className="w-full px-4 py-3 border border-orange-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-orange-500"
required
/>
<button
type="submit"
className="w-full bg-orange-500 text-white px-6 py-3 rounded-lg font-semibold hover:bg-orange-600 transition-colors"
>
Subscribe
</button>
</form>
<p className="text-xs text-foreground/50 mt-4">
By subscribing, you agree to receive email updates. We respect your privacy.
</p>
</div>
</div>
</div>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="http://img.b2bpic.net/free-photo/top-view-tasty-cooked-potatoes-delicious-dish-with-greens-dark-surface-potato-dinner-dish-cooking-meal_140725-102130.jpg"
imageAlt="Delicious food spread"
logoText="Spice & Soul"
copyrightText="© 2025 Spice & Soul Restaurant. All rights reserved."
columns={footerColumns}
/>
</div>
</ThemeProvider>
);
}