bender/98552b6d-19cf-46a0-a243-af025fa85eb6
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-07 12:53:08 +00:00
parent 38e4d64d83
commit 1f83a28ea4
1 changed files with 155 additions and 347 deletions
Download Patch File Download Diff File Expand all files Collapse all files

502
src/app/page.tsx
View File

@@ -27,361 +27,169 @@ export default function LandingPage() {
headingFontWeight="light"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "About",
id: "about",
},
{
name: "Menu",
id: "menu",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="Cloudy Bites"
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "hero" },
{ name: "About", id: "about" },
{ name: "Menu", id: "menu" },
{ name: "Contact", id: "contact" },
]}
brandName="Cloudy Bites"
button={{ text: "Order Now", href: "#menu" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroCarouselLogo
logoText="Cloudy Bites"
description="Experience culinary excellence with every bite. We bring fresh, vibrant, and delicious flavors directly to your plate."
buttons={[
{
text: "View Menu",
href: "#menu",
},
{
text: "Contact Us",
href: "#contact",
},
]}
slides={[
{
imageSrc: "http://img.b2bpic.net/free-photo/top-view-tasty-dinner-with-meat-potatoes-served-with-green-black-plate-pepper-garlic-oil-bottle-cutlery-set_179666-19991.jpg?_wi=1",
imageAlt: "delicious restaurant meal dining",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/eating-pasta_23-2147985237.jpg?_wi=1",
imageAlt: "gourmet burger with fries",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/grilled-beef-steak-served-with-potato-dish-mushroom-sauce_140725-5831.jpg",
imageAlt: "gourmet steak dinner restaurant",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/ice-cream-with-mixed-fruit_1339-4923.jpg",
imageAlt: "breakfast plate healthy start",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/top-baked-sea-bass-served-with-fresh-herbs-sauces-table_140725-12286.jpg",
imageAlt: "tasty grilled fish dish",
},
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroCarouselLogo
logoText="Cloudy Bites"
description="Experience culinary excellence with every bite. We bring fresh, vibrant, and delicious flavors directly to your plate."
buttons={[
{ text: "View Menu", href: "#menu" },
{ text: "Contact Us", href: "#contact" },
]}
slides={[
{ imageSrc: "http://img.b2bpic.net/free-photo/top-view-tasty-dinner-with-meat-potatoes-served-with-green-black-plate-pepper-garlic-oil-bottle-cutlery-set_179666-19991.jpg", imageAlt: "delicious restaurant meal dining" },
{ imageSrc: "http://img.b2bpic.net/free-photo/eating-pasta_23-2147985237.jpg", imageAlt: "gourmet burger with fries" },
{ imageSrc: "http://img.b2bpic.net/free-photo/grilled-beef-steak-served-with-potato-dish-mushroom-sauce_140725-5831.jpg", imageAlt: "gourmet steak dinner restaurant" },
{ imageSrc: "http://img.b2bpic.net/free-photo/ice-cream-with-mixed-fruit_1339-4923.jpg", imageAlt: "breakfast plate healthy start" },
{ imageSrc: "http://img.b2bpic.net/free-photo/top-baked-sea-bass-served-with-fresh-herbs-sauces-table_140725-12286.jpg", imageAlt: "tasty grilled fish dish" },
]}
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={false}
title="Our Passion for Flavor"
description="At Cloudy Bites, we believe that great food brings people together. Our kitchen uses only the finest ingredients to craft memorable dining experiences for our guests."
metrics={[
{
value: "50+",
title: "Menu Varieties",
},
{
value: "10k+",
title: "Happy Guests",
},
{
value: "100%",
title: "Fresh Ingredients",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-professional-chef-working_23-2151232183.jpg?_wi=1"
imageAlt="chef preparing gourmet food"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={false}
title="Our Passion for Flavor"
description="At Cloudy Bites, we believe that great food brings people together. Our kitchen uses only the finest ingredients to craft memorable dining experiences for our guests."
metrics={[
{ value: "50+", title: "Menu Varieties" },
{ value: "10k+", title: "Happy Guests" },
{ value: "100%", title: "Fresh Ingredients" },
]}
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-professional-chef-working_23-2151232183.jpg"
imageAlt="chef preparing gourmet food"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
/>
</div>
<div id="features" data-section="features">
<FeatureCardNine
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
title: "Fast Delivery",
description: "Enjoy your favorite dishes at home, hot and fresh.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hand-holding-smartphone_23-2149870751.jpg",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/view-delicious-food-table_23-2149272790.jpg",
},
imageSrc: "http://img.b2bpic.net/free-photo/top-view-tasty-dinner-with-meat-potatoes-served-with-green-black-plate-pepper-garlic-oil-bottle-cutlery-set_179666-19991.jpg?_wi=2",
imageAlt: "modern food service app interface",
},
{
title: "Premium Ingredients",
description: "Sourced locally and prepared with passion.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hands-scanning-qr-code-with-phone_23-2149357876.jpg",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-fresh-vegetables-dinner-preparation-table_140725-150449.jpg",
},
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-professional-chef-working_23-2151232183.jpg?_wi=2",
imageAlt: "modern food service app interface",
},
{
title: "Community Focus",
description: "We are proud to serve our local area with love.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/view-people-learning-how-make-traditional-sushi-dish_23-2151186427.jpg",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/hand-wearing-gloves-holding-fresh-red-pepper-vegetable-crate_23-2147844279.jpg",
},
imageSrc: "http://img.b2bpic.net/free-photo/eating-pasta_23-2147985237.jpg?_wi=2",
imageAlt: "modern food service app interface",
},
]}
showStepNumbers={true}
title="Why Choose Cloudy Bites"
description="We stand out by providing quality service and delicious flavors every single day."
/>
</div>
<div id="features" data-section="features">
<FeatureCardNine
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
title: "Fast Delivery", description: "Enjoy your favorite dishes at home, hot and fresh.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hand-holding-smartphone_23-2149870751.jpg", imageAlt: "modern food service app interface" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/view-delicious-food-table_23-2149272790.jpg", imageAlt: "modern food service app interface" }
},
{
title: "Premium Ingredients", description: "Sourced locally and prepared with passion.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hands-scanning-qr-code-with-phone_23-2149357876.jpg", imageAlt: "modern food service app interface" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-fresh-vegetables-dinner-preparation-table_140725-150449.jpg", imageAlt: "modern food service app interface" }
},
{
title: "Community Focus", description: "We are proud to serve our local area with love.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/view-people-learning-how-make-traditional-sushi-dish_23-2151186427.jpg", imageAlt: "modern food service app interface" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/hand-wearing-gloves-holding-fresh-red-pepper-vegetable-crate_23-2147844279.jpg", imageAlt: "modern food service app interface" }
},
]}
showStepNumbers={true}
title="Why Choose Cloudy Bites"
description="We stand out by providing quality service and delicious flavors every single day."
/>
</div>
<div id="menu" data-section="menu">
<ProductCardTwo
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{
id: "p1",
brand: "Chef Pick",
name: "Gourmet Classic",
price: "$15.00",
rating: 5,
reviewCount: "120",
imageSrc: "http://img.b2bpic.net/free-photo/burger-bread-bun-with-meat-french-fries_114579-3535.jpg",
},
{
id: "p2",
brand: "Refreshing",
name: "Artisan Drink",
price: "$6.00",
rating: 4,
reviewCount: "85",
imageSrc: "http://img.b2bpic.net/free-photo/still-life-mexican-sweetness_23-2149666285.jpg",
},
{
id: "p3",
brand: "Signature",
name: "Wood-Fired Pizza",
price: "$18.00",
rating: 5,
reviewCount: "200",
imageSrc: "http://img.b2bpic.net/free-photo/meat-cutting-glass-champagne_140725-2149.jpg",
},
{
id: "p4",
brand: "Morning",
name: "Healthy Start",
price: "$12.00",
rating: 4,
reviewCount: "60",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-homemade-chocolate-cakes-white-plate_114579-85484.jpg",
},
{
id: "p5",
brand: "Light",
name: "Grilled Catch",
price: "$22.00",
rating: 5,
reviewCount: "45",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-cup-tea-with-lemon-slice-light-background_140725-124962.jpg",
},
{
id: "p6",
brand: "Dessert",
name: "Signature Pastry",
price: "$8.00",
rating: 5,
reviewCount: "150",
imageSrc: "http://img.b2bpic.net/free-photo/vertical-view-soft-cake-decorated-with-lemon-chocolate-dark-background_140725-91975.jpg",
},
]}
title="Our Signature Dishes"
description="Explore a variety of carefully curated items that represent the heart of Cloudy Bites."
/>
</div>
<div id="menu" data-section="menu">
<ProductCardTwo
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{ id: "p1", brand: "Chef Pick", name: "Gourmet Classic", price: "$15.00", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/burger-bread-bun-with-meat-french-fries_114579-3535.jpg" },
{ id: "p2", brand: "Refreshing", name: "Artisan Drink", price: "$6.00", rating: 4, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/still-life-mexican-sweetness_23-2149666285.jpg" },
{ id: "p3", brand: "Signature", name: "Wood-Fired Pizza", price: "$18.00", rating: 5, reviewCount: "200", imageSrc: "http://img.b2bpic.net/free-photo/meat-cutting-glass-champagne_140725-2149.jpg" },
{ id: "p4", brand: "Morning", name: "Healthy Start", price: "$12.00", rating: 4, reviewCount: "60", imageSrc: "http://img.b2bpic.net/free-photo/top-view-homemade-chocolate-cakes-white-plate_114579-85484.jpg" },
{ id: "p5", brand: "Light", name: "Grilled Catch", price: "$22.00", rating: 5, reviewCount: "45", imageSrc: "http://img.b2bpic.net/free-photo/top-view-cup-tea-with-lemon-slice-light-background_140725-124962.jpg" },
{ id: "p6", brand: "Dessert", name: "Signature Pastry", price: "$8.00", rating: 5, reviewCount: "150", imageSrc: "http://img.b2bpic.net/free-photo/vertical-view-soft-cake-decorated-with-lemon-chocolate-dark-background_140725-91975.jpg" },
]}
title="Our Signature Dishes"
description="Explore a variety of carefully curated items that represent the heart of Cloudy Bites."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardThirteen
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "t1",
name: "Sarah J.",
handle: "@sarah_foodie",
testimonial: "The best burger I've had in a long time. So flavorful!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/couple-having-lunch-together-restaurant_58466-16804.jpg",
},
{
id: "t2",
name: "Michael C.",
handle: "@mikey_eats",
testimonial: "Fantastic service and even better food. Highly recommended.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-eating-sushi-working_23-2149870697.jpg",
},
{
id: "t3",
name: "Emily R.",
handle: "@emily_dines",
testimonial: "Great atmosphere and lovely staff. My favorite spot.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-wearing-embroidered-shirt_23-2149394274.jpg",
},
{
id: "t4",
name: "David K.",
handle: "@david_gourmet",
testimonial: "Truly a hidden gem. The quality is unmatched.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/man-presents-girl-ring_1398-4220.jpg",
},
{
id: "t5",
name: "Lisa M.",
handle: "@lisa_tastes",
testimonial: "Fast service and incredible attention to detail.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/food-blogger-young-fitness-cook-recording-video-social-media-happy-laughing_140725-166770.jpg",
},
]}
showRating={true}
title="Customer Reviews"
description="See why our guests keep coming back for more."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardThirteen
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{ id: "t1", name: "Sarah J.", handle: "@sarah_foodie", testimonial: "The best burger I've had in a long time. So flavorful!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/couple-having-lunch-together-restaurant_58466-16804.jpg" },
{ id: "t2", name: "Michael C.", handle: "@mikey_eats", testimonial: "Fantastic service and even better food. Highly recommended.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-eating-sushi-working_23-2149870697.jpg" },
{ id: "t3", name: "Emily R.", handle: "@emily_dines", testimonial: "Great atmosphere and lovely staff. My favorite spot.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-woman-wearing-embroidered-shirt_23-2149394274.jpg" },
{ id: "t4", name: "David K.", handle: "@david_gourmet", testimonial: "Truly a hidden gem. The quality is unmatched.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/man-presents-girl-ring_1398-4220.jpg" },
{ id: "t5", name: "Lisa M.", handle: "@lisa_tastes", testimonial: "Fast service and incredible attention to detail.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/food-blogger-young-fitness-cook-recording-video-social-media-happy-laughing_140725-166770.jpg" },
]}
showRating={true}
title="Customer Reviews"
description="See why our guests keep coming back for more."
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "f1",
title: "Do you offer delivery?",
content: "Yes, we offer fast delivery services to your doorstep.",
},
{
id: "f2",
title: "Are there vegetarian options?",
content: "Absolutely! We provide a variety of healthy plant-based choices.",
},
{
id: "f3",
title: "Can I make a reservation?",
content: "Yes, please contact us at +961 81 633 899 to book your table.",
},
]}
title="Common Questions"
description="Need more info? We are here to help."
faqsAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-photo/photorealistic-wooden-house-interior-with-timber-decor-furnishings_23-2151263526.jpg?_wi=1"
mediaAnimation="slide-up"
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{ id: "f1", title: "Do you offer delivery?", content: "Yes, we offer fast delivery services to your doorstep." },
{ id: "f2", title: "Are there vegetarian options?", content: "Absolutely! We provide a variety of healthy plant-based choices." },
{ id: "f3", title: "Can I make a reservation?", content: "Yes, please contact us at +961 81 633 899 to book your table." },
]}
title="Common Questions"
description="Need more info? We are here to help."
faqsAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-photo/photorealistic-wooden-house-interior-with-timber-decor-furnishings_23-2151263526.jpg"
mediaAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
useInvertedBackground={false}
title="Get in Touch"
description="Have any questions or need to make a reservation? Reach out to us directly."
inputs={[
{
name: "name",
type: "text",
placeholder: "Your Name",
required: true,
},
{
name: "email",
type: "email",
placeholder: "Your Email",
required: true,
},
]}
textarea={{
name: "message",
placeholder: "How can we help you?",
rows: 4,
required: true,
}}
imageSrc="http://img.b2bpic.net/free-photo/photorealistic-wooden-house-interior-with-timber-decor-furnishings_23-2151263526.jpg?_wi=2"
buttonText="Send Message"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
useInvertedBackground={false}
title="Get in Touch"
description="Have any questions or need to make a reservation? Reach out to us directly."
inputs={[
{ name: "name", type: "text", placeholder: "Your Name", required: true },
{ name: "email", type: "email", placeholder: "Your Email", required: true },
]}
textarea={{ name: "message", placeholder: "How can we help you?", rows: 4, required: true }}
imageSrc="http://img.b2bpic.net/free-photo/photorealistic-wooden-house-interior-with-timber-decor-furnishings_23-2151263526.jpg"
buttonText="Send Message"
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
columns={[
{
title: "Quick Links",
items: [
{
label: "Home",
href: "#hero",
},
{
label: "About",
href: "#about",
},
{
label: "Menu",
href: "#menu",
},
],
},
{
title: "Contact",
items: [
{
label: "+961 81 633 899",
href: "tel:+96181633899",
},
{
label: "Email Us",
href: "mailto:info@cloudybites.com",
},
],
},
]}
logoText="Cloudy Bites"
copyrightText="© 2025 Cloudy Bites. All rights reserved."
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
columns={[
{
title: "Quick Links", items: [
{ label: "Home", href: "#hero" },
{ label: "About", href: "#about" },
{ label: "Menu", href: "#menu" },
],
},
{
title: "Contact", items: [
{ label: "+961 81 633 899", href: "tel:+96181633899" },
{ label: "Email Us", href: "mailto:info@cloudybites.com" },
],
},
]}
logoText="Cloudy Bites"
copyrightText="© 2025 Cloudy Bites. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);