diff --git a/ihatemoney/static/css/main.css b/ihatemoney/static/css/main.css index 9c8e2050..5964c50a 100644 --- a/ihatemoney/static/css/main.css +++ b/ihatemoney/static/css/main.css @@ -456,17 +456,8 @@ tr.payer_line .balance-name { margin-top: 10px; } -.messages { - display: flex; - justify-content: center; - position: absolute; - top: 4.5rem; - width: 100%; - pointer-events: none; -} - -.messages .alert { - pointer-events: auto; +.flash { + z-index: 1031; } .light { diff --git a/ihatemoney/templates/layout.html b/ihatemoney/templates/layout.html index 356801f9..f6c8f4a2 100644 --- a/ihatemoney/templates/layout.html +++ b/ihatemoney/templates/layout.html @@ -1,4 +1,22 @@ {% import "forms.html" as forms %} + +{% macro flash_messages(classes='') %} +{% with messages = get_flashed_messages(with_categories=true) %} +{% if messages %} +
+ {% for category, message in messages %} +
+ {{ message }} + +
+ {% endfor %} +
+{% endif %} +{% endwith %} +{% endmacro %} + @@ -120,16 +138,9 @@ {% endblock %} -
- {% for category, message in get_flashed_messages(with_categories=true) %} -
- {{ message }} - -
- {% endfor %} -
+ {% if not messages_shown %} + {{ flash_messages(classes="w-100 justify-content-center") }} + {% endif %} {% block footer %}