273 lines
17 KiB
TypeScript
273 lines
17 KiB
TypeScript
"use client";
|
||
|
||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
|
||
import SplitAbout from '@/components/sections/about/SplitAbout';
|
||
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
|
||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
|
||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import { XCircle, Hand, Settings, Smile, Briefcase, Dumbbell, UsersRound, Stethoscope, MoonStar, Star, Zap, Target, CheckCircle } from "lucide-react";
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="text-shift"
|
||
defaultTextAnimation="background-highlight"
|
||
borderRadius="soft"
|
||
contentWidth="compact"
|
||
sizing="largeSmallSizeMediumTitles"
|
||
background="fluid"
|
||
cardStyle="layered-gradient"
|
||
primaryButtonStyle="primary-glow"
|
||
secondaryButtonStyle="glass"
|
||
headingFontWeight="extrabold"
|
||
>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarStyleCentered
|
||
brandName="ShoulderEase"
|
||
navItems={[
|
||
{ name: "Home", id: "#hero" },
|
||
{ name: "Features", id: "#features" },
|
||
{ name: "How It Works", id: "#how-it-works" },
|
||
{ name: "Reviews", id: "#reviews" },
|
||
{ name: "Order Now", id: "#offer" }
|
||
]}
|
||
button={{
|
||
text: "Order Now & Get 40% Off →", href: "#offer"
|
||
}}
|
||
/>
|
||
</div>
|
||
|
||
<div id="hero" data-section="hero">
|
||
<HeroSplitDoubleCarousel
|
||
title="Say Goodbye to Shoulder Pain — In Just 15 Minutes"
|
||
description="The Electric Heated Shoulder Brace that combines deep heat therapy + vibration massage to melt away pain — at home, at work, or on the go."
|
||
background={{
|
||
variant: "radial-gradient"
|
||
}}
|
||
leftCarouselItems={[
|
||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ex6gZI1pt4fowRRZpS4X4MizOR/uploaded-1781161691603-zauwac8p.jpg", imageAlt: "Man wearing electric heated shoulder brace for pain relief" },
|
||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-sporty-man-wearing-sportswear-headband-with-heaphones-smartphone-armband-touching-it-with-serious-face_141793-37610.jpg", imageAlt: "man using heated shoulder brace at home" },
|
||
{ imageSrc: "http://img.b2bpic.net/free-photo/urban-sports-concept-with-young-woman_23-2147988228.jpg", imageAlt: "athletic man with shoulder brace after workout" },
|
||
{ imageSrc: "http://img.b2bpic.net/free-photo/hologram-feminine-silhouette-man-hand_23-2148755140.jpg", imageAlt: "close-up heated shoulder brace on person" },
|
||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-lady-doing-exercises-simulator-phisiotherapy-room_1157-38394.jpg", imageAlt: "person with shoulder brace on couch relaxing" },
|
||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-fitness-woman-sportswear-with-headband-looking-unwell-touching-her-neck-having-pain-standing-pink-wall_141793-50037.jpg", imageAlt: "woman smiling while using shoulder massager" }
|
||
]}
|
||
rightCarouselItems={[
|
||
{ imageSrc: "http://img.b2bpic.net/free-photo/physiotherapist-examines-female-patient-shoulder-checks-joint-pain-shoulder-assessment_169016-70971.jpg", imageAlt: "man relaxing with heated shoulder massager" },
|
||
{ imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-using-massage-gun-indoors_23-2149421055.jpg", imageAlt: "woman working on laptop using shoulder brace" },
|
||
{ imageSrc: "http://img.b2bpic.net/free-photo/person-using-massage-gun_23-2149398575.jpg", imageAlt: "close up of shoulder brace material and texture" },
|
||
{ imageSrc: "http://img.b2bpic.net/free-photo/handsome-men-sports-clothes-sitting-near-simulators_1157-26902.jpg", imageAlt: "man doing light exercise wearing shoulder brace" },
|
||
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-relaxing-spa_23-2148000496.jpg", imageAlt: "woman sleeping peacefully with shoulder brace" },
|
||
{ imageSrc: "http://img.b2bpic.net/free-photo/female-patient-undergoing-therapy-with-physiotherapist_23-2148836504.jpg", imageAlt: "family member helping apply shoulder brace" }
|
||
]}
|
||
tag="🔥 3-Level Heat Control | ⚡ Rechargeable Battery | 🏋️ Fits Left & Right Shoulder | ✅ 30-Day Money Back Guarantee"
|
||
tagAnimation="slide-up"
|
||
buttons={[
|
||
{ text: "Order Now & Get 40% Off →", href: "#offer" }
|
||
]}
|
||
buttonAnimation="slide-up"
|
||
carouselPosition="right"
|
||
/>
|
||
</div>
|
||
|
||
<div id="problem" data-section="problem">
|
||
<SplitAbout
|
||
title="Sound Familiar?"
|
||
description="You don't need another painkiller. You need real heat — delivered exactly where it hurts."
|
||
bulletPoints={[
|
||
{ title: "Shoulder pain that won't go away no matter what you try", description: "Persistent shoulder pain can be debilitating.", icon: XCircle },
|
||
{ title: "Physiotherapy sessions costing thousands of rupees every month", description: "Expensive physiotherapy sessions may not be sustainable.", icon: XCircle },
|
||
{ title: "Pain killers that only mask the problem temporarily", description: "Painkillers offer only temporary relief.", icon: XCircle },
|
||
{ title: "Cold nights where your shoulder aches you out of sleep", description: "Night pain disrupts sleep and recovery.", icon: XCircle },
|
||
{ title: "Can't lift your arm properly at work or at the gym", description: "Limited arm mobility affects daily activities.", icon: XCircle }
|
||
]}
|
||
imageSrc="http://img.b2bpic.net/free-photo/handsome-business-man-wearing-suit-touching-shoulder-feeling-pain-standing-white-background_141793-54195.jpg"
|
||
imageAlt="Person with hand on aching shoulder and painful expression"
|
||
mediaAnimation="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
/>
|
||
</div>
|
||
|
||
<div id="product-intro" data-section="product-intro">
|
||
<SplitAbout
|
||
title="Meet the Smart Shoulder Brace That Works While You Rest"
|
||
description="Designed with infrared heating technology and multi-point vibration, this shoulder wrap delivers clinic-level relief without the clinic price. Just strap it on and let it work."
|
||
bulletPoints={[
|
||
{ title: "Infrared Heat Therapy", description: "Penetrates deep into muscles and joints for effective relief.", icon: Zap },
|
||
{ title: "Multi-Point Vibration Massage", description: "Stimulates blood flow and reduces stiffness.", icon: Target }
|
||
]}
|
||
imageSrc="http://img.b2bpic.net/free-photo/women-wear-wristbands-exercise-stand-against-wall_1150-16545.jpg"
|
||
imageAlt="Close-up of electric shoulder brace showing technological details"
|
||
mediaAnimation="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
/>
|
||
</div>
|
||
|
||
<div id="features" data-section="features">
|
||
<FeatureCardTen
|
||
title="Everything Your Shoulder Needs. Nothing It Doesn't."
|
||
features={[
|
||
{
|
||
media: { imageSrc: "http://img.b2bpic.net/free-photo/3d-anatomy-concept-xray-man_183364-118325.jpg", imageAlt: "Graphic showing infrared heat penetrating muscle tissue" },
|
||
reverse: false,
|
||
items: [
|
||
{ text: "3-Level Infrared Heat: Penetrates deep into joints & muscles for real relief", icon: CheckCircle }
|
||
]
|
||
},
|
||
{
|
||
media: { imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-portrait-digital-art_23-2151197901.jpg", imageAlt: "Graphic showing vibration waves stimulating blood flow" },
|
||
reverse: true,
|
||
items: [
|
||
{ text: "Vibration Massage Modes: Stimulates blood flow, reduces stiffness fast", icon: CheckCircle }
|
||
]
|
||
},
|
||
{
|
||
media: { imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-using-massage-gun-man_23-2149421018.jpg", imageAlt: "Close-up of the LED digital display on the shoulder brace" },
|
||
reverse: false,
|
||
items: [
|
||
{ text: "LED Digital Display: See your settings clearly — no guesswork", icon: CheckCircle }
|
||
]
|
||
},
|
||
{
|
||
media: { imageSrc: "http://img.b2bpic.net/free-photo/3d-paper-craft-art-charging-battery_53876-88546.jpg", imageAlt: "Icon of a rechargeable battery and charging cable" },
|
||
reverse: true,
|
||
items: [
|
||
{ text: "Rechargeable Battery: Wireless freedom — use it anywhere", icon: CheckCircle }
|
||
]
|
||
},
|
||
{
|
||
media: { imageSrc: "http://img.b2bpic.net/free-photo/boxer-training-with-resistance-belts_1098-14153.jpg", imageAlt: "Image of the adjustable strap mechanism for the shoulder brace" },
|
||
reverse: false,
|
||
items: [
|
||
{ text: "Adjustable Strap: Fits all shoulder sizes, left or right", icon: CheckCircle }
|
||
]
|
||
},
|
||
{
|
||
media: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-ventilation-system_23-2149388960.jpg", imageAlt: "Close-up of the breathable mesh fabric texture" },
|
||
reverse: true,
|
||
items: [
|
||
{ text: "Breathable Mesh Fabric: Comfortable for extended wear", icon: CheckCircle }
|
||
]
|
||
},
|
||
{
|
||
media: { imageSrc: "http://img.b2bpic.net/free-photo/woman-holding-clipboard-office-lobby_482257-121035.jpg", imageAlt: "Icon of a timer with auto shut-off function" },
|
||
reverse: false,
|
||
items: [
|
||
{ text: "Auto Shut-Off Timer: Safe 15–30 min sessions, no overheating", icon: CheckCircle }
|
||
]
|
||
}
|
||
]}
|
||
textboxLayout="default"
|
||
animationType="slide-up"
|
||
useInvertedBackground={true}
|
||
/>
|
||
</div>
|
||
|
||
<div id="how-it-works" data-section="how-it-works">
|
||
<SplitAbout
|
||
title="Relief in 3 Simple Steps"
|
||
description=""
|
||
bulletPoints={[
|
||
{ title: "Strap It On", description: "Adjustable belt fits any shoulder perfectly", icon: Hand },
|
||
{ title: "Select Your Mode", description: "Choose heat level & vibration intensity on the LED panel", icon: Settings },
|
||
{ title: "Relax & Recover", description: "Feel the heat penetrate deep within minutes", icon: Smile }
|
||
]}
|
||
imageSrc="http://img.b2bpic.net/free-photo/top-view-hands-holding-massage-gun_23-2149421007.jpg"
|
||
imageAlt="Person demonstrating putting on the electric shoulder brace"
|
||
mediaAnimation="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
/>
|
||
</div>
|
||
|
||
<div id="who-its-for" data-section="who-its-for">
|
||
<SplitAbout
|
||
title="Perfect For..."
|
||
description=""
|
||
bulletPoints={[
|
||
{ title: "Office workers with frozen shoulder from sitting all day", description: "Relieve stiffness and discomfort from prolonged desk work.", icon: Briefcase },
|
||
{ title: "Gym-goers with post-workout soreness", description: "Accelerate muscle recovery after intense training.", icon: Dumbbell },
|
||
{ title: "Older adults with arthritis or joint stiffness", description: "Ease chronic pain and improve joint flexibility.", icon: UsersRound },
|
||
{ title: "Anyone recovering from a shoulder injury", description: "Support healing and reduce pain during recovery.", icon: Stethoscope },
|
||
{ title: "People woken up by shoulder pain at night", description: "Enjoy uninterrupted sleep with soothing heat therapy.", icon: MoonStar }
|
||
]}
|
||
imageSrc="http://img.b2bpic.net/free-photo/retro-loving-couple-dancing-near-disco-ball_171337-10521.jpg"
|
||
imageAlt="Diverse people benefiting from the electric shoulder brace"
|
||
mediaAnimation="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
/>
|
||
</div>
|
||
|
||
<div id="reviews" data-section="reviews">
|
||
<TestimonialCardTwo
|
||
title="Join 12,000+ Customers Living Pain-Free"
|
||
description="Hear what our satisfied customers have to say about their journey to a pain-free life."
|
||
testimonials={[
|
||
{ id: "1", name: "Ali Raza", role: "Lahore — Verified Buyer", testimonial: "\"Mera shoulder 2 saal se dukh raha tha — is ne 1 hafte mein farq diya! My shoulder had been hurting for 2 years. This made a difference in just 1 week!\"", imageSrc: "http://img.b2bpic.net/free-photo/pleased-male-customer-guarantee-quality-show-okay-sign-stock-photo_176420-18709.jpg", icon: Star },
|
||
{ id: "2", name: "Sana M.", role: "Karachi — Verified Buyer", testimonial: "\"Best purchase I've made this year. The heat goes DEEP. I use it every night before bed.\"", imageSrc: "http://img.b2bpic.net/free-photo/positive-excited-young-woman-showing-thumbs-up-having-fun-stock-photo_1262-14331.jpg", icon: Star },
|
||
{ id: "3", name: "Usman K.", role: "Islamabad — Verified Buyer", testimonial: "\"Bought it for my father who has arthritis. He now asks for it every single day. Highly recommend!\"", imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-man-home-office-stock-photo_329181-20664.jpg", icon: Star },
|
||
{ id: "4", name: "Fatima N.", role: "Faisalabad — Verified Buyer", testimonial: "\"Physiotherapy chodh di — yeh brace ghar pe hi kaam kar deta hai. Stopped going to physio — this brace does the job at home.\"", imageSrc: "http://img.b2bpic.net/free-photo/young-caucasian-ill-girl-wearing-scarf-keeping-hands-near-mouth-calling-out-loud-someone-with-closed-eyes-isolated-purple-wall-with-copy-space_141793-79573.jpg", icon: Star },
|
||
{ id: "5", name: "Hassan B.", role: "Rawalpindi — Verified Buyer", testimonial: "\"The LED display is very easy to use. My gym trainer also asked me where I got this from!\"", imageSrc: "http://img.b2bpic.net/free-photo/close-up-satisfied-bearded-guy-white-shirt-showing-thumbs-up-approval-like-agree-positive-answer-stock-photo_1258-26715.jpg", icon: Star }
|
||
]}
|
||
carouselMode="buttons"
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
/>
|
||
</div>
|
||
|
||
<div id="offer" data-section="offer">
|
||
<PricingCardNine
|
||
title="Today Only — 40% Off + Free Delivery"
|
||
description="Original Price: ₹5,999 \n Sale Price: ₹3,599 \n\n 🔥 Limited Time Offer! 🔥\n\n🚚 Free delivery nationwide \n🔄 30-day easy return \n🔒 Cash on Delivery available \n\n⚠️ Sirf 23 pieces baqi hain — abhi order karein! (Only 23 pieces left — order now!)"
|
||
plans={[
|
||
{
|
||
id: "sale-offer", title: "Electric Heated Shoulder Brace Massager", price: "₹3,599", period: "Limited Stock", features: ["Original Price: ₹5,999", "Free Delivery Nationwide", "30-Day Easy Return", "Cash on Delivery Available"],
|
||
button: { text: "Order Karo — COD Available →", href: "#" },
|
||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-using-massage-gun-woman_23-2149421004.jpg", imageAlt: "Electric shoulder brace on a special offer"
|
||
}
|
||
]}
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
/>
|
||
</div>
|
||
|
||
<div id="faq" data-section="faq">
|
||
<FaqDouble
|
||
title="Frequently Asked Questions"
|
||
description=""
|
||
faqs={[
|
||
{ id: "faq-1", title: "Kya yeh both shoulders pe use ho sakta hai?", content: "Haan! Adjustable strap left aur right dono shoulders pe fit hota hai." },
|
||
{ id: "faq-2", title: "Is it safe to use daily?", content: "Yes. Auto shut-off timer ensures safe 15–30 min sessions daily." },
|
||
{ id: "faq-3", title: "Battery kitni der chalti hai?", content: "Fully charged battery 2–3 sessions tak chalti hai." },
|
||
{ id: "faq-4", title: "Kya COD available hai?", content: "Bilkul! Cash on Delivery poore Pakistan mein available hai." }
|
||
]}
|
||
faqsAnimation="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterSimple
|
||
columns={[
|
||
{ title: "Product", items: [{ label: "Features", href: "#features" }, { label: "How It Works", href: "#how-it-works" }] },
|
||
{ title: "Support", items: [{ label: "FAQ", href: "#faq" }, { label: "Contact Us", href: "#" }] },
|
||
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }
|
||
]}
|
||
bottomLeftText="© 2023 ShoulderEase. All rights reserved."
|
||
bottomRightText="Made with ❤️ for pain relief."
|
||
/>
|
||
</div>
|
||
</ThemeProvider>
|
||
);
|
||
}
|