39 lines
947 B
Svelte
39 lines
947 B
Svelte
<script lang="ts">
|
|
type Props = {
|
|
action: () => void;
|
|
};
|
|
|
|
let { action }: Props = $props();
|
|
|
|
let dialog: HTMLDialogElement;
|
|
const openModal = () => {
|
|
dialog.showModal();
|
|
};
|
|
</script>
|
|
|
|
<button class="mb-24 rounded-md bg-red-400 p-2" onclick={openModal}>
|
|
Change mode
|
|
</button>
|
|
|
|
<dialog
|
|
open={false}
|
|
bind:this={dialog}
|
|
class="absolute left-0 top-0 z-50 m-0 h-full max-h-full w-full max-w-full p-0 open:bg-black/80"
|
|
>
|
|
<div class="flex h-full w-full flex-col items-center justify-center">
|
|
<h1 class="text-8xl text-red-600">THIS GONNA FUCK THINGS UP</h1>
|
|
<div class="flex items-center justify-center gap-6">
|
|
<button class="rounded-md bg-gray-400 p-4" onclick={() => dialog.close()}
|
|
>Close</button
|
|
>
|
|
<button
|
|
class="rounded-md bg-red-400 p-4"
|
|
onclick={() => {
|
|
action();
|
|
dialog.close();
|
|
}}>Change mode</button
|
|
>
|
|
</div>
|
|
</div>
|
|
</dialog>
|