upd
: modal konfirmasi Deskripsi: - button ya warna abu - button ya pindah ke kiri No Issues
This commit is contained in:
@@ -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>
|
||||
</>
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user