463 lines
17 KiB
TypeScript
463 lines
17 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
|
import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
|
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
|
import HeroSplit from '@/components/sections/hero/HeroSplit';
|
|
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import TeamCardOne from '@/components/sections/team/TeamCardOne';
|
|
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
|
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
|
import { Activity, Award, CheckCircle, Droplets, LifeBuoy, ShieldCheck, Sparkles, Star, Zap } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="expand-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="rounded"
|
|
contentWidth="small"
|
|
sizing="mediumLargeSizeLargeTitles"
|
|
background="circleGradient"
|
|
cardStyle="gradient-bordered"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
navItems={[
|
|
{
|
|
name: "Home",
|
|
id: "#hero",
|
|
},
|
|
{
|
|
name: "About",
|
|
id: "#about",
|
|
},
|
|
{
|
|
name: "Services",
|
|
id: "#services",
|
|
},
|
|
{
|
|
name: "Team",
|
|
id: "#team",
|
|
},
|
|
{
|
|
name: "Testimonials",
|
|
id: "#testimonials",
|
|
},
|
|
{
|
|
name: "FAQ",
|
|
id: "#faq",
|
|
},
|
|
{
|
|
name: "Contact",
|
|
id: "#contact",
|
|
},
|
|
]}
|
|
brandName="HeartCare Clinic"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplit
|
|
background={{
|
|
variant: "plain",
|
|
}}
|
|
imagePosition="right"
|
|
title="Expert Cardiac Care for a Healthier Heart"
|
|
description="Specializing in the diagnosis, treatment, and prevention of heart conditions. Our compassionate team provides personalized care using advanced medical technology."
|
|
buttons={[
|
|
{
|
|
text: "Book an Appointment",
|
|
href: "#contact",
|
|
},
|
|
{
|
|
text: "Learn About Us",
|
|
href: "#about",
|
|
},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/happy-healthcare-worker-shaking-hands-with-senior-man-while-being-home-visit_637285-1362.jpg"
|
|
imageAlt="Cardiologist consulting with a patient about heart health"
|
|
mediaAnimation="slide-up"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/portrait-male-doctor-patient_1170-2163.jpg",
|
|
alt: "Portrait of a male doctor and patient",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/black-general-practitioner-measuring-mature-woman-s-blood-pressure-nursing-home_637285-11340.jpg",
|
|
alt: "Black general practitioner measuring mature woman's blood pressure at nursing home",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/front-view-female-doctor-using-stethoscope-yellow-wall_179666-21170.jpg",
|
|
alt: "Front view of female doctor using stethoscope on a yellow wall",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/front-view-female-doctor-medical-shirt-with-stethoscope-yellow-wall_179666-22676.jpg",
|
|
alt: "Front view of female doctor in medical shirt with stethoscope on yellow wall",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/female-doctor-holding-her-medical-mask-shoulder_23-2148757394.jpg",
|
|
alt: "Patient smiling with doctor",
|
|
},
|
|
]}
|
|
avatarText="Trusted by over 10,000 patients"
|
|
marqueeItems={[
|
|
{
|
|
type: "text-icon",
|
|
text: "Heart Health Experts",
|
|
icon: Activity,
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Advanced Diagnostics",
|
|
},
|
|
{
|
|
type: "text-icon",
|
|
text: "Personalized Care Plans",
|
|
icon: ShieldCheck,
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Patient-Centric Approach",
|
|
},
|
|
{
|
|
type: "text-icon",
|
|
text: "Innovation in Cardiology",
|
|
icon: Sparkles,
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TestimonialAboutCard
|
|
useInvertedBackground={false}
|
|
tag="Our Mission"
|
|
title="Dedicated to Your Heart Health"
|
|
description="At HeartCare Clinic, we believe in a holistic approach to cardiology. Our expert cardiologists are committed to delivering the highest standard of care, ensuring every patient receives a tailored treatment plan."
|
|
subdescription="We combine cutting-edge research with empathetic patient support to achieve the best possible outcomes."
|
|
icon={Activity}
|
|
imageSrc="http://img.b2bpic.net/free-photo/labor-union-members-working-together_23-2150995034.jpg"
|
|
imageAlt="A diverse medical team collaborating in a clinic setting"
|
|
mediaAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureBorderGlow
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
icon: LifeBuoy,
|
|
title: "Advanced Diagnostics",
|
|
description: "Precise diagnosis using the latest imaging and testing technologies for accurate heart condition assessment.",
|
|
},
|
|
{
|
|
icon: Activity,
|
|
title: "Cardiac Rehabilitation",
|
|
description: "Personalized programs designed to help you recover and improve heart health after a cardiac event or surgery.",
|
|
},
|
|
{
|
|
icon: Zap,
|
|
title: "Electrophysiology",
|
|
description: "Specialized care for heart rhythm disorders, including arrhythmia diagnosis and advanced treatment options.",
|
|
},
|
|
{
|
|
icon: Award,
|
|
title: "Interventional Cardiology",
|
|
description: "Minimally invasive procedures for conditions like coronary artery disease, valve issues, and structural heart defects.",
|
|
},
|
|
{
|
|
icon: ShieldCheck,
|
|
title: "Preventive Cardiology",
|
|
description: "Focus on risk assessment and lifestyle modifications to prevent heart disease and promote long-term cardiovascular wellness.",
|
|
},
|
|
{
|
|
icon: Droplets,
|
|
title: "Vascular Medicine",
|
|
description: "Expert diagnosis and treatment for conditions affecting blood vessels throughout the body, ensuring optimal circulation.",
|
|
},
|
|
]}
|
|
title="Comprehensive Cardiac Solutions"
|
|
description="From preventative care to advanced interventions, we offer a full spectrum of services to keep your heart healthy and strong."
|
|
tag="Our Services"
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground={false}
|
|
metrics={[
|
|
{
|
|
id: "1",
|
|
value: "98%",
|
|
title: "Successful Procedures",
|
|
description: "A testament to our skilled surgeons and advanced medical techniques.",
|
|
icon: CheckCircle,
|
|
},
|
|
{
|
|
id: "2",
|
|
value: "5 Stars",
|
|
title: "Patient Satisfaction",
|
|
description: "Rated excellent by our patients for compassionate care and effective treatments.",
|
|
icon: Star,
|
|
},
|
|
{
|
|
id: "3",
|
|
value: "20+",
|
|
title: "Years of Expertise",
|
|
description: "Decades of collective experience in treating diverse and complex cardiac conditions.",
|
|
icon: Award,
|
|
},
|
|
]}
|
|
title="Restoring Health, One Heart at a Time"
|
|
description="Our unwavering commitment to excellence is reflected in our patient outcomes and countless success stories. We strive for the best possible care."
|
|
tag="Our Impact"
|
|
/>
|
|
</div>
|
|
|
|
<div id="team" data-section="team">
|
|
<TeamCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={false}
|
|
members={[
|
|
{
|
|
id: "1",
|
|
name: "Dr. Anya Sharma",
|
|
role: "Lead Cardiologist",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/smiling-middle-aged-male-doctor-wearing-medical-robe-stethoscope-doing-heart-sign-isolated-pink-wall_141793-112371.jpg",
|
|
imageAlt: "Portrait of Dr. Anya Sharma, Lead Cardiologist",
|
|
},
|
|
{
|
|
id: "2",
|
|
name: "Dr. Benjamin Carter",
|
|
role: "Electrophysiologist",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-doctor-with-stethoscope-clinic_1303-19759.jpg",
|
|
imageAlt: "Portrait of Dr. Benjamin Carter, Electrophysiologist",
|
|
},
|
|
{
|
|
id: "3",
|
|
name: "Dr. Sophia Rodriguez",
|
|
role: "Interventional Cardiologist",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/smiling-middle-aged-woman-doctor-wearing-medical-robe-stethoscope-doing-heart-sign-isolated-white-wall-with-copy-space_141793-25926.jpg",
|
|
imageAlt: "Portrait of Dr. Sophia Rodriguez, Interventional Cardiologist",
|
|
},
|
|
]}
|
|
title="Meet Our Compassionate Cardiologists"
|
|
description="Our team of board-certified cardiologists and dedicated support staff are here to provide exceptional, patient-centered care. Trust your heart with the best."
|
|
tag="Our Experts"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1",
|
|
name: "Sarah J.",
|
|
role: "Recovered Patient",
|
|
testimonial: "The care I received at HeartCare Clinic was lifesaving. The doctors were incredibly knowledgeable and the staff provided immense support.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-gorgeous-middle-aged-woman-stylish-striped-pajamas-stretching-body-after-awakening-early-morning_343059-13.jpg",
|
|
imageAlt: "Photo of Sarah J., a satisfied patient",
|
|
},
|
|
{
|
|
id: "2",
|
|
name: "Michael C.",
|
|
role: "Long-term Patient",
|
|
testimonial: "Exceptional professionalism and a truly personalized approach to my condition. I've never felt more confident about my heart health.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-african-american-doctor-nursing-home_637285-11403.jpg",
|
|
imageAlt: "Photo of Michael C., a satisfied patient",
|
|
},
|
|
{
|
|
id: "3",
|
|
name: "Emily R.",
|
|
role: "New Patient",
|
|
testimonial: "From my first visit, I felt truly cared for. They explained everything clearly and put my anxieties at ease. Highly recommend!",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-student-girl-stylish-clothes-relaxing-indoors-after-college_273609-9276.jpg",
|
|
imageAlt: "Photo of Emily R., a satisfied patient",
|
|
},
|
|
{
|
|
id: "4",
|
|
name: "David K.",
|
|
role: "Heart Surgery Patient",
|
|
testimonial: "After my surgery, the rehabilitation program was fantastic. This is a team you can trust with your heart. I'm grateful for my second chance.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-reading-couch_23-2148962434.jpg",
|
|
imageAlt: "Photo of David K., a satisfied patient",
|
|
},
|
|
{
|
|
id: "5",
|
|
name: "Jessica L.",
|
|
role: "Arrhythmia Patient",
|
|
testimonial: "The electrophysiology team here is revolutionary. My quality of life has dramatically improved since my treatment. Thank you, HeartCare!",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-smiling-woman-wearing-sportswear-morning-park_93675-132882.jpg",
|
|
imageAlt: "Photo of Jessica L., a satisfied patient",
|
|
},
|
|
{
|
|
id: "6",
|
|
name: "Robert W.",
|
|
role: "Preventive Care Patient",
|
|
testimonial: "Their preventive approach changed my life. I learned so much about maintaining heart health, and my heart feels stronger than ever.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/side-view-people-relaxing-together_23-2151178231.jpg",
|
|
imageAlt: "Photo of Robert W., a satisfied patient",
|
|
},
|
|
]}
|
|
title="Hear From Our Valued Patients"
|
|
description="Real stories of hope, recovery, and gratitude from individuals who trusted HeartCare Clinic with their most important organ."
|
|
tag="Patient Stories"
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitText
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "1",
|
|
title: "What are the most common cardiac conditions you treat?",
|
|
content: "We treat a wide range of cardiac conditions, including coronary artery disease, arrhythmias, heart failure, valvular heart disease, and hypertension, among others.",
|
|
},
|
|
{
|
|
id: "2",
|
|
title: "How can I prevent heart disease?",
|
|
content: "Prevention involves lifestyle modifications such as a healthy diet, regular exercise, maintaining a healthy weight, managing stress, and avoiding smoking. Regular check-ups are also crucial.",
|
|
},
|
|
{
|
|
id: "3",
|
|
title: "What should I expect during my first visit?",
|
|
content: "Your first visit will involve a comprehensive review of your medical history, a physical examination, and potentially some initial diagnostic tests. We'll discuss your concerns and outline a personalized care plan.",
|
|
},
|
|
{
|
|
id: "4",
|
|
title: "Do you accept my insurance plan?",
|
|
content: "We accept most major insurance providers. Please contact our administrative office with your insurance details, and we will verify your coverage and benefits.",
|
|
},
|
|
{
|
|
id: "5",
|
|
title: "What advanced technologies do you utilize?",
|
|
content: "Our clinic is equipped with state-of-the-art diagnostic tools including advanced echocardiography, cardiac MRI, CT angiography, and electrophysiology mapping systems, ensuring precise and effective care.",
|
|
},
|
|
]}
|
|
sideTitle="Frequently Asked Questions"
|
|
sideDescription="Find quick answers to common questions about cardiac conditions, our treatments, and how our clinic operates to better serve you."
|
|
faqsAnimation="slide-up"
|
|
textPosition="left"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
useInvertedBackground={false}
|
|
title="Schedule Your Appointment Today"
|
|
description="Take the first step towards a healthier heart. Fill out the form below or call us directly to book a consultation with our specialists."
|
|
inputs={[
|
|
{
|
|
name: "name",
|
|
type: "text",
|
|
placeholder: "Your Full Name",
|
|
required: true,
|
|
},
|
|
{
|
|
name: "email",
|
|
type: "email",
|
|
placeholder: "Your Email Address",
|
|
required: true,
|
|
},
|
|
{
|
|
name: "phone",
|
|
type: "tel",
|
|
placeholder: "Your Phone Number",
|
|
},
|
|
]}
|
|
textarea={{
|
|
name: "message",
|
|
placeholder: "How can we help you?",
|
|
rows: 4,
|
|
}}
|
|
imageSrc="http://img.b2bpic.net/free-photo/blur-hotel-lobby_74190-4446.jpg"
|
|
imageAlt="Modern medical clinic reception desk"
|
|
mediaAnimation="slide-up"
|
|
mediaPosition="right"
|
|
buttonText="Send Message"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterMedia
|
|
imageSrc="http://img.b2bpic.net/free-photo/new-business-district-garibaldi_268835-740.jpg"
|
|
imageAlt="Modern clinic building exterior at dusk"
|
|
logoText="HeartCare Clinic"
|
|
columns={[
|
|
{
|
|
title: "Quick Links",
|
|
items: [
|
|
{
|
|
label: "Home",
|
|
href: "#hero",
|
|
},
|
|
{
|
|
label: "About Us",
|
|
href: "#about",
|
|
},
|
|
{
|
|
label: "Our Services",
|
|
href: "#services",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Support",
|
|
items: [
|
|
{
|
|
label: "FAQ",
|
|
href: "#faq",
|
|
},
|
|
{
|
|
label: "Contact Us",
|
|
href: "#contact",
|
|
},
|
|
{
|
|
label: "Patient Portal",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Legal",
|
|
items: [
|
|
{
|
|
label: "Privacy Policy",
|
|
href: "#",
|
|
},
|
|
{
|
|
label: "Terms of Service",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
copyrightText="© 2024 HeartCare Clinic. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|