Switch to version 3: added src/app/contact/page.tsx

2026-03-03 09:03:16 +00:00
parent 0b135c6795
commit cff8eb3b7e
1 changed files with 68 additions and 0 deletions
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -0,0 +1,68 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
+import ContactCenter from "@/components/sections/contact/ContactCenter";
+import FooterCard from "@/components/sections/footer/FooterCard";
+import { Phone, Facebook, Linkedin, Instagram } from "lucide-react";
+
+export default function ContactPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-bubble"
+      defaultTextAnimation="background-highlight"
+      borderRadius="rounded"
+      contentWidth="mediumLarge"
+      sizing="largeSmall"
+      background="circleGradient"
+      cardStyle="gradient-bordered"
+      primaryButtonStyle="double-inset"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarLayoutFloatingInline
+          brandName="PhysioMove"
+          navItems={[
+            { name: "Services", id: "services" },
+            { name: "Our Team", id: "team" },
+            { name: "Testimonials", id: "testimonials" },
+            { name: "FAQ", id: "faq" },
+            { name: "Contact", id: "/contact" }
+          ]}
+          button={{
+            text: "Book Appointment",            href: "#contact"
+          }}
+          animateOnLoad={true}
+        />
+      </div>
+
+      <div id="contact" data-section="contact" className="pt-32">
+        <ContactCenter
+          tag="Get In Touch"
+          title="Contact PhysioMove"
+          description="Have questions about our services? We're here to help. Reach out to us and we'll respond as soon as possible."
+          background={{ variant: "plain" }}
+          useInvertedBackground={false}
+          inputPlaceholder="Enter your email"
+          buttonText="Send Message"
+          termsText="We respect your privacy. Your information is safe with us."
+          onSubmit={(email) => console.log('Contact form submission:', email)}
+          className="py-20"
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterCard
+          logoText="PhysioMove"
+          copyrightText="© 2025 PhysioMove Physiotherapy | Johannesburg, South Africa"
+          socialLinks={[
+            { icon: Facebook, href: "https://facebook.com/physiomove", ariaLabel: "Facebook" },
+            { icon: Linkedin, href: "https://linkedin.com/company/physiomove", ariaLabel: "LinkedIn" },
+            { icon: Instagram, href: "https://instagram.com/physiomove", ariaLabel: "Instagram" }
+          ]}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}