bender/5499774e-32f1-4053-bab5-c480157fe27a
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-05-12 17:53:42 +00:00
parent 9ddccc2665
commit ff0eaad612
1 changed files with 165 additions and 397 deletions
Download Patch File Download Diff File Expand all files Collapse all files

562
src/app/page.tsx
View File

@@ -17,414 +17,182 @@ import { Award, BookOpen, CheckCircle, Clock, Users } from "lucide-react";
export default function LandingPage() { export default function LandingPage() {
return ( return (
<ThemeProvider <ThemeProvider
defaultButtonVariant="icon-arrow" defaultButtonVariant="icon-arrow"
defaultTextAnimation="background-highlight" defaultTextAnimation="background-highlight"
borderRadius="pill" borderRadius="pill"
contentWidth="medium" contentWidth="medium"
sizing="large" sizing="large"
background="grid" background="grid"
cardStyle="inset" cardStyle="inset"
primaryButtonStyle="double-inset" primaryButtonStyle="double-inset"
secondaryButtonStyle="glass" secondaryButtonStyle="glass"
headingFontWeight="medium" headingFontWeight="medium"
> >
<ReactLenis root> <ReactLenis root>
<div id="nav" data-section="nav"> <div id="nav" data-section="nav">
<NavbarLayoutFloatingInline <NavbarLayoutFloatingInline
navItems={[ navItems={[
{ { name: "About", id: "#about" },
name: "About", { name: "Features", id: "#features" },
id: "#about", { name: "Menu", id: "#menu" },
}, { name: "Testimonials", id: "#testimonials" },
{ { name: "Contact", id: "#contact" },
name: "Features", ]}
id: "#features", brandName="The Golden Fork"
}, button={{ text: "Reservations", href: "#contact" }}
{ />
name: "Menu", </div>
id: "#menu",
},
{
name: "Testimonials",
id: "#testimonials",
},
{
name: "Contact",
id: "#contact",
},
]}
brandName="The Golden Fork"
/>
</div>
<div id="hero" data-section="hero"> <div id="hero" data-section="hero">
<HeroSplitDoubleCarousel <HeroSplitDoubleCarousel
background={{ background={{ variant: "radial-gradient" }}
variant: "radial-gradient", title="Culinary Excellence at The Golden Fork"
}} description="Experience fine dining reimagined with seasonal ingredients and world-class service."
title="Culinary Excellence at The Golden Fork" leftCarouselItems={[
description="Experience fine dining reimagined with seasonal ingredients and world-class service." { imageSrc: "http://img.b2bpic.net/free-photo/glass-prosecco-with-bottle-around_114579-2141.jpg", imageAlt: "upscale restaurant table setting" },
leftCarouselItems={[ { imageSrc: "http://img.b2bpic.net/free-photo/dining-room-beige-color-tones-interior-design_114579-2225.jpg", imageAlt: "restaurant interior warm lighting" },
{ { imageSrc: "http://img.b2bpic.net/free-photo/cutlery-near-twig-leaves_23-2147811214.jpg", imageAlt: "Cutlery near twig and leaves" },
imageSrc: "http://img.b2bpic.net/free-photo/glass-prosecco-with-bottle-around_114579-2141.jpg", { imageSrc: "http://img.b2bpic.net/free-photo/grilled-vegetables-served-with-lavash-species_114579-2007.jpg", imageAlt: "Grilled vegetables served with lavash and species" },
imageAlt: "upscale restaurant table setting", { imageSrc: "http://img.b2bpic.net/free-photo/romantic-evening-shared-wine-candlelight-generated-by-ai_188544-13728.jpg", imageAlt: "Romantic evening shared wine and candlelight generated by AI" },
}, ]}
{ rightCarouselItems={[
imageSrc: "http://img.b2bpic.net/free-photo/dining-room-beige-color-tones-interior-design_114579-2225.jpg", { imageSrc: "http://img.b2bpic.net/free-photo/luxury-meeting-dining-room-table-multiple-chairs_114579-2067.jpg", imageAlt: "restaurant interior warm lighting" },
imageAlt: "restaurant interior warm lighting", { imageSrc: "http://img.b2bpic.net/free-photo/cutting-biscuit-with-whipping-cream-berries-with-cutlery_114579-3648.jpg", imageAlt: "upscale restaurant table setting" },
}, { imageSrc: "http://img.b2bpic.net/free-photo/man-embracing-with-woman-restaurant_23-2148016783.jpg", imageAlt: "Man embracing with woman in restaurant" },
{ { imageSrc: "http://img.b2bpic.net/free-photo/middle-age-friends-night-having-dinner_23-2149190934.jpg", imageAlt: "Middle age friends at night having dinner" },
imageSrc: "http://img.b2bpic.net/free-photo/cutlery-near-twig-leaves_23-2147811214.jpg", { imageSrc: "http://img.b2bpic.net/free-photo/rendering-elegant-neoclassical-interior_23-2151059653.jpg", imageAlt: "Rendering of elegant neoclassical interior" },
imageAlt: "Cutlery near twig and leaves", ]}
}, buttons={[{ text: "Book a Table", href: "#contact" }]}
{ avatars={[
imageSrc: "http://img.b2bpic.net/free-photo/grilled-vegetables-served-with-lavash-species_114579-2007.jpg", { src: "http://img.b2bpic.net/free-photo/fashionable-hipster-guy-dressed-denim-shirt-wearing-stylish-glasses_273609-6821.jpg", alt: "Fashionable hipster guy" },
imageAlt: "Grilled vegetables served with lavash and species", { src: "http://img.b2bpic.net/free-photo/crazy-chef-happy-expression_1194-1321.jpg", alt: "crazy chef happy expression" },
}, { src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-holding-glass_23-2148965393.jpg", alt: "Medium shot smiley woman" },
{ { src: "http://img.b2bpic.net/free-photo/portrait-senior-man-luxurious-restaurant_23-2150517397.jpg", alt: "Portrait of senior man" },
imageSrc: "http://img.b2bpic.net/free-photo/romantic-evening-shared-wine-candlelight-generated-by-ai_188544-13728.jpg", { src: "http://img.b2bpic.net/free-photo/elegant-couple-spend-time-restaurant_1157-20504.jpg", alt: "Elegant couple" },
imageAlt: "Romantic evening shared wine and candlelight generated by AI", ]}
}, marqueeItems={[
]} { type: "image", src: "http://img.b2bpic.net/free-photo/rendering-elegant-neoclassical-interior_23-2151059652.jpg", alt: "Neoclassical interior" },
rightCarouselItems={[ { type: "image", src: "http://img.b2bpic.net/free-photo/comfortable-dining-room-with-modern-rustic-elegance-generated-by-ai_188544-21418.jpg", alt: "Rustic dining room" },
{ { type: "image", src: "http://img.b2bpic.net/free-photo/interior-design-neoclassical-style-with-furnishings-decor_23-2151199327.jpg", alt: "Elegant decor" },
imageSrc: "http://img.b2bpic.net/free-photo/luxury-meeting-dining-room-table-multiple-chairs_114579-2067.jpg", { type: "image", src: "http://img.b2bpic.net/free-photo/grilled-meat-cutlet-with-sauce-spicy-pepper-zucchini-tomatoes_140725-10844.jpg", alt: "Grilled meat cutlet" },
imageAlt: "restaurant interior warm lighting", { type: "image", src: "http://img.b2bpic.net/free-photo/front-view-delicious-food-concept_23-2148510914.jpg", alt: "Delicious food concept" },
}, ]}
{ />
imageSrc: "http://img.b2bpic.net/free-photo/cutting-biscuit-with-whipping-cream-berries-with-cutlery_114579-3648.jpg", </div>
imageAlt: "upscale restaurant table setting",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/man-embracing-with-woman-restaurant_23-2148016783.jpg",
imageAlt: "Man embracing with woman in restaurant",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/middle-age-friends-night-having-dinner_23-2149190934.jpg",
imageAlt: "Middle age friends at night having dinner",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/rendering-elegant-neoclassical-interior_23-2151059653.jpg",
imageAlt: "Rendering of elegant neoclassical interior",
},
]}
buttons={[
{
text: "Book a Table",
href: "#contact",
},
]}
avatars={[
{
src: "http://img.b2bpic.net/free-photo/fashionable-hipster-guy-dressed-denim-shirt-wearing-stylish-glasses_273609-6821.jpg",
alt: "Fashionable hipster guy",
},
{
src: "http://img.b2bpic.net/free-photo/crazy-chef-happy-expression_1194-1321.jpg",
alt: "crazy chef happy expression",
},
{
src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-holding-glass_23-2148965393.jpg",
alt: "Medium shot smiley woman",
},
{
src: "http://img.b2bpic.net/free-photo/portrait-senior-man-luxurious-restaurant_23-2150517397.jpg",
alt: "Portrait of senior man",
},
{
src: "http://img.b2bpic.net/free-photo/elegant-couple-spend-time-restaurant_1157-20504.jpg",
alt: "Elegant couple",
},
]}
marqueeItems={[
{
type: "image",
src: "http://img.b2bpic.net/free-photo/rendering-elegant-neoclassical-interior_23-2151059652.jpg",
alt: "Neoclassical interior",
},
{
type: "image",
src: "http://img.b2bpic.net/free-photo/comfortable-dining-room-with-modern-rustic-elegance-generated-by-ai_188544-21418.jpg",
alt: "Rustic dining room",
},
{
type: "image",
src: "http://img.b2bpic.net/free-photo/interior-design-neoclassical-style-with-furnishings-decor_23-2151199327.jpg",
alt: "Elegant decor",
},
{
type: "image",
src: "http://img.b2bpic.net/free-photo/grilled-meat-cutlet-with-sauce-spicy-pepper-zucchini-tomatoes_140725-10844.jpg",
alt: "Grilled meat cutlet",
},
{
type: "image",
src: "http://img.b2bpic.net/free-photo/front-view-delicious-food-concept_23-2148510914.jpg",
alt: "Delicious food concept",
},
]}
/>
</div>
<div id="about" data-section="about"> <div id="about" data-section="about">
<AboutMetric <AboutMetric
useInvertedBackground={false} useInvertedBackground={false}
title="Our Culinary Heritage" title="Our Culinary Heritage"
metrics={[ metrics={[
{ { icon: Award, label: "Years Experience", value: "25+" },
icon: Award, { icon: Award, label: "Awards Won", value: "15" },
label: "Years Experience", { icon: Users, label: "Satisfied Guests", value: "50k+" },
value: "25+", ]}
}, metricsAnimation="slide-up"
{ />
icon: Award, </div>
label: "Awards Won",
value: "15",
},
{
icon: Users,
label: "Satisfied Guests",
value: "50k+",
},
]}
metricsAnimation="slide-up"
/>
</div>
<div id="features" data-section="features"> <div id="features" data-section="features">
<FeatureCardSix <FeatureCardSix
textboxLayout="split" textboxLayout="split"
useInvertedBackground={false} useInvertedBackground={false}
features={[ features={[
{ { title: "Fresh Ingredients", description: "Sourced daily from local farms.", imageSrc: "http://img.b2bpic.net/free-photo/frame-with-fresh-vegetables_23-2147681612.jpg", imageAlt: "fresh organic local ingredients" },
title: "Fresh Ingredients", { title: "Curated Wine List", description: "Pairings for every palate.", imageSrc: "http://img.b2bpic.net/free-photo/wine-glass-bottle_181624-59727.jpg", imageAlt: "wine pairing glass bottle" },
description: "Sourced daily from local farms.", { title: "Exceptional Service", description: "Attentive, professional staff.", imageSrc: "http://img.b2bpic.net/free-photo/elegant-wedding-dishes_1157-17840.jpg", imageAlt: "fine dining service restaurant" },
imageSrc: "http://img.b2bpic.net/free-photo/frame-with-fresh-vegetables_23-2147681612.jpg", ]}
imageAlt: "fresh organic local ingredients", title="Why Dine With Us"
}, description="Excellence in every detail."
{ />
title: "Curated Wine List", </div>
description: "Pairings for every palate.",
imageSrc: "http://img.b2bpic.net/free-photo/wine-glass-bottle_181624-59727.jpg",
imageAlt: "wine pairing glass bottle",
},
{
title: "Exceptional Service",
description: "Attentive, professional staff.",
imageSrc: "http://img.b2bpic.net/free-photo/elegant-wedding-dishes_1157-17840.jpg",
imageAlt: "fine dining service restaurant",
},
]}
title="Why Dine With Us"
description="Excellence in every detail."
/>
</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="two-columns-alternating-heights" gridVariant="two-columns-alternating-heights"
useInvertedBackground={false} useInvertedBackground={false}
products={[ products={[
{ { id: "1", name: "Ribeye Steak", price: "$45", imageSrc: "http://img.b2bpic.net/free-photo/creative-assortment-delicious-food_23-2148949025.jpg" },
id: "1", { id: "2", name: "Sea Bass", price: "$38", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-shot-fusion-food-with-sushi-seasonings-plate-wooden-surface_181624-42994.jpg" },
name: "Ribeye Steak", { id: "3", name: "Truffle Pasta", price: "$32", imageSrc: "http://img.b2bpic.net/free-photo/vertical-view-delicious-pasta-meal-with-tomato-meat-green-blue-plate-ice-background_140725-143666.jpg" },
price: "$45", { id: "4", name: "Chocolate Soufflé", price: "$18", imageSrc: "http://img.b2bpic.net/free-photo/top-view-delicious-creamy-cake-with-chocolate-raisins-light-dark-floor_140725-136347.jpg" },
imageSrc: "http://img.b2bpic.net/free-photo/creative-assortment-delicious-food_23-2148949025.jpg", { id: "5", name: "Wild Mushroom Risotto", price: "$28", imageSrc: "http://img.b2bpic.net/free-photo/risotto-with-mushrooms-coriander-leaves_23-2147925970.jpg" },
}, { id: "6", name: "Duck Confit", price: "$40", imageSrc: "http://img.b2bpic.net/free-photo/duck-breast-steak-white-plate_1203-8926.jpg" },
{ ]}
id: "2", title="Our Signature Dishes"
name: "Sea Bass", description="Handcrafted culinary masterpieces."
price: "$38", />
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-shot-fusion-food-with-sushi-seasonings-plate-wooden-surface_181624-42994.jpg", </div>
},
{
id: "3",
name: "Truffle Pasta",
price: "$32",
imageSrc: "http://img.b2bpic.net/free-photo/vertical-view-delicious-pasta-meal-with-tomato-meat-green-blue-plate-ice-background_140725-143666.jpg",
},
{
id: "4",
name: "Chocolate Soufflé",
price: "$18",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-delicious-creamy-cake-with-chocolate-raisins-light-dark-floor_140725-136347.jpg",
},
{
id: "5",
name: "Wild Mushroom Risotto",
price: "$28",
imageSrc: "http://img.b2bpic.net/free-photo/risotto-with-mushrooms-coriander-leaves_23-2147925970.jpg",
},
{
id: "6",
name: "Duck Confit",
price: "$40",
imageSrc: "http://img.b2bpic.net/free-photo/duck-breast-steak-white-plate_1203-8926.jpg",
},
]}
title="Our Signature Dishes"
description="Handcrafted culinary masterpieces."
/>
</div>
<div id="metrics" data-section="metrics"> <div id="metrics" data-section="metrics">
<MetricCardOne <MetricCardOne
animationType="slide-up" animationType="slide-up"
textboxLayout="default" textboxLayout="default"
gridVariant="uniform-all-items-equal" gridVariant="uniform-all-items-equal"
useInvertedBackground={false} useInvertedBackground={false}
metrics={[ metrics={[
{ { id: "m1", value: "100%", title: "Satisfaction", description: "Quality assurance.", icon: CheckCircle },
id: "m1", { id: "m2", value: "200+", title: "Menu Items", description: "Diverse culinary options.", icon: BookOpen },
value: "100%", { id: "m3", value: "24/7", title: "Support", description: "Always ready to serve.", icon: Clock },
title: "Satisfaction", ]}
description: "Quality assurance.", title="By The Numbers"
icon: CheckCircle, description="Crafting unforgettable memories."
}, />
{ </div>
id: "m2",
value: "200+",
title: "Menu Items",
description: "Diverse culinary options.",
icon: BookOpen,
},
{
id: "m3",
value: "24/7",
title: "Support",
description: "Always ready to serve.",
icon: Clock,
},
]}
title="By The Numbers"
description="Crafting unforgettable memories."
/>
</div>
<div id="testimonials" data-section="testimonials"> <div id="testimonials" data-section="testimonials">
<TestimonialCardThirteen <TestimonialCardThirteen
animationType="slide-up" animationType="slide-up"
textboxLayout="default" textboxLayout="default"
useInvertedBackground={false} useInvertedBackground={false}
testimonials={[ testimonials={[
{ { id: "t1", name: "Alice M.", handle: "@alice", testimonial: "Exquisite dining experience.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/joyful-young-barber-wearing-uniform-glasses-showing-credit-card-looking-camera-showing-ok-sign-isolated-blue-background_141793-138027.jpg" },
id: "t1", { id: "t2", name: "Bob R.", handle: "@bob", testimonial: "The best steak in town.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-luxury-restaurant_23-2150598415.jpg" },
name: "Alice M.", { id: "t3", name: "Clara S.", handle: "@clara", testimonial: "Sophisticated and delicious.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-woman-eating-enjoying-fresh-sushi_169016-1395.jpg" },
handle: "@alice", { id: "t4", name: "David L.", handle: "@david", testimonial: "Unforgettable anniversary.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/people-having-dinner-luxurious-restaurants_23-2151081849.jpg" },
testimonial: "Exquisite dining experience.", { id: "t5", name: "Eve W.", handle: "@eve", testimonial: "Amazing wine pairings.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/romantic-woman-man-table_23-2148025325.jpg" },
rating: 5, ]}
imageSrc: "http://img.b2bpic.net/free-photo/joyful-young-barber-wearing-uniform-glasses-showing-credit-card-looking-camera-showing-ok-sign-isolated-blue-background_141793-138027.jpg", showRating={true}
}, title="Guest Reviews"
{ description="Hear what our patrons say."
id: "t2", />
name: "Bob R.", </div>
handle: "@bob",
testimonial: "The best steak in town.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-luxury-restaurant_23-2150598415.jpg",
},
{
id: "t3",
name: "Clara S.",
handle: "@clara",
testimonial: "Sophisticated and delicious.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-eating-enjoying-fresh-sushi_169016-1395.jpg",
},
{
id: "t4",
name: "David L.",
handle: "@david",
testimonial: "Unforgettable anniversary.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/people-having-dinner-luxurious-restaurants_23-2151081849.jpg",
},
{
id: "t5",
name: "Eve W.",
handle: "@eve",
testimonial: "Amazing wine pairings.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/romantic-woman-man-table_23-2148025325.jpg",
},
]}
showRating={true}
title="Guest Reviews"
description="Hear what our patrons say."
/>
</div>
<div id="faq" data-section="faq"> <div id="faq" data-section="faq">
<FaqSplitText <FaqSplitText
useInvertedBackground={false} useInvertedBackground={false}
faqs={[ faqs={[
{ { id: "f1", title: "Do you accept reservations?", content: "Yes, booking in advance is recommended." },
id: "f1", { id: "f2", title: "Is there a dress code?", content: "Smart casual is preferred." },
title: "Do you accept reservations?", { id: "f3", title: "Do you cater for events?", content: "Yes, we offer bespoke catering." },
content: "Yes, booking in advance is recommended.", ]}
}, sideTitle="Questions?"
{ sideDescription="We have answers."
id: "f2", faqsAnimation="slide-up"
title: "Is there a dress code?", />
content: "Smart casual is preferred.", </div>
},
{
id: "f3",
title: "Do you cater for events?",
content: "Yes, we offer bespoke catering.",
},
]}
sideTitle="Questions?"
sideDescription="We have answers."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact"> <div id="contact" data-section="contact">
<ContactCenter <ContactCenter
useInvertedBackground={false} useInvertedBackground={false}
background={{ background={{ variant: "plain" }}
variant: "plain", tag="Contact"
}} title="Book Your Table"
tag="Contact" description="Secure your dining reservation today."
title="Book Your Table" />
description="Secure your dining reservation today." </div>
/>
</div>
<div id="footer" data-section="footer"> <div id="footer" data-section="footer">
<FooterLogoEmphasis <FooterLogoEmphasis
columns={[ columns={[
{ { items: [{ label: "Menu", href: "#menu" }, { label: "Contact", href: "#contact" }] },
items: [ { items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Use", href: "#" }] },
{ ]}
label: "Menu", logoText="The Golden Fork"
href: "#menu", />
}, </div>
{
label: "Contact",
href: "#contact",
},
],
},
{
items: [
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms of Use",
href: "#",
},
],
},
]}
logoText="The Golden Fork"
/>
</div>
</ReactLenis> </ReactLenis>
</ThemeProvider> </ThemeProvider>
); );