create component elements & add page clinics && add url clinic

2024-08-08 22:00:09 +03:30
parent 57d33a532c
commit 01de360360
13 changed files with 440 additions and 0 deletions
@@ -0,0 +1,46 @@
+import ArrowLeftD from "@/components/icons/ArrowLeftD"
+import ClockClinic from "@/components/icons/ClockClinic"
+import LocationClinic from "@/components/icons/LocationClinic"
+import { Button } from "@mui/material"
+import Image from "next/image"
+import Link from "next/link"
+
+function ItemClinic({ data }) {
+    return (
+        <li className="p-4 relative bg-[#FFF] border border-solid border-[#EFEFEF] rounded-[8px]">
+            <div className="flex items-center justify-start gap-2">
+                <Image
+                    width={60}
+                    height={60}
+                    src={data.img}
+                    alt="img clinic"
+                />
+                <div className="flex flex-col items-start justify-center gap-2">
+                    <p className="text-[#3B3B3B] text-[14px] font-bold">{data.title}</p>
+                    <p className="text-[#7E7E7E] text-[14px] font-normal">{data.doctors} پزشک</p>
+                </div>
+            </div>
+            <div className="flex flex-col items-start mt-4 gap-4 mb-[14px]">
+                <div className="flex items-center justify-start gap-0.5">
+                    <LocationClinic />
+                    <p className="text-[#7E7E7E] text-[12px] font-normal">{data.location}</p>
+                </div>
+                <div className="flex items-center justify-start gap-0.5">
+                    <ClockClinic />
+                    <p className="text-[#7E7E7E] text-[12px] font-normal">ساعت کاری: {data.hours_of_work}</p>
+                </div>
+            </div>
+
+            {/* Arrow */}
+            <Link href={`/clinic/${data.id}`}>
+                <Button
+                    className='!p-[14px] !bg-[#5559CE] !absolute !left-4 !bottom-4  !rounded-full !w-fit'
+                >
+                    <ArrowLeftD />
+                </Button>
+            </Link>
+        </li>
+    )
+}
+
+export default ItemClinic