337 lines
10 KiB
TypeScript
337 lines
10 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
|
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
|
import MediaAbout from '@/components/sections/about/MediaAbout';
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="expand-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="smallMedium"
|
|
sizing="mediumLargeSizeMediumTitles"
|
|
background="noiseDiagonalGradient"
|
|
cardStyle="inset"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{
|
|
name: "Menu",
|
|
id: "menu",
|
|
},
|
|
{
|
|
name: "About",
|
|
id: "about",
|
|
},
|
|
{
|
|
name: "Reviews",
|
|
id: "reviews",
|
|
},
|
|
{
|
|
name: "Find Us",
|
|
id: "contact",
|
|
},
|
|
]}
|
|
brandName="The Burger Joint"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardTestimonial
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "gradient-bars",
|
|
}}
|
|
title="Fresh. Local. Unbeatable."
|
|
description="Crafting the perfect bite, one burger at a time. We use locally sourced ingredients to bring you the best experience in town."
|
|
testimonials={[
|
|
{
|
|
name: "Alex J.",
|
|
handle: "@foodie",
|
|
testimonial: "The best burger I have ever had. Highly recommend the double stack!",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qpg8v3",
|
|
imageAlt: "gourmet burger illustration vector",
|
|
},
|
|
{
|
|
name: "Sarah M.",
|
|
handle: "@burgerlover",
|
|
testimonial: "Incredible quality and flavor. A local gem.",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=glvdiw",
|
|
imageAlt: "gourmet burger illustration vector",
|
|
},
|
|
{
|
|
name: "Mike T.",
|
|
handle: "@localguide",
|
|
testimonial: "Fast service, fresh ingredients, great atmosphere.",
|
|
rating: 4,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=dnz53y",
|
|
imageAlt: "gourmet burger illustration vector",
|
|
},
|
|
{
|
|
name: "Elena R.",
|
|
handle: "@burgerfan",
|
|
testimonial: "The service is as good as the food. Definitely coming back.",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=x789wp",
|
|
imageAlt: "gourmet burger illustration vector",
|
|
},
|
|
{
|
|
name: "Tom K.",
|
|
handle: "@meatlover",
|
|
testimonial: "A true classic burger done right. Best local joint.",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=03l8rv",
|
|
imageAlt: "gourmet burger illustration vector",
|
|
},
|
|
]}
|
|
buttons={[
|
|
{
|
|
text: "View Menu",
|
|
href: "#menu",
|
|
},
|
|
{
|
|
text: "Contact Us",
|
|
href: "#contact",
|
|
},
|
|
]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qpg8v3"
|
|
avatars={[
|
|
{
|
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5w8zjv",
|
|
alt: "customer portrait headshot",
|
|
},
|
|
{
|
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=cslexk",
|
|
alt: "customer portrait headshot",
|
|
},
|
|
{
|
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ye6hgj",
|
|
alt: "customer portrait headshot",
|
|
},
|
|
{
|
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=susge9",
|
|
alt: "customer portrait headshot",
|
|
},
|
|
{
|
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=838mid",
|
|
alt: "customer portrait headshot",
|
|
},
|
|
]}
|
|
marqueeItems={[
|
|
{
|
|
type: "text",
|
|
text: "Fresh Beef",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Local Produce",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Hand-Cut Fries",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Craft Shakes",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Open Late",
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="menu" data-section="menu">
|
|
<ProductCardFour
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{
|
|
id: "p1",
|
|
name: "Classic Burger",
|
|
price: "$9.90",
|
|
variant: "Popular",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=glvdiw",
|
|
},
|
|
{
|
|
id: "p2",
|
|
name: "Veggie Delight",
|
|
price: "$11.90",
|
|
variant: "Veggie",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=dnz53y",
|
|
},
|
|
{
|
|
id: "p3",
|
|
name: "Double Stack",
|
|
price: "$14.90",
|
|
variant: "New",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=x789wp",
|
|
},
|
|
{
|
|
id: "p4",
|
|
name: "Mango Shake",
|
|
price: "$9.50",
|
|
variant: "Fan Fave",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=03l8rv",
|
|
},
|
|
{
|
|
id: "p5",
|
|
name: "Thick Shake",
|
|
price: "$11.50",
|
|
variant: "Classic",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=czlwiw",
|
|
},
|
|
{
|
|
id: "p6",
|
|
name: "Seasoned Fries",
|
|
price: "$5.90",
|
|
variant: "Classic",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=0iqewi",
|
|
},
|
|
]}
|
|
title="Our Menu"
|
|
description="Handcrafted selections for every craving."
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MediaAbout
|
|
useInvertedBackground={false}
|
|
title="Our Story"
|
|
description="Born from a passion for quality, we believe in fresh ingredients, local partnerships, and great flavors. Each burger tells a story of craftsmanship."
|
|
buttons={[
|
|
{
|
|
text: "Visit Us",
|
|
href: "#contact",
|
|
},
|
|
]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qpg8v3"
|
|
/>
|
|
</div>
|
|
|
|
<div id="reviews" data-section="reviews">
|
|
<TestimonialCardSix
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1",
|
|
name: "John D.",
|
|
handle: "@user1",
|
|
testimonial: "Simply delicious experience.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5w8zjv",
|
|
},
|
|
{
|
|
id: "2",
|
|
name: "Jane S.",
|
|
handle: "@user2",
|
|
testimonial: "Fresh and flavorful.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=cslexk",
|
|
},
|
|
{
|
|
id: "3",
|
|
name: "Robert B.",
|
|
handle: "@user3",
|
|
testimonial: "Best service in town.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ye6hgj",
|
|
},
|
|
{
|
|
id: "4",
|
|
name: "Emily C.",
|
|
handle: "@user4",
|
|
testimonial: "Can't wait to come back.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=susge9",
|
|
},
|
|
{
|
|
id: "5",
|
|
name: "David W.",
|
|
handle: "@user5",
|
|
testimonial: "Perfect weekend meal.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=838mid",
|
|
},
|
|
]}
|
|
title="What Our Guests Say"
|
|
description="Don't just take our word for it."
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCTA
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "plain",
|
|
}}
|
|
tag="Find Us"
|
|
title="Hungry for a burger?"
|
|
description="Come visit us today at the heart of the city. We're open daily until late."
|
|
buttons={[
|
|
{
|
|
text: "Directions",
|
|
href: "#",
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterSimple
|
|
columns={[
|
|
{
|
|
title: "Navigate",
|
|
items: [
|
|
{
|
|
label: "Menu",
|
|
href: "#menu",
|
|
},
|
|
{
|
|
label: "About",
|
|
href: "#about",
|
|
},
|
|
{
|
|
label: "Reviews",
|
|
href: "#reviews",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Legal",
|
|
items: [
|
|
{
|
|
label: "Privacy Policy",
|
|
href: "#",
|
|
},
|
|
{
|
|
label: "Terms of Service",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
bottomLeftText="© 2024 The Burger Joint"
|
|
bottomRightText="Fresh. Local. Unbeatable."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|