head page specialties

2024-07-09 19:27:38 +03:30
parent 3480e9997a
commit c6840d8b05
6 changed files with 73 additions and 3 deletions
@@ -1,10 +1,10 @@
 import DoctorsPage from '@/components/doctors';
 import Layout from '@/components/layout';
 import SpecialtiesPage from '@/components/specialties';
 function Doctors() {
    return (
        <Layout title='تخصص ها' name='specialties'>
-            <DoctorsPage />
+            <SpecialtiesPage />
        </Layout>
    )
 }
@@ -0,0 +1,42 @@
 import ArrowBottomD from '@/components/icons/ArrowBottomD'
 import SearchD from '@/components/icons/SearchD'
 import SettingD from '@/components/icons/SettingD'
 import { Button, ButtonGroup, TextField } from '@mui/material'
 import React from 'react'
 function SearchBar() {
    return (
        <ButtonGroup
            variant="contained"
            className="!bg-[#FFF] !w-2/3 !mt-[15px] !rounded-lg !overflow-hidden flex items-center !h-[64px] !shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)]"
        >
            <TextField
                variant="standard"
                InputProps={{
                    disableUnderline: true
                }}
                sx={{
                    '& .MuiInputBase-root': {
                        height: '100%'
                    },
                    '& .MuiInput-root': {
                        borderBottom: 'none',
                    },
                    '& .MuiInputBase-input': {
                        color: '#7E7E7E'
                    }
                }}
                placeholder="جستجوی تخصص"
                dir='rtl'
                className={`!shadow-none !w-full !px-5 !h-full bg-[#FAFAFA] !text-[14px] md:!text-[16px] !min-w-[50%] !rounded-0 !font-normal !text-[#6C757D]`}
            />
            <Button
                className="!rounded-[4px] !ml-1 !w-[56px] !h-[56px] !gap-2.5 !p-4"
            >
                <SearchD />
            </Button>
        </ButtonGroup>
    )
 }
 export default SearchBar
@@ -0,0 +1,13 @@
 import SearchBar from "./SearchBar"
 function Head() {
    return (
        <div className="pt-[195px] padding-responsive bg-[#F6F7F9] pb-[85px] flex flex-col items-center gap-[25px]">
            <p className="text-[#3B3B3B] text-[24px] text-center font-bold">تخصص مورد نظر شما چیست؟</p>
            <p className="text-[#3B3B3B] text-[16px] text-center font-normal">تخصص مورد نظرتان را جستجو کرده و یا از لیست زیر انتخاب نمایید:</p>
            <SearchBar />
        </div>
    )
 }
 export default Head
@@ -1,6 +1,12 @@
 import Head from "./head"
 import List from "./list"
 function SpecialtiesPage() {
    return (
-        <div>SpecialtiesPage</div>
+        <div className="">
            <Head />
            <List />
        </div>
    )
 }
@@ -0,0 +1,9 @@
 function List() {
    return (
        <ul className="grid grid-cols-6 gap-x-[24px gap-y-[40px] bg-[#FAFAFA]">
        </ul>
    )
 }
 export default List;