Update src/app/contact/page.tsx

Merge version_2 into main

src/app/appointment/page.tsx

@@ -0,0 +1,66 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
+import FooterBase from '@/components/sections/footer/FooterBase';
+
+export default function AppointmentPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="text-stagger"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="rounded"
+        contentWidth="small"
+        sizing="mediumLargeSizeMediumTitles"
+        background="grid"
+        cardStyle="glass-elevated"
+        primaryButtonStyle="flat"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="extrabold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "About", id: "/#about" },
+              { name: "Services", id: "/#services" },
+              { name: "Appointment", id: "/appointment" },
+              { name: "Contact", id: "/contact" },
+            ]}
+            brandName="24 Hours Health"
+          />
+        </div>
+        
+        <div className="pt-24">
+          <div id="appointment-form" data-section="contact">
+            <ContactSplitForm
+                title="Book an Appointment"
+                description="Please provide your details below and our team will get in touch to confirm your slot."
+                inputs={[
+                    { name: "fullName", type: "text", placeholder: "Full Name", required: true },
+                    { name: "email", type: "email", placeholder: "Email Address", required: true },
+                    { name: "phone", type: "tel", placeholder: "Phone Number", required: true },
+                    { name: "date", type: "date", placeholder: "Preferred Date", required: true }
+                ]}
+                textarea={{ name: "notes", placeholder: "Any specific concerns or requests?", rows: 4 }}
+                buttonText="Submit Request"
+                useInvertedBackground={false}
+            />
+          </div>
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterBase
+              columns={[
+                { title: "Quick Links", items: [{ label: "Home", href: "/" }, { label: "Appointment", href: "/appointment" }, { label: "Contact", href: "/contact" }] },
+              ]}
+              logoText="One Health Clinic"
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/contact/page.tsx

@@ -0,0 +1,61 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import ContactCTA from '@/components/sections/contact/ContactCTA';
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import FooterBase from '@/components/sections/footer/FooterBase';
+
+export default function ContactPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="text-stagger"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="rounded"
+        contentWidth="small"
+        sizing="mediumLargeSizeMediumTitles"
+        background="grid"
+        cardStyle="glass-elevated"
+        primaryButtonStyle="flat"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="extrabold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "About", id: "/#about" },
+              { name: "Services", id: "/#services" },
+              { name: "Appointment", id: "/appointment" },
+              { name: "Contact", id: "/contact" },
+            ]}
+            brandName="24 Hours Health"
+          />
+        </div>
+        
+        <div className="pt-24">
+            <div id="contact" data-section="contact">
+              <ContactCTA
+                  tag="Contact"
+                  title="Send Us a Message"
+                  description="Our team is ready to assist you with any medical queries or concerns."
+                  buttons={[{ text: "Submit" }]}
+                  background={{ variant: "radial-gradient" }}
+                  useInvertedBackground={false}
+              />
+            </div>
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterBase
+              columns={[
+                { title: "Quick Links", items: [{ label: "Home", href: "/" }, { label: "Appointment", href: "/appointment" }, { label: "Contact", href: "/contact" }] },
+              ]}
+              logoText="One Health Clinic"
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -30,22 +30,11 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleFullscreen
       navItems={[
-        {
-          name: "Home",
-          id: "hero",
-        },
-        {
-          name: "About",
-          id: "about",
-        },
-        {
-          name: "Services",
-          id: "services",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
+        { name: "Home", id: "/" },
+        { name: "About", id: "/#about" },
+        { name: "Services", id: "/#services" },
+        { name: "Appointment", id: "/appointment" },
+        { name: "Contact", id: "/contact" },
       ]}
       brandName="24 Hours Health"
     />
@@ -53,48 +42,17 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroBillboardRotatedCarousel
-      background={{
-        variant: "rotated-rays-animated",
-      }}
+      background={{ variant: "rotated-rays-animated" }}
       title="Healthcare That Never Sleeps"
       description="Providing quality 24-hour urgent care and specialized medical services when you need them most. We are always here for you."
-      buttons={[
-        {
-          text: "Book Appointment",
-          href: "#contact",
-        },
-      ]}
+      buttons={[{ text: "Book Appointment", href: "/appointment" }]}
       carouselItems={[
-        {
-          id: "1",
-          imageSrc: "http://img.b2bpic.net/free-photo/senior-people-writing-medical-report-papers-with-receptionist-before-checkup-appointment-with-physician-health-center-old-patients-signing-registration-form-files-insurance-support_482257-50675.jpg",
-          imageAlt: "Modern Clinic",
-        },
-        {
-          id: "2",
-          imageSrc: "http://img.b2bpic.net/free-photo/doctor-shows-viral-cell-laptop-screen_482257-119231.jpg",
-          imageAlt: "Medical Consultation",
-        },
-        {
-          id: "3",
-          imageSrc: "http://img.b2bpic.net/free-photo/empty-stomatology-orthodontist-hospital-cabinet-with-nobody-it_482257-10435.jpg",
-          imageAlt: "Diagnostic Room",
-        },
-        {
-          id: "4",
-          imageSrc: "http://img.b2bpic.net/free-photo/team-young-specialist-doctors-reviewing-documents-corridor-hospital_1303-21211.jpg",
-          imageAlt: "Medical Team",
-        },
-        {
-          id: "5",
-          imageSrc: "http://img.b2bpic.net/free-photo/hospital-letters_23-2147612302.jpg",
-          imageAlt: "Clinic Facade",
-        },
-        {
-          id: "6",
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-doctor-working-clinic_23-2150251801.jpg",
-          imageAlt: "Patient Care",
-        },
+        { id: "1", imageSrc: "http://img.b2bpic.net/free-photo/senior-people-writing-medical-report-papers-with-receptionist-before-checkup-appointment-with-physician-health-center-old-patients-signing-registration-form-files-insurance-support_482257-50675.jpg", imageAlt: "Modern Clinic" },
+        { id: "2", imageSrc: "http://img.b2bpic.net/free-photo/doctor-shows-viral-cell-laptop-screen_482257-119231.jpg", imageAlt: "Medical Consultation" },
+        { id: "3", imageSrc: "http://img.b2bpic.net/free-photo/empty-stomatology-orthodontist-hospital-cabinet-with-nobody-it_482257-10435.jpg", imageAlt: "Diagnostic Room" },
+        { id: "4", imageSrc: "http://img.b2bpic.net/free-photo/team-young-specialist-doctors-reviewing-documents-corridor-hospital_1303-21211.jpg", imageAlt: "Medical Team" },
+        { id: "5", imageSrc: "http://img.b2bpic.net/free-photo/hospital-letters_23-2147612302.jpg", imageAlt: "Clinic Facade" },
+        { id: "6", imageSrc: "http://img.b2bpic.net/free-photo/front-view-doctor-working-clinic_23-2150251801.jpg", imageAlt: "Patient Care" },
       ]}
     />
   </div>
@@ -103,9 +61,7 @@ export default function LandingPage() {
       <TextSplitAbout
       useInvertedBackground={false}
       title="Your Health, Our Commitment"
-      description={[
-        "At One Health Clinic, we believe healthcare shouldn't be limited by hours of the day. Our dedicated team of professionals offers 24/7 care to ensure you stay healthy and active whenever emergencies or health concerns arise.",
-      ]}
+      description={["At One Health Clinic, we believe healthcare shouldn't be limited by hours of the day. Our dedicated team of professionals offers 24/7 care to ensure you stay healthy and active whenever emergencies or health concerns arise."]}
     />
   </div>
 
@@ -115,36 +71,9 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={true}
       features={[
-        {
-          id: "1",
-          label: "24/7 Urgent Care",
-          title: "Emergency Ready",
-          items: [
-            "Immediate injury care",
-            "Acute illness relief",
-            "Expert triage services",
-          ],
-        },
-        {
-          id: "2",
-          label: "Diagnostics",
-          title: "In-House Lab",
-          items: [
-            "Quick blood analysis",
-            "Advanced imaging",
-            "Same-day result reports",
-          ],
-        },
-        {
-          id: "3",
-          label: "General Medicine",
-          title: "Wellness Care",
-          items: [
-            "Physical examinations",
-            "Preventative medicine",
-            "Chronic condition management",
-          ],
-        },
+        { id: "1", label: "24/7 Urgent Care", title: "Emergency Ready", items: ["Immediate injury care", "Acute illness relief", "Expert triage services"] },
+        { id: "2", label: "Diagnostics", title: "In-House Lab", items: ["Quick blood analysis", "Advanced imaging", "Same-day result reports"] },
+        { id: "3", label: "General Medicine", title: "Wellness Care", items: ["Physical examinations", "Preventative medicine", "Chronic condition management"] },
       ]}
       title="Comprehensive Care Services"
       description="We offer a wide range of specialized medical services catering to all your family's health needs."
@@ -157,30 +86,9 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       metrics={[
-        {
-          id: "1",
-          value: "15k+",
-          title: "Patients Served",
-          items: [
-            "Across all ages",
-          ],
-        },
-        {
-          id: "2",
-          value: "24/7",
-          title: "Availability",
-          items: [
-            "Available day and night",
-          ],
-        },
-        {
-          id: "3",
-          value: "98%",
-          title: "Patient Satisfaction",
-          items: [
-            "Based on feedback surveys",
-          ],
-        },
+        { id: "1", value: "15k+", title: "Patients Served", items: ["Across all ages"] },
+        { id: "2", value: "24/7", title: "Availability", items: ["Available day and night"] },
+        { id: "3", value: "98%", title: "Patient Satisfaction", items: ["Based on feedback surveys"] },
       ]}
       title="Clinical Excellence"
       description="We pride ourselves on our consistent record of quality patient care."
@@ -193,41 +101,11 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={true}
       testimonials={[
-        {
-          id: "1",
-          name: "Sarah J.",
-          role: "Patient",
-          testimonial: "The staff were incredibly attentive during my emergency visit at 3 AM. Highly recommended.",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-african-american-doctor-nursing-home_637285-11403.jpg",
-        },
-        {
-          id: "2",
-          name: "Michael R.",
-          role: "Patient",
-          testimonial: "Efficient services and a very warm atmosphere. So grateful they are always open.",
-          imageSrc: "http://img.b2bpic.net/free-photo/thank-you-happy-senior-tattooed-man-holding-hands-heart-smiling-being-flattered-touched-looking-heartfelt-pleased-by-something-standing-white-background_176420-45004.jpg",
-        },
-        {
-          id: "3",
-          name: "Anna & Leo",
-          role: "Patients",
-          testimonial: "We brought our children here after-hours and felt immediately reassured. Exceptional staff.",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-loving-senior-couple-looking-camera_23-2148196504.jpg",
-        },
-        {
-          id: "4",
-          name: "David W.",
-          role: "Patient",
-          testimonial: "Professional, quick, and very thorough diagnostic care. This is my go-to clinic now.",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-woman-therapy_23-2148928886.jpg",
-        },
-        {
-          id: "5",
-          name: "Elena M.",
-          role: "Patient",
-          testimonial: "Compassionate care is rare these days, but I found it here. Thank you for your support.",
-          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-nurses-talking_23-2148501139.jpg",
-        },
+        { id: "1", name: "Sarah J.", role: "Patient", testimonial: "The staff were incredibly attentive during my emergency visit at 3 AM. Highly recommended.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-african-american-doctor-nursing-home_637285-11403.jpg" },
+        { id: "2", name: "Michael R.", role: "Patient", testimonial: "Efficient services and a very warm atmosphere. So grateful they are always open.", imageSrc: "http://img.b2bpic.net/free-photo/thank-you-happy-senior-tattooed-man-holding-hands-heart-smiling-being-flattered-touched-looking-heartfelt-pleased-by-something-standing-white-background_176420-45004.jpg" },
+        { id: "3", name: "Anna & Leo", role: "Patients", testimonial: "We brought our children here after-hours and felt immediately reassured. Exceptional staff.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-loving-senior-couple-looking-camera_23-2148196504.jpg" },
+        { id: "4", name: "David W.", role: "Patient", testimonial: "Professional, quick, and very thorough diagnostic care. This is my go-to clinic now.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-woman-therapy_23-2148928886.jpg" },
+        { id: "5", name: "Elena M.", role: "Patient", testimonial: "Compassionate care is rare these days, but I found it here. Thank you for your support.", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-nurses-talking_23-2148501139.jpg" },
       ]}
       title="What Our Patients Say"
       description="Your recovery and trust are our highest rewards."
@@ -239,21 +117,9 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       faqs={[
-        {
-          id: "1",
-          title: "Are you truly open 24/7?",
-          content: "Yes, we have dedicated teams working round-the-clock to ensure medical assistance is always available.",
-        },
-        {
-          id: "2",
-          title: "Do I need an appointment?",
-          content: "Walk-ins are always welcome, though you may book an appointment online to minimize wait times.",
-        },
-        {
-          id: "3",
-          title: "Do you accept insurance?",
-          content: "We work with all major health insurance providers. Please check at reception for verification.",
-        },
+        { id: "1", title: "Are you truly open 24/7?", content: "Yes, we have dedicated teams working round-the-clock to ensure medical assistance is always available." },
+        { id: "2", title: "Do I need an appointment?", content: "Walk-ins are always welcome, though you may book an appointment online to minimize wait times." },
+        { id: "3", title: "Do you accept insurance?", content: "We work with all major health insurance providers. Please check at reception for verification." },
       ]}
       title="Frequently Asked Questions"
       description="Have questions about our services or hours? We have the answers."
@@ -264,54 +130,19 @@ export default function LandingPage() {
   <div id="contact" data-section="contact">
       <ContactCTA
       useInvertedBackground={true}
-      background={{
-        variant: "radial-gradient",
-      }}
+      background={{ variant: "radial-gradient" }}
       tag="Contact Us"
       title="Get In Touch Today"
       description="Need immediate assistance or have a question? Our doors are open 24/7."
-      buttons={[
-        {
-          text: "Contact Us",
-          href: "mailto:hello@onehealth.clinic",
-        },
-      ]}
+      buttons={[{ text: "Contact Us", href: "/contact" }]}
     />
   </div>
 
   <div id="footer" data-section="footer">
       <FooterBase
       columns={[
-        {
-          title: "Quick Links",
-          items: [
-            {
-              label: "About",
-              href: "#about",
-            },
-            {
-              label: "Services",
-              href: "#services",
-            },
-            {
-              label: "Contact",
-              href: "#contact",
-            },
-          ],
-        },
-        {
-          title: "Legal",
-          items: [
-            {
-              label: "Privacy Policy",
-              href: "#",
-            },
-            {
-              label: "Terms of Service",
-              href: "#",
-            },
-          ],
-        },
+        { title: "Quick Links", items: [{ label: "About", href: "/#about" }, { label: "Services", href: "/#services" }, { label: "Appointment", href: "/appointment" }, { label: "Contact", href: "/contact" }] },
+        { title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
       ]}
       logoText="One Health Clinic"
       copyrightText="© 2025 One Health Clinic. All rights reserved."
@@ -320,4 +151,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}