51 lines
1.6 KiB

import React, { useState } from "react";
import Button from "../Button";
import Tabbar from "../Tabbar";
const Modal = ({ activeTab }) => {
const [openModal, setOpenModal] = useState(false);
return (
<div>
<Button
className={`bg-[#046AE8] text-white rounded-md px-2 py-2 text-sm`}
iconHolderClassName={"bg-transparent mr-1"}
iconClassName={"w-5"}
icon={"images/blue-edit-icon.svg"}
text={"ویرایش"}
onClick={() => setOpenModal(true)}
/>
<div
className={`cursor-pointer w-screen h-screen flex items-center justify-center bg-black fixed left-0 top-0 duration-300 transition-all
${openModal ? "opacity-90" : "opacity-0 pointer-events-none"}
`}
>
<div className="w-1/2 flex flex-col bg-white border border-gray-400 rounded-sm ">
<div
className="p-3 flex flex-col"
onClick={(e) => e.stopPropagation()}
>
<Button
className="w-fit p-1.5 self-end bg-[#D11B1B] rounded-sm mb-7"
text={false}
icon={"images/white-cancel.svg"}
iconHolderClassName={"mr-0"}
onClick={() => setOpenModal(false)}
/>
<Tabbar />
</div>
<div className="w-full flex flex-col items-end p-2 bg-[#e2dfdf]">
<Button
className="w-fit p-2 bg-[#3C58EA] text-white rounded-md text-sm"
text={"ذخیره و ثبت اطلاعات"}
iconHolderClassName={"mr-0"}
/>
</div>
</div>
</div>
</div>
);
};
export default Modal;