Initial Sepehr Sanaat Next.js storefront with Meshkee catalog and SEO.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-08-14 17:33:49 +03:30
commit af22f753bf
137 changed files with 8759 additions and 0 deletions
@@ -0,0 +1,92 @@
+import type { Metadata } from "next";
+import { site } from "@/data/site";
+import { PageHeader } from "@/components/ui/PageHeader";
+import { Container } from "@/components/ui/Container";
+import { ContactForm } from "@/components/contact/ContactForm";
+import { MailIcon, MapPinIcon, PhoneIcon } from "@/components/icons";
+
+const mapQuery = encodeURIComponent(site.address);
+const mapEmbedSrc = `https://maps.google.com/maps?q=${mapQuery}&hl=fa&z=${site.map.zoom}&output=embed`;
+const mapLink = `https://www.google.com/maps/search/?api=1&query=${mapQuery}`;
+
+export const metadata: Metadata = {
+  title: "تماس با ما",
+  description: `${site.address} — تلفن ${site.phones.join(" و ")}`,
+  alternates: { canonical: "/contact" },
+};
+
+export default function ContactPage() {
+  return (
+    <>
+      <PageHeader
+        title="تماس با ما"
+        titleEn="CONTACT US"
+        description="در دسترس هستیم. در صورت نیاز به کمک سریع با ما تماس بگیرید."
+      />
+      <Container className="grid gap-8 py-10 lg:grid-cols-2">
+        <div className="rounded-xl border border-line bg-white p-6">
+          <h2 className="mb-5 text-lg font-extrabold text-navy">اطلاعات تماس</h2>
+          <ul className="space-y-5 text-[15px] leading-8">
+            <li className="flex gap-3">
+              <span className="mt-1 flex h-9 w-9 shrink-0 items-center justify-center rounded-lg bg-navy text-white">
+                <MapPinIcon className="h-4 w-4" />
+              </span>
+              <div>
+                <p className="text-xs font-bold text-navy">آدرس</p>
+                <p className="text-muted">{site.address}</p>
+              </div>
+            </li>
+            <li className="flex gap-3">
+              <span className="mt-1 flex h-9 w-9 shrink-0 items-center justify-center rounded-lg bg-navy text-white">
+                <PhoneIcon className="h-4 w-4" />
+              </span>
+              <div>
+                <p className="text-xs font-bold text-navy">تلفن</p>
+                <p className="text-navy">{site.phones.join(" — ")}</p>
+                <p className="text-sm text-muted">فکس: {site.fax}</p>
+              </div>
+            </li>
+            <li className="flex gap-3">
+              <span className="mt-1 flex h-9 w-9 shrink-0 items-center justify-center rounded-lg bg-navy text-white">
+                <MailIcon className="h-4 w-4" />
+              </span>
+              <div>
+                <p className="text-xs font-bold text-navy">ایمیل</p>
+                <div className="space-y-0.5 font-display text-sm tracking-wide">
+                  {site.emails.map((email) => (
+                    <p key={email}>
+                      <a href={`mailto:${email}`} className="text-muted hover:text-navy">
+                        {email}
+                      </a>
+                    </p>
+                  ))}
+                </div>
+              </div>
+            </li>
+          </ul>
+        </div>
+        <ContactForm />
+      </Container>
+      <Container className="pb-14">
+        <div className="overflow-hidden rounded-xl border border-line">
+          <iframe
+            title="موقعیت شرکت فنی مهندسی سپهر صنعت"
+            src={mapEmbedSrc}
+            className="h-[240px] w-full border-0 sm:h-[380px]"
+            loading="lazy"
+            referrerPolicy="no-referrer-when-downgrade"
+          />
+        </div>
+        <a
+          href={mapLink}
+          target="_blank"
+          rel="noreferrer"
+          className="mt-3 inline-flex items-center gap-2 text-sm font-bold text-brand hover:text-navy"
+        >
+          <MapPinIcon className="h-4 w-4" />
+          مشاهده در نقشه
+        </a>
+      </Container>
+    </>
+  );
+}