diff --git a/public/images/white-cancel.svg b/public/images/white-cancel.svg new file mode 100644 index 0000000..2e99890 --- /dev/null +++ b/public/images/white-cancel.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/src/components/Card/index.js b/src/components/Card/index.js index b98c5b1..7524923 100644 --- a/src/components/Card/index.js +++ b/src/components/Card/index.js @@ -2,19 +2,15 @@ import React, { useState } from "react"; import Button from "../Button"; import CircleInCircle from "../CircleInCircle"; - -import FormInput from "../FormInput"; +import Modal from "../Modal"; const ProcessCard = ({ processes, title, hint, buttons, options }) => { - const [openModal, setOpenModal] = useState(false); - console.log(openModal); - return ( - + {/* right */} {/* top */} - + {processes.map((process, index) => ( { ))} {/* middle */} - + {title} @@ -42,6 +38,7 @@ const ProcessCard = ({ processes, title, hint, buttons, options }) => { {/* bottom */} + {buttons.map((btn, index) => ( { {/* left */} - + {options.map((option, j) => ( { ))} - {/* modal */} - - e.stopPropagation()} - > - setOpenModal(false)} - /> - - - ); }; @@ -128,11 +104,6 @@ ProcessCard.defaultProps = { ], buttons: [ - { - title: "ویرایش", - className: "bg-[#046AE8] text-white", - icon: "images/blue-edit-icon.svg", - }, { title: "سوالات:", className: "border border-[#046AE8] text-[#046AE8]", diff --git a/src/components/Modal/index.js b/src/components/Modal/index.js new file mode 100644 index 0000000..ef25ff9 --- /dev/null +++ b/src/components/Modal/index.js @@ -0,0 +1,43 @@ +import React, { useState } from "react"; + +import Button from "../Button"; +import FormInput from "../FormInput"; + +const Modal = () => { + const [openModal, setOpenModal] = useState(false); + console.log(openModal); + + return ( + + setOpenModal(true)} + /> + + + e.stopPropagation()} + > + + + + + + ); +}; + +export default Modal;
@@ -42,6 +38,7 @@ const ProcessCard = ({ processes, title, hint, buttons, options }) => {