From 5c3e4ce7d88ca60dfa84390293a9ee0035cdc917 Mon Sep 17 00:00:00 2001 From: Christoph Haas Date: Sun, 22 Mar 2026 23:56:56 +0100 Subject: [PATCH] Use native HTML element for modals Replaced CSS-based modal with native HTML element. Cleaner code, better accessibility, built-in backdrop handling. --- frontend/src/routes/domains/+page.svelte | 92 ++++++++++++------------ 1 file changed, 46 insertions(+), 46 deletions(-) diff --git a/frontend/src/routes/domains/+page.svelte b/frontend/src/routes/domains/+page.svelte index deea550..d57a361 100644 --- a/frontend/src/routes/domains/+page.svelte +++ b/frontend/src/routes/domains/+page.svelte @@ -16,7 +16,7 @@ let domains = $state([]); let user = $state(null); let loading = $state(true); - let showModal = $state(false); + let dialogEl = $state(null); let newDomain = $state({ name: '' }); let createError = $state(''); @@ -48,6 +48,16 @@ } } + function openModal() { + createError = ''; + newDomain = { name: '' }; + dialogEl?.showModal(); + } + + function closeModal() { + dialogEl?.close(); + } + async function createDomain() { createError = ''; try { @@ -58,8 +68,7 @@ }); const data = await res.json(); if (res.ok) { - showModal = false; - newDomain = { name: '' }; + closeModal(); await loadData(); } else { createError = data.error || 'Failed to create domain'; @@ -93,7 +102,7 @@

Domains

{#if isAdmin()} - + {/if}
@@ -139,25 +148,22 @@ {/if} -{#if showModal} - - -{/if} + +

Add Domain

+
{ e.preventDefault(); createDomain(); }}> + + {#if createError} +

{createError}

+ {/if} +
+ + +
+
+