Merge version_1 into main #2
440
src/app/page.tsx
440
src/app/page.tsx
@@ -19,325 +19,149 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Products",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "faq",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Busters"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Products", id: "products" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Busters"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Unleash the Refreshment with Busters Busty"
|
||||
description="Experience the boldest, most vibrant flavor in every sip. Busters Busty is the ultimate drink for those who live life to the fullest."
|
||||
tag="New Flavor Alert"
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Yours",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-drink-bananas-arrangement_23-2148922336.jpg?_wi=1",
|
||||
imageAlt: "Busters Busty drink studio shot",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/glass-orange-juice-wooden-table-terrace_169016-22332.jpg?_wi=1",
|
||||
imageAlt: "Can on wooden table",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-water-rings-orange-pool-surface_23-2148358182.jpg?_wi=1",
|
||||
imageAlt: "Pouring dynamic shot",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/minimalist-still-life-asian-tea_23-2149709032.jpg",
|
||||
imageAlt: "Arranged cans",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/strawberry-smoothie-by-swimming-pool_53876-65614.jpg",
|
||||
imageAlt: "Poolside drink",
|
||||
},
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Unleash the Refreshment with Busters Busty"
|
||||
description="Experience the boldest, most vibrant flavor in every sip. Busters Busty is the ultimate drink for those who live life to the fullest."
|
||||
tag="New Flavor Alert"
|
||||
buttons={[{ text: "Get Yours", href: "#products" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/high-angle-drink-bananas-arrangement_23-2148922336.jpg", imageAlt: "Busters Busty drink studio shot" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/glass-orange-juice-wooden-table-terrace_169016-22332.jpg", imageAlt: "Can on wooden table" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-water-rings-orange-pool-surface_23-2148358182.jpg", imageAlt: "Pouring dynamic shot" }
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Why Busters Busty?"
|
||||
description="We believe that life is meant to be tasted. That's why we crafted Busters Busty with high-quality ingredients, pure fruit essences, and a punch of energy that keeps you going all day long."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/friends-playing-beer-pong_23-2149406996.jpg"
|
||||
imageAlt="The Busters Busty brand team"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Why Busters Busty?"
|
||||
description="We believe that life is meant to be tasted. That's why we crafted Busters Busty with high-quality ingredients, pure fruit essences, and a punch of energy that keeps you going all day long."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/friends-playing-beer-pong_23-2149406996.jpg"
|
||||
imageAlt="The Busters Busty brand team"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "Busters",
|
||||
name: "Citrus Burst",
|
||||
price: "$2.99",
|
||||
rating: 5,
|
||||
reviewCount: "1.2k",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/recycled-aluminium-cans_23-2149436501.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
brand: "Busters",
|
||||
name: "Berry Blast",
|
||||
price: "$2.99",
|
||||
rating: 5,
|
||||
reviewCount: "890",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beer-glass_23-2148098765.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
brand: "Busters",
|
||||
name: "Mango Madness",
|
||||
price: "$3.49",
|
||||
rating: 4,
|
||||
reviewCount: "450",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/delicious-colada-morada-composition_23-2149161468.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
brand: "Busters",
|
||||
name: "Tropical Twist",
|
||||
price: "$3.49",
|
||||
rating: 5,
|
||||
reviewCount: "670",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/three-glasses-with-water-blue-orange_176420-42405.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
brand: "Busters",
|
||||
name: "Golden Glow",
|
||||
price: "$3.99",
|
||||
rating: 5,
|
||||
reviewCount: "320",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/luxury-frosted-glass-perfume-bottle-with-silver-cap_9975-133767.jpg",
|
||||
},
|
||||
]}
|
||||
title="Explore Our Flavors"
|
||||
description="From refreshing citrus to bold berry, find your perfect match in our diverse lineup."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "1", brand: "Busters", name: "Citrus Burst", price: "$2.99", rating: 5, reviewCount: "1.2k", imageSrc: "http://img.b2bpic.net/free-photo/recycled-aluminium-cans_23-2149436501.jpg" },
|
||||
{ id: "2", brand: "Busters", name: "Berry Blast", price: "$2.99", rating: 5, reviewCount: "890", imageSrc: "http://img.b2bpic.net/free-photo/beer-glass_23-2148098765.jpg" },
|
||||
{ id: "3", brand: "Busters", name: "Mango Madness", price: "$3.49", rating: 4, reviewCount: "450", imageSrc: "http://img.b2bpic.net/free-photo/delicious-colada-morada-composition_23-2149161468.jpg" }
|
||||
]}
|
||||
title="Explore Our Flavors"
|
||||
description="From refreshing citrus to bold berry, find your perfect match in our diverse lineup."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Track Intakes",
|
||||
description: "Monitor your hydration levels daily with ease.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-looking-different-goodies-her-shopping-list-smartphone_23-2149110874.jpg",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hand-holding-smartphone_23-2149870751.jpg",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-drink-bananas-arrangement_23-2148922336.jpg?_wi=2",
|
||||
imageAlt: "mobile app ui nutritional info",
|
||||
},
|
||||
{
|
||||
title: "Get Recipes",
|
||||
description: "Unlock creative ways to mix your Busters Busty.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/flat-design-task-management-app-set_23-2148667058.jpg",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/dating-app-interface-smartphone_23-2149374755.jpg",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/glass-orange-juice-wooden-table-terrace_169016-22332.jpg?_wi=2",
|
||||
imageAlt: "mobile app ui nutritional info",
|
||||
},
|
||||
{
|
||||
title: "Earn Rewards",
|
||||
description: "Collect points with every can purchased.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/luminescent-technology-application_23-2151876475.jpg",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/dating-app-design-interface_23-2148507314.jpg",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-water-rings-orange-pool-surface_23-2148358182.jpg?_wi=2",
|
||||
imageAlt: "mobile app ui nutritional info",
|
||||
},
|
||||
]}
|
||||
showStepNumbers={true}
|
||||
title="Smart Hydration App"
|
||||
description="Download our app to track your intake, explore recipes, and earn rewards while you drink."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ title: "Track Intakes", description: "Monitor your hydration levels daily with ease.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/woman-looking-different-goodies-her-shopping-list-smartphone_23-2149110874.jpg" }, phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hand-holding-smartphone_23-2149870751.jpg" } },
|
||||
{ title: "Get Recipes", description: "Unlock creative ways to mix your Busters Busty.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-vector/flat-design-task-management-app-set_23-2148667058.jpg" }, phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/dating-app-interface-smartphone_23-2149374755.jpg" } },
|
||||
{ title: "Earn Rewards", description: "Collect points with every can purchased.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/luminescent-technology-application_23-2151876475.jpg" }, phoneTwo: { imageSrc: "http://img.b2bpic.net/free-vector/dating-app-design-interface_23-2148507314.jpg" } }
|
||||
]}
|
||||
showStepNumbers={true}
|
||||
title="Smart Hydration App"
|
||||
description="Download our app to track your intake, explore recipes, and earn rewards while you drink."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "1M+",
|
||||
title: "Cans Sold",
|
||||
description: "Refreshing customers globally.",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/gradient-infographic-elements-set_23-2148145868.jpg",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "500k+",
|
||||
title: "App Users",
|
||||
description: "Engaged community daily.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/workers-looking-monthly-statistics_329181-12025.jpg",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "100%",
|
||||
title: "Natural Ingredients",
|
||||
description: "Committed to quality.",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/leaf-circle-cutouts-set_78370-9278.jpg",
|
||||
},
|
||||
]}
|
||||
title="Impact by the Numbers"
|
||||
description="Our community is growing fast, and the refreshing effect is undeniable."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "m1", value: "1M+", title: "Cans Sold", description: "Refreshing customers globally.", imageSrc: "http://img.b2bpic.net/free-vector/gradient-infographic-elements-set_23-2148145868.jpg" },
|
||||
{ id: "m2", value: "500k+", title: "App Users", description: "Engaged community daily.", imageSrc: "http://img.b2bpic.net/free-photo/workers-looking-monthly-statistics_329181-12025.jpg" },
|
||||
{ id: "m3", value: "100%", title: "Natural Ingredients", description: "Committed to quality.", imageSrc: "http://img.b2bpic.net/free-vector/leaf-circle-cutouts-set_78370-9278.jpg" }
|
||||
]}
|
||||
title="Impact by the Numbers"
|
||||
description="Our community is growing fast, and the refreshing effect is undeniable."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alex R.",
|
||||
role: "Designer",
|
||||
company: "Creative Hub",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-woman-street-drinking-morning-refreshing-drink_158595-4439.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Sarah J.",
|
||||
role: "Product Manager",
|
||||
company: "TechCorp",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/drinking-coffee-smiling-while-taking-break_329181-16242.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Leo T.",
|
||||
role: "Student",
|
||||
company: "State Univ",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/girl-with-bootle_1157-8769.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Maya K.",
|
||||
role: "Athlete",
|
||||
company: "Gym Pro",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-with-basketball-drinking-water_23-2147925242.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Sam P.",
|
||||
role: "Photographer",
|
||||
company: "Visuals",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wonderful-lightly-tanned-woman-retro-jeans-posing-with-positive-smile_197531-20614.jpg",
|
||||
},
|
||||
]}
|
||||
title="What Fans Are Saying"
|
||||
description="Hear from our community of refreshment seekers."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Alex R.", role: "Designer", company: "Creative Hub", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/cheerful-woman-street-drinking-morning-refreshing-drink_158595-4439.jpg" },
|
||||
{ id: "2", name: "Sarah J.", role: "Product Manager", company: "TechCorp", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/drinking-coffee-smiling-while-taking-break_329181-16242.jpg" },
|
||||
{ id: "3", name: "Leo T.", role: "Student", company: "State Univ", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/girl-with-bootle_1157-8769.jpg" }
|
||||
]}
|
||||
title="What Fans Are Saying"
|
||||
description="Hear from our community of refreshment seekers."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Is it natural?",
|
||||
content: "Absolutely! We use 100% natural ingredients.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Where can I buy it?",
|
||||
content: "Find us in all major retail stores nationwide.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Are there caffeine-free options?",
|
||||
content: "Yes, we offer caffeine-free versions of our popular flavors.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/table-lamp-laptop-yellow-paper-plane-cork-board-against-white-background_23-2147873583.jpg"
|
||||
title="Common Questions"
|
||||
description="Got questions? We've got answers."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "q1", title: "Is it natural?", content: "Absolutely! We use 100% natural ingredients." },
|
||||
{ id: "q2", title: "Where can I buy it?", content: "Find us in all major retail stores nationwide." },
|
||||
{ id: "q3", title: "Are there caffeine-free options?", content: "Yes, we offer caffeine-free versions of our popular flavors." }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/table-lamp-laptop-yellow-paper-plane-cork-board-against-white-background_23-2147873583.jpg"
|
||||
title="Common Questions"
|
||||
description="Got questions? We've got answers."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Contact Us"
|
||||
title="Stay Updated"
|
||||
description="Sign up for our newsletter to get new flavor drops and exclusive discounts."
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
tag="Contact Us"
|
||||
title="Stay Updated"
|
||||
description="Sign up for our newsletter to get new flavor drops and exclusive discounts."
|
||||
background={{ variant: "plain" }}
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Busters Busty"
|
||||
copyrightText="© 2025 Busters Busty. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Busters Busty"
|
||||
copyrightText="© 2025 Busters Busty. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user