Files

48 lines
1.7 KiB
JavaScript

import AnimationTextHead from "@/app/component/AnimationTextHead";
import UnderlineLG from "../icons/UnderlineLG";
import TickOrangeA from "../icons/TickOrangeA";
const ourServices = [
{ text: "جستجوی سریع پزشک" },
{ text: "جستجوی کلینیک و مراکز درمانی" },
{ text: "نوبت‌گیری راحت و آسان" },
{ text: "داشبورد تخصصی بیمار", link: "https://clinic-pro.ir/" },
{ text: "داشبورد تخصصی پزشک", link: "https://clinic-pro.ir/" },
{ text: "پشتیبانی و یادآوری نوبت" },
];
function Services() {
return (
<div className="mt-[16px] sm:mt-[24px] md:mt-[32px] lg:mt-[40px] px-[16px] sm:px-[12%]">
<div className="flex justify-center">
<AnimationTextHead text="خدمات ما">
<UnderlineLG />
</AnimationTextHead>
</div>
<ul
className="mt-[20px] sm:mt-[26px] md:mt-[33px] lg:mt-[40px] flex flex-wrap gap-x-[72px] gap-y-[20px] sm:gap-y-[32px] md:gap-y-[44px] lg:gap-y-[56px] lg:grid lg:grid-cols-3"
>
{ourServices.map((item, idx) => (
<li key={idx} className="flex items-start justify-start gap-[8px]">
<TickOrangeA />
{item.link ? (
<a
href={item.link}
target="_blank"
rel="noopener noreferrer"
className="text-[#525252] text-[16px] font-medium hover:text-[#F17732] transition-colors"
>
{item.text}
</a>
) : (
<p className="text-[#525252] text-[16px] font-medium">{item.text}</p>
)}
</li>
))}
</ul>
</div>
);
}
export default Services;