External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-05-23 08:37:48 -02:30
Code Issues Packages Projects Releases Wiki Activity

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.

Browse Source
This commit is contained in:
Chris Houseknecht
2014-01-09 05:45:58 +00:00
parent 9930c6d356
commit ec5686770b
2 changed files with 56 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
awx/ui/static/less/ansible-ui.less
View File

@@ -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;
}

9
awx/ui/templates/ui/index.html
View File

@@ -132,6 +132,9 @@
</head>
<body>
<div id="wrap">
<div id="navbar-container">
<div class="navbar navbar-inverse navbar-fixed-top main-menu" role="navigation">
<div class="container">
<div class="navbar-header">
@@ -154,7 +157,7 @@
</div><!-- nav-collapse -->
</div>
</div><!-- navbar -->
</div>
<div class="container main-container" id="main">
<div class="row">
@@ -358,6 +361,10 @@
<div class="overlay"></div>
<div class="spinny"><i class="fa fa-cog fa-spin fa-2x"></i> <p>working...</p></div>
<div id="push"></div>
</div><!-- wrap -->
<div class="site-footer">
<div class="container">
<div class="row">