Skip to main content

Modal

export const App = () => {
const [open, setOpen] = React.useState(false);
return (
<div className="box-border">
<Button
onClick={() => {
setOpen(!open);
}}
>
بازکردن
</Button>
<Modal onClose={() => setOpen(false)} open={open}>
<Typography
color="gray900"
size="18"
className="text-right pt-8"
type="h3"
>
لغو درخواست بررسی پست!
</Typography>
<hr />
<Typography
color="gray700"
size="14"
className="text-justify pt-16 pb-8"
type="p"
>
آیا می‌خواهید بررسی پست «کسب و کار لعنتی! تجربه شیرین من در اجرای
جرقه‌های ذهنم» را لغو کنید؟
</Typography>
<div className="float-left">
<Button
onClick={() => {
setOpen(!open);
}}
type="secondary"
className="ml-8"
>
ادامه‌ٔ بررسی
</Button>
<Button
onClick={() => {
setOpen(!open);
}}
type="negative"
>
بله، لغو شود
</Button>
</div>
</Modal>
</div>
);
};