hamid zarghami
54 lines
2.1 KiB
TypeScript
54 lines
2.1 KiB
TypeScript
import { Call, Location, MessageQuestion, Sms } from "iconsax-reactjs";
|
||
import { type FC, type ReactNode } from "react";
|
||
|
||
type ContactItemProps = {
|
||
icon: ReactNode;
|
||
children: ReactNode;
|
||
};
|
||
|
||
const ContactItem: FC<ContactItemProps> = ({ icon, children }) => {
|
||
return (
|
||
<div className="flex items-start gap-3">
|
||
<div className="flex size-9 shrink-0 items-center justify-center rounded-lg border border-primary text-primary">{icon}</div>
|
||
<div className="text-sm leading-6 text-[#3A4147]">{children}</div>
|
||
</div>
|
||
);
|
||
};
|
||
|
||
const FooterContact: FC = () => {
|
||
return (
|
||
<div className="flex max-w-none sm:max-w-[280px] flex-col gap-5">
|
||
<ContactItem icon={<Location size={18} color="currentColor" variant="Linear" />}>
|
||
جاده خاوران، شریف آباد، شهرک صنعتی شنزار، بعد از میدان چهارم، خیابان بوستان پنجم، خیابان گلبهار، پلاک ۱۲۲
|
||
</ContactItem>
|
||
|
||
<ContactItem icon={<Call size={18} color="currentColor" variant="Linear" />}>
|
||
<div className="flex flex-col gap-0.5">
|
||
<span>۰۲۱-۳۶۹۱۱۵۹۹ | ۰۲۱-۳۶۹۱۰۷۹۹</span>
|
||
<span>۰۲۱۳۴۷۸۲۰۰۰ (۳۰ خط)</span>
|
||
</div>
|
||
</ContactItem>
|
||
|
||
<ContactItem icon={<Sms size={18} color="currentColor" variant="Linear" />}>
|
||
<div className="flex flex-col gap-0.5">
|
||
<span className="font-bold text-[#0A1B2C]">پاسخگوی سوالات شما</span>
|
||
<a href="mailto:info@example.com" className="hover:text-primary" dir="ltr">
|
||
info@example.com
|
||
</a>
|
||
</div>
|
||
</ContactItem>
|
||
|
||
<ContactItem icon={<MessageQuestion size={18} color="currentColor" variant="Linear" />}>
|
||
<div className="flex flex-col gap-0.5">
|
||
<span>نیاز به راهنمایی دارید؟</span>
|
||
<a href="#" className="font-bold text-[#0A1B2C] hover:text-primary">
|
||
از طریق سوالات متداول پاسخ خود را پیدا کنید.
|
||
</a>
|
||
</div>
|
||
</ContactItem>
|
||
</div>
|
||
);
|
||
};
|
||
|
||
export default FooterContact;
|