alireza-hassaniandClaude Sonnet 5
f16b47966b
Next.js (App Router) clone of negindentalclinic.ir, wired to the Meshkee Website API (blog, contact form, favicon), with on-page SEO and a scroll-reveal animation sequence on the homepage. See context.md for full project context. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
99 lines
3.3 KiB
JavaScript
99 lines
3.3 KiB
JavaScript
import PageHero from "@/components/PageHero";
|
||
import ContactForm from "./ContactForm";
|
||
import styles from "./contact.module.css";
|
||
|
||
export const metadata = {
|
||
title: "تماس با ما",
|
||
description:
|
||
"راه‌های ارتباطی کلینیک دندانپزشکی نگین در قم: آدرس بلوار امین، تلفن ۰۲۵-۳۲۹۴۵۰۷۷ و فرم تماس آنلاین.",
|
||
};
|
||
|
||
const INFO = [
|
||
{
|
||
en: "Address",
|
||
fa: "آدرس",
|
||
value: "قم، بلوار امین، کوچه ۲۱، شماره ۵ (روبروی صدا و سیما)",
|
||
icon: (
|
||
<svg viewBox="0 0 24 24" width="22" height="22" fill="none" stroke="currentColor" strokeWidth="1.8">
|
||
<path d="M12 21s7-5.6 7-11a7 7 0 1 0-14 0c0 5.4 7 11 7 11z" />
|
||
<circle cx="12" cy="10" r="2.6" />
|
||
</svg>
|
||
),
|
||
},
|
||
{
|
||
en: "Phone",
|
||
fa: "تلفن تماس",
|
||
value: "۰۲۵ - ۳۲۹۴۵۰۷۷",
|
||
href: "tel:+982532945077",
|
||
ltr: true,
|
||
icon: (
|
||
<svg viewBox="0 0 24 24" width="22" height="22" fill="none" stroke="currentColor" strokeWidth="1.8">
|
||
<path d="M4 5c0-.6.4-1 1-1h3l2 5-2.5 1.5a12 12 0 0 0 5.5 5.5L18 18l5 2v3c0 .6-.4 1-1 1A17 17 0 0 1 4 5z" />
|
||
</svg>
|
||
),
|
||
},
|
||
{
|
||
en: "Email",
|
||
fa: "آدرس الکترونیکی",
|
||
value: "info@negindentalclinic.ir",
|
||
href: "mailto:info@negindentalclinic.ir",
|
||
icon: (
|
||
<svg viewBox="0 0 24 24" width="22" height="22" fill="none" stroke="currentColor" strokeWidth="1.8">
|
||
<rect x="3" y="5" width="18" height="14" rx="2" />
|
||
<path d="m4 7 8 6 8-6" />
|
||
</svg>
|
||
),
|
||
},
|
||
];
|
||
|
||
export default function ContactPage() {
|
||
return (
|
||
<>
|
||
<PageHero
|
||
en="Contact Us"
|
||
fa="ارتباط با ما"
|
||
lead="نظرات خود را با ما در میان بگذارید…"
|
||
/>
|
||
|
||
<section className="section">
|
||
<div className="container">
|
||
<h2 className="visually-hidden">راه‌های ارتباطی</h2>
|
||
<div className={styles.infoGrid}>
|
||
{INFO.map((i) => (
|
||
<article key={i.en} className={styles.infoCard}>
|
||
<span className={styles.infoIcon}>{i.icon}</span>
|
||
<span className="card__en">{i.en}</span>
|
||
<h3>{i.fa}</h3>
|
||
{i.href ? (
|
||
<a href={i.href} dir={i.ltr ? "ltr" : undefined}>
|
||
{i.value}
|
||
</a>
|
||
) : (
|
||
<p dir={i.ltr ? "ltr" : undefined}>{i.value}</p>
|
||
)}
|
||
</article>
|
||
))}
|
||
</div>
|
||
|
||
<div className={styles.formWrap}>
|
||
<div className="sec-head" style={{ marginBottom: 32 }}>
|
||
<span className="sec-head__en">Share your comments with us</span>
|
||
<h2 className="sec-head__fa">ارسال پیام</h2>
|
||
</div>
|
||
<ContactForm />
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section className={styles.mapSection}>
|
||
<iframe
|
||
title="نقشه کلینیک دندانپزشکی نگین"
|
||
src="https://www.google.com/maps?q=%D8%A8%D9%84%D9%88%D8%A7%D8%B1%20%D8%A7%D9%85%DB%8C%D9%86%20%D9%82%D9%85&output=embed"
|
||
loading="lazy"
|
||
referrerPolicy="no-referrer-when-downgrade"
|
||
/>
|
||
</section>
|
||
</>
|
||
);
|
||
}
|