changeset 149:f2f434eafb66

Always push the footer to the bottom of the page
author Benoît Allard <benoit.allard@greenbone.net>
date Fri, 31 Oct 2014 14:19:16 +0100
parents 3500cb0c54d1
children e0ae6b0b4a0f
files farol/static/style.css farol/templates/about.j2 farol/templates/layout.j2
diffstat 3 files changed, 30 insertions(+), 12 deletions(-) [+]
line wrap: on
line diff
--- a/farol/static/style.css	Fri Oct 31 14:18:47 2014 +0100
+++ b/farol/static/style.css	Fri Oct 31 14:19:16 2014 +0100
@@ -2,28 +2,50 @@
 .panel-title a, a.a-block {
     display: block;
 }
-/*
-// Try to push the footer to the bottom of the page
+
+/* Try to push the footer to the bottom of the page */
 html, body {
   height: 100%;
+  margin: 0;
+  padding: 0;
+}
+
+.cover {
+  min-height: 100%;
+  position: relative;
+}
+
+nav.navigation {
+  padding: 10px;
 }
 
 .main.container {
-  min-height: 100%;
-  margin-bottom: -50px;
+  padding: 10px;
+  padding-bottom: 140px; /* height of the footer + 10 */
 }
-*/
 
+.footer {
+  height 130px;
+  width: 100%;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+}
+/* And that works */
+
+/* Display a background image */
 @media (min-width: 768px){
   body {
     background: url('background.png') no-repeat fixed right bottom rgb(255,255,255);
   }
 }
 
+/* attenuate it */
 .cover {
   background: rgba(255,255,255,0.8);
 }
 
+/* For the POST_buttons */
 form.inlined-form {
   display: inline-block;
 }
@@ -33,11 +55,7 @@
   padding: 0;
 }
 
-.footer {
-  height: 130px;
-  margin-top: 20px;
-}
-
+/* Color when hovering, Ouh ... */
 #greenbone.logo_img {
   display: block;
   width: 100px;
--- a/farol/templates/about.j2	Fri Oct 31 14:18:47 2014 +0100
+++ b/farol/templates/about.j2	Fri Oct 31 14:19:16 2014 +0100
@@ -64,7 +64,7 @@
   {% endif %}
   <hr>
   <p><strong>Farol</strong> is published under GPLv2+, and is Copyright &copy; Greenbone Networks GmbH.</p>
-  <span class="text-muted pull-right"><small>SessionID: {{ session.get('id', '') }}</small></span>
+  {% if session.id %}<span class="text-muted pull-right"><small>SessionID: {{ session.id }}</small></span>{% endif %}
   <p class="text-muted"><small>Now running:
   {% for product, version in versions %}
     {{ product }}: <tt>{{ version }}</tt>{{ ' / '  if not loop.last }}
--- a/farol/templates/layout.j2	Fri Oct 31 14:18:47 2014 +0100
+++ b/farol/templates/layout.j2	Fri Oct 31 14:19:16 2014 +0100
@@ -70,7 +70,7 @@
         </div>{# /.navbar-collapse #}
       </div>{# /.container-fluid #}
     </nav>
-    <div class="container">
+    <div class="main container">
       {% block pre_content %}{% endblock %}
       <div>
         {% block content %}{% endblock %}

http://farol.wald.intevation.org