page doctor detail

2024-07-06 21:46:11 +03:30
parent 855f31eed8
commit 7315167325
12 changed files with 379 additions and 5 deletions
@@ -0,0 +1,43 @@
+'use client';
+import { Button } from "@mui/material";
+import { useState } from "react"
+
+const listLink = [
+    { name: 'درباره پزشک', link: 'about-doctor' },
+    { name: 'موقعیت مکانی ', link: 'location' },
+    { name: 'نظرات', link: 'comments' },
+]
+
+function Link() {
+
+    const [activeId, setActiveId] = useState(0);
+
+    return (
+        <ul className="flex items-center justify-start mt-[56px] mb-[32px]">
+            {listLink.map((item, idx) => (
+                <li
+                    key={idx}
+                    className={`
+
+                    `}
+                >
+                    <a href={`#${item.link}`}>
+                        <Button
+                            className={`
+                        !text-[20px] !font-bold !mx-[56px] !py-px
+                        ${idx !== 0 && idx !== listLink.length - 1 ?
+                                    'relative before:absolute before:right-[-56px] before:top-0 before:h-full before:w-px before:bg-[#BABABA] after:absolute after:left-[-56px] after:top-0 after:h-full after:w-px after:bg-[#BABABA]'
+                                    : ''}
+                        ${activeId === idx ? '!text-[#F17732]' : '!text-[#525252]'}
+                        `}
+                            variant="text">
+                            {item.name}
+                        </Button>
+                    </a>
+                </li>
+            ))}
+        </ul>
+    )
+}
+
+export default Link