From 936bbc28ac45675669a3bccf95bb24644fb812ca Mon Sep 17 00:00:00 2001
From: Felix Hamann <felix.hamann@campus.lmu.de>
Date: Sun, 16 Sep 2018 21:21:05 +0200
Subject: [PATCH] alerts and notifications refinements

---
 templates/default-layout.lucius    |  4 +--
 templates/dsgvDisclaimer.hamlet    |  1 -
 templates/dsgvDisclaimer.lucius    |  3 +--
 templates/standalone/alerts.julius |  2 +-
 templates/standalone/alerts.lucius | 39 +++---------------------------
 templates/widgets/asidenav.lucius  |  1 +
 6 files changed, 9 insertions(+), 41 deletions(-)

diff --git a/templates/default-layout.lucius b/templates/default-layout.lucius
index f55073584..96b838972 100644
--- a/templates/default-layout.lucius
+++ b/templates/default-layout.lucius
@@ -1,7 +1,7 @@
 :root {
   /* THEME INDEPENDENT COLORS */
-  --color-error: #ff3860;
-  --color-warning: #ffdd57;
+  --color-error: #8c0707;
+  --color-warning: #fc9900;
   --color-success: #23d160;
   --color-info: #c4c4c4;
   --color-lightblack: #1A2A36;
diff --git a/templates/dsgvDisclaimer.hamlet b/templates/dsgvDisclaimer.hamlet
index ca8ab35fe..4551b7c84 100644
--- a/templates/dsgvDisclaimer.hamlet
+++ b/templates/dsgvDisclaimer.hamlet
@@ -14,4 +14,3 @@
       Bitte melden Sie etwaige Probleme an #
         <a href="mailto:jost@tcs.ifi.lmu.de">
           jost@tcs.ifi.lmu.de
-
diff --git a/templates/dsgvDisclaimer.lucius b/templates/dsgvDisclaimer.lucius
index 96cf818dc..d92349d1d 100644
--- a/templates/dsgvDisclaimer.lucius
+++ b/templates/dsgvDisclaimer.lucius
@@ -3,10 +3,9 @@
   border-radius: 3px;
   padding: 10px 20px 20px;
   margin: 40px 0;
-  color: var(--color-lighter);
+  color: var(--color-dark);
   box-shadow: 0 0 4px 2px inset currentColor;
   padding-left: 20%;
-  color: #318dc5 ;
 
   &::before {
     content: 'i';
diff --git a/templates/standalone/alerts.julius b/templates/standalone/alerts.julius
index b3820f60a..28b3f7c29 100644
--- a/templates/standalone/alerts.julius
+++ b/templates/standalone/alerts.julius
@@ -6,7 +6,7 @@
   window.utils.alert = function(alertEl) {
     var closeEl = document.createElement('DIV');
     var dataDecay = alertEl.dataset.decay;
-    var autoDecay = 3;
+    var autoDecay = 30;
     if (dataDecay) {
       autoDecay = parseInt(dataDecay, 10);
     }
diff --git a/templates/standalone/alerts.lucius b/templates/standalone/alerts.lucius
index d8118762f..9501f1329 100644
--- a/templates/standalone/alerts.lucius
+++ b/templates/standalone/alerts.lucius
@@ -2,13 +2,13 @@
 /**
   .alert
     Regular Info Alert
-    Disappears automatically after 3 seconds
-    Disappears after x seconds if sepcified via data-decay='x'
+    Disappears automatically after 30 seconds
+    Disappears after x seconds if explicitly specified via data-decay='x' on html element
     Can be told not to disappear with data-decay='0'
 
   .alert-warning, .alert-error
     Warning or Error alert
-    Don't disappear, only difference is color
+    These don't disappear, only difference is color
     .alert-warning is orange regardless of user's selected theme
     .alert-error is red regardless of user's selected theme
 
@@ -23,20 +23,12 @@
   flex-direction: column;
 }
 
-@media (min-width: 768px) {
-
-  .alerts {
-    top: 150px;
-    bottom: auto;
-  }
-}
-
 .alert {
   position: relative;
   display: inline-block;
   background-color: var(--color-dark);
   font-size: 1rem;
-  color: #f3f3f3;
+  color: var(--color-lightwhite);
   z-index: 0;
   max-height: 200px;
   transition: all .3s ease-in-out;
@@ -116,8 +108,6 @@
   top: 0;
   width: 60px;
   height: 100%;
-  /* TODO: remove next line as soon as messagerenderer-error in julius gets resolved */
-  color: var(--color-dark);
   transition: all .3s ease;
   z-index: 40;
 
@@ -138,7 +128,6 @@
     top: 50%;
     left: 50%;
     display: flex;
-    color: rgba(255, 255, 255, 0.5);
     align-items: center;
     justify-content: center;
     transform: translate(-50%, -50%);
@@ -158,31 +147,11 @@
 
 .alert-warning {
   background-color: var(--color-warning);
-  color: var(--color-dark);
-
-  .alert__close {
-    color: var(--color-warning);
-
-    /* TODO: remove me as soon as messagerenderer-error in julius gets resolved */
-    &::before {
-      color: var(--color-dark);
-    }
-  }
 }
 
 .alert-danger,
 .alert-error {
   background-color: var(--color-error);
-  color: var(--color-lightwhite);
-
-  .alert__close {
-    color: var(--color-error);
-
-    /* TODO: remove me as soon as messagerenderer-error in julius gets resolved */
-    &::before {
-      color: var(--color-lightwhite);
-    }
-  }
 }
 
 .alert--invisible {
diff --git a/templates/widgets/asidenav.lucius b/templates/widgets/asidenav.lucius
index 3e0613284..37db31849 100644
--- a/templates/widgets/asidenav.lucius
+++ b/templates/widgets/asidenav.lucius
@@ -181,6 +181,7 @@
   width: 0;
   overflow: hidden;
   z-index: -1;
+  box-shadow: 0 0 13px rgba(0, 0, 0, 0.4);
 }
 
 @media (max-width: 425px) {