From e2d0e3abd490c33acee444489ef9285aac1f7341 Mon Sep 17 00:00:00 2001
From: Tim Haasdyk <tim_haasdyk@sil.org>
Date: Mon, 6 Oct 2025 11:25:58 +0200
Subject: [PATCH] Make Lexbox notifications scroll if to tall And keep the
 close button in view. Using sticky is a bit weird, but fixed and absolute
 make things messy and this is only for edge cases.

---
 frontend/src/lib/notify/Notify.svelte | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/src/lib/notify/Notify.svelte b/frontend/src/lib/notify/Notify.svelte
index 233d459170..0a036ff273 100644
--- a/frontend/src/lib/notify/Notify.svelte
+++ b/frontend/src/lib/notify/Notify.svelte
@@ -8,16 +8,16 @@
 </script>
 
 {#if $notifications.length > 0}
-  <div class="toast toast-center prose z-20">
+  <div class="toast toast-center prose z-20 max-h-full">
     {#if $notifications.length > 1}
       <div class="flex justify-end" in:slide out:blur>
         <BadgeButton onclick={removeAllNotifications}>{$t('notify.close_all')}<span class="ml-2">✕</span></BadgeButton>
       </div>
     {/if}
     {#each $notifications as note (note)}
-      <div class="alert {note.category ?? ''}" in:slide out:blur>
+      <div class="alert {note.category ?? ''} overflow-y-auto" in:slide out:blur>
         {note.message}
-        <button onclick={() => removeNotification(note)} class="btn btn-circle btn-sm btn-ghost">✕</button>
+        <button onclick={() => removeNotification(note)} class="btn btn-circle btn-sm btn-ghost sticky top-0 bottom-0">✕</button>
       </div>
     {/each}
   </div>