Compare commits
10 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 461c06cc89 | |||
| 1a57652e2f | |||
| 8763be04b3 | |||
| 3e4ab4068b | |||
| 29eb0ca9e4 | |||
| f537a2e2a5 | |||
| 22fe86e426 | |||
| f7ed0a8caa | |||
| 6c3954ef28 | |||
| 4fefb25286 |
@@ -8,44 +8,31 @@ import FooterCard from '@/components/sections/footer/FooterCard';
|
|||||||
|
|
||||||
export default function AboutPage() {
|
export default function AboutPage() {
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="reveal-blur" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
|
||||||
defaultButtonVariant="text-stagger"
|
|
||||||
defaultTextAnimation="reveal-blur"
|
|
||||||
borderRadius="soft"
|
|
||||||
contentWidth="compact"
|
|
||||||
sizing="largeSmall"
|
|
||||||
background="blurBottom"
|
|
||||||
cardStyle="glass-depth"
|
|
||||||
primaryButtonStyle="primary-glow"
|
|
||||||
secondaryButtonStyle="solid"
|
|
||||||
headingFontWeight="normal"
|
|
||||||
>
|
|
||||||
<ReactLenis root>
|
<ReactLenis root>
|
||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav">
|
||||||
<NavbarLayoutFloatingInline
|
<NavbarLayoutFloatingInline
|
||||||
navItems={[
|
navItems={[
|
||||||
{ name: "Our Story", id: "/about" },
|
{ name: "Home", id: "/" },
|
||||||
{ name: "Menu", id: "/menu" },
|
{ name: "About", id: "/about" },
|
||||||
{ name: "Events", id: "/events" },
|
{ name: "Events", id: "/events" },
|
||||||
{ name: "Contact", id: "/contact" },
|
{ name: "Contact", id: "/contact" },
|
||||||
]}
|
]}
|
||||||
brandName="The Table"
|
brandName="The Table"
|
||||||
button={{ text: "Order Now", href: "/menu" }}
|
button={{ text: "Book Now", href: "/contact" }}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="about" data-section="about">
|
<div id="about" data-section="about">
|
||||||
<TextSplitAbout
|
<TextSplitAbout
|
||||||
useInvertedBackground={true}
|
title="Our Story: Community & Roots"
|
||||||
title="Our Story"
|
description={[
|
||||||
description={[
|
"At The Table, we believe in the power of shared experiences. Founded by local culinary enthusiasts, our cafe serves as a hub for the community to gather over thoughtfully sourced, farm-to-table meals.", "We are proudly women-owned and dedicated to supporting small, local producers. Every partnership we build ensures that we not only provide fresh, sustainable ingredients but also empower local entrepreneurs who share our vision for quality and integrity.", "Join us in celebrating the local spirit, one plate at a time."
|
||||||
"The Table was born from a simple desire: to bring people together through the art of fine dining.", "Our community-focused philosophy ensures that every ingredient we serve is locally sourced, seasonal, and prepared with love.", "We believe that great food is the cornerstone of great memories."
|
]}
|
||||||
]}
|
useInvertedBackground={false}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
<div id="footer" data-section="footer">
|
||||||
<FooterCard logoText="The Table" copyrightText="© 2025 The Table Restaurant" />
|
<FooterCard logoText="The Table" copyrightText="© 2025 The Table Restaurant" />
|
||||||
</div>
|
</div>
|
||||||
</ReactLenis>
|
</ReactLenis>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
|
|||||||
@@ -3,39 +3,85 @@
|
|||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import ReactLenis from "lenis/react";
|
import ReactLenis from "lenis/react";
|
||||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||||
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||||
|
import { Instagram, MapPin, Clock, Phone, Mail } from "lucide-react";
|
||||||
|
|
||||||
export default function ContactPage() {
|
export default function ContactPage() {
|
||||||
return (
|
return (
|
||||||
<ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="text-stagger"
|
||||||
|
defaultTextAnimation="reveal-blur"
|
||||||
|
borderRadius="rounded"
|
||||||
|
contentWidth="medium"
|
||||||
|
sizing="medium"
|
||||||
|
background="circleGradient"
|
||||||
|
cardStyle="glass-elevated"
|
||||||
|
primaryButtonStyle="gradient"
|
||||||
|
secondaryButtonStyle="glass"
|
||||||
|
headingFontWeight="normal"
|
||||||
|
>
|
||||||
<ReactLenis root>
|
<ReactLenis root>
|
||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav">
|
||||||
<NavbarLayoutFloatingInline
|
<NavbarLayoutFloatingInline
|
||||||
navItems={[
|
navItems={[
|
||||||
{ name: "Home", id: "/" },
|
{ name: "Home", id: "/" },
|
||||||
{ name: "Menu", id: "/menu" },
|
{ name: "About", id: "/about" },
|
||||||
{ name: "Events", id: "/events" },
|
{ name: "Events", id: "/events" },
|
||||||
{ name: "Contact", id: "/contact" },
|
{ name: "Contact", id: "/contact" },
|
||||||
]}
|
]}
|
||||||
brandName="The Table"
|
brandName="The Table"
|
||||||
button={{ text: "Book Now", href: "/contact" }}
|
button={{ text: "Contact", href: "#contact" }}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="contact" data-section="contact">
|
<div id="contact" data-section="contact">
|
||||||
<ContactCTA
|
<ContactSplit
|
||||||
tag="Get In Touch"
|
tag="Reach Out"
|
||||||
title="We'd Love to Hear From You"
|
title="Visit or Contact Us"
|
||||||
description="Whether you have questions about our menu, want to book a private event, or just want to say hi, we're here to help."
|
description="We're located in the heart of the city and open for your enjoyment. Have a question or want to host an event? Use the form below."
|
||||||
buttons={[{ text: "Call Us", href: "tel:+1234567890" }, { text: "Email Us", href: "mailto:hello@thetable.com" }]}
|
|
||||||
background={{ variant: "sparkles-gradient" }}
|
background={{ variant: "sparkles-gradient" }}
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
|
imageSrc="http://img.b2bpic.net/free-photo/restaurant-hall-with-round-square-tables-some-chairs-plants_140725-8031.jpg"
|
||||||
|
inputPlaceholder="Enter your email"
|
||||||
|
buttonText="Join Newsletter"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div className="py-20 px-[5vw] grid grid-cols-1 md:grid-cols-2 gap-12">
|
||||||
|
<div className="space-y-8">
|
||||||
|
<h2 className="text-3xl font-bold">Location & Hours</h2>
|
||||||
|
<div className="flex items-center gap-4">
|
||||||
|
<MapPin className="text-accent" />
|
||||||
|
<p>123 Culinary Lane, Food City, FC 90210</p>
|
||||||
|
</div>
|
||||||
|
<div className="flex items-center gap-4">
|
||||||
|
<Clock className="text-accent" />
|
||||||
|
<p>Mon-Sun: 11:00 AM - 10:00 PM</p>
|
||||||
|
</div>
|
||||||
|
<div className="flex items-center gap-4">
|
||||||
|
<Phone className="text-accent" />
|
||||||
|
<p>(555) 123-4567</p>
|
||||||
|
</div>
|
||||||
|
<div className="flex items-center gap-4">
|
||||||
|
<Mail className="text-accent" />
|
||||||
|
<p>hello@thetable.com</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="bg-card p-8 rounded-lg">
|
||||||
|
<h3 className="text-2xl font-semibold mb-4">Social Feed</h3>
|
||||||
|
<p className="mb-6">Follow our journey on Instagram for daily specials and updates.</p>
|
||||||
|
<a href="#" className="flex items-center gap-2 text-primary-cta font-bold hover:underline">
|
||||||
|
<Instagram /> @TheTableRestaurant
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
<div id="footer" data-section="footer">
|
||||||
<FooterBaseReveal logoText="The Table" columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]} />
|
<FooterCard
|
||||||
|
logoText="The Table"
|
||||||
|
copyrightText="© 2025 The Table Restaurant"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</ReactLenis>
|
</ReactLenis>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
|
|||||||
@@ -3,39 +3,49 @@
|
|||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import ReactLenis from "lenis/react";
|
import ReactLenis from "lenis/react";
|
||||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||||
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
|
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||||||
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||||
|
|
||||||
export default function EventsPage() {
|
export default function EventsPage() {
|
||||||
return (
|
return (
|
||||||
<ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
|
<ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="reveal-blur" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
|
||||||
<ReactLenis root>
|
<ReactLenis root>
|
||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav">
|
||||||
<NavbarLayoutFloatingInline
|
<NavbarLayoutFloatingInline
|
||||||
navItems={[
|
navItems={[
|
||||||
{ name: "Home", id: "/" },
|
{ name: "Home", id: "/" },
|
||||||
{ name: "Menu", id: "/menu" },
|
{ name: "About", id: "/about" },
|
||||||
{ name: "Events", id: "/events" },
|
{ name: "Events", id: "/events" },
|
||||||
{ name: "Contact", id: "/contact" },
|
{ name: "Contact", id: "/contact" },
|
||||||
]}
|
]}
|
||||||
brandName="The Table"
|
brandName="The Table"
|
||||||
button={{ text: "Book Now", href: "/contact" }}
|
button={{ text: "View Full Calendar", href: "#contact" }}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="pt-24">
|
<div id="events" data-section="events">
|
||||||
<MetricCardSeven
|
<MetricCardEleven
|
||||||
animationType="slide-up"
|
animationType="slide-up"
|
||||||
|
title="Join Our Recurring Events"
|
||||||
|
description="Discover our weekly culinary traditions and special community gatherings. Book your spot today!"
|
||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
title="Upcoming Events"
|
|
||||||
description="Join us for exclusive dining events, tastings, and community gatherings."
|
|
||||||
metrics={[
|
metrics={[
|
||||||
{ id: "e1", value: "Wine Tasting", title: "Friday, 7:00 PM", items: ["Fine wine", "Cheese pairings"] },
|
{
|
||||||
{ id: "e2", value: "Coffee Workshop", title: "Saturday, 10:00 AM", items: ["Learn to brew", "Expert tips"] },
|
id: "e1", value: "Weekly", title: "Sunday Brunch Club", description: "Farm-fresh seasonal brunch menu every Sunday. RSVP required to secure your favorite corner table.", imageSrc: "http://img.b2bpic.net/free-photo/group-young-friends-having-dinner-together_23-2148454081.jpg"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "e2", value: "Monthly", title: "Farmer Partner Dinners", description: "Exclusive seasonal tasting menus curated with our local farm partners. Join our mailing list for invites.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-black-plates-with-golden-spoons-dark-background-color-food-cutlery-restaurant-dinner-cafe_179666-19702.jpg"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "e3", value: "Seasonal", title: "Workshops & Tastings", description: "Learn from local experts in our monthly cooking and wine-tasting masterclasses.", imageSrc: "http://img.b2bpic.net/free-photo/girl-slices-vegetables-board-prepares-salad-nature-sunny-day-cooking-close-up-view_78826-3100.jpg"
|
||||||
|
},
|
||||||
]}
|
]}
|
||||||
|
buttons={[{ text: "View Full Calendar", href: "#contact" }]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<FooterBaseReveal logoText="The Table" columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]} />
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterCard logoText="The Table" copyrightText="© 2025 The Table Restaurant" />
|
||||||
|
</div>
|
||||||
</ReactLenis>
|
</ReactLenis>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -4,40 +4,60 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|||||||
import ReactLenis from "lenis/react";
|
import ReactLenis from "lenis/react";
|
||||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||||
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
||||||
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||||
|
|
||||||
export default function MenuPage() {
|
export default function MenuPage() {
|
||||||
return (
|
return (
|
||||||
<ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="text-stagger"
|
||||||
|
defaultTextAnimation="reveal-blur"
|
||||||
|
borderRadius="soft"
|
||||||
|
contentWidth="compact"
|
||||||
|
sizing="largeSmall"
|
||||||
|
background="blurBottom"
|
||||||
|
cardStyle="glass-depth"
|
||||||
|
primaryButtonStyle="primary-glow"
|
||||||
|
secondaryButtonStyle="solid"
|
||||||
|
headingFontWeight="normal"
|
||||||
|
>
|
||||||
<ReactLenis root>
|
<ReactLenis root>
|
||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav">
|
||||||
<NavbarLayoutFloatingInline
|
<NavbarLayoutFloatingInline
|
||||||
navItems={[
|
navItems={[
|
||||||
{ name: "Home", id: "/" },
|
{ name: "Home", id: "/" },
|
||||||
{ name: "Menu", id: "/menu" },
|
{ name: "Menu", id: "/menu" },
|
||||||
{ name: "Events", id: "/events" },
|
{ name: "Events", id: "/events" },
|
||||||
{ name: "Contact", id: "/contact" },
|
{ name: "Contact", id: "/contact" }
|
||||||
]}
|
]}
|
||||||
brandName="The Table"
|
brandName="The Table"
|
||||||
button={{ text: "Book Now", href: "/contact" }}
|
button={{ text: "Order Now", href: "#menu" }}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="pt-24">
|
|
||||||
<ProductCardOne
|
<div id="menu" data-section="menu">
|
||||||
|
<ProductCardOne
|
||||||
|
title="Our Menu"
|
||||||
|
description="Discover our curated selections of fine coffee, tea, pastries, wine, and small plates."
|
||||||
|
gridVariant="three-columns-all-equal-width"
|
||||||
animationType="slide-up"
|
animationType="slide-up"
|
||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
gridVariant="three-columns-all-equal-width"
|
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
title="Our Menu"
|
|
||||||
description="Discover our curated selection of fine coffees and exquisite wines."
|
|
||||||
products={[
|
products={[
|
||||||
{ id: "c1", name: "Signature Espresso", price: "$4", imageSrc: "https://images.unsplash.com/photo-1510707577719-ae7c14805e3a?q=80&w=600" },
|
{ id: "coffee", name: "Signature Roast Coffee", price: "$6", imageSrc: "http://img.b2bpic.net/free-photo/coffee-cup-with-latte-art-coffee-beans-dark-background_140725-6677.jpg", imageAlt: "Coffee" },
|
||||||
{ id: "c2", name: "Pour Over Coffee", price: "$6", imageSrc: "https://images.unsplash.com/photo-1544716278-ca5e3f4abd8c?q=80&w=600" },
|
{ id: "tea", name: "Organic Jasmine Tea", price: "$7", imageSrc: "http://img.b2bpic.net/free-photo/tea-set-with-cups-tea-leaves-tea-pot-wooden-table_23-2148767931.jpg", imageAlt: "Tea" },
|
||||||
{ id: "w1", name: "Pinot Noir", price: "$12/glass", imageSrc: "https://images.unsplash.com/photo-1553361371-9b22f780351d?q=80&w=600" },
|
{ id: "pastry", name: "Butter Croissant", price: "$5", imageSrc: "http://img.b2bpic.net/free-photo/croissants-wooden-surface_1150-13654.jpg", imageAlt: "Pastry" },
|
||||||
|
{ id: "wine", name: "House Red Wine", price: "$12", imageSrc: "http://img.b2bpic.net/free-photo/wine-glass-with-red-wine-wooden-table_23-2148419688.jpg", imageAlt: "Wine" },
|
||||||
|
{ id: "plates", name: "Assorted Small Plates", price: "$15", imageSrc: "http://img.b2bpic.net/free-photo/tapas-platter-selection_114579-2462.jpg", imageAlt: "Small Plates" }
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterCard
|
||||||
|
logoText="The Table"
|
||||||
|
copyrightText="© 2025 The Table Restaurant"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<FooterBaseReveal logoText="The Table" columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]} />
|
|
||||||
</ReactLenis>
|
</ReactLenis>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
|
|||||||
273
src/app/page.tsx
273
src/app/page.tsx
@@ -2,142 +2,183 @@
|
|||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import ReactLenis from "lenis/react";
|
import ReactLenis from "lenis/react";
|
||||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
import ContactText from '@/components/sections/contact/ContactText';
|
||||||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||||
import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
|
import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
|
||||||
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||||
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
|
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
|
||||||
|
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||||
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
||||||
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
||||||
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
||||||
import ContactForm from '@/components/form/ContactForm';
|
import { Sparkles } from "lucide-react";
|
||||||
import { Sparkles, Mail } from "lucide-react";
|
|
||||||
|
|
||||||
export default function LandingPage() {
|
export default function LandingPage() {
|
||||||
return (
|
return (
|
||||||
<ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="text-stagger"
|
||||||
|
defaultTextAnimation="reveal-blur"
|
||||||
|
borderRadius="soft"
|
||||||
|
contentWidth="compact"
|
||||||
|
sizing="largeSmall"
|
||||||
|
background="blurBottom"
|
||||||
|
cardStyle="glass-depth"
|
||||||
|
primaryButtonStyle="primary-glow"
|
||||||
|
secondaryButtonStyle="solid"
|
||||||
|
headingFontWeight="normal"
|
||||||
|
>
|
||||||
<ReactLenis root>
|
<ReactLenis root>
|
||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav">
|
||||||
<NavbarLayoutFloatingInline
|
<NavbarLayoutFloatingInline
|
||||||
navItems={[
|
navItems={[
|
||||||
{ name: "Home", id: "/" },
|
{ name: "Our Story", id: "about" },
|
||||||
{ name: "Menu", id: "/menu" },
|
{ name: "Menu", id: "menu" },
|
||||||
{ name: "Events", id: "/events" },
|
{ name: "Events", id: "events" },
|
||||||
{ name: "Contact", id: "/contact" },
|
{ name: "Contact", id: "/contact" },
|
||||||
]}
|
]}
|
||||||
brandName="The Table"
|
brandName="The Table"
|
||||||
button={{ text: "Book Now", href: "/contact" }}
|
button={{
|
||||||
/>
|
text: "Order Now", href: "#menu"
|
||||||
</div>
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="hero" data-section="hero">
|
<div id="hero" data-section="hero">
|
||||||
<HeroSplitDualMedia
|
<HeroSplitDualMedia
|
||||||
title="A Tableside Tradition"
|
background={{
|
||||||
description="Fine dining reimagined."
|
variant: "gradient-bars"}}
|
||||||
tag="Voted Best in Town"
|
title="A Tableside Tradition"
|
||||||
rating={5}
|
description="Experience fine dining reimagined with fresh local ingredients and a warm, welcoming atmosphere in the heart of the city."
|
||||||
ratingText="Based on 500+ reviews"
|
tag="Voted Best in Town"
|
||||||
mediaItems={[
|
buttons={[
|
||||||
{ imageSrc: "http://img.b2bpic.net/free-photo/restaurant-hall-with-round-square-tables-some-chairs-plants_140725-8031.jpg" },
|
{ text: "Book Table", href: "/contact" },
|
||||||
{ imageSrc: "http://img.b2bpic.net/free-photo/steamed-bao-bun-with-braised-pork-belly-fresh-asian-slaw_84443-85877.jpg" }
|
{ text: "View Menu", href: "#menu" },
|
||||||
]}
|
]}
|
||||||
tagIcon={Sparkles}
|
mediaItems={[
|
||||||
background={{ variant: "sparkles-gradient" }}
|
{ imageSrc: "http://img.b2bpic.net/free-photo/restaurant-hall-with-round-square-tables-some-chairs-plants_140725-8031.jpg", imageAlt: "Restaurant Interior" },
|
||||||
/>
|
{ imageSrc: "http://img.b2bpic.net/free-photo/steamed-bao-bun-with-braised-pork-belly-fresh-asian-slaw_84443-85877.jpg", imageAlt: "Chef Plating Dish" }
|
||||||
</div>
|
]}
|
||||||
|
mediaAnimation="slide-up"
|
||||||
|
rating={5}
|
||||||
|
ratingText="Based on 500+ glowing reviews"
|
||||||
|
tagIcon={Sparkles}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="about" data-section="about">
|
<div id="about" data-section="about">
|
||||||
<TextSplitAbout
|
<TextSplitAbout
|
||||||
useInvertedBackground={true}
|
useInvertedBackground={true}
|
||||||
title="Our Philosophy"
|
title="Our Philosophy"
|
||||||
description={["Fresh ingredients.", "Modern culinary magic."]}
|
description={[
|
||||||
/>
|
"Founded on a love for community, our kitchen celebrates the journey of fresh, seasonal ingredients from local farms directly to your table.", "Every dish is crafted with purpose, passion, and a touch of modern culinary magic."
|
||||||
</div>
|
]}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="features" data-section="features">
|
<div id="features" data-section="features">
|
||||||
<FeatureCardTwentyEight
|
<FeatureCardTwentyEight
|
||||||
animationType="slide-up"
|
animationType="slide-up"
|
||||||
textboxLayout="split"
|
textboxLayout="split"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
title="Modern Restaurant Experience"
|
features={[
|
||||||
description="Designed for your comfort."
|
{ id: "f1", title: "Mobile Responsive", subtitle: "View our menu effortlessly on any device.", category: "Service", value: "100%" },
|
||||||
features={[
|
{ id: "f2", title: "Online Ordering", subtitle: "Order your favorite meals ahead with one click.", category: "Convenience", value: "Fast" },
|
||||||
{ id: "f1", title: "Mobile Responsive", subtitle: "Seamless.", category: "Design", value: "Smooth" },
|
{ id: "f3", title: "Event RSVP", subtitle: "Manage your event attendance with ease.", category: "Booking", value: "Easy" },
|
||||||
{ id: "f2", title: "Online Ordering", subtitle: "Quick.", category: "Ordering", value: "Fast" }
|
{ id: "f4", title: "Newsletter Signup", subtitle: "Join our community for updates and perks.", category: "Community", value: "Join" },
|
||||||
]}
|
{ id: "f5", title: "Social Feed", subtitle: "Follow our culinary journey on Instagram.", category: "Social", value: "Live" },
|
||||||
/>
|
]}
|
||||||
</div>
|
title="Modern Restaurant Amenities"
|
||||||
|
description="Designed for your comfort and connection, our digital-first approach ensures a seamless experience from booking to dining."
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="menu" data-section="menu">
|
<div id="menu" data-section="menu">
|
||||||
<ProductCardOne
|
<ProductCardOne
|
||||||
animationType="slide-up"
|
animationType="slide-up"
|
||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
gridVariant="three-columns-all-equal-width"
|
gridVariant="three-columns-all-equal-width"
|
||||||
useInvertedBackground={true}
|
useInvertedBackground={true}
|
||||||
title="Seasonal Menu"
|
products={[
|
||||||
description="Carefully crafted dishes."
|
{ id: "p1", name: "Artisan Bread Basket", price: "$12", imageSrc: "http://img.b2bpic.net/free-photo/sliced-greenery-vegetables-pomegranate-arils-plate_114579-86474.jpg" },
|
||||||
products={[
|
{ id: "p2", name: "Seared Prime Steak", price: "$48", imageSrc: "http://img.b2bpic.net/free-photo/fried-eggplant-with-tomatoes-sesame-seeds-plate_140725-9191.jpg" },
|
||||||
{ id: "p1", name: "Bread", price: "$12", imageSrc: "http://img.b2bpic.net/free-photo/sliced-greenery-vegetables-pomegranate-arils-plate_114579-86474.jpg" },
|
{ id: "p3", name: "Homemade Basil Pasta", price: "$28", imageSrc: "http://img.b2bpic.net/free-photo/vegan-pasta-white-plate_23-2148305758.jpg" },
|
||||||
{ id: "p2", name: "Steak", price: "$48", imageSrc: "http://img.b2bpic.net/free-photo/fried-eggplant-with-tomatoes-sesame-seeds-plate_140725-9191.jpg" },
|
{ id: "p4", name: "Pan-Seared Sea Bass", price: "$36", imageSrc: "http://img.b2bpic.net/free-photo/delicious-dish-with-quinoa-meat_181624-28743.jpg" },
|
||||||
{ id: "p3", name: "Pasta", price: "$28", imageSrc: "http://img.b2bpic.net/free-photo/vegan-pasta-white-plate_23-2148305758.jpg" },
|
{ id: "p5", name: "Dark Chocolate Mousse", price: "$14", imageSrc: "http://img.b2bpic.net/free-photo/front-view-little-delicious-cake-with-chocolate-raisins-light-dark-background_140725-132620.jpg" },
|
||||||
]}
|
{ id: "p6", name: "Fresh Harvest Salad", price: "$18", imageSrc: "http://img.b2bpic.net/free-photo/bowl-salad-with-fried-potatoes-arugula-cucumber-lettuce-yoghurt_140725-1500.jpg" },
|
||||||
/>
|
]}
|
||||||
</div>
|
title="Seasonal Menu Highlights"
|
||||||
|
description="Artisanal ingredients meet culinary expertise in every curated plate we serve."
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="newsletter" data-section="newsletter">
|
<div id="events" data-section="events">
|
||||||
<ContactForm
|
<MetricCardEleven
|
||||||
title="Stay Connected"
|
animationType="slide-up"
|
||||||
description="Join our newsletter."
|
textboxLayout="split"
|
||||||
tag="Join Us"
|
useInvertedBackground={false}
|
||||||
tagIcon={Mail}
|
metrics={[
|
||||||
useInvertedBackground={false}
|
{ id: "m1", value: "15K+", title: "Happy Guests Served", description: "Delivering excellence at every seat.", imageSrc: "http://img.b2bpic.net/free-photo/group-young-friends-having-dinner-together_23-2148454081.jpg" },
|
||||||
/>
|
{ id: "m2", value: "24", title: "Industry Awards", description: "Celebrating culinary excellence and innovation.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-black-plates-with-golden-spoons-dark-background-color-food-cutlery-restaurant-dinner-cafe_179666-19702.jpg" },
|
||||||
</div>
|
{ id: "m3", value: "12", title: "Local Farms Partners", description: "Directly sourcing sustainable ingredients.", imageSrc: "http://img.b2bpic.net/free-photo/girl-slices-vegetables-board-prepares-salad-nature-sunny-day-cooking-close-up-view_78826-3100.jpg" },
|
||||||
|
]}
|
||||||
|
title="Community Milestones"
|
||||||
|
description="Our passion drives impact in our local community through shared dining and meaningful gathering."
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="testimonials" data-section="testimonials">
|
<div id="testimonials" data-section="testimonials">
|
||||||
<TestimonialCardFifteen
|
<TestimonialCardFifteen
|
||||||
testimonial="An absolute treasure!"
|
useInvertedBackground={true}
|
||||||
rating={5}
|
testimonial="An absolute treasure in the city! Every visit feels like coming home. The service, the food, and the vibe are unmatched."
|
||||||
author="Samantha W."
|
rating={5}
|
||||||
avatars={[{ src: "http://img.b2bpic.net/free-photo/women-eating-traditional-italian-pizza-together_52683-110888.jpg", alt: "Customer" }]}
|
author="Samantha W."
|
||||||
ratingAnimation="slide-up"
|
avatars={[
|
||||||
avatarsAnimation="slide-up"
|
{ src: "http://img.b2bpic.net/free-photo/women-eating-traditional-italian-pizza-together_52683-110888.jpg", alt: "Customer" },
|
||||||
useInvertedBackground={true}
|
{ src: "http://img.b2bpic.net/free-photo/low-angle-friends-shaking-hands_23-2148395404.jpg", alt: "Customer" },
|
||||||
/>
|
{ src: "http://img.b2bpic.net/free-photo/high-angle-friends-restaurant_23-2148395392.jpg", alt: "Customer" },
|
||||||
</div>
|
{ src: "http://img.b2bpic.net/free-photo/salad-with-oil-fresh-tomatoes-colourful-bell-peppers-red-beans_140725-10631.jpg", alt: "Customer" },
|
||||||
|
{ src: "http://img.b2bpic.net/free-photo/good-humoured-caucasian-woman-enjoying-healthy-food-indoor-shot-smiling-girl-eating-salad_197531-17196.jpg", alt: "Customer" },
|
||||||
|
]}
|
||||||
|
ratingAnimation="slide-up"
|
||||||
|
avatarsAnimation="slide-up"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="faq" data-section="faq">
|
<div id="faq" data-section="faq">
|
||||||
<FaqSplitMedia
|
<FaqSplitMedia
|
||||||
textboxLayout="split"
|
textboxLayout="split"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
faqs={[
|
faqs={[
|
||||||
{ id: "q1", title: "Do you take reservations?", content: "Yes, book online." },
|
{ id: "q1", title: "Do you take reservations?", content: "Yes, we highly recommend booking in advance through our website." },
|
||||||
{ id: "q2", title: "How do I RSVP?", content: "Use the website." },
|
{ id: "q2", title: "Are you pet friendly?", content: "Our patio area is pet friendly, though indoors is reserved for human diners." },
|
||||||
]}
|
{ id: "q3", title: "Do you offer private dining?", content: "Absolutely! Contact us for private event packages and availability." },
|
||||||
title="FAQ"
|
]}
|
||||||
description="Common questions."
|
imageSrc="http://img.b2bpic.net/free-photo/side-view-woman-working-service-industry_23-2150722790.jpg"
|
||||||
faqsAnimation="slide-up"
|
mediaAnimation="slide-up"
|
||||||
/>
|
title="Got Questions?"
|
||||||
</div>
|
description="Here is everything you need to know about dining at The Table."
|
||||||
|
faqsAnimation="slide-up"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="contact" data-section="contact">
|
<div id="contact" data-section="contact">
|
||||||
<ContactCTA
|
<ContactText
|
||||||
tag="Visit Us"
|
useInvertedBackground={true}
|
||||||
title="Reserve Your Seat"
|
background={{ variant: "sparkles-gradient" }}
|
||||||
description="We are ready for you."
|
text="Ready for your next favorite meal? Let us save you a seat."
|
||||||
buttons={[{ text: "Book" }]}
|
buttons={[
|
||||||
background={{ variant: "sparkles-gradient" }}
|
{ text: "Contact Us", href: "/contact" },
|
||||||
useInvertedBackground={false}
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
<div id="footer" data-section="footer">
|
||||||
<FooterBaseReveal
|
<FooterCard
|
||||||
logoText="The Table"
|
logoText="The Table"
|
||||||
columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]}
|
copyrightText="© 2025 The Table Restaurant"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</ReactLenis>
|
</ReactLenis>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user