220 lines
11 KiB
TypeScript
220 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import { Heart, Stethoscope, Award } from "lucide-react";
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
|
import HeroBillboardScroll from "@/components/sections/hero/HeroBillboardScroll";
|
|
import MetricCardFourteen from "@/components/sections/metrics/MetricCardFourteen";
|
|
import FeatureCardTwentyFour from "@/components/sections/feature/FeatureCardTwentyFour";
|
|
import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
|
|
import TeamCardSix from "@/components/sections/team/TeamCardSix";
|
|
import TestimonialCardTwelve from "@/components/sections/testimonial/TestimonialCardTwelve";
|
|
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
|
|
|
|
const navItems = [
|
|
{ name: "Home", id: "home" },
|
|
{ name: "Services", id: "services" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "Contact", id: "contact" },
|
|
];
|
|
|
|
const footerColumns = [
|
|
{
|
|
title: "Quick Links", items: [
|
|
{ label: "Home", href: "/" },
|
|
{ label: "Services", href: "/services" },
|
|
{ label: "About", href: "/about" },
|
|
{ label: "Contact", href: "/contact" },
|
|
],
|
|
},
|
|
{
|
|
title: "Services", items: [
|
|
{ label: "Back & Neck Pain", href: "/services" },
|
|
{ label: "Joint Pain Therapy", href: "/services" },
|
|
{ label: "Post-Surgery Rehab", href: "/services" },
|
|
{ label: "Sports Injuries", href: "/services" },
|
|
],
|
|
},
|
|
{
|
|
title: "Contact Info", items: [
|
|
{ label: "Phone: +91-9876-543-210", href: "tel:+919876543210" },
|
|
{ label: "Email: info@jainphysio.com", href: "mailto:info@jainphysio.com" },
|
|
{ label: "Address: Char Imli, Bhopal", href: "#" },
|
|
{ label: "Hours: Mon-Sat 9AM-6PM", href: "#" },
|
|
],
|
|
},
|
|
{
|
|
title: "Legal", items: [
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms of Service", href: "#" },
|
|
{ label: "Disclaimer", href: "#" },
|
|
{ label: "Contact Us", href: "/contact" },
|
|
],
|
|
},
|
|
];
|
|
|
|
export default function HomePage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-shift"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="soft"
|
|
contentWidth="smallMedium"
|
|
sizing="mediumLarge"
|
|
background="fluid"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="light"
|
|
>
|
|
{/* Navbar */}
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
navItems={navItems}
|
|
brandName="Jain Physiotherapy Clinic"
|
|
button={{
|
|
text: "Call Now", href: "tel:+919876543210"}}
|
|
/>
|
|
</div>
|
|
|
|
{/* Hero Section */}
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardScroll
|
|
title="Relieve Pain. Restore Movement."
|
|
description="Expert physiotherapy care in Bhopal. Personalized treatment for back pain, neck pain, joint injuries, and post-surgery rehabilitation. Experienced doctor, proven results."
|
|
background={{ variant: "plain" }}
|
|
tag="Professional Healthcare"
|
|
tagIcon={Heart}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{
|
|
text: "Book Appointment", href: "/contact"},
|
|
{
|
|
text: "Call: +91-9876-543-210", href: "tel:+919876543210"},
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
imageSrc="https://images.unsplash.com/photo-1576091160550-112173f31c74?w=800&h=600&fit=crop"
|
|
imageAlt="Modern physiotherapy clinic with advanced treatment equipment"
|
|
ariaLabel="Jain Physiotherapy Clinic hero section"
|
|
/>
|
|
</div>
|
|
|
|
{/* Trust Signals Section */}
|
|
<div id="trust-signals" data-section="trust-signals">
|
|
<MetricCardFourteen
|
|
title="Trusted by Hundreds of Patients"
|
|
tag="Patient Satisfaction"
|
|
tagAnimation="slide-up"
|
|
metrics={[
|
|
{
|
|
id: "rating", value: "5.0★", description: "Patient Rating"},
|
|
{
|
|
id: "patients", value: "500+", description: "Happy Patients"},
|
|
{
|
|
id: "experience", value: "15+", description: "Years of Experience"},
|
|
{
|
|
id: "recovery", value: "95%", description: "Recovery Success Rate"},
|
|
]}
|
|
metricsAnimation="slide-up"
|
|
useInvertedBackground={false}
|
|
ariaLabel="Trust metrics and patient statistics"
|
|
/>
|
|
</div>
|
|
|
|
{/* Services Section */}
|
|
<div id="services" data-section="services">
|
|
<FeatureCardTwentyFour
|
|
title="Specialized Services"
|
|
description="Comprehensive physiotherapy treatments tailored to your specific needs and health goals."
|
|
tag="Treatment Expertise"
|
|
tagIcon={Stethoscope}
|
|
tagAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="slide-up"
|
|
features={[
|
|
{
|
|
id: "back-pain", title: "Back & Neck Pain", author: "Specialized Treatment", description: "Expert treatment for chronic back pain, cervical spondylosis, and neck stiffness. Relief through targeted therapy and exercises.", tags: ["Pain Relief", "Professional"],
|
|
imageSrc: "https://images.unsplash.com/photo-1631217b2af32a1e1a79d15cda230dc5f148f36d?w=800&h=600&fit=crop", imageAlt: "Physiotherapist performing back pain treatment on patient in clinic"},
|
|
{
|
|
id: "joint-care", title: "Joint Pain Therapy", author: "Mobility Restoration", description: "Treatment for knee, shoulder, hip, and ankle pain. Restore full range of motion and reduce inflammation naturally.", tags: ["Joint Health", "Mobility"],
|
|
imageSrc: "https://images.unsplash.com/photo-1576091160596-112173f31c74?w=800&h=600&fit=crop", imageAlt: "Therapist assisting patient with joint rehabilitation exercises in modern clinic"},
|
|
{
|
|
id: "post-surgery", title: "Post-Surgery Rehabilitation", author: "Recovery Support", description: "Specialized rehabilitation programs after orthopedic surgeries. Safe, guided recovery with proven techniques.", tags: ["Recovery", "Professional Care"],
|
|
imageSrc: "https://images.unsplash.com/photo-1579154204601-01d3f2d751a0?w=800&h=600&fit=crop", imageAlt: "Patient undergoing post-surgical physiotherapy rehabilitation with professional therapist"},
|
|
]}
|
|
ariaLabel="Physiotherapy services offered"
|
|
/>
|
|
</div>
|
|
|
|
{/* Why Choose Us Section */}
|
|
<div id="why-choose" data-section="why-choose">
|
|
<TextSplitAbout
|
|
title="Why Choose Jain Physiotherapy?"
|
|
description={[
|
|
"Dr. Jhankar Jain brings 15+ years of clinical experience in physiotherapy. Our clinic is equipped with modern treatment facilities and maintained to the highest standards of cleanliness and professionalism.", "We believe in personalized care. Every patient receives a customized treatment plan based on thorough assessment and medical history. Our patient-first approach ensures you get the attention and care you deserve.", "Located in the heart of Bhopal near Char Imli, we're easily accessible. Whether you're recovering from surgery, managing chronic pain, or seeking preventive care, our expert team is ready to help you regain health and mobility."]}
|
|
buttons={[
|
|
{
|
|
text: "Schedule Your Visit", href: "/contact"},
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
useInvertedBackground={false}
|
|
showBorder={false}
|
|
ariaLabel="Why choose us section"
|
|
/>
|
|
</div>
|
|
|
|
{/* Doctor Introduction Section */}
|
|
<div id="doctor-intro" data-section="doctor-intro">
|
|
<TeamCardSix
|
|
title="Meet Dr. Jhankar Jain"
|
|
description="Experienced physiotherapist dedicated to patient care and recovery. With 15+ years of practice, Dr. Jain has successfully treated hundreds of patients with diverse conditions."
|
|
tag="Healthcare Professional"
|
|
tagIcon={Award}
|
|
tagAnimation="slide-up"
|
|
members={[
|
|
{
|
|
id: "doctor-1", name: "Dr. Jhankar Jain", role: "Physiotherapy Expert", imageSrc: "https://images.unsplash.com/photo-1537368310025-700d6d9d2a9a?w=800&h=600&fit=crop", imageAlt: "Dr. Jhankar Jain - Lead physiotherapist with 15+ years experience"},
|
|
]}
|
|
gridVariant="one-large-right-three-stacked-left"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
ariaLabel="Doctor profile section"
|
|
/>
|
|
</div>
|
|
|
|
{/* Testimonials Section */}
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwelve
|
|
testimonials={[
|
|
{
|
|
id: "testimonial-1", name: "Priya Sharma", imageSrc: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=200&h=200&fit=crop", imageAlt: "Priya Sharma - Satisfied patient of Jain Physiotherapy Clinic"},
|
|
{
|
|
id: "testimonial-2", name: "Rajesh Kumar", imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=200&h=200&fit=crop", imageAlt: "Rajesh Kumar - Patient testimonial from Jain Physiotherapy"},
|
|
{
|
|
id: "testimonial-3", name: "Anika Patel", imageSrc: "https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=200&h=200&fit=crop", imageAlt: "Anika Patel - Jain Physiotherapy patient review"},
|
|
{
|
|
id: "testimonial-4", name: "Vikram Singh", imageSrc: "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=200&h=200&fit=crop", imageAlt: "Vikram Singh - Recovered patient at Jain Physiotherapy Clinic Bhopal"},
|
|
]}
|
|
cardTitle="Patient Testimonials"
|
|
cardTag="Real Patient Stories"
|
|
cardTagIcon={Heart}
|
|
cardAnimation="slide-up"
|
|
useInvertedBackground={false}
|
|
ariaLabel="Patient testimonials section"
|
|
/>
|
|
</div>
|
|
|
|
{/* Footer */}
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseReveal
|
|
columns={footerColumns}
|
|
copyrightText="© 2024 Jain Physiotherapy Clinic. All rights reserved. Dr. Jhankar Jain - Physiotherapy Expert."
|
|
ariaLabel="Footer section"
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |