From a647ea01568f219fc7eae4c27fb87880bc446649 Mon Sep 17 00:00:00 2001
From: Graham Triggs <gtriggs@duraspace.org>
Date: Fri, 22 Sep 2017 23:41:54 +0100
Subject: [PATCH] Improved flash message handling

---
 webapp/src/main/webapp/js/vitroUtils.js                 | 4 +++-
 webapp/src/main/webapp/themes/vitro/css/vitroTheme.css  | 1 +
 webapp/src/main/webapp/themes/vitro/templates/flash.ftl | 4 ++--
 3 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/webapp/src/main/webapp/js/vitroUtils.js b/webapp/src/main/webapp/js/vitroUtils.js
index 2156515a0..0e5b37332 100644
--- a/webapp/src/main/webapp/js/vitroUtils.js
+++ b/webapp/src/main/webapp/js/vitroUtils.js
@@ -10,7 +10,9 @@ $(document).ready(function(){
     jQuery('section#welcome-message').css('display', 'block').delay(2000).fadeOut(1500, function() { jQuery('section#welcome-msg-container').remove(); });
     
     // fade in flash-message when user logs out
-    jQuery('section#flash-message').css('display', 'none').fadeIn(1500);
+    jQuery('section#flash-message').css('display', 'none').fadeIn(1500, function() {
+        $(this).delay(2000).fadeOut(1500, function() { jQuery('section#flash-msg-container').remove(); });
+    });
     
     /////////////////////////////
      // Home search filter
diff --git a/webapp/src/main/webapp/themes/vitro/css/vitroTheme.css b/webapp/src/main/webapp/themes/vitro/css/vitroTheme.css
index ec7abced4..a04606c4b 100644
--- a/webapp/src/main/webapp/themes/vitro/css/vitroTheme.css
+++ b/webapp/src/main/webapp/themes/vitro/css/vitroTheme.css
@@ -709,6 +709,7 @@ p.password-note {
     padding: .25em;
     margin-bottom: 8px;
 }
+#flash-msg-container,
 #welcome-msg-container {
     margin-bottom: 8px;
     margin-top: -10px;
diff --git a/webapp/src/main/webapp/themes/vitro/templates/flash.ftl b/webapp/src/main/webapp/themes/vitro/templates/flash.ftl
index 34cc71619..fc92131d6 100644
--- a/webapp/src/main/webapp/themes/vitro/templates/flash.ftl
+++ b/webapp/src/main/webapp/themes/vitro/templates/flash.ftl
@@ -6,8 +6,8 @@
         <section  id="welcome-message" role="alert">${flash}</section>
     </section>
     <#else>
-    <section id="flash-message" role="alert">
-    ${flash}
+    <section  id="flash-msg-container" role="container">
+        <section id="flash-message" role="alert">${flash}</section>
     </section>
     </#if>
 </#if>