349 lines
13 KiB
TypeScript
349 lines
13 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
|
import PricingCardSeven from '@/components/sections/pricing/PricingCardSeven';
|
|
import AboutMetric from '@/components/sections/about/AboutMetric';
|
|
import TestimonialCardEight from '@/components/sections/testimonial/TestimonialCardEight';
|
|
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
|
import { Zap, Brain, Shield, Award, Sparkles } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="expand-hover"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="soft"
|
|
contentWidth="mediumSmall"
|
|
sizing="mediumLargeSizeMediumTitles"
|
|
background="circleGradient"
|
|
cardStyle="neon-glow"
|
|
primaryButtonStyle="layered-depth"
|
|
secondaryButtonStyle="minimal"
|
|
headingFontWeight="medium"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{ name: "Home", id: "hero" },
|
|
{ name: "Product", id: "pricing" },
|
|
{ name: "Why Edgetabs", id: "about" },
|
|
{ name: "Reviews", id: "testimonials" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
brandName="Edgetabs"
|
|
bottomLeftText="Performance Supplement"
|
|
bottomRightText="support@edgetabs.com"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardCarousel
|
|
title="Unlock Peak Performance with Edgetabs"
|
|
description="Engineered for laser focus, sustained energy, and mental clarity. Experience the edge that separates ordinary from extraordinary."
|
|
tag="LOW ON STOCK"
|
|
buttons={[
|
|
{ text: "Get Edge Now", href: "pricing" }
|
|
]}
|
|
mediaItems={[
|
|
{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767548617546-3vn9eu16.jpg",
|
|
imageAlt: "supplement capsule energy focus performance"
|
|
},
|
|
{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767450501963-tpqqsdz5.jpg",
|
|
imageAlt: "supplement bottle fitness health capsule"
|
|
},
|
|
{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767450501525-2z6ffwci.jpg",
|
|
imageAlt: "supplement product packaging tin premium"
|
|
},
|
|
{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767548617883-i0ilyasy.jpg",
|
|
imageAlt: "supplement tablets capsules health wellness"
|
|
},
|
|
{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767548618110-c6caoant.jpg",
|
|
imageAlt: "supplement energy performance fitness athlete"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardSeven
|
|
title="Choose Your Bundle"
|
|
description="Select the perfect supply of Edgetabs for your performance goals. All bundles ship within 24 hours."
|
|
plans={[
|
|
{
|
|
id: "single-tin",
|
|
tag: "STARTER",
|
|
pricingOptions: [
|
|
{
|
|
value: "one-time",
|
|
label: "One-Time",
|
|
price: "$49.99",
|
|
subtitle: "Single Purchase"
|
|
},
|
|
{
|
|
value: "monthly",
|
|
label: "Subscribe",
|
|
price: "$44.99",
|
|
subtitle: "10% Savings"
|
|
}
|
|
],
|
|
defaultOption: "one-time",
|
|
selectorNote: "Subscribe & save 10%",
|
|
description: "30 servings. Perfect for first-time users to experience the Edgetabs edge.",
|
|
buttons: [
|
|
{ text: "Add 1 Tin", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
id: "two-tins",
|
|
tag: "POPULAR",
|
|
pricingOptions: [
|
|
{
|
|
value: "one-time",
|
|
label: "One-Time",
|
|
price: "$89.98",
|
|
subtitle: "Save $9.98"
|
|
},
|
|
{
|
|
value: "monthly",
|
|
label: "Subscribe",
|
|
price: "$80.98",
|
|
subtitle: "Save 19.78%"
|
|
}
|
|
],
|
|
defaultOption: "one-time",
|
|
selectorNote: "Save $9.98 on purchase",
|
|
description: "60 servings. Two months of peak performance. Ideal for consistent users.",
|
|
buttons: [
|
|
{ text: "Add 2 Tins", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
id: "three-tins",
|
|
tag: "BEST VALUE",
|
|
pricingOptions: [
|
|
{
|
|
value: "one-time",
|
|
label: "One-Time",
|
|
price: "$124.97",
|
|
subtitle: "Save $24.97"
|
|
},
|
|
{
|
|
value: "monthly",
|
|
label: "Subscribe",
|
|
price: "$112.47",
|
|
subtitle: "Save 29.93%"
|
|
}
|
|
],
|
|
defaultOption: "one-time",
|
|
selectorNote: "Save $24.97 - Best savings",
|
|
description: "90 servings. Three months of uninterrupted edge. Maximum value and commitment.",
|
|
buttons: [
|
|
{ text: "Add 3 Tins", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<AboutMetric
|
|
title="Why Edgetabs Outperforms the Competition"
|
|
useInvertedBackground="noInvert"
|
|
metrics={[
|
|
{
|
|
icon: Zap,
|
|
label: "Sustained Energy",
|
|
value: "8+ Hours"
|
|
},
|
|
{
|
|
icon: Brain,
|
|
label: "Laser Focus",
|
|
value: "99% Pure"
|
|
},
|
|
{
|
|
icon: Shield,
|
|
label: "Lab Tested",
|
|
value: "100%"
|
|
},
|
|
{
|
|
icon: Award,
|
|
label: "Customer Rated",
|
|
value: "4.8★"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardEight
|
|
title="Trusted by 2,000+ Peak Performers"
|
|
description="Real results from real users who have transformed their performance with Edgetabs."
|
|
tag="★★★★★ Rated"
|
|
testimonials={[
|
|
{
|
|
id: "1",
|
|
name: "Sarah Johnson",
|
|
role: "Fitness Coach",
|
|
company: "Elite Training",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391971052-5paod60c.jpg",
|
|
imageAlt: "portrait professional headshot business person"
|
|
},
|
|
{
|
|
id: "2",
|
|
name: "Michael Chen",
|
|
role: "Entrepreneur",
|
|
company: "Tech Startup",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391971396-8z0vqol9.jpg",
|
|
imageAlt: "portrait professional headshot person face"
|
|
},
|
|
{
|
|
id: "3",
|
|
name: "Emily Rodriguez",
|
|
role: "Professional Athlete",
|
|
company: "Performance Pro",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767448343297-4asr5tm3.jpg",
|
|
imageAlt: "portrait professional headshot business person"
|
|
},
|
|
{
|
|
id: "4",
|
|
name: "David Kim",
|
|
role: "Software Engineer",
|
|
company: "Tech Innovation",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767548603379-gni6b4vr.jpg",
|
|
imageAlt: "portrait professional headshot person face"
|
|
},
|
|
{
|
|
id: "5",
|
|
name: "Jessica Martinez",
|
|
role: "Marketing Executive",
|
|
company: "Growth Agency",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767548618649-feo4luc0.jpg",
|
|
imageAlt: "portrait professional headshot business person"
|
|
},
|
|
{
|
|
id: "6",
|
|
name: "James Wilson",
|
|
role: "Fitness Enthusiast",
|
|
company: "Wellness Coach",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391971803-ej8f6jxf.jpg",
|
|
imageAlt: "portrait professional headshot person face"
|
|
}
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardEleven
|
|
title="Proven Results, Real Impact"
|
|
description="See the measurable difference Edgetabs makes in performance and customer satisfaction."
|
|
metrics={[
|
|
{
|
|
id: "1",
|
|
value: "2,000+",
|
|
title: "Happy Customers",
|
|
description: "Growing community of peak performers",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767548619667-g5lfh80v.jpg",
|
|
imageAlt: "people community group users customers"
|
|
},
|
|
{
|
|
id: "2",
|
|
value: "98%",
|
|
title: "Satisfaction Rate",
|
|
description: "Customers report improved focus and energy",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767548619976-xvx1vkd7.jpg",
|
|
imageAlt: "satisfaction happy smile success achievement"
|
|
},
|
|
{
|
|
id: "3",
|
|
value: "8+",
|
|
title: "Hours of Edge",
|
|
description: "Sustained performance throughout the day",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767548619347-rdypab32.jpg",
|
|
imageAlt: "performance chart growth data analytics"
|
|
},
|
|
{
|
|
id: "4",
|
|
value: "100%",
|
|
title: "Lab Verified",
|
|
description: "Third-party tested for purity and potency",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767548620347-50j6wzjb.jpg",
|
|
imageAlt: "quality premium check verified badge"
|
|
}
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
tag="Stay Connected"
|
|
title="Join the Edge Community"
|
|
description="Get exclusive updates on new products, performance tips, and special offers. Plus receive 15% off your first order."
|
|
tagIcon={Sparkles}
|
|
useInvertedBackground="noInvert"
|
|
inputPlaceholder="Enter your email"
|
|
buttonText="Claim 15% Off"
|
|
termsText="By signing up, you agree to our newsletter. Unsubscribe anytime."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoEmphasis
|
|
logoText="Edgetabs"
|
|
columns={[
|
|
{
|
|
items: [
|
|
{ label: "Home", href: "hero" },
|
|
{ label: "Product", href: "pricing" },
|
|
{ label: "Pricing", href: "pricing" }
|
|
]
|
|
},
|
|
{
|
|
items: [
|
|
{ label: "Why Us", href: "about" },
|
|
{ label: "Reviews", href: "testimonials" },
|
|
{ label: "Contact", href: "contact" }
|
|
]
|
|
},
|
|
{
|
|
items: [
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms of Service", href: "#" },
|
|
{ label: "Shipping Info", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
items: [
|
|
{ label: "Instagram", href: "#" },
|
|
{ label: "Twitter", href: "#" },
|
|
{ label: "YouTube", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |