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,55 @@
+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-[30px] !rounded-lg !overflow-hidden flex items-center !h-[64px] !shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)]"
+        >
+            <Button
+                className="!border-none !min-w-[122px] !h-[64px] !px-2 !bg-[#F8F8FF] !rounded-l-none"
+                variant="contained"
+                color="secondary"
+            >
+                <div className="min-w-[20px] min-h-[20px]">
+                    <SettingD />
+                </div>
+                <p className="text-[#616161] text-[16px] font-medium mx-2">فیلترها</p>
+                <div className='min-w-[24px]'>
+                    <ArrowBottomD />
+                </div>
+            </Button>
+            <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 !min-w-[56px] !min-h-[56px] !gap-2.5 !p-4"
+            >
+                <SearchD />
+            </Button>
+        </ButtonGroup>
+    )
+}
+
+export default SearchBar