From e2286676f1f4dc37c98afe5bcee1777949e48c08 Mon Sep 17 00:00:00 2001
From: Glandos <bugs-github@antipoul.fr>
Date: Wed, 13 Oct 2021 22:27:49 +0200
Subject: [PATCH] Flash messages must be dimissed manually

---
 ihatemoney/static/css/main.css   |  1 -
 ihatemoney/templates/layout.html | 17 ++++++-----------
 2 files changed, 6 insertions(+), 12 deletions(-)

diff --git a/ihatemoney/static/css/main.css b/ihatemoney/static/css/main.css
index 13af3675..d71c9bd3 100644
--- a/ihatemoney/static/css/main.css
+++ b/ihatemoney/static/css/main.css
@@ -469,7 +469,6 @@ tr.payer_line .balance-name {
   position: absolute;
   top: 4.5rem;
   width: 100%;
-  pointer-events: none;
 }
 
 .light {
diff --git a/ihatemoney/templates/layout.html b/ihatemoney/templates/layout.html
index bd5a412a..137c2a59 100644
--- a/ihatemoney/templates/layout.html
+++ b/ihatemoney/templates/layout.html
@@ -21,12 +21,6 @@
     {% block head %}{% endblock %}
     <script type="text/javascript" charset="utf-8">
         $(document).ready(function(){
-            setTimeout(function(){
-                $(".flash").fadeOut("slow", function () {
-                    $(".flash").remove();
-                });
-            }, 4000);
-
             $('.dropdown-toggle').dropdown();
             $('[data-toggle="tooltip"]').tooltip();
             {% block js %}{% endblock %}
@@ -128,11 +122,12 @@
 
   <div class="messages">
     {% for category, message in get_flashed_messages(with_categories=true) %}
-      {% if category == "message" %}{# Default category for flash(msg) #}
-        <div class="flash alert alert-success">{{ message }}</div>
-      {% else %}
-        <div class="flash alert alert-{{ category }}">{{ message }}</div>
-      {% endif %}
+      <div class="flash alert alert-{{ "success" if category == "message" else category }} alert-dismissible fade show">
+        {{ message }}
+        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
+          <span aria-hidden="true">&times;</span>
+        </button>
+      </div>
     {% endfor %}
   </div>