diff --git a/src/global.css b/src/global.css index 42ed6d7..e30f544 100644 --- a/src/global.css +++ b/src/global.css @@ -9,12 +9,6 @@ * { -webkit-tap-highlight-color: transparent; - -webkit-touch-callout: none; - -webkit-user-select: none; - -khtml-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; outline: none !important; font-family: JetBrainsMono; diff --git a/src/ui/Dialog.svelte b/src/ui/Dialog.svelte index fbd7a7d..eb3f02b 100644 --- a/src/ui/Dialog.svelte +++ b/src/ui/Dialog.svelte @@ -5,15 +5,46 @@ export let name = ""; export let class_name = ""; export let on_close = () => {}; + + let dialog; + let local_open = false; + + function toggle_dialog(_) { + if (is_open && local_open) { + dialog.showModal(); + document.addEventListener("keydown", (event) => { + if (event.key === "Escape") { + is_open = false; + } + }); + } else if (local_open === true) { + dialog.close(); + document.removeEventListener( + "keydown", + (event) => { + if (event.key === "Escape") { + is_open = false; + } + }, + true, + ); + } else if (!local_open) { + local_open = true; + } + } + + $: _ = toggle_dialog(is_open); -