page clinics & page clinic item head and tabs about

2024-08-12 06:31:40 +03:30
parent 697bde2f5d
commit f5ce58ef90
37 changed files with 1643 additions and 51 deletions
@@ -0,0 +1,9 @@
+import React from 'react'
+
+function Contact() {
+    return (
+        <div>Contact</div>
+    )
+}
+
+export default Contact
@@ -0,0 +1,9 @@
+import React from 'react'
+
+function Doctors() {
+    return (
+        <div>Doctors</div>
+    )
+}
+
+export default Doctors
@@ -0,0 +1,14 @@
+import React from 'react'
+
+function ContentDetail({ head, children }) {
+    return (
+        <div className='my-[24px]'>
+            <p className='text-[#3B3B3B] text-[20px] font-bold'>{head}</p>
+            <div className='mt-[16px]'>
+                {children}
+            </div>
+        </div>
+    )
+}
+
+export default ContentDetail
@@ -0,0 +1,47 @@
+import Image from 'next/image';
+
+function Images({ data }) {
+    return (
+        <div className='flex items-center mb-[8px] justify-center gap-[24px] w-full'>
+            <Image
+                className="rounded-[8px] overflow-hidden"
+                src={data.images_clinic[0]}
+                alt="img clinic"
+                height={432}
+                width={600}
+            />
+            <div className="grid grid-cols-2 gap-[24px]">
+                <Image
+                    className="rounded-[8px] overflow-hidden"
+                    src={data.images_clinic[1]}
+                    alt="img clinic"
+                    height={204}
+                    width={288}
+                />
+                <Image
+                    className="rounded-[8px] overflow-hidden"
+                    src={data.images_clinic[2]}
+                    alt="img clinic"
+                    height={204}
+                    width={288}
+                />
+                <Image
+                    className="rounded-[8px] overflow-hidden"
+                    src={data.images_clinic[3]}
+                    alt="img clinic"
+                    height={204}
+                    width={288}
+                />
+                <Image
+                    className="rounded-[8px] overflow-hidden"
+                    src={data.images_clinic[4]}
+                    alt="img clinic"
+                    height={204}
+                    width={288}
+                />
+            </div>
+        </div>
+    )
+}
+
+export default Images
@@ -0,0 +1,24 @@
+import Image from 'next/image'
+
+function ListBime({ data }) {
+    return (
+        <ul className='flex items-center justify-center gap-[24px]'>
+            {data.list_bime.map((item, idx) => (
+                <li
+                    key={idx}
+                    className='p-[16px] w-full border border-[#EFEFEF] flex flex-col items-center justify-center gap-[20px]'
+                >
+                    <Image
+                        src={item.img}
+                        height={92}
+                        width={92}
+                        alt='bime'
+                    />
+                    <p className='text-[#525252] text-[16px] font-medium'>{item.name}</p>
+                </li>
+            ))}
+        </ul>
+    )
+}
+
+export default ListBime
@@ -0,0 +1,23 @@
+import Image from "next/image"
+import Images from "./Images"
+import ContentDetail from "./ContentDetail"
+import ListBime from "./ListBime"
+
+function About({ data }) {
+    return (
+        <div>
+            <Images data={data} />
+            <ContentDetail head='کلینیک تخصصی و فوق تخصصی نیکان'>
+                <p
+                    className="text-[#525252] text-[16px] font-normal leading-[32px]"
+                    dangerouslySetInnerHTML={{ __html: data.caption }}
+                ></p>
+            </ContentDetail>
+            <ContentDetail head='بیمه های طرف قرارداد'>
+                <ListBime data={data} />
+            </ContentDetail>
+        </div>
+    )
+}
+
+export default About