Merge version_1 into main #1
353
src/app/page.tsx
353
src/app/page.tsx
@@ -18,254 +18,129 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="hover-bubble"
|
||||
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: "Home",
|
||||
id: "#hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "#features",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "#testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="Drs Matebula Kuhlase"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "#hero" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Services", id: "#features" },
|
||||
{ name: "Testimonials", id: "#testimonials" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="Drs Matebula Kuhlase"
|
||||
button={{ text: "Book Appointment", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Your Trusted Medical Partners in Diepkloof"
|
||||
description="Drs Matebula Kuhlase Partners Inc provides comprehensive, professional, and patient-focused medical care for you and your family."
|
||||
tag="Trusted Care"
|
||||
buttons={[
|
||||
{
|
||||
text: "Book an Appointment",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/empty-healthcare-medical-office-no-people-modern-hospital-interior-computer-desk-with-examining-diagnostic-data-checking-disease-doctor-medical-space_482257-64606.jpg",
|
||||
imageAlt: "Medical consultation room",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/doctor-preparing-consult_23-2149309927.jpg",
|
||||
imageAlt: "Professional doctor in clinic",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/empty-hospital-reception-counter-hallway-waiting-room-seats-medical-examination-appointment-with-physician-registration-desk-with-waiting-area-help-patients-with-disease-diagnosis_482257-51632.jpg",
|
||||
imageAlt: "General practitioner consultation",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-doctor-work_23-2149726937.jpg",
|
||||
imageAlt: "Medical staff in Diepkloof",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/no-people-hospital-reception-desk-medical-appointments-checkup-visit-waiting-room-lobby-with-counter-indoors-give-support-advice-modern-healthcare-facility_482257-44451.jpg",
|
||||
imageAlt: "Patient care services",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-spacious-office-dentist_8353-9976.jpg",
|
||||
imageAlt: "Modern clinical office",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Your Trusted Medical Partners in Diepkloof"
|
||||
description="Drs Matebula Kuhlase Partners Inc provides comprehensive, professional, and patient-focused medical care for you and your family."
|
||||
tag="Trusted Care"
|
||||
buttons={[{ text: "Book an Appointment", href: "#contact" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/empty-healthcare-medical-office-no-people-modern-hospital-interior-computer-desk-with-examining-diagnostic-data-checking-disease-doctor-medical-space_482257-64606.jpg", imageAlt: "Medical consultation room" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/doctor-preparing-consult_23-2149309927.jpg", imageAlt: "Professional doctor in clinic" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/empty-hospital-reception-counter-hallway-waiting-room-seats-medical-examination-appointment-with-physician-registration-desk-with-waiting-area-help-patients-with-disease-diagnosis_482257-51632.jpg", imageAlt: "General practitioner consultation" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-doctor-work_23-2149726937.jpg", imageAlt: "Medical staff in Diepkloof" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/no-people-hospital-reception-desk-medical-appointments-checkup-visit-waiting-room-lobby-with-counter-indoors-give-support-advice-modern-healthcare-facility_482257-44451.jpg", imageAlt: "Patient care services" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/beautiful-spacious-office-dentist_8353-9976.jpg", imageAlt: "Modern clinical office" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="About Our Practice"
|
||||
title="Compassionate Care in the Heart of Diepkloof"
|
||||
description="We are committed to providing high-quality primary healthcare services. Our practice prioritizes the health and wellbeing of the Diepkloof community through professional and accessible general practice services."
|
||||
subdescription="With years of experience, our doctors work to ensure every patient receives individual attention, accurate diagnostics, and a clear treatment path."
|
||||
icon={Activity}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/female-nurse-practicing-medicine-clinic_23-2149868920.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
imageAlt="doctor consultation patient care"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
tag="About Our Practice"
|
||||
title="Compassionate Care in the Heart of Diepkloof"
|
||||
description="We are committed to providing high-quality primary healthcare services. Our practice prioritizes the health and wellbeing of the Diepkloof community through professional and accessible general practice services."
|
||||
subdescription="With years of experience, our doctors work to ensure every patient receives individual attention, accurate diagnostics, and a clear treatment path."
|
||||
icon={Activity}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/female-nurse-practicing-medicine-clinic_23-2149868920.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
imageAlt="doctor consultation patient care"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "General Consultations",
|
||||
subtitle: "Expert care for acute and chronic conditions.",
|
||||
category: "Medical",
|
||||
value: "Primary Care",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Wellness Checkups",
|
||||
subtitle: "Preventative health screening and monitoring.",
|
||||
category: "Wellness",
|
||||
value: "Prevention",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Chronic Disease Management",
|
||||
subtitle: "Ongoing care for long-term health success.",
|
||||
category: "Support",
|
||||
value: "Monitoring",
|
||||
},
|
||||
]}
|
||||
title="Our Clinical Services"
|
||||
description="Comprehensive medical support tailored to your unique healthcare needs."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "f1", title: "General Consultations", subtitle: "Expert care for acute and chronic conditions.", category: "Medical", value: "Primary Care" },
|
||||
{ id: "f2", title: "Wellness Checkups", subtitle: "Preventative health screening and monitoring.", category: "Wellness", value: "Prevention" },
|
||||
{ id: "f3", title: "Chronic Disease Management", subtitle: "Ongoing care for long-term health success.", category: "Support", value: "Monitoring" }
|
||||
]}
|
||||
title="Our Clinical Services"
|
||||
description="Comprehensive medical support tailored to your unique healthcare needs."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="asymmetric-60-wide-40-narrow"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah Moloi",
|
||||
role: "Patient",
|
||||
company: "Diepkloof Resident",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-patient-smiling-while-talking-doctor_107420-73983.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Thabo Nkosi",
|
||||
role: "Patient",
|
||||
company: "Local Professional",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-mature-woman-talking-her-doctor-medical-clinic_637285-9073.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Lerato Dlamini",
|
||||
role: "Patient",
|
||||
company: "Long-term Patient",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-female-doctor-patient_23-2149844603.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "David Khoza",
|
||||
role: "Patient",
|
||||
company: "Community Member",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/sportive-senior-smiling-camera_23-2148297533.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Palesa Mokoena",
|
||||
role: "Patient",
|
||||
company: "Local Resident",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-female-doctor-holding-stethoscope_268835-944.jpg",
|
||||
},
|
||||
]}
|
||||
title="Patient Stories"
|
||||
description="Trusted by our community to provide excellent healthcare."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="asymmetric-60-wide-40-narrow"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Sarah Moloi", role: "Patient", company: "Diepkloof Resident", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/female-patient-smiling-while-talking-doctor_107420-73983.jpg" },
|
||||
{ id: "t2", name: "Thabo Nkosi", role: "Patient", company: "Local Professional", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-mature-woman-talking-her-doctor-medical-clinic_637285-9073.jpg" },
|
||||
{ id: "t3", name: "Lerato Dlamini", role: "Patient", company: "Long-term Patient", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-female-doctor-patient_23-2149844603.jpg" },
|
||||
{ id: "t4", name: "David Khoza", role: "Patient", company: "Community Member", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/sportive-senior-smiling-camera_23-2148297533.jpg" },
|
||||
{ id: "t5", name: "Palesa Mokoena", role: "Patient", company: "Local Resident", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-female-doctor-holding-stethoscope_268835-944.jpg" }
|
||||
]}
|
||||
title="Patient Stories"
|
||||
description="Trusted by our community to provide excellent healthcare."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "How can I book an appointment?",
|
||||
content: "You can contact our office by phone or visit our reception desk in Diepkloof.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Do you accept walk-ins?",
|
||||
content: "We prioritize appointments but do accommodate emergencies. Please call ahead when possible.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Do you offer chronic illness management?",
|
||||
content: "Yes, we specialize in long-term chronic condition monitoring and support.",
|
||||
},
|
||||
]}
|
||||
sideTitle="Frequently Asked Questions"
|
||||
sideDescription="Find answers to the most common questions about our practice."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "q1", title: "How can I book an appointment?", content: "You can contact our office by phone or visit our reception desk in Diepkloof." },
|
||||
{ id: "q2", title: "Do you accept walk-ins?", content: "We prioritize appointments but do accommodate emergencies. Please call ahead when possible." },
|
||||
{ id: "q3", title: "Do you offer chronic illness management?", content: "Yes, we specialize in long-term chronic condition monitoring and support." }
|
||||
]}
|
||||
sideTitle="Frequently Asked Questions"
|
||||
sideDescription="Find answers to the most common questions about our practice."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Reach Out to Us"
|
||||
description="Have questions or need to schedule an appointment? Get in touch today."
|
||||
buttonText="Send Enquiry"
|
||||
tag="Contact Us"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Reach Out to Us"
|
||||
description="Have questions or need to schedule an appointment? Get in touch today."
|
||||
buttonText="Send Enquiry"
|
||||
tag="Contact Us"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "#hero",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#features",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="Drs Matebula Kuhlase Partners Inc"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{ items: [{ label: "Home", href: "#hero" }, { label: "About", href: "#about" }, { label: "Services", href: "#features" }] },
|
||||
{ items: [{ label: "Contact", href: "#contact" }, { label: "Privacy Policy", href: "#" }] }
|
||||
]}
|
||||
logoText="Drs Matebula Kuhlase Partners Inc"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user