bender/086fefaf-f594-4950-ae23-9878ac837c53
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2 into main

Browse Source 
Merge version_2 into main
This commit was merged in pull request #1.
This commit is contained in:
bender
2026-05-28 17:28:29 +00:00
parent 0b111b28c8 6bafab6410
commit a865fe8b42
2 changed files with 113 additions and 295 deletions
Download Patch File Download Diff File Expand all files Collapse all files

390
src/app/page.tsx
View File

@@ -2,10 +2,10 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import FooterBase from '@/components/sections/footer/FooterBase';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
@@ -34,55 +34,36 @@ export default function LandingPage() {
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home",
id: "#hero",
},
name: "Home", id: "#hero"},
{
name: "About",
id: "#about",
},
name: "About", id: "#about"},
{
name: "Flavors",
id: "#product",
},
name: "Flavors", id: "#product"},
{
name: "Benefits",
id: "#features",
},
name: "Benefits", id: "#features"},
{
name: "Testimonials",
id: "#testimonials",
},
name: "Testimonials", id: "#testimonials"},
{
name: "Contact",
id: "#contact",
},
name: "Contact", id: "#contact"},
]}
brandName="Monster Juice"
button={{
text: "Buy Now",
href: "#product",
}}
text: "Buy Now", href: "#product"}}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplit
background={{
variant: "glowing-orb",
}}
variant: "glowing-orb"}}
imagePosition="right"
title="Unleash Your Inner Beast"
description="Monster Juice powers your day, fueling your focus, and electrifying your senses. Experience sustained energy without the crash."
buttons={[
{
text: "Explore Flavors",
href: "#product",
},
text: "Explore Flavors", href: "#product"},
{
text: "Find a Store",
href: "#",
},
text: "Find a Store", href: "#"},
]}
imageSrc="http://img.b2bpic.net/free-photo/refreshing-drink-with-blueberries-arrangement_23-2150928902.jpg"
imageAlt="Vibrant Monster Juice Can with Dynamic Splash"
@@ -90,52 +71,32 @@ export default function LandingPage() {
fixedMediaHeight={true}
avatars={[
{
src: "http://img.b2bpic.net/free-photo/happy-african-young-lady-walking-outdoors_171337-15131.jpg",
alt: "Energetic young person",
},
src: "http://img.b2bpic.net/free-photo/happy-african-young-lady-walking-outdoors_171337-15131.jpg", alt: "Energetic young person"},
{
src: "http://img.b2bpic.net/free-photo/black-african-american-woman-stylish-hipster-fitness-outfit-violet-top-pants-white_285396-10163.jpg",
alt: "Satisfied customer",
},
src: "http://img.b2bpic.net/free-photo/black-african-american-woman-stylish-hipster-fitness-outfit-violet-top-pants-white_285396-10163.jpg", alt: "Satisfied customer"},
{
src: "http://img.b2bpic.net/free-photo/dark-skinned-professional-tutor-has-private-lesson-with-trainee-prepare-seminar_273609-44830.jpg",
alt: "Focused professional",
},
src: "http://img.b2bpic.net/free-photo/dark-skinned-professional-tutor-has-private-lesson-with-trainee-prepare-seminar_273609-44830.jpg", alt: "Focused professional"},
{
src: "http://img.b2bpic.net/free-photo/serious-female-designer-checking-her-interior-design-digital-tablet_273609-13943.jpg",
alt: "Athlete enjoying a drink",
},
src: "http://img.b2bpic.net/free-photo/serious-female-designer-checking-her-interior-design-digital-tablet_273609-13943.jpg", alt: "Athlete enjoying a drink"},
{
src: "http://img.b2bpic.net/free-photo/excited-senior-man-winning-video-game_23-2147935606.jpg",
alt: "Happy user review",
},
src: "http://img.b2bpic.net/free-photo/excited-senior-man-winning-video-game_23-2147935606.jpg", alt: "Happy user review"},
]}
avatarText="Join over 250K satisfied users!"
marqueeItems={[
{
type: "text-icon",
text: "Explosive Energy",
icon: Zap,
type: "text-icon", text: "Explosive Energy", icon: Zap,
},
{
type: "text-icon",
text: "Laser Focus",
icon: Target,
type: "text-icon", text: "Laser Focus", icon: Target,
},
{
type: "text-icon",
text: "Zero Crash",
icon: Clock,
type: "text-icon", text: "Zero Crash", icon: Clock,
},
{
type: "text-icon",
text: "Amazing Flavors",
icon: Leaf,
type: "text-icon", text: "Amazing Flavors", icon: Leaf,
},
{
type: "text-icon",
text: "Peak Performance",
icon: Rocket,
type: "text-icon", text: "Peak Performance", icon: Rocket,
},
]}
/>
@@ -148,9 +109,7 @@ export default function LandingPage() {
title="Crafted for Peak Performance & Unrivaled Taste"
buttons={[
{
text: "Our Story",
href: "#",
},
text: "Our Story", href: "#"},
]}
/>
</div>
@@ -162,32 +121,17 @@ export default function LandingPage() {
useInvertedBackground={false}
features={[
{
id: "power",
title: "Explosive Power",
descriptions: [
"Ignite your potential with our unique blend of ingredients, designed to deliver immediate and sustained energy for any challenge.",
],
imageSrc: "http://img.b2bpic.net/free-photo/blue-abstract-blower-optical-fiber_23-2148241234.jpg",
imageAlt: "Person feeling energetic",
},
id: "power", title: "Explosive Power", descriptions: [
"Ignite your potential with our unique blend of ingredients, designed to deliver immediate and sustained energy for any challenge."],
imageSrc: "http://img.b2bpic.net/free-photo/blue-abstract-blower-optical-fiber_23-2148241234.jpg", imageAlt: "Person feeling energetic"},
{
id: "focus",
title: "Laser Focus",
descriptions: [
"Sharpen your mind and enhance cognitive function. Stay dialed in and productive, whether at work, school, or hitting your fitness goals.",
],
imageSrc: "http://img.b2bpic.net/free-photo/hands-robot-human-hands-touching-with-fingers-virtual-reality-artificial-intelligence-technology-concept_460848-7985.jpg",
imageAlt: "Person focused with clear mind",
},
id: "focus", title: "Laser Focus", descriptions: [
"Sharpen your mind and enhance cognitive function. Stay dialed in and productive, whether at work, school, or hitting your fitness goals."],
imageSrc: "http://img.b2bpic.net/free-photo/hands-robot-human-hands-touching-with-fingers-virtual-reality-artificial-intelligence-technology-concept_460848-7985.jpg", imageAlt: "Person focused with clear mind"},
{
id: "refresh",
title: "Ultimate Refreshment",
descriptions: [
"Beyond the boost, enjoy a crisp, delicious taste that invigorates your palate and truly quenches your thirst, leaving you revitalized.",
],
imageSrc: "http://img.b2bpic.net/free-photo/delicious-sangria-glass-seaside_23-2149426430.jpg",
imageAlt: "Ice-cold drink with condensation",
},
id: "refresh", title: "Ultimate Refreshment", descriptions: [
"Beyond the boost, enjoy a crisp, delicious taste that invigorates your palate and truly quenches your thirst, leaving you revitalized."],
imageSrc: "http://img.b2bpic.net/free-photo/delicious-sangria-glass-seaside_23-2149426430.jpg", imageAlt: "Ice-cold drink with condensation"},
]}
title="Ignite Your Potential"
description="Experience the difference with Monster Juice — engineered for vitality, clarity, and an unbeatable taste."
@@ -202,65 +146,23 @@ export default function LandingPage() {
useInvertedBackground={false}
products={[
{
id: "original",
brand: "Monster Juice",
name: "Classic Unleashed",
price: "$2.99",
rating: 5,
reviewCount: "2.5K",
imageSrc: "http://img.b2bpic.net/free-photo/futuristic-brightly-colored-soda-can_23-2150995345.jpg",
imageAlt: "Original Flavor Monster Juice Can",
},
id: "original", brand: "Monster Juice", name: "Classic Unleashed", price: "$2.99", rating: 5,
reviewCount: "2.5K", imageSrc: "http://img.b2bpic.net/free-photo/futuristic-brightly-colored-soda-can_23-2150995345.jpg", imageAlt: "Original Flavor Monster Juice Can"},
{
id: "citrus",
brand: "Monster Juice",
name: "Zesty Bolt",
price: "$2.99",
rating: 4.8,
reviewCount: "1.8K",
imageSrc: "http://img.b2bpic.net/free-photo/lemonade-with-lemons-basil-leaves-bottle-white-grungy_176474-7424.jpg",
imageAlt: "Citrus Flavor Monster Juice Can",
},
id: "citrus", brand: "Monster Juice", name: "Zesty Bolt", price: "$2.99", rating: 4.8,
reviewCount: "1.8K", imageSrc: "http://img.b2bpic.net/free-photo/lemonade-with-lemons-basil-leaves-bottle-white-grungy_176474-7424.jpg", imageAlt: "Citrus Flavor Monster Juice Can"},
{
id: "berry",
brand: "Monster Juice",
name: "Berry Blitz",
price: "$2.99",
rating: 4.9,
reviewCount: "2.1K",
imageSrc: "http://img.b2bpic.net/free-photo/futuristic-brightly-colored-soda-can_23-2150995212.jpg",
imageAlt: "Berry Flavor Monster Juice Can",
},
id: "berry", brand: "Monster Juice", name: "Berry Blitz", price: "$2.99", rating: 4.9,
reviewCount: "2.1K", imageSrc: "http://img.b2bpic.net/free-photo/futuristic-brightly-colored-soda-can_23-2150995212.jpg", imageAlt: "Berry Flavor Monster Juice Can"},
{
id: "tropical",
brand: "Monster Juice",
name: "Tropical Fury",
price: "$2.99",
rating: 4.7,
reviewCount: "1.5K",
imageSrc: "http://img.b2bpic.net/free-photo/message-bottle_1252-565.jpg",
imageAlt: "Tropical Flavor Monster Juice Can",
},
id: "tropical", brand: "Monster Juice", name: "Tropical Fury", price: "$2.99", rating: 4.7,
reviewCount: "1.5K", imageSrc: "http://img.b2bpic.net/free-photo/message-bottle_1252-565.jpg", imageAlt: "Tropical Flavor Monster Juice Can"},
{
id: "zero",
brand: "Monster Juice",
name: "Zero Roar",
price: "$2.99",
rating: 4.6,
reviewCount: "1.2K",
imageSrc: "http://img.b2bpic.net/free-photo/closeup-focus-shot-man-holding-white-mug_181624-25962.jpg",
imageAlt: "Zero Sugar Monster Juice Can",
},
id: "zero", brand: "Monster Juice", name: "Zero Roar", price: "$2.99", rating: 4.6,
reviewCount: "1.2K", imageSrc: "http://img.b2bpic.net/free-photo/closeup-focus-shot-man-holding-white-mug_181624-25962.jpg", imageAlt: "Zero Sugar Monster Juice Can"},
{
id: "punch",
brand: "Monster Juice",
name: "Punch Power",
price: "$2.99",
rating: 4.8,
reviewCount: "1.9K",
imageSrc: "http://img.b2bpic.net/free-photo/raspberry-lemonade-drink-glass-blue-background_123827-22670.jpg",
imageAlt: "Punch Flavor Monster Juice Can",
},
id: "punch", brand: "Monster Juice", name: "Punch Power", price: "$2.99", rating: 4.8,
reviewCount: "1.9K", imageSrc: "http://img.b2bpic.net/free-photo/raspberry-lemonade-drink-glass-blue-background_123827-22670.jpg", imageAlt: "Punch Flavor Monster Juice Can"},
]}
title="Discover Your Favorite Flavor"
description="From classic power to exotic blends, find the perfect Monster Juice to supercharge your senses."
@@ -274,34 +176,16 @@ export default function LandingPage() {
useInvertedBackground={false}
metrics={[
{
id: "energy",
value: "90%",
title: "Energy Boost",
items: [
"Users report immediate energy surge",
"Sustained vitality throughout the day",
"No post-consumption crash",
],
id: "energy", value: "90%", title: "Energy Boost", items: [
"Users report immediate energy surge", "Sustained vitality throughout the day", "No post-consumption crash"],
},
{
id: "focus",
value: "85%",
title: "Enhanced Focus",
items: [
"Improved concentration for tasks",
"Better mental clarity",
"Supports demanding cognitive activities",
],
id: "focus", value: "85%", title: "Enhanced Focus", items: [
"Improved concentration for tasks", "Better mental clarity", "Supports demanding cognitive activities"],
},
{
id: "satisfaction",
value: "95%",
title: "Customer Satisfaction",
items: [
"Overwhelmingly positive reviews",
"High repurchase rate",
"Loved by athletes and professionals",
],
id: "satisfaction", value: "95%", title: "Customer Satisfaction", items: [
"Overwhelmingly positive reviews", "High repurchase rate", "Loved by athletes and professionals"],
},
]}
title="Our Impact & Performance"
@@ -318,59 +202,23 @@ export default function LandingPage() {
carouselMode="buttons"
testimonials={[
{
id: "1",
name: "Alex R.",
role: "Professional Athlete",
company: "Elite Sports",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-happy-smiling-woman_23-2148489712.jpg",
imageAlt: "Alex R. - Professional Athlete",
},
id: "1", name: "Alex R.", role: "Professional Athlete", company: "Elite Sports", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-happy-smiling-woman_23-2148489712.jpg", imageAlt: "Alex R. - Professional Athlete"},
{
id: "2",
name: "Sarah K.",
role: "Software Engineer",
company: "Tech Innovators",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-female-sport-outfit-holding-white-sign_140725-85436.jpg",
imageAlt: "Sarah K. - Software Engineer",
},
id: "2", name: "Sarah K.", role: "Software Engineer", company: "Tech Innovators", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-female-sport-outfit-holding-white-sign_140725-85436.jpg", imageAlt: "Sarah K. - Software Engineer"},
{
id: "3",
name: "Mike D.",
role: "College Student",
company: "University X",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-posing-with-yellow-jacket_23-2149020794.jpg",
imageAlt: "Mike D. - College Student",
},
id: "3", name: "Mike D.", role: "College Student", company: "University X", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-posing-with-yellow-jacket_23-2149020794.jpg", imageAlt: "Mike D. - College Student"},
{
id: "4",
name: "Jessica L.",
role: "Creative Director",
company: "Artistic Edge",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-redhead-girl-bed-reading_23-2148321006.jpg",
imageAlt: "Jessica L. - Creative Director",
},
id: "4", name: "Jessica L.", role: "Creative Director", company: "Artistic Edge", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-redhead-girl-bed-reading_23-2148321006.jpg", imageAlt: "Jessica L. - Creative Director"},
{
id: "5",
name: "Ben T.",
role: "Entrepreneur",
company: "Startup Hub",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/competitive-girl-celebrates-winning-holding-game-joystick-controller-red-wall_158595-4951.jpg",
imageAlt: "Ben T. - Entrepreneur",
},
id: "5", name: "Ben T.", role: "Entrepreneur", company: "Startup Hub", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/competitive-girl-celebrates-winning-holding-game-joystick-controller-red-wall_158595-4951.jpg", imageAlt: "Ben T. - Entrepreneur"},
{
id: "6",
name: "Chloe M.",
role: "Fitness Instructor",
company: "BodyFit Gym",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-adventure-seeker-looking-out-scenic-mountain-range-view_482257-119196.jpg",
imageAlt: "Chloe M. - Fitness Instructor",
},
id: "6", name: "Chloe M.", role: "Fitness Instructor", company: "BodyFit Gym", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-adventure-seeker-looking-out-scenic-mountain-range-view_482257-119196.jpg", imageAlt: "Chloe M. - Fitness Instructor"},
]}
title="Hear It From Our Tribe"
description="Our community speaks for itself. Discover why Monster Juice is the preferred choice for those who demand more."
@@ -382,14 +230,7 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={false}
names={[
"Apex Innovators",
"Quantum Labs",
"Dynamic Core",
"Velocity Sports",
"SynthWave Studios",
"Global Reach Inc.",
"Urban Evolve",
]}
"Apex Innovators", "Quantum Labs", "Dynamic Core", "Velocity Sports", "SynthWave Studios", "Global Reach Inc.", "Urban Evolve"]}
title="Trusted by Top Performers"
description="Join the ranks of leading brands and individuals who choose Monster Juice for their daily energy needs."
showCard={false}
@@ -397,109 +238,86 @@ export default function LandingPage() {
</div>
<div id="faq" data-section="faq">
<FaqDouble
<FaqSplitMedia
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "faq1",
title: "What makes Monster Juice unique?",
content: "Monster Juice combines a potent blend of natural energizers and nootropics for sustained energy and enhanced mental clarity, without the jitters or crash common with other drinks. Our unique flavor profiles are also unmatched!",
},
id: "faq1", title: "What makes Monster Juice unique?", content: "Monster Juice combines a potent blend of natural energizers and nootropics for sustained energy and enhanced mental clarity, without the jitters or crash common with other drinks. Our unique flavor profiles are also unmatched!"},
{
id: "faq2",
title: "Are there different flavors available?",
content: "Absolutely! We offer a wide range of exciting flavors including Classic Unleashed, Zesty Bolt, Berry Blitz, Tropical Fury, and more. Explore our 'Flavors' section to find your perfect match.",
},
id: "faq2", title: "Are there different flavors available?", content: "Absolutely! We offer a wide range of exciting flavors including Classic Unleashed, Zesty Bolt, Berry Blitz, Tropical Fury, and more. Explore our 'Flavors' section to find your perfect match."},
{
id: "faq3",
title: "Is Monster Juice suitable for athletes?",
content: "Yes, Monster Juice is a favorite among athletes for its fast-acting energy and focus-enhancing ingredients, which can support pre-workout intensity and in-game performance. Always consult with a healthcare professional.",
},
id: "faq3", title: "Is Monster Juice suitable for athletes?", content: "Yes, Monster Juice is a favorite among athletes for its fast-acting energy and focus-enhancing ingredients, which can support pre-workout intensity and in-game performance. Always consult with a healthcare professional."},
{
id: "faq4",
title: "Does Monster Juice contain artificial sweeteners?",
content: "We offer both original and zero-sugar options. Our zero-sugar variants use high-quality, non-caloric sweeteners to maintain our delicious taste without added sugar. Check product labels for specific ingredient details.",
},
id: "faq4", title: "Does Monster Juice contain artificial sweeteners?", content: "We offer both original and zero-sugar options. Our zero-sugar variants use high-quality, non-caloric sweeteners to maintain our delicious taste without added sugar. Check product labels for specific ingredient details."},
{
id: "faq5",
title: "Where can I purchase Monster Juice?",
content: "Monster Juice is available at major grocery stores, convenience stores, and online retailers nationwide. Use our 'Find a Store' feature on the homepage to locate a retailer near you or order directly from our website.",
},
id: "faq5", title: "Where can I purchase Monster Juice?", content: "Monster Juice is available at major grocery stores, convenience stores, and online retailers nationwide. Use our 'Find a Store' feature on the homepage to locate a retailer near you or order directly from our website."},
]}
title="Frequently Asked Questions"
description="Have questions? We've got answers. Find everything you need to know about Monster Juice."
faqsAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-photo/energetic-athlete-jumping-training-outdoor_23-2149591969.jpg"
imageAlt="Energetic athlete jumping"
mediaAnimation="slide-up"
mediaPosition="right"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
<ContactSplitForm
useInvertedBackground={false}
background={{
variant: "radial-gradient",
}}
tag="Get in Touch"
title="Ready to Feel the Rush?"
description="Join our community and get exclusive updates, new flavor announcements, and special offers directly to your inbox."
imageSrc="http://img.b2bpic.net/free-photo/vibrant-paint-splash_1194-637922.jpg"
imageAlt="Vibrant liquid splash or abstract energy pattern"
mediaAnimation="opacity"
inputPlaceholder="Enter your email"
buttonText="Subscribe Now"
termsText="By subscribing, you agree to our Privacy Policy and Terms of Service."
inputs={[
{
name: "name", type: "text", placeholder: "Your Name", required: true,
},
{
name: "email", type: "email", placeholder: "Your Email", required: true,
},
]}
textarea={{
name: "message", placeholder: "Your Message", rows: 5,
}}
buttonText="Send Message"
onSubmit={(data) => console.log(data)}
imageSrc="http://img.b2bpic.net/free-photo/human-connection-digital-network_23-2149369324.jpg"
imageAlt="Abstract network connection"
mediaAnimation="slide-up"
mediaPosition="left"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
<FooterBase
logoText="Monster Juice"
columns={[
{
title: "Company",
items: [
title: "Company", items: [
{
label: "About Us",
href: "#about",
},
label: "About Us", href: "#about"},
{
label: "Careers",
href: "#",
},
label: "Careers", href: "#"},
{
label: "Press",
href: "#",
},
label: "Press", href: "#"},
],
},
{
title: "Products",
items: [
title: "Products", items: [
{
label: "Flavors",
href: "#product",
},
label: "Flavors", href: "#product"},
{
label: "Nutrition",
href: "#",
},
label: "Nutrition", href: "#"},
{
label: "Ingredients",
href: "#",
},
label: "Ingredients", href: "#"},
],
},
{
title: "Support",
items: [
title: "Support", items: [
{
label: "FAQ",
href: "#faq",
},
label: "FAQ", href: "#faq"},
{
label: "Contact Us",
href: "#contact",
},
label: "Contact Us", href: "#contact"},
],
},
]}

18
src/app/styles/variables.css
View File

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #ffffff;
--card: #f9f9f9;
--foreground: #000612e6;
--primary-cta: #E34400;
--primary-cta-text: #ffffff;
--secondary-cta: #f9f9f9;
--secondary-cta-text: #000612e6;
--accent: #e2e2e2;
--background-accent: #E34400;
--background: #0a0a0a;
--card: #1a1a1a;
--foreground: #ffffffe6;
--primary-cta: #e6e6e6;
--primary-cta-text: #000000;
--secondary-cta: #1a1a1a;
--secondary-cta-text: #ffffff;
--accent: #737373;
--background-accent: #737373;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);