Merge pull request #491 from jaredevantabor/footer

Directivize footer and make it sticky

awx/ui/client/legacy-styles/main-layout.less

@@ -7,13 +7,16 @@
  *
  */
 
-html, body { height: 100%; }
+html { height: 100%; }
 
 body {
     font-family: 'Open Sans', sans-serif;
     font-weight: 400;
     color: @black;
     padding-top: 58px;
+    min-height: 100%;
+    padding-bottom: 40px;
+    position: relative;
 }
 
 #main-menu-container {

awx/ui/client/src/app.js

@@ -67,6 +67,7 @@ import './shared/InventoryTree';
 import './shared/Socket';
 import './job-templates/main';
 import './shared/features/main';
+import './footer/main';
 
 
 /*#if DEBUG#*/
@@ -180,7 +181,8 @@ var tower = angular.module('Tower', [
     'AboutAnsibleHelpModal',
     'PortalJobsListDefinition',
     'features',
-    'longDateFilter'
+    'longDateFilter',
+    'footer'
 ])
 
     .constant('AngularScheduler.partials', urlPrefix + 'lib/angular-scheduler/lib/')

awx/ui/client/src/footer/footer.block.less

@@ -6,7 +6,7 @@
     color: #848992;
     width: 100%;
     z-index: 1040;
-    position: fixed;
+    position: absolute;
     right: 0;
     left: 0;
     bottom: 0;

awx/ui/client/src/footer/footer.directive.js

@@ -0,0 +1,16 @@
+/*************************************************
+ * Copyright (c) 2015 Ansible, Inc.
+ *
+ * All Rights Reserved
+ *************************************************/
+
+export default
+    ['templateUrl',
+        function(templateUrl) {
+            return {
+                restrict: 'E',
+                scope: true,
+                templateUrl: templateUrl('footer/footer')
+            };
+        }
+    ];

awx/ui/client/src/footer/footer.partial.html

@@ -0,0 +1,8 @@
+<footer class='Footer'>
+    <a href="http://www.ansible.com" target="_blank">
+        <div class="Footer-logo">
+            <img id="footer-logo" alt="Red Hat, Inc. | Ansible, Inc." class="Footer-logoImage" src="/static/assets/footer-logo.png">
+        </div>
+    </a>
+    <div class="Footer-copyright">Copyright &copy 2015 <a class="Footer-link" href="http://www.redhat.com" target="_blank">Red Hat</a>, Inc. All Rights Reserved.</div>
+</footer>

awx/ui/client/src/footer/main.js

@@ -0,0 +1,11 @@
+/*************************************************
+ * Copyright (c) 2015 Ansible, Inc.
+ *
+ * All Rights Reserved
+ *************************************************/
+
+import footerDirective from './footer.directive';
+
+export default
+    angular.module('footer', [])
+        .directive('towerFooter', footerDirective);

awx/ui/templates/ui/index.html

@@ -247,15 +247,7 @@
 </div>
 -->
 <div class="site-footer"></div>
-<footer class='Footer'>
+<tower-footer></tower-footer>
-    <a href="http://www.ansible.com" target="_blank">
-        <div class="Footer-logo">
-            <img id="footer-logo" alt="Red Hat, Inc. | Ansible, Inc." class="Footer-logoImage" src="/static/assets/footer-logo.png">
-        </div>
-    </a>
-    <div class="Footer-copyright">Copyright &copy 2015 <a class="Footer-link" href="http://www.redhat.com" target="_blank">Red Hat</a>, Inc. All Rights Reserved.</div>
-</footer>
-
   <script>
         // HACK: Need this to support global-dependent
         //  config-loading behavior
@@ -263,6 +255,5 @@
 
         require('app');
   </script>
-
 </body>
 </html>