Update src/app/page.tsx

This commit is contained in:
2026-05-06 04:17:31 +00:00
parent 423873730a
commit 0aef27720a

View File

@@ -20,358 +20,150 @@ export default function LandingPage() {
defaultButtonVariant="bounce-effect"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="medium"
sizing="medium"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "About",
id: "about",
},
{
name: "Menu",
id: "features",
},
{
name: "Reviews",
id: "testimonials",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="Ray's In the City"
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "hero" },
{ name: "About", id: "about" },
{ name: "Menu", id: "features" },
{ name: "Reviews", id: "testimonials" },
{ name: "Contact", id: "contact" },
]}
brandName="Ray's In the City"
button={{ text: "Book Now", href: "#contact" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitKpi
background={{
variant: "plain",
}}
title="A Culinary Landmark in the Heart of the City"
description="Experience unparalleled fine dining where exceptional service meets the freshest ingredients. Ray's In the City is your destination for unforgettable evenings."
kpis={[
{
value: "20+",
label: "Years Serving",
},
{
value: "5k+",
label: "Happy Guests",
},
{
value: "4.9/5",
label: "Guest Rating",
},
]}
enableKpiAnimation={true}
buttons={[
{
text: "Book Your Table",
href: "#contact",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/there-are-glasses-wine-water-table-with-white-cloth-are-ready-dining_613910-17447.jpg?_wi=1"
mediaAnimation="slide-up"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/close-up-round-table-served-two-christms-dinner-silver-candle-decorated-with-natural-fir-branches-two-flutes-pairs-plates-with-decorative-handmade-christmas-trees_132075-11391.jpg",
alt: "Diner 1",
},
{
src: "http://img.b2bpic.net/free-photo/wine-glass_74190-1307.jpg",
alt: "Diner 2",
},
{
src: "http://img.b2bpic.net/free-photo/restaurant-table-with-white-lace-table-cloth-blue-napkins_140725-2571.jpg",
alt: "Diner 3",
},
{
src: "http://img.b2bpic.net/free-photo/round-table-arrangement-restaurant_23-2147936225.jpg",
alt: "Diner 4",
},
{
src: "http://img.b2bpic.net/free-photo/there-are-glasses-wine-water-table-with-white-cloth-are-ready-dining_613910-17447.jpg",
alt: "Diner 5",
},
]}
avatarText="Join 5,000+ satisfied guests"
marqueeItems={[
{
type: "text",
text: "Michelin Recommended",
},
{
type: "text",
text: "Farm to Table",
},
{
type: "text",
text: "Handcrafted Cocktails",
},
{
type: "text",
text: "Private Dining",
},
{
type: "text",
text: "Award Winning",
},
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitKpi
background={{ variant: "plain" }}
title="A Culinary Landmark in the Heart of the City"
description="Experience unparalleled fine dining where exceptional service meets the freshest ingredients. Ray's In the City is your destination for unforgettable evenings."
kpis={[
{ value: "20+", label: "Years Serving" },
{ value: "5k+", label: "Happy Guests" },
{ value: "4.9/5", label: "Guest Rating" },
]}
enableKpiAnimation={true}
buttons={[{ text: "Book Your Table", href: "#contact" }]}
imageSrc="http://img.b2bpic.net/free-photo/there-are-glasses-wine-water-table-with-white-cloth-are-ready-dining_613910-17447.jpg"
mediaAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<TestimonialAboutCard
useInvertedBackground={true}
tag="Our Story"
title="Crafting Perfection, Every Plate"
description="Founded on a passion for culinary excellence, Ray's has become a pillar of city dining. We source locally to deliver flavors that resonate with every bite."
subdescription="Our team is dedicated to creating moments that linger long after the meal is over."
icon={Award}
imageSrc="http://img.b2bpic.net/free-photo/chef-cooking-salad-with-mushrooms_23-2148471925.jpg?_wi=1"
mediaAnimation="blur-reveal"
/>
</div>
<div id="about" data-section="about">
<TestimonialAboutCard
useInvertedBackground={true}
tag="Our Story"
title="Crafting Perfection, Every Plate"
description="Founded on a passion for culinary excellence, Ray's has become a pillar of city dining. We source locally to deliver flavors that resonate with every bite."
subdescription="Our team is dedicated to creating moments that linger long after the meal is over."
icon={Award}
imageSrc="http://img.b2bpic.net/free-photo/chef-cooking-salad-with-mushrooms_23-2148471925.jpg"
mediaAnimation="blur-reveal"
/>
</div>
<div id="features" data-section="features">
<FeatureCardTwentyEight
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
features={[
{
id: "1",
title: "Prime Steaks",
subtitle: "Dry-aged perfection",
category: "Main Course",
value: "Since '03",
},
{
id: "2",
title: "Fresh Seafood",
subtitle: "Locally sourced catch",
category: "Seafood",
value: "Daily",
},
{
id: "3",
title: "Wine Pairing",
subtitle: "Curated cellar selection",
category: "Drinks",
value: "Expert",
},
]}
title="Exceptional Culinary Offerings"
description="Discover our signature dishes, meticulously prepared for the discerning palate."
/>
</div>
<div id="features" data-section="features">
<FeatureCardTwentyEight
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
features={[
{ id: "1", title: "Prime Steaks", subtitle: "Dry-aged perfection", category: "Main Course", value: "Since '03" },
{ id: "2", title: "Fresh Seafood", subtitle: "Locally sourced catch", category: "Seafood", value: "Daily" },
{ id: "3", title: "Wine Pairing", subtitle: "Curated cellar selection", category: "Drinks", value: "Expert" },
]}
title="Exceptional Culinary Offerings"
description="Discover our signature dishes, meticulously prepared for the discerning palate."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardFive
textboxLayout="default"
useInvertedBackground={true}
testimonials={[
{
id: "1",
name: "Sarah J.",
date: "Oct 2023",
title: "An unforgettable evening",
quote: "The atmosphere and flavors at Ray's are absolutely unmatched in the city.",
tag: "Dinner Date",
avatarSrc: "http://img.b2bpic.net/free-photo/cheerful-couple-talking-while-eating-lunch-restaurant_637285-9017.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/there-are-glasses-wine-water-table-with-white-cloth-are-ready-dining_613910-17447.jpg?_wi=2",
imageAlt: "happy customer dining restaurant",
},
{
id: "2",
name: "Michael B.",
date: "Sep 2023",
title: "Absolute Perfection",
quote: "Service was impeccable, and every bite was a symphony of taste.",
tag: "Birthday Celebration",
avatarSrc: "http://img.b2bpic.net/free-photo/group-happy-young-people-having-dinner-together-dining-table-focus-is-redhead-woman-taking-food-from-her-friend_637285-3752.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/chef-cooking-salad-with-mushrooms_23-2148471925.jpg?_wi=2",
imageAlt: "happy customer dining restaurant",
},
{
id: "3",
name: "Emily R.",
date: "Aug 2023",
title: "My Favorite Spot",
quote: "Ray's never fails to impress. Always the best steaks in town.",
tag: "Frequent Diner",
avatarSrc: "http://img.b2bpic.net/free-photo/couples-celebrating-birthday_23-2149891043.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/couple-having-date-together-luxurious-restaurant_23-2150517424.jpg",
imageAlt: "happy customer dining restaurant",
},
{
id: "4",
name: "David W.",
date: "Jul 2023",
title: "World Class",
quote: "The wine selection is curated by true professionals. Highly recommend.",
tag: "Business Lunch",
avatarSrc: "http://img.b2bpic.net/free-photo/pumpkin-soup-with-shrimp-glass-red-wine_140725-5413.jpg",
imageSrc: "http://img.b2bpic.net/free-vector/vector-design-chef-logo-luxury-template_361591-3492.jpg",
imageAlt: "happy customer dining restaurant",
},
{
id: "5",
name: "Jessica L.",
date: "Jun 2023",
title: "Pure Culinary Art",
quote: "Every dish is prepared with passion and precision. A must-visit.",
tag: "Anniversary",
avatarSrc: "http://img.b2bpic.net/free-photo/high-angle-view-pasta-ingredient-with-white-blank-paper-napkin-grey-surface_23-2148087277.jpg",
imageSrc: "http://img.b2bpic.net/free-vector/flat-new-year-badges-black-background_23-2147723090.jpg",
imageAlt: "happy customer dining restaurant",
},
]}
title="What Our Guests Say"
description="Heartfelt experiences from our community of dining enthusiasts."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardFive
textboxLayout="default"
useInvertedBackground={true}
testimonials={[
{ id: "1", name: "Sarah J.", date: "Oct 2023", title: "An unforgettable evening", quote: "The atmosphere and flavors at Ray's are absolutely unmatched in the city.", tag: "Dinner Date", avatarSrc: "http://img.b2bpic.net/free-photo/cheerful-couple-talking-while-eating-lunch-restaurant_637285-9017.jpg" },
{ id: "2", name: "Michael B.", date: "Sep 2023", title: "Absolute Perfection", quote: "Service was impeccable, and every bite was a symphony of taste.", tag: "Birthday Celebration", avatarSrc: "http://img.b2bpic.net/free-photo/group-happy-young-people-having-dinner-together-dining-table-focus-is-redhead-woman-taking-food-from-her-friend_637285-3752.jpg" },
{ id: "3", name: "Emily R.", date: "Aug 2023", title: "My Favorite Spot", quote: "Ray's never fails to impress. Always the best steaks in town.", tag: "Frequent Diner", avatarSrc: "http://img.b2bpic.net/free-photo/couples-celebrating-birthday_23-2149891043.jpg" },
{ id: "4", name: "David W.", date: "Jul 2023", title: "World Class", quote: "The wine selection is curated by true professionals. Highly recommend.", tag: "Business Lunch", avatarSrc: "http://img.b2bpic.net/free-photo/pumpkin-soup-with-shrimp-glass-red-wine_140725-5413.jpg" },
{ id: "5", name: "Jessica L.", date: "Jun 2023", title: "Pure Culinary Art", quote: "Every dish is prepared with passion and precision. A must-visit.", tag: "Anniversary", avatarSrc: "http://img.b2bpic.net/free-photo/high-angle-view-pasta-ingredient-with-white-blank-paper-napkin-grey-surface_23-2148087277.jpg" },
]}
title="What Our Guests Say"
description="Heartfelt experiences from our community of dining enthusiasts."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardTwo
animationType="slide-up"
textboxLayout="default"
gridVariant="bento-grid"
useInvertedBackground={false}
metrics={[
{
id: "m1",
value: "15,000+",
description: "Meals Served Annually",
},
{
id: "m2",
value: "50+",
description: "Expert Staff Members",
},
{
id: "m3",
value: "10+",
description: "Culinary Awards Won",
},
]}
title="A Legacy of Excellence"
description="Numbers that reflect our dedication to the art of fine dining."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardTwo
animationType="slide-up"
textboxLayout="default"
gridVariant="bento-grid"
useInvertedBackground={false}
metrics={[
{ id: "m1", value: "15,000+", description: "Meals Served Annually" },
{ id: "m2", value: "50+", description: "Expert Staff Members" },
{ id: "m3", value: "10+", description: "Culinary Awards Won" },
]}
title="A Legacy of Excellence"
description="Numbers that reflect our dedication to the art of fine dining."
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
textboxLayout="default"
useInvertedBackground={true}
faqs={[
{
id: "f1",
title: "Do you accept reservations?",
content: "Yes, we highly recommend booking in advance through our website.",
},
{
id: "f2",
title: "Are there vegetarian options?",
content: "Absolutely, we have a curated seasonal menu for all dietary needs.",
},
{
id: "f3",
title: "Is there a dress code?",
content: "We maintain an elegant-casual atmosphere for our guests.",
},
]}
title="Common Questions"
description="Everything you need to know about dining at Ray's In the City."
faqsAnimation="slide-up"
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
textboxLayout="default"
useInvertedBackground={true}
faqs={[
{ id: "f1", title: "Do you accept reservations?", content: "Yes, we highly recommend booking in advance through our website." },
{ id: "f2", title: "Are there vegetarian options?", content: "Absolutely, we have a curated seasonal menu for all dietary needs." },
{ id: "f3", title: "Is there a dress code?", content: "We maintain an elegant-casual atmosphere for our guests." },
]}
title="Common Questions"
description="Everything you need to know about dining at Ray's In the City."
faqsAnimation="slide-up"
/>
</div>
<div id="social" data-section="social">
<SocialProofOne
textboxLayout="default"
useInvertedBackground={false}
names={[
"The Culinary Review",
"City Dining Magazine",
"Best Of The City",
"Hospitality Monthly",
"Gourmet Press",
"The Food Guide",
"Dining Excellence Daily",
]}
title="Recognized Excellence"
description="Proudly featured in the city's finest dining publications."
/>
</div>
<div id="social" data-section="social">
<SocialProofOne
textboxLayout="default"
useInvertedBackground={false}
names={["The Culinary Review", "City Dining Magazine", "Best Of The City", "Hospitality Monthly", "Gourmet Press", "The Food Guide", "Dining Excellence Daily"]}
title="Recognized Excellence"
description="Proudly featured in the city's finest dining publications."
/>
</div>
<div id="contact" data-section="contact">
<ContactText
useInvertedBackground={true}
background={{
variant: "rotated-rays-animated",
}}
text="Join us for an unforgettable evening in the heart of the city. Make your reservation today."
buttons={[
{
text: "Contact Us",
href: "#",
},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactText
useInvertedBackground={true}
background={{ variant: "rotated-rays-animated" }}
text="Join us for an unforgettable evening in the heart of the city. Make your reservation today."
buttons={[{ text: "Contact Us", href: "#" }]}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{
items: [
{
label: "About Us",
href: "#about",
},
{
label: "Our Menu",
href: "#features",
},
],
},
{
items: [
{
label: "Bookings",
href: "#contact",
},
{
label: "Gift Cards",
href: "#",
},
],
},
{
items: [
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms of Service",
href: "#",
},
],
},
]}
logoText="Ray's In the City"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{ items: [{ label: "About Us", href: "#about" }, { label: "Our Menu", href: "#features" }] },
{ items: [{ label: "Bookings", href: "#contact" }, { label: "Gift Cards", href: "#" }] },
{ items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
]}
logoText="Ray's In the City"
/>
</div>
</ReactLenis>
</ThemeProvider>
);