Merge version_1 into main #1

Merged
bender merged 1 commits from version_1 into main 2026-04-20 01:38:34 +00:00

View File

@@ -19,319 +19,158 @@ export default function LandingPage() {
defaultButtonVariant="directional-hover"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="medium"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "About",
id: "about",
},
{
name: "Departments",
id: "departments",
},
{
name: "Services",
id: "services",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="Josiah Mission Hospital"
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{ name: "About", id: "about" },
{ name: "Departments", id: "departments" },
{ name: "Services", id: "services" },
{ name: "Contact", id: "contact" }
]}
brandName="Josiah Mission Hospital"
button={{ text: "Book Appointment", href: "#contact" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroCentered
background={{
variant: "plain",
}}
title="Welcome to Quality Healthcare"
description="We Treat, But God Heals. Dedicated to providing high quality and professional care to our community."
avatars={[
{
src: "http://img.b2bpic.net/free-photo/top-view-hospital-reception-diverse-group-people-waiting-doctor-appointment-while-talking-about-medical-problems-professional-nurse-checking-appointment-mother-child_482257-45912.jpg",
alt: "Hospital reception",
},
{
src: "http://img.b2bpic.net/free-photo/empty-reception-desk-appointments-medical-facility-waiting-area-with-chairs-sit-rows-before-attending-checkup-consultation-healthcare-clinical-space-emergency-center_482257-46930.jpg",
alt: "Waiting area",
},
{
src: "http://img.b2bpic.net/free-photo/luxury-yacht-elegant-interior-design-travel-comfort-generated-by-ai_188544-28008.jpg",
alt: "Lobby design",
},
{
src: "http://img.b2bpic.net/free-photo/doctor-patient-ophthalmologist-s-office_23-2150917695.jpg",
alt: "Doctor and patient",
},
{
src: "http://img.b2bpic.net/free-photo/medical-team-discusses-x-ray-scan-results-patient-care-treatment-center_482257-116767.jpg",
alt: "Medical team meeting",
},
]}
buttons={[
{
text: "Book Appointment",
href: "#contact",
},
{
text: "Contact Us",
href: "#contact",
},
]}
buttonAnimation="slide-up"
marqueeItems={[
{
type: "text",
text: "24/7 Emergency Care",
},
{
type: "text",
text: "Board-Certified Specialists",
},
{
type: "text",
text: "Modern Medical Equipment",
},
{
type: "text",
text: "Compassionate Care",
},
{
type: "text",
text: "Affordable Healthcare",
},
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroCentered
background={{ variant: "plain" }}
title="Welcome to Quality Healthcare"
description="We Treat, But God Heals. Dedicated to providing high quality and professional care to our community."
avatars={[
{ src: "http://img.b2bpic.net/free-photo/top-view-hospital-reception-diverse-group-people-waiting-doctor-appointment-while-talking-about-medical-problems-professional-nurse-checking-appointment-mother-child_482257-45912.jpg", alt: "Hospital reception" },
{ src: "http://img.b2bpic.net/free-photo/empty-reception-desk-appointments-medical-facility-waiting-area-with-chairs-sit-rows-before-attending-checkup-consultation-healthcare-clinical-space-emergency-center_482257-46930.jpg", alt: "Waiting area" },
{ src: "http://img.b2bpic.net/free-photo/luxury-yacht-elegant-interior-design-travel-comfort-generated-by-ai_188544-28008.jpg", alt: "Lobby design" },
{ src: "http://img.b2bpic.net/free-photo/doctor-patient-ophthalmologist-s-office_23-2150917695.jpg", alt: "Doctor and patient" },
{ src: "http://img.b2bpic.net/free-photo/medical-team-discusses-x-ray-scan-results-patient-care-treatment-center_482257-116767.jpg", alt: "Medical team meeting" }
]}
buttons={[
{ text: "Book Appointment", href: "#contact" },
{ text: "Contact Us", href: "#contact" }
]}
buttonAnimation="slide-up"
marqueeItems={[
{ type: "text", text: "24/7 Emergency Care" },
{ type: "text", text: "Board-Certified Specialists" },
{ type: "text", text: "Modern Medical Equipment" },
{ type: "text", text: "Compassionate Care" },
{ type: "text", text: "Affordable Healthcare" }
]}
/>
</div>
<div id="about" data-section="about">
<MediaAbout
useInvertedBackground={true}
title="Our Mission & Vision"
description="To provide high quality and professional care to our community improving their well being. We strive to be the healthcare provider of choice through reliability, teamwork, and respect."
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-nurses-wearing-face-masks_23-2149484039.jpg"
/>
</div>
<div id="about" data-section="about">
<MediaAbout
useInvertedBackground={true}
title="Our Mission & Vision"
description="To provide high quality and professional care to our community improving their well being. We strive to be the healthcare provider of choice through reliability, teamwork, and respect."
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-nurses-wearing-face-masks_23-2149484039.jpg"
/>
</div>
<div id="departments" data-section="departments">
<FeatureBorderGlow
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
icon: Search,
title: "Laboratory",
description: "Full diagnostic and clinical testing services.",
},
{
icon: Smile,
title: "Maternity Ward",
description: "Safe and compassionate maternal and neonatal care.",
},
{
icon: Activity,
title: "Consultation",
description: "Comprehensive general physician examinations.",
},
{
icon: Droplet,
title: "Pharmacy",
description: "On-site pharmacy services for convenience.",
},
{
icon: Heart,
title: "Emergency",
description: "24/7 rapid response for medical emergencies.",
},
]}
title="Clinical Departments"
description="Specialized care units managed by experienced medical professionals."
/>
</div>
<div id="departments" data-section="departments">
<FeatureBorderGlow
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{ icon: Search, title: "Laboratory", description: "Full diagnostic and clinical testing services." },
{ icon: Smile, title: "Maternity Ward", description: "Safe and compassionate maternal and neonatal care." },
{ icon: Activity, title: "Consultation", description: "Comprehensive general physician examinations." },
{ icon: Droplet, title: "Pharmacy", description: "On-site pharmacy services for convenience." },
{ icon: Heart, title: "Emergency", description: "24/7 rapid response for medical emergencies." }
]}
title="Clinical Departments"
description="Specialized care units managed by experienced medical professionals."
/>
</div>
<div id="services" data-section="services">
<ProductCardThree
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
products={[
{
id: "s1",
name: "General Consultation",
price: "Standard",
imageSrc: "http://img.b2bpic.net/free-photo/laboratory-supplies-medical-work_23-2149744722.jpg",
},
{
id: "s2",
name: "Laboratory Services",
price: "Advanced",
imageSrc: "http://img.b2bpic.net/free-photo/family-two-mums-having-baby_23-2149168849.jpg",
},
{
id: "s3",
name: "Maternal Care",
price: "Essential",
imageSrc: "http://img.b2bpic.net/free-photo/african-american-doctor-measuring-blood-pressure-senior-patient-nursing-home_637285-11342.jpg",
},
{
id: "s4",
name: "Pharmacy Services",
price: "On-site",
imageSrc: "http://img.b2bpic.net/free-photo/still-life-assortment-test-tubes_23-2149132642.jpg",
},
{
id: "s5",
name: "Emergency Services",
price: "24/7",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-pregnant-person-sitting-hospital-ward-bed_482257-22963.jpg",
},
{
id: "s6",
name: "BP Monitoring",
price: "Vital",
imageSrc: "http://img.b2bpic.net/free-photo/full-equiped-medical-cabinet_1303-23917.jpg",
},
]}
title="Medical Services"
description="Extensive range of healthcare offerings tailored to your needs."
/>
</div>
<div id="services" data-section="services">
<ProductCardThree
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
products={[
{ id: "s1", name: "General Consultation", price: "Standard", imageSrc: "http://img.b2bpic.net/free-photo/laboratory-supplies-medical-work_23-2149744722.jpg" },
{ id: "s2", name: "Laboratory Services", price: "Advanced", imageSrc: "http://img.b2bpic.net/free-photo/family-two-mums-having-baby_23-2149168849.jpg" },
{ id: "s3", name: "Maternal Care", price: "Essential", imageSrc: "http://img.b2bpic.net/free-photo/african-american-doctor-measuring-blood-pressure-senior-patient-nursing-home_637285-11342.jpg" },
{ id: "s4", name: "Pharmacy Services", price: "On-site", imageSrc: "http://img.b2bpic.net/free-photo/still-life-assortment-test-tubes_23-2149132642.jpg" },
{ id: "s5", name: "Emergency Services", price: "24/7", imageSrc: "http://img.b2bpic.net/free-photo/portrait-pregnant-person-sitting-hospital-ward-bed_482257-22963.jpg" },
{ id: "s6", name: "BP Monitoring", price: "Vital", imageSrc: "http://img.b2bpic.net/free-photo/full-equiped-medical-cabinet_1303-23917.jpg" }
]}
title="Medical Services"
description="Extensive range of healthcare offerings tailored to your needs."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardTwo
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
metrics={[
{
id: "m1",
value: "10K+",
description: "Patients Served",
},
{
id: "m2",
value: "24/7",
description: "Care Available",
},
{
id: "m3",
value: "15+",
description: "Expert Staff",
},
]}
title="Our Impact"
description="Demonstrating our commitment to community health."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardTwo
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
metrics={[
{ id: "m1", value: "10K+", description: "Patients Served" },
{ id: "m2", value: "24/7", description: "Care Available" },
{ id: "m3", value: "15+", description: "Expert Staff" }
]}
title="Our Impact"
description="Demonstrating our commitment to community health."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardThirteen
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
testimonials={[
{
id: "t1",
name: "Sarah J.",
handle: "@patient",
testimonial: "Excellent care and compassionate staff!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/family-doctor-doctor-s-office_23-2148168431.jpg",
},
{
id: "t2",
name: "Michael K.",
handle: "@patient",
testimonial: "Very professional and friendly environment.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/happy-queer-eldery-women-back-view_23-2149732512.jpg",
},
{
id: "t3",
name: "Emily R.",
handle: "@patient",
testimonial: "Truly grateful for the maternal care.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/mother-holding-baby-mothers-day_23-2147791560.jpg",
},
{
id: "t4",
name: "David M.",
handle: "@patient",
testimonial: "Quick and effective emergency response.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-asian-man-with-cancer_23-2149870347.jpg",
},
{
id: "t5",
name: "Grace L.",
handle: "@patient",
testimonial: "Clean facilities and expert doctors.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-doctor-patient_23-2149103572.jpg",
},
]}
showRating={true}
title="Patient Stories"
description="Hear from those who have experienced our compassionate care."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardThirteen
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
testimonials={[
{ id: "t1", name: "Sarah J.", handle: "@patient", testimonial: "Excellent care and compassionate staff!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/family-doctor-doctor-s-office_23-2148168431.jpg" },
{ id: "t2", name: "Michael K.", handle: "@patient", testimonial: "Very professional and friendly environment.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-queer-eldery-women-back-view_23-2149732512.jpg" },
{ id: "t3", name: "Emily R.", handle: "@patient", testimonial: "Truly grateful for the maternal care.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/mother-holding-baby-mothers-day_23-2147791560.jpg" },
{ id: "t4", name: "David M.", handle: "@patient", testimonial: "Quick and effective emergency response.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-asian-man-with-cancer_23-2149870347.jpg" },
{ id: "t5", name: "Grace L.", handle: "@patient", testimonial: "Clean facilities and expert doctors.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-doctor-patient_23-2149103572.jpg" }
]}
showRating={true}
title="Patient Stories"
description="Hear from those who have experienced our compassionate care."
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={false}
background={{
variant: "plain",
}}
tag="Contact Us"
title="Need Medical Assistance?"
description="Visit us in Nairobi, Kenya or reach out for inquiries."
buttonText="Send Message"
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={false}
background={{ variant: "plain" }}
tag="Contact Us"
title="Need Medical Assistance?"
description="Visit us in Nairobi, Kenya or reach out for inquiries."
buttonText="Send Message"
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
columns={[
{
title: "Info",
items: [
{
label: "About Us",
href: "#about",
},
{
label: "Contact",
href: "#contact",
},
],
},
{
title: "Departments",
items: [
{
label: "Maternity",
href: "#departments",
},
{
label: "Consultation",
href: "#departments",
},
],
},
]}
logoText="Josiah Mission Hospital"
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
columns={[
{
title: "Info", items: [{ label: "About Us", href: "#about" }, { label: "Contact", href: "#contact" }]
},
{
title: "Departments", items: [{ label: "Maternity", href: "#departments" }, { label: "Consultation", href: "#departments" }]
}
]}
logoText="Josiah Mission Hospital"
/>
</div>
</ReactLenis>
</ThemeProvider>
);