diff --git a/src/app/modal.module.css b/src/app/modal.module.css index 83af476..e123e09 100644 --- a/src/app/modal.module.css +++ b/src/app/modal.module.css @@ -1,18 +1,29 @@ .modal { + width: 100%; + height: 100%; + background: none; + border: none; +} + +.modal::backdrop { + background: rgba(0, 0, 0, 0.6); + backdrop-filter: blur(10px); +} + +.container { + position: fixed; width: 90%; height: 90%; margin-left: 5%; margin-right: 5%; top: 5%; + border-style: solid; border-width: 1px; border-color: black; padding: 20px; border-radius: 20px; -} - -.modal::backdrop { - background: rgba(0, 0, 0, 0.6); - backdrop-filter: blur(10px); + background-color: white; + overflow: auto; } .header { diff --git a/src/app/modal.tsx b/src/app/modal.tsx index 692eb3a..5afb9a2 100644 --- a/src/app/modal.tsx +++ b/src/app/modal.tsx @@ -7,6 +7,7 @@ import { ReactNode, MouseEvent, } from "react"; +import { ToastContainer } from "react-toastify"; import styles from "./modal.module.css"; interface Props { @@ -55,17 +56,31 @@ export default function Modal({ title, children, isOpen, handleClose }: Props) { onClose={handleClose} onClick={handleClickOutside} > -