From ec5686770b7e8afb79ac8bda787813f7ccc25307 Mon Sep 17 00:00:00 2001 From: Chris Houseknecht Date: Thu, 9 Jan 2014 05:45:58 +0000 Subject: [PATCH] Fixed footer to always be 85px heigh and appear at the exact bottom of page when content does not fill entire page height. Prior to this the content area was fixed at 700px, which was a temporary hack. --- awx/ui/static/less/ansible-ui.less | 28 ++++++++++++--- awx/ui/templates/ui/index.html | 57 +++++++++++++++++------------- 2 files changed, 56 insertions(+), 29 deletions(-) diff --git a/awx/ui/static/less/ansible-ui.less b/awx/ui/static/less/ansible-ui.less index 65b99c6d4f..d082e2bb5e 100644 --- a/awx/ui/static/less/ansible-ui.less +++ b/awx/ui/static/less/ansible-ui.less @@ -29,9 +29,10 @@ @tip-background: #0088CC; @tip-color: #fff; +html, body { height: 100%; } html { - background-color: @black; + background-color: @white; } body { @@ -39,6 +40,12 @@ body { color: @black; } +/* Bootstrap fix that's causing a right margin to appear + whenver a modal is opened */ +body.modal-open { + margin-right: 0; +} + /* Helper Classes */ .pad-right-sm { padding-right: 10px; } @@ -299,11 +306,24 @@ dd { min-height: 15px; } -.main-container { - min-height: 700px; +/* footer variables */ +@footer-height: 85px; +@footer-margin: 60px; +@push-height: (@footer-height + @footer-margin); +@push-margin: 0px; +#wrap { + min-height: 100%; + height: 100%; + height: auto !important; + margin: 0 auto -(@push-height + @push-margin); +} +#push { + height: (@footer-height + @footer-margin); /* push height = footer height + footer padding */ + margin-bottom: (@footer-margin); } -.main-menu { +#navbar-container, .main-menu { + width: 100%; background-color: @black; } diff --git a/awx/ui/templates/ui/index.html b/awx/ui/templates/ui/index.html index d4977a99b3..5f9bbaa621 100644 --- a/awx/ui/templates/ui/index.html +++ b/awx/ui/templates/ui/index.html @@ -132,29 +132,32 @@ - - +
+ +
@@ -352,12 +355,16 @@
- +

working...

- + +
+ +
+