2.0 style changes

Right justified Account menu. Modified bootstrap menu collapse setting to force collapse at 1075px so that we never show the menu on multiple lines. Started changing styles on job detail page so that we auto-resize behavior can be restored.

awx/ui/static/ansible-bootstrap/variables.less

@@ -296,7 +296,8 @@
 @grid-gutter-width:         30px;
 // Navbar collapse
 //** Point at which the navbar becomes uncollapsed.
-@grid-float-breakpoint:     @screen-sm-min;
+@grid-float-breakpoint:    1075px;  //CLH 6/24/14 - cause main navbar menu to collapse here and hopefully
+                                    // not show multi-line main menu
 //** Point at which the navbar begins collapsing.
 @grid-float-breakpoint-max: (@grid-float-breakpoint - 1);
 

awx/ui/static/js/helpers/JobDetail.js

@@ -812,7 +812,7 @@ function($rootScope, $log, UpdatePlayStatus, UpdateHostStatus, AddHostResult, Ge
             graph_data.push({
                 label: 'OK',
                 value: (scope.host_summary.ok === scope.host_summary.total) ? 1 : scope.host_summary.ok,
-                color: '#5bb75b'
+                color: '#00aa00'
             });
         }
         if (scope.host_summary.changed) {
@@ -833,7 +833,7 @@ function($rootScope, $log, UpdatePlayStatus, UpdateHostStatus, AddHostResult, Ge
             graph_data.push({
                 label: 'Failed',
                 value: (scope.host_summary.failed === scope.host_summary.total) ? 1 : scope.host_summary.failed,
-                color: '#DA4D49'
+                color: '#aa0000'
             });
         }
 

awx/ui/static/less/ansible-ui.less

@@ -20,7 +20,7 @@
 @info-color:   #3a87ad;
 @red:          #aa0000;   // Ansible Unreachable
 @red-hover:    #AE3F3A;
-@changed:      #aa5500;   // Ansible Changed
+@changed:      #FF9900;   // Ansible Changed
 @skipped:      #00aaaa;   // Ansible Skipped
 @warning:      #FF9900;
 @well:         #f5f5f5;   /* well background color */
@@ -1009,7 +1009,7 @@ input[type="checkbox"].checkbox-no-label {
 
   .icon-job-changed,
   .job-changed {
-      color: @warning;
+      color: @changed;
   }
 
   .icon-job-stopped,

awx/ui/static/less/job-details.less

@@ -1,23 +1,21 @@
 /*********************************************
  *  Copyright (c) 2014 AnsibleWorks, Inc.
- *  
+ *
  *  job-details.less
- *  
+ *
  *  Styles for job details page
  *
  */
 
-@failed-hosts-color:        #DA4D49;
-@successful-hosts-color:    #5bb75b;
-@changed-hosts-color:       #FF9900;
-@skipped-hosts-color:       #01BCC5;
+@failed-hosts-color:        @red;
+@successful-hosts-color:    @green;
+@changed-hosts-color:       @changed;
+@skipped-hosts-color:       @skipped;
 @unreachable-hosts-color:   #A9A9A9;
 
 
 #jobs-detail {
-    .nav-path {
-        margin-bottom: 20px;
-    }
+    margin-top: 20px;
 }
 
 .job_summary {
@@ -58,7 +56,7 @@
 .failed-hosts {
     background-color: @failed-hosts-color;
 }
-.failed-hosts-color { 
+.failed-hosts-color {
     color: @failed-hosts-color;
 }
 .successful-hosts {
@@ -85,11 +83,11 @@
 
 .job_well {
     padding: 8px;
-    background-color: @well;
+    background-color: @white;
     border: 1px solid @well-border;
     border-radius: 4px;
-    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
-            box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
+    /*-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
+            box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);*/
 }
 
 #hide-summary-button {
@@ -115,9 +113,8 @@
 .status-row {
      margin-bottom: 10px;
      .job-label {
-        font-weight: bold;   
-        font-size: 12px;
-     }   
+        font-weight: bold;
+     }
 }
 
 #job_options {
@@ -163,7 +160,7 @@
     font-size: 12px;
 }
 
-.table-detail { 
+.table-detail {
     overflow-x: hidden;
     overflow-y: auto;
     border: 1px solid @grey;
@@ -239,7 +236,7 @@
 #search_all_hosts_name {
     font-size: 14px;
     padding-left: 3px;
-    padding-right: 20px;      
+    padding-right: 20px;
 }
 
 #event-help-link {
@@ -265,7 +262,7 @@ label.small-label {
 }
 
 #task-hosts-section {
-    position: relative; 
+    position: relative;
     top: 0;
     left: 0;
     #hosts-table-detail {
@@ -328,7 +325,7 @@ label.small-label {
     .header {
         margin-top: 20px;
         .legend {
-            i { 
+            i {
                 margin-left: 10px
             }
             i:first-child {

awx/ui/static/less/main-layout.less

@@ -46,6 +46,7 @@ body {
     margin-bottom: 20px;
 }
 
+/*
 @media (min-width: 1200px) {
     #main-menu-container {
         #account-menu {
@@ -53,4 +54,4 @@ body {
             float: right;
         }
     }
-}
+}*/

awx/ui/static/partials/job_detail.html

@@ -144,7 +144,7 @@
                 <div class="job_well">
                     <div id="summary-well-top-section">
                         <div id="hide-summary-button" style="display: hidden;">
-                            <a href="" class="btn btn-xs btn-default" ng-click="toggleSummary('hide')" aw-tool-tip="Hide summary" data-placement="top"><i class="fa fa-arrow-circle-right fa-lg"></i></a>
+                            <a href="" class="btn btn-xs btn-primary" ng-click="toggleSummary('hide')" aw-tool-tip="Hide summary" data-placement="top"><i class="fa fa-arrow-circle-right fa-lg"></i></a>
                         </div>
                         <div id="summary-search-section" class="section">
                             <div class="header">

awx/ui/templates/ui/index.html

@@ -193,7 +193,7 @@
                         <li id="job_templates"><a href="#job_templates" id="main_job_templates_link">Job Templates</a></li>
                         <li id="jobs"><a href="#jobs" id="main_jobs_link">Jobs</a></li>
                     </ul>
-                    <ul class="nav navbar-nav" id="account-menu">
+                    <ul class="nav navbar-nav navbar-right" id="account-menu">
                         <li id="socket-beacon"></li>
                         <li class="dropdown">
                             <a href="" id="account-menu-link" data-toggle="dropdown">Account <span class="caret"></span></a>