331 lines
19 KiB
TypeScript
331 lines
19 KiB
TypeScript
"use client";
|
||
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import ReactLenis from "lenis/react";
|
||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||
import FeatureBento from '@/components/sections/feature/FeatureBento';
|
||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
|
||
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
||
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
||
import { Award, Box, CookingPot, Diamond, Droplets, Home, Leaf, Smile } from "lucide-react";
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="bounce-effect"
|
||
defaultTextAnimation="entrance-slide"
|
||
borderRadius="pill"
|
||
contentWidth="medium"
|
||
sizing="largeSmallSizeLargeTitles"
|
||
background="grid"
|
||
cardStyle="outline"
|
||
primaryButtonStyle="double-inset"
|
||
secondaryButtonStyle="solid"
|
||
headingFontWeight="normal"
|
||
>
|
||
<ReactLenis root>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarStyleCentered
|
||
navItems={[
|
||
{
|
||
name: "Home", id: "#home"},
|
||
{
|
||
name: "Menu", id: "#menu"},
|
||
{
|
||
name: "About", id: "#about"},
|
||
{
|
||
name: "Reviews", id: "#reviews"},
|
||
{
|
||
name: "FAQ", id: "#faq"},
|
||
{
|
||
name: "Contact", id: "#contact"},
|
||
]}
|
||
button={{
|
||
text: "Order Now", href: "#contact"}}
|
||
brandName="Shanghai Tan Burgers"
|
||
/>
|
||
</div>
|
||
|
||
<div id="home" data-section="home">
|
||
<HeroSplitTestimonial
|
||
useInvertedBackground={false}
|
||
background={{
|
||
variant: "plain"}}
|
||
imagePosition="right"
|
||
title="Experience the Best Burgers in Town!"
|
||
description="Juicy patties, fresh ingredients, and a taste that keeps you coming back for more. Shanghai Tan Burgers is your destination for gourmet burgers and an unforgettable dining experience."
|
||
testimonials={[
|
||
{
|
||
name: "Alex P.", handle: "@alexfoodie", testimonial: "Absolutely the best burger I've had in years! The patty was perfectly cooked and the toppings were fresh.", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/pleased-successful-female-administrator-office_273609-4124.jpg", imageAlt: "Customer Alex P."},
|
||
{
|
||
name: "Maria S.", handle: "@mariasavor", testimonial: "Fantastic service and even better food. The truffle fries are a must-try! Highly recommend Shanghai Tan Burgers.", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-blonde-female-model-sport-wear-eating-free-potato_176420-7750.jpg", imageAlt: "Customer Maria S."},
|
||
{
|
||
name: "Chen W.", handle: "@eatsbychen", testimonial: "A true hidden gem! Every burger is crafted with care and the flavors are just incredible. My new favorite spot.", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/hipster-man-talking-by-mobile-phone-cafe_329181-2041.jpg", imageAlt: "Customer Chen W."},
|
||
{
|
||
name: "Sarah J.", handle: "@burgergal", testimonial: "The atmosphere is great, and the burgers are out of this world. Fresh ingredients make all the difference. You won't regret it!", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-dark-skinned-young-female-with-frizzy-hair-eats-something-drinks-smoothie-spends-free-time-with-boyfriend-friend-enjoys-summer-vacations-tropical-country-island_273609-2195.jpg", imageAlt: "Customer Sarah J."},
|
||
{
|
||
name: "David L.", handle: "@localeats", testimonial: "Consistently amazing food and friendly staff. It's the only place I go for a truly satisfying burger experience.", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/attractive-girl-white-shirt-is-holding-cupcakes_158595-1588.jpg", imageAlt: "Customer David L."},
|
||
]}
|
||
testimonialRotationInterval={5000}
|
||
buttons={[
|
||
{
|
||
text: "Order Online", href: "#contact"},
|
||
{
|
||
text: "View Menu", href: "#menu"},
|
||
]}
|
||
avatars={[
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/portrait-handsome-smiling-young-man-model-wearing-casual-shirt-clothes-fashion-stylish-man-posing_158538-5314.jpg", alt: "Happy Customer 1"},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/young-blonde-girl-wearing-casual-red-sweater-isolated-background-happy-face-smiling-with-crossed-arms-looking-camera-positive-person_839833-16598.jpg", alt: "Happy Customer 2"},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/smiling-portrait-young-woman-holding-mobile-phone-hand-looking-camera_23-2148148233.jpg", alt: "Happy Customer 3"},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/young-black-woman-with-afro-hair-laughing-enjoying_150588-169.jpg", alt: "Happy Customer 4"},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/mature-man-smiling-looking-camera-urban-background_1139-1093.jpg", alt: "Happy Customer 5"},
|
||
]}
|
||
avatarText="Join our community of happy diners!"
|
||
imageSrc="http://img.b2bpic.net/free-photo/front-view-chicken-burger-with-cheese-green-salad-wooden-desk-sandwich-fast-food-meal_140725-25934.jpg"
|
||
imageAlt="A mouth-watering gourmet burger"
|
||
mediaAnimation="slide-up"
|
||
fixedMediaHeight={true}
|
||
marqueeItems={[
|
||
{
|
||
type: "text-icon", text: "Gourmet Flavors", icon: CookingPot,
|
||
},
|
||
{
|
||
type: "text-icon", text: "Fresh Ingredients Daily", icon: Leaf,
|
||
},
|
||
{
|
||
type: "text-icon", text: "Award-Winning Recipes", icon: Award,
|
||
},
|
||
{
|
||
type: "text-icon", text: "Friendly Service", icon: Smile,
|
||
},
|
||
{
|
||
type: "text-icon", text: "Family Owned", icon: Home,
|
||
},
|
||
]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="about" data-section="about">
|
||
<TestimonialAboutCard
|
||
useInvertedBackground={true}
|
||
tag="Our Story"
|
||
title="Crafting Perfection, One Burger at a Time"
|
||
description="At Shanghai Tan Burgers, we believe in passion, quality, and community. Every burger is a testament to our commitment to fresh, locally sourced ingredients and unique flavors that stand out from the rest."
|
||
subdescription="Since day one, our mission has been to serve unforgettable meals and create a welcoming atmosphere for everyone who walks through our doors. We take pride in our culinary journey and invite you to be a part of it."
|
||
icon={Diamond}
|
||
imageSrc="http://img.b2bpic.net/free-photo/chef-preparing-burger-with-meat-cutletcheese-tomatoes-lettuce-onion_140725-8118.jpg"
|
||
imageAlt="Chef preparing a burger with fresh ingredients"
|
||
mediaAnimation="opacity"
|
||
/>
|
||
</div>
|
||
|
||
<div id="features" data-section="features">
|
||
<FeatureBento
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
features={[
|
||
{
|
||
title: "Signature Burgers", description: "Indulge in our unique burger creations, blending classic tastes with innovative twists. Each burger is a masterpiece.", bentoComponent: "reveal-icon", icon: Award,
|
||
},
|
||
{
|
||
title: "Freshly Made Sides", description: "Complement your burger with our crispy, golden fries, gourmet onion rings, or a refreshing side salad made with local produce.", bentoComponent: "reveal-icon", icon: Box,
|
||
},
|
||
{
|
||
title: "Craft Beverages", description: "Quench your thirst with our selection of local craft sodas, artisanal milkshakes, and refreshing iced teas.", bentoComponent: "reveal-icon", icon: Droplets,
|
||
},
|
||
]}
|
||
title="More Than Just Burgers"
|
||
description="Discover what makes Shanghai Tan Burgers a local favorite. From signature sauces to crispy sides and unique beverages, we have something for every craving and every palate."
|
||
tag="Highlights"
|
||
/>
|
||
</div>
|
||
|
||
<div id="menu" data-section="menu">
|
||
<ProductCardThree
|
||
textboxLayout="default"
|
||
gridVariant="three-columns-all-equal-width"
|
||
useInvertedBackground={true}
|
||
animationType="slide-up"
|
||
products={[
|
||
{
|
||
id: "cheeseburger", name: "Classic Cheeseburger", price: "$12.99", imageSrc: "http://img.b2bpic.net/free-photo/top-view-burger-with-olives-cheese-different-vegetables-inside-round-pan-bright-floor_140725-11674.jpg", imageAlt: "Classic Cheeseburger with melted cheese"},
|
||
{
|
||
id: "chickenburger", name: "Spicy Chicken Burger", price: "$13.99", imageSrc: "http://img.b2bpic.net/free-photo/sandwich-with-chicken-burger-tomatoes-red-onion-lettuce_2829-11151.jpg", imageAlt: "Spicy Chicken Burger with crispy chicken"},
|
||
{
|
||
id: "veggieburger", name: "Black Bean Veggie Burger", price: "$11.99", imageSrc: "http://img.b2bpic.net/free-photo/veggie-lettering-vegan-food_23-2148305762.jpg", imageAlt: "Black Bean Veggie Burger with fresh lettuce"},
|
||
{
|
||
id: "doubleburger", name: "The Double Stack", price: "$16.99", imageSrc: "http://img.b2bpic.net/free-photo/front-view-burgers-with-pickles_23-2148784499.jpg", imageAlt: "Double Stack Burger with two patties"},
|
||
{
|
||
id: "pulledpork", name: "BBQ Pulled Pork Burger", price: "$14.99", imageSrc: "http://img.b2bpic.net/free-photo/breakfast-sandwich-made-with-bread-fried-egg-ham-lettuce_1150-25690.jpg", imageAlt: "BBQ Pulled Pork Burger with coleslaw"},
|
||
{
|
||
id: "truffleburger", name: "Truffle Mushroom Swiss", price: "$15.99", imageSrc: "http://img.b2bpic.net/free-photo/meat-burger-wooden-board-coleslaw-cucumber-tomato-mushrooms-cheese-side-view_141793-2387.jpg", imageAlt: "Truffle Mushroom Swiss Burger"},
|
||
]}
|
||
title="Our Delicious Menu"
|
||
description="Explore our handcrafted selection of burgers, sides, and more. Each bite is a culinary journey made with passion and the freshest ingredients."
|
||
/>
|
||
</div>
|
||
|
||
<div id="metrics" data-section="metrics">
|
||
<MetricCardEleven
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
animationType="slide-up"
|
||
metrics={[
|
||
{
|
||
id: "customers", value: "10,000+", title: "Happy Customers", description: "Served with a smile and a delicious burger, our community keeps growing.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-assortment-with-different-feelings_23-2148860333.jpg", imageAlt: "Happy face icon"},
|
||
{
|
||
id: "years", value: "5+", title: "Years of Excellence", description: "Proudly crafting and serving the best burgers in town since our opening.", imageSrc: "http://img.b2bpic.net/free-photo/assortment-with-14th-february-date-roses_23-2148357883.jpg", imageAlt: "Calendar icon"},
|
||
{
|
||
id: "freshness", value: "100%", title: "Fresh Ingredients", description: "Commitment to locally sourced produce and premium quality meats every day.", imageSrc: "http://img.b2bpic.net/free-photo/raw-vegetables-ai-generated-image_268835-11217.jpg", imageAlt: "Leaf icon"},
|
||
]}
|
||
title="Our Numbers Speak For Themselves"
|
||
description="Proudly serving our community and crafting unforgettable experiences that bring joy to every customer."
|
||
/>
|
||
</div>
|
||
|
||
<div id="reviews" data-section="reviews">
|
||
<TestimonialCardOne
|
||
animationType="depth-3d"
|
||
textboxLayout="default"
|
||
gridVariant="uniform-all-items-equal"
|
||
useInvertedBackground={true}
|
||
carouselMode="buttons"
|
||
testimonials={[
|
||
{
|
||
id: "1", name: "Samantha Lee", role: "Local Foodie", company: "TasteTracker Blog", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/enjoying-cup-coffee_1098-17179.jpg", imageAlt: "Samantha Lee"},
|
||
{
|
||
id: "2", name: "Mark Rodriguez", role: "Restaurant Critic", company: "City Bites Magazine", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-having-lunch-restaurant_23-2150491912.jpg", imageAlt: "Mark Rodriguez"},
|
||
{
|
||
id: "3", name: "Jessica Chen", role: "Frequent Diner", company: "Google Reviewer", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/vertical-photo-beautiful-lady-sitting-restaurant-smiling-camera_114579-92383.jpg", imageAlt: "Jessica Chen"},
|
||
{
|
||
id: "4", name: "David Kim", role: "Community Member", company: "Local Resident", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-senior-marriage-eating-breakfast-together_329181-14782.jpg", imageAlt: "David Kim"},
|
||
{
|
||
id: "5", name: "Emily Watson", role: "Food Blogger", company: "The Flavor Journey", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/excited-elegant-middle-aged-businesswoman-using-laptop-work-clenching-fists-happy-win-tender_343059-3753.jpg", imageAlt: "Emily Watson"},
|
||
{
|
||
id: "6", name: "Robert Green", role: "Happy Customer", company: "Food Lover", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/outdoor-shot-pensive-curly-haired-woman-student-returns-from-lecures-wears-headband-casual-neat-clothes-strolls-outdoors-poses-against-blurred-urban-background-people-lifestyle-concept_273609-62304.jpg", imageAlt: "Robert Green"},
|
||
]}
|
||
title="What Our Customers Say"
|
||
description="Don't just take our word for it – hear from our happy customers who rave about our delicious burgers, friendly service, and vibrant atmosphere."
|
||
/>
|
||
</div>
|
||
|
||
<div id="social-proof" data-section="social-proof">
|
||
<SocialProofOne
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
names={[
|
||
"Local Foodie Blogs", "Community Favorites", "Taste Award Winners", "Delivery Partners", "Customer Choice", "Event Caterers", "Weekend Warriors"]}
|
||
title="Loved by Many"
|
||
description="Our commitment to quality, flavor, and service has earned us a loyal following and recognition in the community."
|
||
showCard={true}
|
||
/>
|
||
</div>
|
||
|
||
<div id="faq" data-section="faq">
|
||
<FaqDouble
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
faqs={[
|
||
{
|
||
id: "faq-1", title: "What are your opening hours?", content: "We are open Monday to Saturday from 11:00 AM to 10:00 PM, and Sundays from 12:00 PM to 9:00 PM. Check our Google Maps for holiday hours!"},
|
||
{
|
||
id: "faq-2", title: "Do you offer vegetarian or vegan options?", content: "Yes, we have a delicious black bean veggie burger that can be made vegan upon request. Just let our staff know your preference!"},
|
||
{
|
||
id: "faq-3", title: "Can I customize my burger?", content: "Absolutely! We offer a wide range of toppings and sauces to build your perfect burger. Feel free to ask for modifications."},
|
||
{
|
||
id: "faq-4", title: "Do you offer delivery or takeout?", content: "Yes, we offer both! You can order online through our website or call us directly for takeout. We also partner with popular delivery services."},
|
||
{
|
||
id: "faq-5", title: "Do you cater for events?", content: "We do! For catering inquiries, please reach out to us via our contact form or give us a call to discuss your event's needs and our special packages."},
|
||
{
|
||
id: "faq-6", title: "Are your ingredients locally sourced?", content: "We pride ourselves on using fresh, high-quality ingredients, with many of our vegetables and meats sourced from local farms and suppliers whenever possible."},
|
||
]}
|
||
title="Frequently Asked Questions"
|
||
description="Find quick answers to the most common questions about our restaurant, menu, services, and more."
|
||
faqsAnimation="slide-up"
|
||
/>
|
||
</div>
|
||
|
||
<div id="contact" data-section="contact">
|
||
<ContactCTA
|
||
useInvertedBackground={false}
|
||
background={{
|
||
variant: "sparkles-gradient"}}
|
||
tag="Get in Touch"
|
||
title="Visit Us or Place Your Order"
|
||
description="We're always happy to serve you the best burgers in town. Find us or reach out for your next meal!"
|
||
buttons={[
|
||
{
|
||
text: "Order Online", href: "#"},
|
||
{
|
||
text: "Get Directions", href: "https://maps.app.goo.gl/HJmJMU66W1k2LDD9"},
|
||
]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterLogoEmphasis
|
||
logoSrc="http://img.b2bpic.net/free-photo/eat-healthy-restaurant-logo-papercraft-cut-out-style_53876-126879.jpg"
|
||
logoAlt="Shanghai Tan Burgers Logo"
|
||
columns={[
|
||
{
|
||
items: [
|
||
{
|
||
label: "Home", href: "#home"},
|
||
{
|
||
label: "Menu", href: "#menu"},
|
||
{
|
||
label: "About Us", href: "#about"},
|
||
],
|
||
},
|
||
{
|
||
items: [
|
||
{
|
||
label: "Reviews", href: "#reviews"},
|
||
{
|
||
label: "FAQ", href: "#faq"},
|
||
{
|
||
label: "Contact", href: "#contact"},
|
||
],
|
||
},
|
||
{
|
||
items: [
|
||
{
|
||
label: "Privacy Policy", href: "#"},
|
||
{
|
||
label: "Terms of Service", href: "#"},
|
||
{
|
||
label: "Accessibility", href: "#"},
|
||
],
|
||
},
|
||
]}
|
||
logoText="Shanghai Tan Burgers"
|
||
/>
|
||
</div>
|
||
</ReactLenis>
|
||
</ThemeProvider>
|
||
);
|
||
}
|