diff --git a/src/lib/components/ui/Dialog.svelte b/src/lib/components/ui/Dialog.svelte
index f50a3e9..a485c00 100644
--- a/src/lib/components/ui/Dialog.svelte
+++ b/src/lib/components/ui/Dialog.svelte
@@ -25,7 +25,7 @@
 	let dialog = $state();
 	let local_open = false;
 
-	function toggle_dialog(/** @type {any} */_) {
+	function toggle_dialog() {
 		if (is_open && local_open) {
 			dialog.showModal();
 			document.addEventListener("keydown", (event) => {
@@ -49,7 +49,7 @@
 		}
 	}
 
-	let _ = $derived(toggle_dialog(is_open));
+	$effect(toggle_dialog)
 
 	let form = $state();
 </script>
@@ -65,7 +65,7 @@
 	bg-[#000000aa]
 	transition-all duration-300">
 	<div
-		class="w-[700px] h-[800px] mx-4 px-2 flex flex-col
+		class="w-[700px] h-auto mx-4 px-2 flex flex-col
 		border-[var(--w-border)] dark:border-[var(--b-border)] border-2 rounded-xl
 		bg-[var(--w-bg-second)] dark:bg-[var(--b-bg-second)]
 		text-[var(--w-text)] dark:text-[var(--b-text)] text-2xl
@@ -83,11 +83,11 @@
 					{name}
 				</p>
 			{/if}
-			<button class="size-[60px] m-2 pb-3">
+			<button class="size-[60px] m-2 pb-3"
 				onclick={() => {
 					is_open = false;
 					on_close();
-				}}
+				}}>
 				<img src={x} class="size-[40px] dark:invert" alt="x close img"/>
 			</button>
 		</div>