193 lines
9.6 KiB
TypeScript
193 lines
9.6 KiB
TypeScript
"use client";
|
||
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import ReactLenis from "lenis/react";
|
||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||
import FaqBase from '@/components/sections/faq/FaqBase';
|
||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
|
||
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
||
import TeamCardTwo from '@/components/sections/team/TeamCardTwo';
|
||
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
||
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="icon-arrow"
|
||
defaultTextAnimation="entrance-slide"
|
||
borderRadius="soft"
|
||
contentWidth="mediumSmall"
|
||
sizing="largeSizeMediumTitles"
|
||
background="floatingGradient"
|
||
cardStyle="outline"
|
||
primaryButtonStyle="primary-glow"
|
||
secondaryButtonStyle="layered"
|
||
headingFontWeight="normal"
|
||
>
|
||
<ReactLenis root>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarLayoutFloatingInline
|
||
navItems={[
|
||
{ name: "Menu", id: "#products" },
|
||
{ name: "About", id: "#about" },
|
||
{ name: "Team", id: "#team" },
|
||
{ name: "Contact", id: "#contact" },
|
||
]}
|
||
brandName="Joanna's Place"
|
||
button={{ text: "Order Now", href: "#contact" }}
|
||
/>
|
||
</div>
|
||
|
||
<div id="hero" data-section="hero">
|
||
<HeroSplitKpi
|
||
background={{ variant: "gradient-bars" }}
|
||
title="Klintholm's Finest Burgers"
|
||
description="Experience hand-crafted, locally sourced ingredients served right by the harbor. Joanna's Place offers premium comfort food in a relaxed seaside setting."
|
||
kpis={[
|
||
{ value: "4 ", label: "Signature Burgers" },
|
||
{ value: "3+", label: "Years Quality" },
|
||
{ value: "Local", label: "Sourced Beef" },
|
||
]}
|
||
enableKpiAnimation={true}
|
||
buttons={[{ text: "View Menu", href: "#products" }]}
|
||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=s7pwiw"
|
||
mediaAnimation="slide-up"
|
||
avatars={[
|
||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=05xi4v", alt: "Happy customer" },
|
||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=w5ai71", alt: "Happy customer" },
|
||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=2u5z87", alt: "Happy customer" },
|
||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6yt3v6", alt: "Happy customer" },
|
||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9mxt0y", alt: "Happy customer" },
|
||
]}
|
||
avatarText="Loved by 500+ happy locals"
|
||
marqueeItems={[
|
||
{ type: "text", text: "Locally Sourced" },
|
||
{ type: "text", text: "Fresh Ingredients" },
|
||
{ type: "text", text: "Harbor View" },
|
||
{ type: "text", text: "Artisan Buns" },
|
||
{ type: "text", text: "Hand-made Patties" },
|
||
]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="about" data-section="about">
|
||
<TextSplitAbout
|
||
useInvertedBackground={true}
|
||
title="Tradition by the bøf burger "
|
||
description={[
|
||
"Founded on a love for simple, delicious food, Joanna's Place brings a touch of premium dining to Klintholm Havn.", "Every burger is crafted with passion, featuring fresh ingredients and local flavors that keep guests coming back year after year."]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="products" data-section="products">
|
||
<ProductCardFour
|
||
animationType="slide-up"
|
||
textboxLayout="split"
|
||
gridVariant="two-columns-alternating-heights"
|
||
useInvertedBackground={false}
|
||
products={[
|
||
{ id: "1", name: "bøf burger + fries ", price: "145 DKK", variant: "57cm lang ", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=sdswn5" },
|
||
{ id: "2", name: "nakkefilet burger + fries ", price: "149DKK", variant: "Bacon Cheese", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7osnsl" },
|
||
{ id: "3", name: "Kylling Burger", price: "139DKK", variant: "chicken ", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3e6ddz" },
|
||
{ id: "4", name: "Veggie Delight", price: "135 DKK", variant: "Plant-based", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7sp5i5" },
|
||
{ id: "5", name: "goulash ", price: "89DKK", variant: "Chili", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=vx2ibo" },
|
||
{ id: "6", name: "buguette ", price: "99DKK", variant: "57cm lang ", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6zkdzb" },
|
||
]}
|
||
title="Our Signature Creations"
|
||
description="Discover our curated selection of premium burgers, each prepared to order."
|
||
/>
|
||
</div>
|
||
|
||
<div id="metrics" data-section="metrics">
|
||
<MetricCardEleven
|
||
animationType="slide-up"
|
||
textboxLayout="split"
|
||
useInvertedBackground={true}
|
||
metrics={[
|
||
{ id: "m1", value: "5k+", title: "Served", description: "Burgers served over years", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=rg8snl" },
|
||
{ id: "m2", value: "100%", title: "Local", description: "Local fresh meat", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=gwb8rl" },
|
||
{ id: "m3", value: "5⭐️ ", title: "average Rating", description: "Average guest rating", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ol1e35" },
|
||
]}
|
||
title="Our Success"
|
||
description="Numbers that define our journey."
|
||
/>
|
||
</div>
|
||
|
||
<div id="team" data-section="team">
|
||
<TeamCardTwo
|
||
animationType="slide-up"
|
||
textboxLayout="split"
|
||
gridVariant="three-columns-all-equal-width"
|
||
useInvertedBackground={false}
|
||
members={[
|
||
{ id: "t1", name: "Joanna", role: "Owner & Founder", description: "Head of culinary vision", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ubx031" },
|
||
{ id: "t2", name: "Michał ", role: "Head Chef", description: "Master of the grill", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=36ildq" },
|
||
{ id: "t3", name: "ola/karol ", role: "Service Lead", description: "Ensuring great harbor vibes", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=v8amwm" },
|
||
]}
|
||
title="Meet The Crew"
|
||
description="The passionate people behind Joanna's Place."
|
||
/>
|
||
</div>
|
||
|
||
<div id="testimonials" data-section="testimonials">
|
||
<TestimonialCardSix
|
||
animationType="slide-up"
|
||
textboxLayout="split"
|
||
useInvertedBackground={true}
|
||
testimonials={[
|
||
{ id: "1", name: "Anders Jensen", handle: "@andersj", testimonial: "Best burger in Denmark!", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=05xi4v" },
|
||
{ id: "2", name: "Mette Nielsen", handle: "@metten", testimonial: "Amazing location and food.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=w5ai71" },
|
||
{ id: "3", name: "Thomas Holm", handle: "@thomash", testimonial: "The atmosphere is top notch.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=2u5z87" },
|
||
{ id: "4", name: "Lise Petersen", handle: "@lisep", testimonial: "Juicy and perfect every time.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6yt3v6" },
|
||
{ id: "5", name: "Jens V.", handle: "@jensv", testimonial: "A must-visit when at the harbor.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9mxt0y" },
|
||
]}
|
||
title="Guest Voices"
|
||
description="What people say about our burgers."
|
||
/>
|
||
</div>
|
||
|
||
<div id="faq" data-section="faq">
|
||
<FaqBase
|
||
textboxLayout="split"
|
||
useInvertedBackground={false}
|
||
faqs={[
|
||
{ id: "q1", title: "Do you accept reservations?", content: "Yes, for larger groups." },
|
||
{ id: "q2", title: "Are there vegan options?", content: "Absolutely, try our Veggie Delight." },
|
||
{ id: "q3", title: "Is parking available?", content: "Free parking at Klintholm Havn." },
|
||
]}
|
||
title="Common Questions"
|
||
description="Everything you need to know about us."
|
||
faqsAnimation="slide-up"
|
||
/>
|
||
</div>
|
||
|
||
<div id="contact" data-section="contact">
|
||
<ContactSplitForm
|
||
useInvertedBackground={true}
|
||
title="Visit Us Today"
|
||
description="Join us at the harbor for the best burger experience in the area."
|
||
inputs={[
|
||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||
{ name: "email", type: "email", placeholder: "Your Email", required: true },
|
||
]}
|
||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=os2qec"
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterLogoEmphasis
|
||
columns={[
|
||
{ items: [{ label: "Menu", href: "#products" }, { label: "About", href: "#about" }] },
|
||
{ items: [{ label: "Contact", href: "#contact" }, { label: "Privacy", href: "#" }] },
|
||
]}
|
||
logoText="Joanna's Place"
|
||
/>
|
||
</div>
|
||
</ReactLenis>
|
||
</ThemeProvider>
|
||
);
|
||
}
|