Update src/app/page.tsx

This commit is contained in:
2026-05-08 16:53:04 +00:00
parent 683af19717
commit 7883a7964c

View File

@@ -2,6 +2,7 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import { Coffee, Croissant, Book, Heart } from "lucide-react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
@@ -27,285 +28,129 @@ export default function LandingPage() {
headingFontWeight="extrabold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "About",
id: "about",
},
{
name: "Menu",
id: "products",
},
{
name: "Reviews",
id: "testimonials",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="Hard Bean"
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "hero" },
{ name: "About", id: "about" },
{ name: "Menu", id: "products" },
{ name: "Reviews", id: "testimonials" },
{ name: "Contact", id: "contact" },
]}
brandName="Hard Bean"
button={{ text: "Order Now", href: "#products" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardGallery
background={{
variant: "gradient-bars",
}}
title="Your Neighborhood Home for Specialty Coffee"
description="Artisanal coffee, freshly baked goods, and a cozy space designed for studying, relaxing, and connection in the heart of Merrick."
buttons={[
{
text: "View Our Menu",
href: "#products",
},
]}
mediaItems={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=y7pg4x&_wi=1",
imageAlt: "Coffee shop interior",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z37eag&_wi=1",
imageAlt: "Fresh pastries",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=o71nwd&_wi=1",
imageAlt: "Cafe ambiance",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=h65ufq",
imageAlt: "Barista service",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=034cyw",
imageAlt: "Coffee brewing",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=rbnn93",
imageAlt: "Morning coffee ritual",
},
]}
mediaAnimation="slide-up"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardGallery
background={{ variant: "gradient-bars" }}
title="Your Neighborhood Home for Specialty Coffee"
description="Artisanal coffee, freshly baked goods, and a cozy space designed for studying, relaxing, and connection in the heart of Merrick."
buttons={[{ text: "View Our Menu", href: "#products" }]}
mediaItems={[
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=y7pg4x", imageAlt: "Coffee shop interior" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z37eag", imageAlt: "Fresh pastries" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=o71nwd", imageAlt: "Cafe ambiance" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=h65ufq", imageAlt: "Barista service" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=034cyw", imageAlt: "Coffee brewing" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=rbnn93", imageAlt: "Morning coffee ritual" }
]}
mediaAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<TextSplitAbout
useInvertedBackground={false}
title="Welcome to Hard Bean Merrick"
description={[
"We believe that a great cup of coffee is the heart of every community. Our Merrick cafe serves specialty coffees sourced from around the world, paired with delicious, fresh-baked goods and a warm, inviting atmosphere.",
"Whether you're here to power through a study session, catch up with an old friend, or simply enjoy a quiet moment with a latte, our doors are open.",
]}
/>
</div>
<div id="about" data-section="about">
<TextSplitAbout
useInvertedBackground={false}
title="Welcome to Hard Bean Merrick"
description={[
"We believe that a great cup of coffee is the heart of every community. Our Merrick cafe serves specialty coffees sourced from around the world, paired with delicious, fresh-baked goods and a warm, inviting atmosphere.", "Whether you're here to power through a study session, catch up with an old friend, or simply enjoy a quiet moment with a latte, our doors are open."]}
/>
</div>
<div id="features" data-section="features">
<FeatureCardTwentySix
textboxLayout="default"
useInvertedBackground={true}
features={[
{
title: "World-Class Beans",
description: "Ethically sourced specialty coffees from the finest growing regions.",
buttonIcon: "Coffee",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=kra34t",
imageAlt: "coffee shop friendly barista smiling",
},
{
title: "Fresh Baked Daily",
description: "Treat yourself to our selection of artisanal pastries and snacks.",
buttonIcon: "Croissant",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=y7pg4x&_wi=2",
imageAlt: "coffee shop friendly barista smiling",
},
{
title: "Cozy Atmosphere",
description: "The perfect local sanctuary for studying, reading, or relaxing.",
buttonIcon: "Book",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z37eag&_wi=2",
imageAlt: "coffee shop friendly barista smiling",
},
{
title: "Friendly Service",
description: "Our team is here to brighten your day with every cup served.",
buttonIcon: "Heart",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=o71nwd&_wi=2",
imageAlt: "coffee shop friendly barista smiling",
},
]}
title="Why Merrick Loves Us"
description="Experience more than just coffee. We provide an authentic cafe experience designed for your lifestyle."
/>
</div>
<div id="features" data-section="features">
<FeatureCardTwentySix
textboxLayout="default"
useInvertedBackground={true}
features={[
{ title: "World-Class Beans", description: "Ethically sourced specialty coffees from the finest growing regions.", buttonIcon: Coffee, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=kra34t", imageAlt: "coffee shop friendly barista smiling" },
{ title: "Fresh Baked Daily", description: "Treat yourself to our selection of artisanal pastries and snacks.", buttonIcon: Croissant, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=y7pg4x", imageAlt: "coffee shop friendly barista smiling" },
{ title: "Cozy Atmosphere", description: "The perfect local sanctuary for studying, reading, or relaxing.", buttonIcon: Book, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z37eag", imageAlt: "coffee shop friendly barista smiling" },
{ title: "Friendly Service", description: "Our team is here to brighten your day with every cup served.", buttonIcon: Heart, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=o71nwd", imageAlt: "coffee shop friendly barista smiling" },
]}
title="Why Merrick Loves Us"
description="Experience more than just coffee. We provide an authentic cafe experience designed for your lifestyle."
/>
</div>
<div id="products" data-section="products">
<ProductCardFour
animationType="slide-up"
textboxLayout="split"
gridVariant="two-columns-alternating-heights"
useInvertedBackground={false}
products={[
{
id: "1",
name: "Mocha Latte",
price: "$5.50",
variant: "Specialty Coffee",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6do362",
},
{
id: "2",
name: "Monkey Bread",
price: "$4.00",
variant: "Baked Goods",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=vh9g4h",
},
{
id: "3",
name: "Decaf Espresso over Ice",
price: "$4.75",
variant: "Iced Coffee",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=05hgdu",
},
{
id: "4",
name: "Matcha Latte",
price: "$5.25",
variant: "Green Tea",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=4cahqr",
},
{
id: "5",
name: "Breakfast Sandwich",
price: "$7.50",
variant: "Breakfast",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=yt5y20",
},
{
id: "6",
name: "Tiramisu Snack",
price: "$4.50",
variant: "Dessert",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=vr8tmw",
},
]}
title="Menu Highlights"
description="Discover your new favorite drink or treat from our popular selections."
/>
</div>
<div id="products" data-section="products">
<ProductCardFour
animationType="slide-up"
textboxLayout="split"
gridVariant="two-columns-alternating-heights"
useInvertedBackground={false}
products={[
{ id: "1", name: "Mocha Latte", price: "$5.50", variant: "Specialty Coffee", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6do362" },
{ id: "2", name: "Monkey Bread", price: "$4.00", variant: "Baked Goods", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=vh9g4h" },
{ id: "3", name: "Decaf Espresso over Ice", price: "$4.75", variant: "Iced Coffee", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=05hgdu" },
{ id: "4", name: "Matcha Latte", price: "$5.25", variant: "Green Tea", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=4cahqr" },
{ id: "5", name: "Breakfast Sandwich", price: "$7.50", variant: "Breakfast", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=yt5y20" },
{ id: "6", name: "Tiramisu Snack", price: "$4.50", variant: "Dessert", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=vr8tmw" },
]}
title="Menu Highlights"
description="Discover your new favorite drink or treat from our popular selections."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSix
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
testimonials={[
{
id: "1",
name: "Sarah L.",
handle: "@sarah-l",
testimonial: "Great coffee, yummy bake goods, nice space and decor.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=fvosnm",
},
{
id: "2",
name: "Michael R.",
handle: "@miker",
testimonial: "Great coffee, drinks and treats in a cozy atmosphere. Perfect little coffee shop!",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ria9ng",
},
{
id: "3",
name: "Jessica T.",
handle: "@jess-t",
testimonial: "Great find in Merrick! Awesome coffee and nice vibe.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=02sta1",
},
{
id: "4",
name: "David W.",
handle: "@davidw",
testimonial: "The staff are consistently friendly and provide excellent service.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=xjz7bb",
},
{
id: "5",
name: "Emma C.",
handle: "@emmac",
testimonial: "My go-to spot for studying. The matcha drinks are incredible.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=y5yh9j",
},
]}
title="Merrick's Favorite Cafe"
description="Hear what our regulars are saying about their Hard Bean experience."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSix
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
testimonials={[
{ id: "1", name: "Sarah L.", handle: "@sarah-l", testimonial: "Great coffee, yummy bake goods, nice space and decor.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=fvosnm" },
{ id: "2", name: "Michael R.", handle: "@miker", testimonial: "Great coffee, drinks and treats in a cozy atmosphere. Perfect little coffee shop!", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ria9ng" },
{ id: "3", name: "Jessica T.", handle: "@jess-t", testimonial: "Great find in Merrick! Awesome coffee and nice vibe.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=02sta1" },
{ id: "4", name: "David W.", handle: "@davidw", testimonial: "The staff are consistently friendly and provide excellent service.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=xjz7bb" },
{ id: "5", name: "Emma C.", handle: "@emmac", testimonial: "My go-to spot for studying. The matcha drinks are incredible.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=y5yh9j" },
]}
title="Merrick's Favorite Cafe"
description="Hear what our regulars are saying about their Hard Bean experience."
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "1",
title: "Do you have Wi-Fi?",
content: "Yes, we provide complimentary high-speed Wi-Fi for all our guests.",
},
{
id: "2",
title: "Do you offer vegan options?",
content: "We offer several vegan-friendly milk alternatives and rotate our baked goods menu to include vegan snacks.",
},
{
id: "3",
title: "Can I reserve a table?",
content: "We operate on a first-come, first-served basis, creating a welcoming flow for everyone.",
},
]}
title="Frequently Asked Questions"
description="Have questions? We've got answers."
faqsAnimation="slide-up"
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{ id: "1", title: "Do you have Wi-Fi?", content: "Yes, we provide complimentary high-speed Wi-Fi for all our guests." },
{ id: "2", title: "Do you offer vegan options?", content: "We offer several vegan-friendly milk alternatives and rotate our baked goods menu to include vegan snacks." },
{ id: "3", title: "Can I reserve a table?", content: "We operate on a first-come, first-served basis, creating a welcoming flow for everyone." },
]}
title="Frequently Asked Questions"
description="Have questions? We've got answers."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactText
useInvertedBackground={true}
background={{
variant: "sparkles-gradient",
}}
text="Visit us at 15 Merrick Ave, Merrick, NY 11566. Open daily until 6 PM."
buttons={[
{
text: "Get Directions",
href: "https://maps.google.com",
},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactText
useInvertedBackground={true}
background={{ variant: "sparkles-gradient" }}
text="Visit us at 15 Merrick Ave, Merrick, NY 11566. Open daily until 6 PM."
buttons={[{ text: "Get Directions", href: "https://maps.google.com" }]}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Hard Bean"
leftLink={{
text: "Privacy Policy",
href: "#",
}}
rightLink={{
text: "Contact Us",
href: "tel:+16313046647",
}}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Hard Bean"
leftLink={{ text: "Privacy Policy", href: "#" }}
rightLink={{ text: "Contact Us", href: "tel:+16313046647" }}
/>
</div>
</ReactLenis>
</ThemeProvider>
);