From 857ccad47105f7a5ab50074501673783b06541d2 Mon Sep 17 00:00:00 2001
From: Felix Hamann <felix.hamann@campus.lmu.de>
Date: Sat, 30 Jun 2018 21:24:13 +0200
Subject: [PATCH] alerts now slide in and -unimportant- ones hide automatically

---
 templates/standalone/alerts.julius |  7 +++++++
 templates/standalone/alerts.lucius | 18 ++++++++++++++++++
 2 files changed, 25 insertions(+)

diff --git a/templates/standalone/alerts.julius b/templates/standalone/alerts.julius
index ebf1f744d..00ac0156b 100644
--- a/templates/standalone/alerts.julius
+++ b/templates/standalone/alerts.julius
@@ -11,6 +11,13 @@
       alertEl.classList.add('alert--invisible');
     });
     alertEl.insertBefore(closeEl, alertEl.children[0]);
+
+    // auto-hide info and success-alerts after 3 seconds
+    if (!alertEl.matches('.alert-danger, .alert-warning')) {
+      window.setTimeout(function() {
+        alertEl.classList.add('alert--invisible');
+      }, 3000);
+    }
   }
 
 })();
diff --git a/templates/standalone/alerts.lucius b/templates/standalone/alerts.lucius
index 3c3b10fc1..8856a9b61 100644
--- a/templates/standalone/alerts.lucius
+++ b/templates/standalone/alerts.lucius
@@ -8,6 +8,14 @@
   display: flex;
   flex-direction: column;
 }
+
+@media (min-width: 768px) {
+
+  .alerts {
+    top: 150px;
+  }
+}
+
 .alert {
   position: relative;
   display: inline-block;
@@ -23,6 +31,7 @@
   margin-left: 20px;
   margin-right: 60px;
   box-shadow: 0 0 7px var(--color-dark);
+  animation: slide-in-alert .2s ease-out forwards;
 
   + .alert:not(.alert--invisible) {
     margin-top: 20px;
@@ -39,6 +48,15 @@
   }
 }
 
+@keyframes slide-in-alert {
+  from {
+    left: 120%;
+  }
+  to {
+    left: 0;
+  }
+}
+
 @media (min-width: 425px) {
 
   .alert {