Add src/app/contact/page.tsx

src/app/contact/page.tsx

@@ -0,0 +1,133 @@
+"use client";
+
+import { Phone, MessageCircle, MapPin } from "lucide-react";
+import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
+import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
+import FooterCard from "@/components/sections/footer/FooterCard";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+
+export default function ContactPage() {
+  const handleFormSubmit = (data: Record<string, string>) => {
+    console.log("Form submitted:", data);
+  };
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="expand-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="mediumLarge"
+      sizing="largeSmallSizeMediumTitles"
+      background="none"
+      cardStyle="gradient-mesh"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="solid"
+      headingFontWeight="light"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarLayoutFloatingOverlay
+          brandName="School Uniforms & Textiles"
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Products", id: "products" },
+            { name: "Schools", id: "schools" },
+            { name: "Services", id: "/services" },
+            { name: "Contact", id: "/contact" },
+          ]}
+          button={{ text: "Call Now", href: "tel:+919876543210" }}
+        />
+      </div>
+
+      <div id="contact" data-section="contact">
+        <ContactSplitForm
+          title="Get In Touch With Us"
+          description="Have questions about our uniforms or services? We're here to help! Contact us using the form below or call us directly. Our team will respond within 2 hours."
+          inputs={[
+            {
+              name: "parentName",              type: "text",              placeholder: "Your Full Name",              required: true,
+            },
+            {
+              name: "phoneNumber",              type: "tel",              placeholder: "Phone Number (WhatsApp)",              required: true,
+            },
+            {
+              name: "email",              type: "email",              placeholder: "Email Address",              required: false,
+            },
+            {
+              name: "subject",              type: "text",              placeholder: "Subject of Inquiry",              required: true,
+            },
+          ]}
+          textarea={{
+            name: "message",            placeholder: "Tell us how we can help you...",            rows: 5,
+            required: true,
+          }}
+          useInvertedBackground={true}
+          imageSrc="http://img.b2bpic.net/free-photo/receiving-order_1098-21305.jpg?_wi=2"
+          imageAlt="Customer service team"
+          mediaAnimation="slide-up"
+          mediaPosition="right"
+          buttonText="Send Message"
+          onSubmit={handleFormSubmit}
+        />
+      </div>
+
+      <div className="bg-background py-20 px-6">
+        <div className="max-w-4xl mx-auto">
+          <h2 className="text-3xl font-bold text-foreground mb-12 text-center">Contact Information</h2>
+          
+          <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
+            <div className="bg-card rounded-lg p-8 text-center">
+              <div className="flex justify-center mb-4">
+                <Phone className="w-8 h-8 text-primary-cta" />
+              </div>
+              <h3 className="text-lg font-semibold text-foreground mb-2">Phone</h3>
+              <p className="text-foreground mb-2">Call us anytime</p>
+              <a href="tel:07702470459" className="text-primary-cta font-semibold hover:underline">
+                07702470459
+              </a>
+            </div>
+
+            <div className="bg-card rounded-lg p-8 text-center">
+              <div className="flex justify-center mb-4">
+                <MessageCircle className="w-8 h-8 text-primary-cta" />
+              </div>
+              <h3 className="text-lg font-semibold text-foreground mb-2">WhatsApp</h3>
+              <p className="text-foreground mb-2">Quick response via WhatsApp</p>
+              <a href="https://wa.me/919876543210" className="text-primary-cta font-semibold hover:underline" target="_blank" rel="noopener noreferrer">
+                Message on WhatsApp
+              </a>
+            </div>
+
+            <div className="bg-card rounded-lg p-8 text-center">
+              <div className="flex justify-center mb-4">
+                <MapPin className="w-8 h-8 text-primary-cta" />
+              </div>
+              <h3 className="text-lg font-semibold text-foreground mb-2">Location</h3>
+              <p className="text-foreground mb-2">Visit our store</p>
+              <a href="https://maps.google.com/?q=School+Uniforms+SR+Nagar" className="text-primary-cta font-semibold hover:underline" target="_blank" rel="noopener noreferrer">
+                SR Nagar, Hyderabad
+              </a>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterCard
+          logoText="School Uniforms & Textiles"
+          copyrightText="© 2025 School Uniforms & Textiles Store. All rights reserved. | Local Business in SR Nagar"
+          socialLinks={[
+            { icon: Phone, href: "tel:07702470459", ariaLabel: "Call us" },
+            {
+              icon: MessageCircle,
+              href: "https://wa.me/919876543210",              ariaLabel: "WhatsApp us"
+            },
+            {
+              icon: MapPin,
+              href: "https://maps.google.com/?q=School+Uniforms+SR+Nagar",              ariaLabel: "Visit our store location"
+            },
+          ]}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}