: modal konfirmasi

Deskripsi:
- button ya warna abu
- button ya pindah ke kiri

No Issues
This commit is contained in:
amel
2025-01-15 14:42:49 +08:00
parent 772c58a1c2
commit 09e7a6c4f7

View File

@@ -1,6 +1,6 @@
import { Button, Flex, Modal, SimpleGrid, Text } from '@mantine/core';
import { useMediaQuery } from '@mantine/hooks';
import { BsQuestionCircleFill } from 'react-icons/bs';
import { IoIosWarning } from 'react-icons/io';
export default function LayoutModalNew({ opened, onClose, description, onYes, loading, onCheck }: { opened: boolean, onClose: () => void, loading?: boolean, description: string, onYes: (val: boolean) => void, onCheck: (val: boolean) => void }) {
const isMobile = useMediaQuery('(max-width: 768px)');
@@ -15,24 +15,20 @@ export default function LayoutModalNew({ opened, onClose, description, onYes, lo
}
}} opened={opened} onClose={onClose} withCloseButton={false} centered closeOnClickOutside={false}>
<Flex justify={"center"} align={"center"} direction={"column"}>
<BsQuestionCircleFill size={100} color="red" />
<Text mt={30} ta={"center"} fw={"bold"} fz={18}>{description}</Text>
<IoIosWarning size={130} color="red" />
<Text mt={20} ta={"center"} fw={"bold"} fz={18}>{description}</Text>
</Flex>
<Button mt={30} fullWidth size="lg" radius={'xl'} bg={'blue'} onClick={() => onCheck(true)}>Lihat Data</Button>
<SimpleGrid mt={10} cols={{ base: 1, sm: 2, lg: 2 }}>
{isMobile ?
<>
<Button loading={loading} fullWidth size="lg" radius={'xl'} bg={'green'} onClick={() => {
onYes(true)
}}>YA</Button>
<Button loading={loading} fullWidth size="lg" radius={'xl'} bg={'#dcdcdc'} c={'#858e96'} onClick={() => { onYes(true) }}>YA</Button>
<Button fullWidth size="lg" radius={'xl'} bg={'#F1C1CF'} c={'#D30B30'} onClick={() => onYes(false)}>TIDAK</Button>
</>
:
<>
<Button loading={loading} fullWidth size="lg" radius={'xl'} bg={'#dcdcdc'} c={'#858e96'} onClick={() => { onYes(true) }}>YA</Button>
<Button fullWidth size="lg" radius={'xl'} bg={'#F1C1CF'} c={'#D30B30'} onClick={() => onYes(false)}>TIDAK</Button>
<Button loading={loading} fullWidth size="lg" radius={'xl'} bg={'green'} onClick={() => {
onYes(true)
}}>YA</Button>
</>
}