design and responsive page doctor and account

2024-08-30 11:59:53 +03:30
parent 707206450c
commit 451ae76cb1
15 changed files with 251 additions and 42 deletions
@@ -0,0 +1,51 @@
+'use client';
+
+import { Drawer, Modal } from "@mui/material";
+import { styleDefault } from "@/mui";
+import Content from "./Content";
+
+function ModalOpenLocation({ open, setOpen, handleClose, children }) {
+
+    const toggleDrawer = (newOpen) => () => {
+        setOpen(newOpen);
+    };
+
+    return (
+        <>
+            {/* Button Modal */}
+            {children}
+            {/* Content Modal */}
+            <Modal
+                open={open}
+                onClose={handleClose}
+                className="!hidden md:!flex"
+            >
+                <div
+                    style={styleDefault}
+                    className="!pt-[12px] !pb-[28px] !px-[24px] !bg-[#FAFAFA] !rounded-[8px] !overflow-hidden"
+                >
+                    <Content onClose={handleClose} />
+                </div>
+            </Modal>
+            <Drawer
+                open={open}
+                anchor="bottom"
+                onClose={toggleDrawer(false)}
+                className="!flex md:!hidden"
+                sx={{
+                    '& .MuiPaper-root': {
+                        borderRadius: '25px 25px 0px 0px'
+                    }
+                }}
+            >
+                <div
+                    className="!pt-[12px] !pb-[28px] !px-[24px] !bg-[#FAFAFA] !rounded-[8px] !overflow-hidden !shadow-[0px_1px_24.8px_0px_rgba(155,_155,_155,_0.27)]"
+                >
+                    <Content handleClose={handleClose} />
+                </div>
+            </Drawer>
+        </>
+    )
+}
+
+export default ModalOpenLocation