123 lines
5.3 KiB
JavaScript
123 lines
5.3 KiB
JavaScript
import { footerL, footerR } from "@/constans";
|
|
import Image from "next/image";
|
|
import Linkedin from "../icons/Linkedin";
|
|
import Telegram from "../icons/Telegram";
|
|
import Whatsapp from "../icons/Whatsapp";
|
|
import Instagram from "../icons/Instagram";
|
|
import Link from "next/link";
|
|
import LocationF from "../icons/LocationF";
|
|
import CalendarAddF from "../icons/CalendarAddF";
|
|
import StethoscopeF from "../icons/StethoscopeF";
|
|
|
|
const socialMedias = [
|
|
<Linkedin />,
|
|
<Telegram />,
|
|
<Whatsapp />,
|
|
<Instagram />
|
|
]
|
|
|
|
const head = [
|
|
{ icon: <LocationF />, text: 'جستجوی پزشک در شهر شما' },
|
|
{ icon: <CalendarAddF />, text: 'نوبت گیری سریع و آسان' },
|
|
{ icon: <StethoscopeF />, text: 'دشبورد اختصاصی برای پزشکان' }
|
|
]
|
|
|
|
const Namads = [
|
|
'/assets/images/footer-etehadie.png',
|
|
'/assets/images/footer-r.png',
|
|
'/assets/images/footer-namad.png'
|
|
]
|
|
|
|
function Footer() {
|
|
return (
|
|
<div>
|
|
<div className="flex items-center justify-center gap-[100px]">
|
|
{head.map((item, idx) => (
|
|
<div key={idx} className="flex items-center justify-start gap-1">
|
|
{item.icon}
|
|
<p className="text-[#2F2F2F] text-[16px] font-medium">{item.text}</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
<span className="h-px bg-[#D7D7D7] mb-[40px] mt-[48px] w-full block"></span>
|
|
<div className="pb-[60px] flex items-start justify-between">
|
|
{/* Right */}
|
|
<div className="flex gap-[30px] flex-col items-start">
|
|
{/* Icon */}
|
|
<div className="flex items-center justify-start gap-[5px]">
|
|
<Image
|
|
alt="logo"
|
|
width={30}
|
|
height={30}
|
|
src='/assets/images/logo.png'
|
|
/>
|
|
<p className="text-[#526CAC] text-[16px] font-bold font-kalame">نوبت ۷۲۴</p>
|
|
</div>
|
|
<p
|
|
className="text-[#616161] text-[14px] font-normal"
|
|
>724 یک وبسایت نوبت دهی آنلاین می باشد که<br /> بستری آسان برای پزشکان و بیماران فراهم کرده<br /> است. </p>
|
|
<ul className="flex items-center gap-3">
|
|
{Namads.map(src => (
|
|
<li>
|
|
<Image
|
|
alt="logo"
|
|
width={48}
|
|
height={48}
|
|
src={src}
|
|
/>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
|
|
{/* Center */}
|
|
<ul className="flex flex-col gap-3">
|
|
{footerR.map((item, idx) => (
|
|
<li
|
|
key={idx}
|
|
className={`
|
|
relative after:absolute after:right-0 after:h-0.5 after:bottom-0 after:w-0
|
|
${idx === 0 ? 'text-[#3B3B3B] after:hover:w-full after:transition-all after:hover:bg-[#F17732] font-bold pb-1.5' : 'text-[#616161] border-transparent font-normal'}
|
|
text-[16px] w-fit`}
|
|
>{item}</li>
|
|
))}
|
|
</ul>
|
|
<ul className="flex flex-col gap-3">
|
|
{footerL.map((item, idx) => (
|
|
<li
|
|
key={idx}
|
|
className={`
|
|
relative after:absolute after:right-0 after:h-0.5 after:bottom-0 after:w-0
|
|
${idx === 0 ? 'text-[#3B3B3B] after:hover:w-full after:transition-all after:hover:bg-[#F17732] font-bold pb-1.5' : 'text-[#616161] border-transparent font-normal'}
|
|
text-[16px] w-fit`}
|
|
>{item}</li>
|
|
))}
|
|
</ul>
|
|
|
|
{/* Left */}
|
|
<div className="flex flex-col justify-center gap-[50px]">
|
|
<p className="text-[#3B3B3B] w-fit text-[16px] after:hover:w-full after:transition-all after:hover:bg-[#F17732] font-bold pb-1.5 relative after:absolute after:right-0 after:h-0.5 after:bottom-0 after:w-0">
|
|
همراه با ما باشید:
|
|
</p>
|
|
<ul className="flex items-center gap-[15px]">
|
|
{socialMedias.map((item, idx) => (
|
|
<li
|
|
key={idx}
|
|
className="p-2.5 bg-[#EAECFA] rounded-full w-fit"
|
|
>
|
|
<Link
|
|
href='/'
|
|
className="min-h-fit"
|
|
>
|
|
{item}
|
|
</Link>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Footer |