Merge version_1 into main #1
340
src/app/page.tsx
340
src/app/page.tsx
@@ -20,31 +20,24 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="expand-hover"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Menu",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "faq",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Menu", id: "products" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="BurgerJoy"
|
||||
/>
|
||||
@@ -52,78 +45,32 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Crafted with Passion, Served with Joy"
|
||||
description="The ultimate burger experience made from premium, locally sourced ingredients. Taste the difference in every bite."
|
||||
kpis={[
|
||||
{
|
||||
value: "100%",
|
||||
label: "Grass-fed Beef",
|
||||
},
|
||||
{
|
||||
value: "24h",
|
||||
label: "Slow-fermented Bun",
|
||||
},
|
||||
{
|
||||
value: "50+",
|
||||
label: "Flavor Combinations",
|
||||
},
|
||||
{ value: "100%", label: "Grass-fed Beef" },
|
||||
{ value: "24h", label: "Slow-fermented Bun" },
|
||||
{ value: "50+", label: "Flavor Combinations" }
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "Order Now",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Order Now", href: "#products" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/front-view-beef-burger-with-salad-bacon_23-2148784490.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/girl-gives-five-guy-from-india_496169-2861.jpg",
|
||||
alt: "Happy customer 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiley-couple-sharing-fast-food_329181-20757.jpg",
|
||||
alt: "Happy customer 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/couple-enjoying-food-restaurant_23-2149269176.jpg",
|
||||
alt: "Happy customer 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/funny-stylish-indian-man-sitting-fast-food-cafe-eating-french-fries-show-his-tongue_627829-1356.jpg",
|
||||
alt: "Happy customer 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/hipster-with-stylish-haircut-beard-sits-table-decided-dine-roadside-cafe-eating-hamburger_613910-19637.jpg",
|
||||
alt: "Happy customer 5",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/girl-gives-five-guy-from-india_496169-2861.jpg", alt: "Happy customer 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/smiley-couple-sharing-fast-food_329181-20757.jpg", alt: "Happy customer 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/couple-enjoying-food-restaurant_23-2149269176.jpg", alt: "Happy customer 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/funny-stylish-indian-man-sitting-fast-food-cafe-eating-french-fries-show-his-tongue_627829-1356.jpg", alt: "Happy customer 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/hipster-with-stylish-haircut-beard-sits-table-decided-dine-roadside-cafe-eating-hamburger_613910-19637.jpg", alt: "Happy customer 5" }
|
||||
]}
|
||||
avatarText="Join 5,000+ happy burger lovers"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Grass-fed Beef",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Locally Sourced",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Artisan Buns",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Handcrafted Sauces",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Fresh Ingredients",
|
||||
},
|
||||
{ type: "text", text: "Grass-fed Beef" },
|
||||
{ type: "text", text: "Locally Sourced" },
|
||||
{ type: "text", text: "Artisan Buns" },
|
||||
{ type: "text", text: "Handcrafted Sauces" },
|
||||
{ type: "text", text: "Fresh Ingredients" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -134,14 +81,8 @@ export default function LandingPage() {
|
||||
title="Our Secret Ingredient? Dedication."
|
||||
description="We started with a simple mission: to elevate the humble burger into a culinary masterpiece. From handmade patties to our signature buns, every detail is crafted for maximum flavor."
|
||||
metrics={[
|
||||
{
|
||||
value: "10k+",
|
||||
title: "Burgers Served",
|
||||
},
|
||||
{
|
||||
value: "5",
|
||||
title: "Star Quality",
|
||||
},
|
||||
{ value: "10k+", title: "Burgers Served" },
|
||||
{ value: "5", title: "Star Quality" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/hands-making-tasty-burger_23-2148374841.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
@@ -156,24 +97,9 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Farm-Fresh Produce",
|
||||
description: "Crispy lettuce, ripe tomatoes, and locally grown onions arrive daily.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-cheesy-meat-burger-with-seasonings-dark-surface-bun-sandwich-meat-fries_140725-82158.jpg",
|
||||
imageAlt: "Fresh Veggies",
|
||||
},
|
||||
{
|
||||
title: "Artisan Buns",
|
||||
description: "Freshly baked every morning with a hint of brioche sweetness.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vertical-closeup-shot-freshly-baked-buns-white-plate-wooden-table_181624-32658.jpg",
|
||||
imageAlt: "Artisan Bun",
|
||||
},
|
||||
{
|
||||
title: "Signature Sauces",
|
||||
description: "Hand-blended secret recipes that make our burgers stand out.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-wooden-board-with-hamburger_23-2148575407.jpg",
|
||||
imageAlt: "Secret Sauce",
|
||||
},
|
||||
{ title: "Farm-Fresh Produce", description: "Crispy lettuce, ripe tomatoes, and locally grown onions arrive daily.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-cheesy-meat-burger-with-seasonings-dark-surface-bun-sandwich-meat-fries_140725-82158.jpg", imageAlt: "Fresh Veggies" },
|
||||
{ title: "Artisan Buns", description: "Freshly baked every morning with a hint of brioche sweetness.", imageSrc: "http://img.b2bpic.net/free-photo/vertical-closeup-shot-freshly-baked-buns-white-plate-wooden-table_181624-32658.jpg", imageAlt: "Artisan Bun" },
|
||||
{ title: "Signature Sauces", description: "Hand-blended secret recipes that make our burgers stand out.", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-wooden-board-with-hamburger_23-2148575407.jpg", imageAlt: "Secret Sauce" }
|
||||
]}
|
||||
title="Why BurgerJoy is Different"
|
||||
description="We don't cut corners. Quality is the foundation of every burger we build."
|
||||
@@ -187,42 +113,12 @@ export default function LandingPage() {
|
||||
gridVariant="one-large-left-three-stacked-right"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Classic Cheeseburger",
|
||||
price: "$12.99",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/composition-with-delicious-vegan-burger_23-2149039336.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Bacon Explosion",
|
||||
price: "$14.99",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hamburger-with-egg-benedict-energy-drinks-can_114579-2137.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Avocado Veggie",
|
||||
price: "$13.99",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/tasty-hamburger-with-fries_23-2148575430.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Spicy Chicken",
|
||||
price: "$11.99",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/street-food-still-life_23-2151535236.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Smoky BBQ Pork",
|
||||
price: "$15.99",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-burgers-with-pickles_23-2148784499.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Truffle Mushroom",
|
||||
price: "$16.99",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-beef-burger-with-salad_23-2148784488.jpg",
|
||||
},
|
||||
{ id: "p1", name: "Classic Cheeseburger", price: "$12.99", imageSrc: "http://img.b2bpic.net/free-photo/composition-with-delicious-vegan-burger_23-2149039336.jpg" },
|
||||
{ id: "p2", name: "Bacon Explosion", price: "$14.99", imageSrc: "http://img.b2bpic.net/free-photo/hamburger-with-egg-benedict-energy-drinks-can_114579-2137.jpg" },
|
||||
{ id: "p3", name: "Avocado Veggie", price: "$13.99", imageSrc: "http://img.b2bpic.net/free-photo/tasty-hamburger-with-fries_23-2148575430.jpg" },
|
||||
{ id: "p4", name: "Spicy Chicken", price: "$11.99", imageSrc: "http://img.b2bpic.net/free-photo/street-food-still-life_23-2151535236.jpg" },
|
||||
{ id: "p5", name: "Smoky BBQ Pork", price: "$15.99", imageSrc: "http://img.b2bpic.net/free-photo/front-view-burgers-with-pickles_23-2148784499.jpg" },
|
||||
{ id: "p6", name: "Truffle Mushroom", price: "$16.99", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-beef-burger-with-salad_23-2148784488.jpg" }
|
||||
]}
|
||||
title="Our Signature Menu"
|
||||
description="Browse through our collection of chef-curated burgers."
|
||||
@@ -236,27 +132,9 @@ export default function LandingPage() {
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "4.9",
|
||||
title: "Rating",
|
||||
description: "Based on 2,000+ reviews",
|
||||
icon: Star,
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "500+",
|
||||
title: "Daily Orders",
|
||||
description: "Happy burgers sold daily",
|
||||
icon: Utensils,
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "15",
|
||||
title: "Years",
|
||||
description: "Serving flavor since 2009",
|
||||
icon: Award,
|
||||
},
|
||||
{ id: "m1", value: "4.9", title: "Rating", description: "Based on 2,000+ reviews", icon: Star },
|
||||
{ id: "m2", value: "500+", title: "Daily Orders", description: "Happy burgers sold daily", icon: Utensils },
|
||||
{ id: "m3", value: "15", title: "Years", description: "Serving flavor since 2009", icon: Award }
|
||||
]}
|
||||
title="Loved by the Community"
|
||||
description="Our numbers speak for themselves."
|
||||
@@ -270,46 +148,11 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah J.",
|
||||
role: "Foodie",
|
||||
company: "Local Blog",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-happy-colleagues-with-pizza_23-2149103772.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Mark D.",
|
||||
role: "Burger Fan",
|
||||
company: "Client",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-view-young-businessman-eating-croissant-while-sitting-outdoor-cafe_637285-10394.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Emma R.",
|
||||
role: "Blogger",
|
||||
company: "TechCrunch",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-food-lover-eating_23-2149255969.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "David K.",
|
||||
role: "Critic",
|
||||
company: "Food Mag",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-with-delicious-taco_23-2151048060.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Alice M.",
|
||||
role: "Fan",
|
||||
company: "Happy Customer",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-couple-with-food_23-2148866916.jpg",
|
||||
},
|
||||
{ id: "t1", name: "Sarah J.", role: "Foodie", company: "Local Blog", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-happy-colleagues-with-pizza_23-2149103772.jpg" },
|
||||
{ id: "t2", name: "Mark D.", role: "Burger Fan", company: "Client", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/low-angle-view-young-businessman-eating-croissant-while-sitting-outdoor-cafe_637285-10394.jpg" },
|
||||
{ id: "t3", name: "Emma R.", role: "Blogger", company: "TechCrunch", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-food-lover-eating_23-2149255969.jpg" },
|
||||
{ id: "t4", name: "David K.", role: "Critic", company: "Food Mag", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-with-delicious-taco_23-2151048060.jpg" },
|
||||
{ id: "t5", name: "Alice M.", role: "Fan", company: "Happy Customer", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-couple-with-food_23-2148866916.jpg" }
|
||||
]}
|
||||
title="What Our Fans Say"
|
||||
description="Real people, real flavor. Read what our loyal customers have to say."
|
||||
@@ -321,21 +164,9 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Do you offer vegan options?",
|
||||
content: "Yes, we have our Signature Avocado Veggie Burger which is 100% plant-based.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "How do you source your beef?",
|
||||
content: "Our beef is locally sourced from high-welfare farms.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Can I order online?",
|
||||
content: "Yes! Use the link in our menu section for local delivery.",
|
||||
},
|
||||
{ id: "f1", title: "Do you offer vegan options?", content: "Yes, we have our Signature Avocado Veggie Burger which is 100% plant-based." },
|
||||
{ id: "f2", title: "How do you source your beef?", content: "Our beef is locally sourced from high-welfare farms." },
|
||||
{ id: "f3", title: "Can I order online?", content: "Yes! Use the link in our menu section for local delivery." }
|
||||
]}
|
||||
title="Got Questions?"
|
||||
description="Here is what you need to know about our burgers."
|
||||
@@ -346,19 +177,11 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
text="Ready for your first bite? Visit us today or order online for delivery."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Directions",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
text: "Order Online",
|
||||
href: "#",
|
||||
},
|
||||
{ text: "Get Directions", href: "#" },
|
||||
{ text: "Order Online", href: "#" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -368,52 +191,25 @@ export default function LandingPage() {
|
||||
logoText="BurgerJoy"
|
||||
columns={[
|
||||
{
|
||||
title: "Menu",
|
||||
items: [
|
||||
{
|
||||
label: "Our Burgers",
|
||||
href: "#products",
|
||||
},
|
||||
{
|
||||
label: "Sides",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Drinks",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
title: "Menu", items: [
|
||||
{ label: "Our Burgers", href: "#products" },
|
||||
{ label: "Sides", href: "#" },
|
||||
{ label: "Drinks", href: "#" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "#about" },
|
||||
{ label: "Careers", href: "#" },
|
||||
{ label: "Contact", href: "#contact" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user