From dd89021cfbb344b6178c6db718d081a60bb286db Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Christian=20K=C3=B6nig?= <ckoenig@posteo.de>
Date: Thu, 2 Nov 2023 23:03:24 +0100
Subject: [PATCH] Fix notification animation
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Christian König <ckoenig@posteo.de>
---
 scripts/pi-hole/js/utils.js   | 4 ++++
 scripts/pi-hole/lua/header.lp | 2 +-
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/scripts/pi-hole/js/utils.js b/scripts/pi-hole/js/utils.js
index 15de336b..55dfca3d 100644
--- a/scripts/pi-hole/js/utils.js
+++ b/scripts/pi-hole/js/utils.js
@@ -93,6 +93,10 @@ function showAlert(type, icon, title, message) {
       type: type,
       delay: 5000, // default value
       mouse_over: "pause",
+      animate: {
+        enter: "animate__animated animate__fadeInDown",
+        exit: "animate__animated animate__fadeOutUp"
+      }
     };
   switch (type) {
     case "info":
diff --git a/scripts/pi-hole/lua/header.lp b/scripts/pi-hole/lua/header.lp
index 4417e652..8e41a0e8 100644
--- a/scripts/pi-hole/lua/header.lp
+++ b/scripts/pi-hole/lua/header.lp
@@ -89,11 +89,11 @@ is_authenticated = mg.request_info.is_authenticated
 
     <!-- Common styles -->
     <link rel="stylesheet" href="<?=pihole.fileversion('style/vendor/bootstrap/css/bootstrap.min.css')?>">
+    <link rel="stylesheet" href="<?=pihole.fileversion('style/vendor/animate.min.css')?>">
 <?
 if startsWith(scriptname, 'groups') then
     -- Group management styles
 ?>
-    <link rel="stylesheet" href="<?=pihole.fileversion('style/vendor/animate.min.css')?>">
     <link rel="stylesheet" href="<?=pihole.fileversion('style/vendor/bootstrap-select.min.css')?>">
     <link rel="stylesheet" href="<?=pihole.fileversion('style/vendor/bootstrap-toggle.min.css')?>">
 <? end ?>