Initial commit: UP Parivaar Dallas site

2026-07-23 20:08:08 +05:30
commit 9a42e8b6e5
128 changed files with 8409 additions and 0 deletions
@@ -0,0 +1,108 @@
+import { Arrow } from "@/components/ui";
+
+export const metadata = { title: "Contact Us — UP Parivaar Dallas" };
+
+const info = [
+  {
+    label: "Phone Number",
+    value: "(555) 123-4567",
+    icon: (
+      <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.8">
+        <path d="M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6 19.8 19.8 0 0 1-3.1-8.7A2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8.1 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2Z" strokeLinecap="round" strokeLinejoin="round" />
+      </svg>
+    ),
+  },
+  {
+    label: "Email Address",
+    value: "info@upparivaar.com",
+    icon: (
+      <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.8">
+        <path d="M4 4h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2Z" />
+        <path d="m2 7 10 6 10-6" strokeLinecap="round" strokeLinejoin="round" />
+      </svg>
+    ),
+  },
+  {
+    label: "Office Hours",
+    value: (
+      <>
+        Monday–Friday: 8am – 6pm
+        <br />
+        Saturday: 9am – 3pm
+      </>
+    ),
+    icon: (
+      <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.8">
+        <circle cx="12" cy="12" r="9" />
+        <path d="M12 7v5l3 2" strokeLinecap="round" strokeLinejoin="round" />
+      </svg>
+    ),
+  },
+];
+
+export default function ContactPage() {
+  return (
+    <>
+      {/* HERO */}
+      <section className="page-glow page-hero--tight contactwrap">
+        <div className="container hero-center">
+          <span className="eyebrow">UP Parivar Dallas · Est. 2010</span>
+          <h1 className="display-title ts-34-46 contact-hero__title">Contact Us</h1>
+          <p className="contact-hero__sub">
+            Schedule a complimentary consultation with our community team.
+          </p>
+        </div>
+      </section>
+
+      {/* CONTACT CARD */}
+      <section className="contact-section">
+        <div className="container">
+          <div className="contact-card">
+            {/* Info panel */}
+            <div className="contact-info">
+              <div>
+                <h2 className="contact-info__title">Get In Touch</h2>
+              </div>
+              <p className="contact-info__text">
+                Reach out for events, membership, seva opportunities or partnership
+                queries. We&apos;re eager to help your family feel at home in Dallas!
+              </p>
+              <div className="contact-info__list">
+                {info.map((it) => (
+                  <div key={it.label} className="contact-info__item">
+                    <span className="contact-info__icon">{it.icon}</span>
+                    <div>
+                      <p className="contact-info__label">{it.label}</p>
+                      <p className="contact-info__value">{it.value}</p>
+                    </div>
+                  </div>
+                ))}
+              </div>
+            </div>
+
+            {/* Message form */}
+            <div className="contact-form">
+              <h2 className="contact-form__title">Send us a Message</h2>
+              <form className="contact-form__grid">
+                <input className="contact-input" type="text" placeholder="First Name" aria-label="First Name" />
+                <input className="contact-input" type="text" placeholder="Last Name" aria-label="Last Name" />
+                <input className="contact-input" type="email" placeholder="Email Address" aria-label="Email Address" />
+                <input className="contact-input" type="tel" placeholder="Phone Number" aria-label="Phone Number" />
+                <textarea
+                  className="contact-textarea contact-form__field--full"
+                  placeholder="Project / Message Details"
+                  aria-label="Message Details"
+                />
+                <div className="contact-form__field--full contact-form__actions">
+                  <button type="submit" className="btn-primary">
+                    Get a Free Consultation <Arrow />
+                  </button>
+                </div>
+              </form>
+            </div>
+          </div>
+        </div>
+      </section>
+    </>
+  );
+}