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,47 @@
+import { Box, Tab, Tabs as TabsMUI } from '@mui/material';
+
+function a11yProps(index) {
+    return {
+        id: `simple-tab-${index}`,
+        'aria-controls': `simple-tabpanel-${index}`,
+    };
+};
+
+const listTab = ['درباره کلینیک', 'اطلاعات تماس', 'پزشک ها'];
+
+function Tabs({ value, handleChange }) {
+    return (
+        <Box
+            className="!border-none"
+        >
+            <TabsMUI
+                value={value}
+                onChange={handleChange}
+                sx={{
+                    '.MuiTabs-fixed': {
+                        overflow: 'auto !important'
+                    },
+                    '.MuiTabs-indicator': {
+                        height: '2px',
+                        borderRadius: '10px',
+                        background: '#F17732'
+                    },
+                    '& .mui-11pdt05-MuiButtonBase-root-MuiTab-root.Mui-selected': {
+                        color: '#F17732 !important'
+                    }
+                }}
+            >
+                {listTab.map((item, idx) => (
+                    <Tab
+                        key={idx}
+                        label={item}
+                        {...a11yProps(idx)}
+                        className="text-[#495057] !p-1 !text-[14px] md:!text-[16px] !font-bold !mr-2"
+                    />
+                ))}
+            </TabsMUI>
+        </Box>
+    )
+}
+
+export default Tabs