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()} - > -
-
); }; @@ -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 ( +
+
+ + + ); +}; + +export default Modal;