diff --git a/ui/src/components/Toaster.svelte b/ui/src/components/Toaster.svelte
index 93c12ba..0399e88 100644
--- a/ui/src/components/Toaster.svelte
+++ b/ui/src/components/Toaster.svelte
@@ -2,7 +2,7 @@
  import { ToastsStore } from '../stores/toasts';
 </script>
 
-<div class="toast-container position-absolute top-0 end-0 p-3">
+<div class="toast-container position-fixed top-0 end-0 p-3">
     {#each $ToastsStore.toasts as toast}
         <div class="toast show" role="alert">
             <div class="toast-header">
diff --git a/ui/src/routes/auth.svelte b/ui/src/routes/auth.svelte
index b3a055c..47cb9ff 100644
--- a/ui/src/routes/auth.svelte
+++ b/ui/src/routes/auth.svelte
@@ -32,8 +32,8 @@
          .catch((response) => {
 	     pleaseWait = false;
 	     if (response.data)
-	         addToast({
-	             variant: "danger",
+                 ToastsStore.addToast({
+	             color: "danger",
 	             title: "Connexion impossible",
 	             msg: (response.data ? response.data.errmsg : "Impossible de contacter le serveur"),
 	         });