From 0fe49c13d5512a2a172c47f3497c0442d909a040 Mon Sep 17 00:00:00 2001
From: Arnaud Bos <arnaud.tlse@gmail.com>
Date: Wed, 2 Nov 2011 13:44:55 +0100
Subject: [PATCH] See #54. Move the flashing message to absolute positionning
 to avoid annoying shifting of the bills list.

---
 budget/templates/layout.html | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/budget/templates/layout.html b/budget/templates/layout.html
index c8f8df8..6ac0a3a 100644
--- a/budget/templates/layout.html
+++ b/budget/templates/layout.html
@@ -9,6 +9,8 @@
     {% block head %}{% endblock %}
     <script type="text/javascript" charset="utf-8">
         $(document).ready(function(){
+            var left = window.innerWidth/2-$('.flash').width()/2;
+            $(".flash").css({ "left": left+"px", "top":"45px" });
             setTimeout(function(){
                 $(".flash").fadeOut("slow", function () {
                     $(".flash").remove();
@@ -80,13 +82,13 @@
 <div class="container-fluid" style="height: 100%; padding-left: 10px;">
     {% block sidebar %}{% endblock %}
     <div class="content" style="margin-left: 250px;">
-    {% for message in get_flashed_messages() %}
-        <div class="flash alert-message info"><p>{{ message }}</p></div>
-    {% endfor %}
     {% block content %}
     {% endblock %}
     </div>
 </div>
+    {% for message in get_flashed_messages() %}
+        <div class="flash alert-message info" style="position:absolute;"><p>{{ message }}</p></div>
+    {% endfor %}
 {% endblock %}
 {% block footer %}
 <div id="footer">