Woah there! Are you sure you want to nuke that country?
In the event of total atomic annihilation, we can't save you, because we'll have to pretend we don't know you.
<div class="modal">
<div class="text">
<h2>Woah there! Are you sure you want to nuke that country?</h2>
<p>In the event of total atomic annihilation, we can't save you, because we'll have to pretend we don't know you.</p>
</div>
<div class="buttons">
<a href="#" class="button mono">
Nevermind
</a>
<a href="#" class="button error">
Delete that nation.
</a>
</div>
</div>
Supported statuses: Success, warning, error, info. Okay to omit.
import { Modal, Button } from '@cupid-ui/react';
// [...]
<Modal
title="Woah there! Are you sure you want to nuke that country?"
subtext="In the event of total atomic annihilation, we can't save you, because we'll have to pretend we don't know you."
>
<Button
title="Nevermind"
type="mono"
/>
<Button
title="Delete that nation"
type="error"
/>
</Modal>
title
: Must be a string
. The main text of the modal (eg. the notice being provided)subtext
: Must be a string
. The text below the notice (eg. blurb about what the modal's action will cause)<Modal></Modal>
(eg. <Button/>
for the modal to interact with)In the event of total atomic annihilation, we can't save you, because we'll have to pretend we don't know you.