You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by al...@apache.org on 2016/10/27 16:32:09 UTC

ambari git commit: AMBARI-18720. Test and fix new tables styles on Ambari (part 2) (alexantonenko)

Repository: ambari
Updated Branches:
  refs/heads/trunk 097de987b -> 03014f0cd


AMBARI-18720. Test and fix new tables styles on Ambari (part 2) (alexantonenko)


Project: http://git-wip-us.apache.org/repos/asf/ambari/repo
Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/03014f0c
Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/03014f0c
Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/03014f0c

Branch: refs/heads/trunk
Commit: 03014f0cd8ce5105386ef35dce6a19924cf94875
Parents: 097de98
Author: Alex Antonenko <hi...@gmail.com>
Authored: Thu Oct 27 18:29:29 2016 +0300
Committer: Alex Antonenko <hi...@gmail.com>
Committed: Thu Oct 27 19:32:04 2016 +0300

----------------------------------------------------------------------
 ambari-web/app/styles/application.less          |  97 ++++----
 .../app/styles/theme/bootstrap-ambari.css       | 175 +++------------
 .../templates/common/configs/overrideWindow.hbs |  10 +-
 .../modal_popups/dependent_configs_list.hbs     |   4 +-
 ambari-web/app/templates/experimental.hbs       |  24 +-
 .../main/admin/stack_upgrade/services.hbs       |   3 +
 .../admin/stack_upgrade/upgrade_history.hbs     |  45 ++--
 ambari-web/app/templates/main/alerts.hbs        |  25 +--
 .../alerts/add_definition_to_group_popup.hbs    |  16 +-
 .../main/alerts/alert_definitions_actions.hbs   |  30 ++-
 .../main/alerts/definition_details.hbs          | 153 +++++++------
 .../templates/main/dashboard/config_history.hbs |   3 +
 ambari-web/app/templates/main/host.hbs          |  31 +--
 .../templates/main/host/bulk_operation_menu.hbs | 220 ++++++++++---------
 .../templates/main/host/combo_search_box.hbs    |  13 +-
 .../app/templates/main/host/host_alerts.hbs     |   3 +-
 ambari-web/app/templates/main/host/logs.hbs     |   3 +
 .../app/templates/main/host/stack_versions.hbs  |   3 +
 ambari-web/app/templates/wizard/step3.hbs       |  16 +-
 ambari-web/app/templates/wizard/step4.hbs       |  19 +-
 ambari-web/app/templates/wizard/step6.hbs       |   2 +-
 ambari-web/app/templates/wizard/step9.hbs       |   4 +-
 ambari-web/app/views/common/filter_view.js      |   2 +-
 .../dependent_configs_list_popup.js             |   2 +-
 .../main/admin/stack_upgrade/versions_view.js   |   3 +-
 .../app/views/main/alert_definitions_view.js    |  27 ++-
 .../alerts/alert_definitions_actions_view.js    |   2 +
 .../views/main/host/hosts_table_menu_view.js    |   2 +
 28 files changed, 422 insertions(+), 515 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/styles/application.less
----------------------------------------------------------------------
diff --git a/ambari-web/app/styles/application.less b/ambari-web/app/styles/application.less
index a33b6bb..798d80f 100644
--- a/ambari-web/app/styles/application.less
+++ b/ambari-web/app/styles/application.less
@@ -1672,11 +1672,11 @@ a:focus {
   -moz-border-radius: 0;
 }
 .submenu-left {
-  &> .dropdown-menu-wrap {
+  > .dropdown-menu-wrap {
     position: relative;
     width: 100%;
     left: -100%;
-    &> .dropdown-menu {
+    > .dropdown-menu {
       position: absolute;
       top: 0;
       right: -10px;
@@ -1684,8 +1684,10 @@ a:focus {
     }
   }
   &:hover {
-    .dropdown-menu {
-      display: inline-block;
+    > .dropdown-menu-wrap {
+      > .dropdown-menu {
+        display: inline-block;
+      }
     }
   }
 }
@@ -3353,9 +3355,6 @@ table.graphs {
       margin-bottom: 10px;
       margin-top: -5px;
     }
-    .hosts-actions {
-      margin-right: 10px;
-    }
     .health-status-bar {
       font-size: 0.9em;
       margin-left: 0;
@@ -3406,8 +3405,8 @@ table.graphs {
     .col0,.col1,
     td:first-child,
     th:first-child,
-    td:first-child + td,
-    th:first-child + th{
+    td:last-child,
+    th:last-child {
       padding-left: 4px!important;
       padding-right: 1px!important;
       padding-right: 10px\9!important;
@@ -3418,58 +3417,58 @@ table.graphs {
       }
     }
     .col2,
-    td:first-child + td + td,
-    th:first-child + th + th{
+    td:first-child + td,
+    th:first-child + th{
       width: 20%;
       padding-right: 1px;
     }
     .col3, .col4,
+    td:first-child + td + td,
+    th:first-child + th + th,
     td:first-child + td + td + td,
-    th:first-child + th + th + th,
-    td:first-child + td + td + td + td,
-    th:first-child + th + th + th + th{
+    th:first-child + th + th + th{
       padding-left: 1px!important;
       padding-right: 1px!important;
       width: 1.5%;
       width: 13px\9!important;
     }
     .col5,
-    td:first-child + td + td + td + td + td,
-    th:first-child + th + th + th + th + th {
+    td:first-child + td + td + td + td,
+    th:first-child + th + th + th + th {
       width: 10%!important;
     }
     .col6,
-    td:first-child + td + td + td + td + td + td,
-    th:first-child + th + th + th + th + th + th {
+    td:first-child + td + td + td + td + td,
+    th:first-child + th + th + th + th + th {
       width: 13%!important;
     }
     .col7,
-    td:first-child + td + td + td + td + td + td + td,
-    th:first-child + th + th + th + th + th + th + th{
+    td:first-child + td + td + td + td + td + td,
+    th:first-child + th + th + th + th + th + th{
       width: 5%!important;
     }
 
     .col8,
-    td:first-child + td + td + td + td + td + td + td + td,
-    th:first-child + th + th + th + th + th + th + th + th{
+    td:first-child + td + td + td + td + td + td + td,
+    th:first-child + th + th + th + th + th + th + th{
       width: 6%!important;
     }
 
     .col9,
-    td:first-child + td + td + td + td + td + td + td + td + td,
-    th:first-child + th + th + th + th + th + th + th + th + th{
+    td:first-child + td + td + td + td + td + td + td + td,
+    th:first-child + th + th + th + th + th + th + th + th{
       width: 9%!important;
     }
 
     .col10,
-    td:first-child + td + td + td + td + td + td + td + td + td + td,
-    th:first-child + th + th + th + th + th + th + th + th + th + th{
+    td:first-child + td + td + td + td + td + td + td + td + td,
+    th:first-child + th + th + th + th + th + th + th + th + th{
       width: 9%!important;
     }
 
     .col11,
-    td:first-child + td + td + td + td + td + td + td + td + td + td + td,
-    th:first-child + th + th + th + th + th + th + th + th + th + th +th{
+    td:first-child + td + td + td + td + td + td + td + td + td + td,
+    th:first-child + th + th + th + th + th + th + th + th + th +th{
       width: 11%!important;
       a {
         word-wrap: break-word;
@@ -3477,8 +3476,8 @@ table.graphs {
     }
 
     .col12,
-    td:first-child + td + td + td + td + td + td + td + td + td + td + td + td,
-    th:first-child + th + th + th + th + th + th + th + th + th + th + th +th{
+    td:first-child + td + td + td + td + td + td + td + td + td + td + td,
+    th:first-child + th + th + th + th + th + th + th + th + th + th +th{
       width: 11%!important;
     }
 
@@ -3804,10 +3803,6 @@ table.graphs {
     padding-left: 17px;
   }
 
-  .box-header .button-section {
-    margin-bottom: 5px;
-  }
-
   hr {
     margin-bottom: 0;
     clear: both;
@@ -4966,8 +4961,8 @@ ul.list-inline li {
   #hosts {
     .table {
       .col2,
-      td:first-child + td + td,
-      th:first-child + th + th {
+      td:first-child + td,
+      th:first-child + th {
         width: 15%!important;
 
         .filter-input-width{
@@ -4976,45 +4971,45 @@ ul.list-inline li {
       }
 
       .col4,
-      td:first-child + td + td + td + td,
-      th:first-child + th + th + th + th{
+      td:first-child + td + td + td,
+      th:first-child + th + th + th{
         width: 1.4%;
       }
 
       .col5,
-      td:first-child + td + td + td + td + td,
-      th:first-child + th + th + th + th + th {
+      td:first-child + td + td + td + td,
+      th:first-child + th + th + th + th {
         width: 11.7%!important;
       }
 
       .col6,
-      td:first-child + td + td + td + td + td + td,
-      th:first-child + th + th + th + th + th + th{
+      td:first-child + td + td + td + td + td,
+      th:first-child + th + th + th + th + th{
         width: 9%!important;
       }
 
       .col7,
-      td:first-child + td + td + td + td + td + td + td,
-      th:first-child + th + th + th + th + th + th + th{
+      td:first-child + td + td + td + td + td + td,
+      th:first-child + th + th + th + th + th + th{
         width: 9%!important;
       }
 
       .col8,
-      td:first-child + td + td + td + td + td + td + td + td,
-      th:first-child + th + th + th + th + th + th + th + th{
+      td:first-child + td + td + td + td + td + td + td,
+      th:first-child + th + th + th + th + th + th + th{
         width: 9%!important;
       }
       .col9,
-      td:first-child + td + td + td + td + td + td + td + td + td,
-      th:first-child + th + th + th + th + th + th + th + th + th{
+      td:first-child + td + td + td + td + td + td + td + td,
+      th:first-child + th + th + th + th + th + th + th + th{
         width: 9%!important;
       }
       .col11,
       .col12,
+      td:first-child + td + td + td + td + td + td + td + td + td + td,
+      th:first-child + th + th + th + th + th + th + th + th + th +th,
       td:first-child + td + td + td + td + td + td + td + td + td + td + td,
-      th:first-child + th + th + th + th + th + th + th + th + th + th +th,
-      td:first-child + td + td + td + td + td + td + td + td + td + td + td + td,
-      th:first-child + th + th + th + th + th + th + th + th + th + th + th +th{
+      th:first-child + th + th + th + th + th + th + th + th + th + th +th{
         width: 11.2%!important;
       }
       td.name .trim_hostname{

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/styles/theme/bootstrap-ambari.css
----------------------------------------------------------------------
diff --git a/ambari-web/app/styles/theme/bootstrap-ambari.css b/ambari-web/app/styles/theme/bootstrap-ambari.css
index e573c43..acc487e 100644
--- a/ambari-web/app/styles/theme/bootstrap-ambari.css
+++ b/ambari-web/app/styles/theme/bootstrap-ambari.css
@@ -415,6 +415,12 @@ h2.table-title {
 .table.table-hover > tbody > tr:hover > td .action {
   visibility: visible;
 }
+.table.table-hover > tbody > tr:first-of-type > td {
+  border-top: 1px solid transparent;
+}
+.table.table-hover > tbody > tr:first-of-type:hover > td {
+  border-color: #A7DFF2;
+}
 .wizard .wizard-header h3 {
   font-family: 'Roboto', sans-serif;
   font-weight: normal;
@@ -422,14 +428,21 @@ h2.table-title {
   line-height: 1;
   font-size: 20px;
   color: #333;
-  margin: 20px 30px;
+  margin: 15px 20px;
 }
 .wizard .wizard-body {
-  background-color: #ebecf1;
+  background: #ebecf1;
+  /* Old browsers */
+  background: -moz-linear-gradient(to right, #323544 0%, #323544 24.9%, #ebecf1 25%, #ebecf1 100%);
+  /* FF3.6-15 */
+  background: -webkit-linear-gradient(to right, #323544 0%, #323544 24.9%, #ebecf1 25%, #ebecf1 100%);
+  /* Chrome10-25,Safari5.1-6 */
+  background: linear-gradient(to right, #323544 0%, #323544 24.9%, #ebecf1 25%, #ebecf1 100%);
+  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   margin: 0;
 }
 .wizard .wizard-body .wizard-content {
-  padding-top: 50px;
+  padding-top: 25px;
 }
 .wizard .wizard-body .wizard-content .step-title {
   font-family: 'Roboto', sans-serif;
@@ -439,6 +452,7 @@ h2.table-title {
   color: #333;
   font-weight: bold;
   font-size: 16px;
+  padding-left: 10px;
   color: #666;
 }
 .wizard .wizard-body .wizard-content .step-description {
@@ -448,24 +462,30 @@ h2.table-title {
   line-height: 1;
   color: #333;
   font-size: 12px;
+  padding-left: 10px;
   color: #999;
 }
+.wizard .wizard-body .wizard-content .panel.panel-default {
+  border: none;
+}
 .wizard .wizard-body .wizard-nav {
-  padding-top: 40px;
+  min-height: 650px;
+  padding-top: 25px;
   background-color: #323544;
 }
 .wizard .wizard-body .wizard-nav .nav li {
   padding: 10px 0;
 }
 .wizard .wizard-body .wizard-nav .nav li a {
-  height: 68px;
+  height: 48px;
+  padding: 0px 5px;
   display: table-cell;
   vertical-align: middle;
 }
 .wizard .wizard-body .wizard-nav .nav li .step-marker {
   position: absolute;
-  top: 19px;
-  line-height: 15.5px;
+  top: 9px;
+  line-height: 16px;
   text-align: center;
   width: 20px;
   height: 20px;
@@ -518,8 +538,8 @@ h2.table-title {
   position: absolute;
   background-color: #1EB475;
   content: "";
-  top: 49px;
-  left: 24px;
+  top: 39px;
+  left: 14px;
 }
 .wizard .wizard-body .wizard-nav .nav li.completed:last-child:after {
   content: none;
@@ -543,10 +563,10 @@ h2.table-title {
   background-color: inherit;
 }
 .wizard .wizard-footer {
-  padding: 20px 30px;
+  padding: 15px 20px;
 }
 .wizard .wizard-footer button {
-  margin: 0 15px;
+  margin: 0 10px;
 }
 .checkbox-disabled-style {
   background-color: #b2b8c1;
@@ -634,139 +654,6 @@ input.radio:checked + label:after {
   height: 6px;
   border-radius: 6px;
 }
-.wizard .wizard-header h3 {
-  font-family: 'Roboto', sans-serif;
-  font-weight: normal;
-  font-style: normal;
-  line-height: 1;
-  font-size: 20px;
-  color: #333;
-  margin: 20px 30px;
-}
-.wizard .wizard-body {
-  background-color: #ebecf1;
-  margin: 0;
-}
-.wizard .wizard-body .wizard-content {
-  padding-top: 50px;
-}
-.wizard .wizard-body .wizard-content .step-title {
-  font-family: 'Roboto', sans-serif;
-  font-weight: normal;
-  font-style: normal;
-  line-height: 1;
-  color: #333;
-  font-weight: bold;
-  font-size: 16px;
-  color: #666;
-}
-.wizard .wizard-body .wizard-content .step-description {
-  font-family: 'Roboto', sans-serif;
-  font-weight: normal;
-  font-style: normal;
-  line-height: 1;
-  color: #333;
-  font-size: 12px;
-  color: #999;
-}
-.wizard .wizard-body .wizard-nav {
-  padding-top: 40px;
-  background-color: #323544;
-}
-.wizard .wizard-body .wizard-nav .nav li {
-  padding: 10px 0;
-}
-.wizard .wizard-body .wizard-nav .nav li a {
-  height: 68px;
-  display: table-cell;
-  vertical-align: middle;
-}
-.wizard .wizard-body .wizard-nav .nav li .step-marker {
-  position: absolute;
-  top: 19px;
-  line-height: 15.5px;
-  text-align: center;
-  width: 20px;
-  height: 20px;
-  border: 2px solid #1EB475;
-  border-radius: 50%;
-  font-size: 12px;
-  font-style: inherit;
-  color: #1EB475;
-  background-color: #323544;
-}
-.wizard .wizard-body .wizard-nav .nav li .step-name {
-  font-family: 'Roboto', sans-serif;
-  font-weight: normal;
-  font-style: normal;
-  line-height: 1;
-  color: #333;
-  font-size: 16px;
-  color: #bbbbbb;
-  margin-left: 30px;
-}
-.wizard .wizard-body .wizard-nav .nav li .step-description {
-  font-family: 'Roboto', sans-serif;
-  font-weight: normal;
-  font-style: normal;
-  line-height: 1;
-  color: #333;
-  font-size: 12px;
-  color: #999;
-  margin-left: 30px;
-}
-.wizard .wizard-body .wizard-nav .nav li.completed .step-marker {
-  background-color: #1EB475;
-  color: white;
-  font-size: 10px;
-  padding-left: 3px;
-}
-.wizard .wizard-body .wizard-nav .nav li.completed .step-marker .step-index {
-  display: none;
-}
-.wizard .wizard-body .wizard-nav .nav li.completed .step-marker:after {
-  font-family: "Glyphicons Halflings";
-  content: "\e013";
-  position: relative;
-  top: 1px;
-  left: -1px;
-}
-.wizard .wizard-body .wizard-nav .nav li.completed:after {
-  width: 2px;
-  height: 100%;
-  position: absolute;
-  background-color: #1EB475;
-  content: "";
-  top: 49px;
-  left: 24px;
-}
-.wizard .wizard-body .wizard-nav .nav li.completed:last-child:after {
-  content: none;
-}
-.wizard .wizard-body .wizard-nav .nav li.active .step-name {
-  font-weight: bold;
-}
-.wizard .wizard-body .wizard-nav .nav li.disabled .step-marker {
-  color: #bbbbbb;
-  border-color: #bbbbbb;
-}
-.wizard .wizard-body .wizard-nav .nav li.disabled.completed .step-marker {
-  background-color: #bbbbbb;
-  color: #323544;
-}
-.wizard .wizard-body .wizard-nav .nav-pills > li.active > a,
-.wizard .wizard-body .wizard-nav .nav-pills > li.active > a:focus,
-.wizard .wizard-body .wizard-nav .nav-pills > li.active > a:hover,
-.wizard .wizard-body .wizard-nav .nav > li > a:focus,
-.wizard .wizard-body .wizard-nav .nav > li > a:hover {
-  background-color: inherit;
-}
-.wizard .wizard-footer {
-  padding: 20px 30px;
-}
-.wizard .wizard-footer button {
-  margin: 0 15px;
-}
 h1,
 h2,
 h3,

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/common/configs/overrideWindow.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/common/configs/overrideWindow.hbs b/ambari-web/app/templates/common/configs/overrideWindow.hbs
index c5f9785..b41e8f1 100644
--- a/ambari-web/app/templates/common/configs/overrideWindow.hbs
+++ b/ambari-web/app/templates/common/configs/overrideWindow.hbs
@@ -92,11 +92,11 @@
         <table class="table table-hover">
           <thead>
             <tr>
+              <th width="45%">{{t common.host}}</th>
+              <th width="45%">{{view.filterColumn.name}}</th>
               <th width="10%">
                 {{view App.CheckboxView checkedBinding="view.allHostsSelected" disabledBinding="view.isDisabled"}}
               </th>
-              <th width="45%">{{t common.host}}</th>
-              <th width="45%">{{view.filterColumn.name}}</th>
             </tr>
           </thead>
          </table>
@@ -105,15 +105,15 @@
             <tbody>
               {{#each entry in view.pageContent}}
                 <tr {{bindAttr class="entry.filtered::hidden"}}>
-                  <td width="10%">
-                    {{view App.CheckboxView checkedBinding="entry.selected"}}
-                  </td>
                   <td width="45%">
                     {{entry.host.hostName}}
                   </td>
                   <td>
                     {{entry.filterColumnValue}}
                   </td>
+                  <td width="10%">
+                    {{view App.CheckboxView checkedBinding="entry.selected"}}
+                  </td>
                 </tr>
               {{/each}}
             </tbody>

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/common/modal_popups/dependent_configs_list.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/common/modal_popups/dependent_configs_list.hbs b/ambari-web/app/templates/common/modal_popups/dependent_configs_list.hbs
index d705d40..a717341 100644
--- a/ambari-web/app/templates/common/modal_popups/dependent_configs_list.hbs
+++ b/ambari-web/app/templates/common/modal_popups/dependent_configs_list.hbs
@@ -23,7 +23,6 @@
   <table class="table table-hover">
     <thead>
     <tr>
-      <th class="check-box-col">{{view view.toggleAll}}<label {{bindAttr for="view.toggleAllId"}}></label></th>
       <th>{{t common.property}}</th>
       <th>{{t common.service}}</th>
       <th>{{t common.configGroup}}</th>
@@ -36,12 +35,12 @@
             {{t popup.dependent.configs.table.recommendedValue}}
           </div>
       </th>
+      <th class="check-box-col">{{view view.toggleAll}}<label {{bindAttr for="view.toggleAllId"}}></label></th>
     </tr>
     </thead>
     <tbody>
     {{#each recommendation in view.parentView.recommendations}}
       <tr>
-        <td class="check-box-col">{{view App.CheckboxView checkedBinding="recommendation.saveRecommended"}}</td>
         <td class="config-dependency-name">{{recommendation.propertyName}}</td>
         <td class="config-dependency-service">{{recommendation.serviceDisplayName}}</td>
         <td class="config-dependency-group">
@@ -56,6 +55,7 @@
             {{view App.ConfigDiffView configBinding="recommendation"}}
           </div>
         </td>
+        <td class="check-box-col">{{view App.CheckboxView checkedBinding="recommendation.saveRecommended"}}</td>
       </tr>
     {{/each}}
     </tbody>

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/experimental.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/experimental.hbs b/ambari-web/app/templates/experimental.hbs
index 781bc92..640393b 100644
--- a/ambari-web/app/templates/experimental.hbs
+++ b/ambari-web/app/templates/experimental.hbs
@@ -34,26 +34,26 @@
       <thead>
         <tr>
           <th style="width: 20%;">Experimental Functionality</th>
-          <th style="width: 20%;">Enabled?</th>
           <th style="width: 60%;">Description</th>
+          <th style="width: 20%;">Enabled?</th>
         </tr>
       </thead>
       <tbody>
-		    {{#each support in controller.supports}}
-		      <tr>
-		        <td>{{support.name}}</td>
-		        <td>{{view App.CheckboxView checkedBinding="support.selected"}}</td>
-		        <td></td>
-			    </tr>
-		    {{/each}}
+        {{#each support in controller.supports}}
+          <tr>
+            <td>{{support.name}}</td>
+            <td></td>
+            <td>{{view App.CheckboxView checkedBinding="support.selected"}}</td>
+          </tr>
+        {{/each}}
     </tbody>
     </table>
     <div class="control-group" style="margin-bottom: 70px;">
         <div class="pull-right">
-	      <button class="btn btn-default" {{action doCancel target="controller"}}>{{t form.cancel}}</button>
-	      <button class="btn btn-primary" {{action doSave target="controller"}}>{{t common.save}}</button>
-	    </div>
-	</div>
+        <button class="btn btn-default" {{action doCancel target="controller"}}>{{t form.cancel}}</button>
+        <button class="btn btn-primary" {{action doSave target="controller"}}>{{t common.save}}</button>
+      </div>
+  </div>
     <hr>
     <div class="control-group" style="margin-bottom: 100px;">
       {{#isAuthorized "CLUSTER.MANAGE_USER_PERSISTED_DATA"}}

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/main/admin/stack_upgrade/services.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/admin/stack_upgrade/services.hbs b/ambari-web/app/templates/main/admin/stack_upgrade/services.hbs
index 5a4e64b..1c91d3e 100644
--- a/ambari-web/app/templates/main/admin/stack_upgrade/services.hbs
+++ b/ambari-web/app/templates/main/admin/stack_upgrade/services.hbs
@@ -17,6 +17,9 @@
 }}
 
 
+<div class="row">
+  <h2 class="table-title col-sm-1">{{t common.stack}}</h2>
+</div>
 <table class="table table-hover">
   <thead>
   <tr>

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/main/admin/stack_upgrade/upgrade_history.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/admin/stack_upgrade/upgrade_history.hbs b/ambari-web/app/templates/main/admin/stack_upgrade/upgrade_history.hbs
index 9244298..6692c8e 100644
--- a/ambari-web/app/templates/main/admin/stack_upgrade/upgrade_history.hbs
+++ b/ambari-web/app/templates/main/admin/stack_upgrade/upgrade_history.hbs
@@ -21,26 +21,31 @@
     {{view App.SpinnerView}}
   </div>
   <div {{bindAttr class="view.isReady::hidden"}}>
-	  <div class="btn-group display-inline-block">
-	    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
-	      <span class="filters-label">{{t common.filter}}: </span>
-	        <span>
-	          {{view.selectedCategory.label}}
-	          <span class="caret"></span>
-	        </span>
-	    </a>
-	    <ul class="dropdown-menu">
-	      {{#each category in view.categories}}
-	        <li>
-	          <a {{action selectCategory category target="view"}} href="#">
-	            {{category.label}}
-	          </a>
-	        </li>
-	      {{/each}}
-	    </ul>
-	  </div>
-	  <br/>
-	  <br/>
+    <div class="row">
+      <h2 class="table-title col-sm-3">{{t common.upgrade.history}}</h2>
+      <div class="table-controls row col-sm-9 pull-right">
+        <div class="col-sm-12">
+          <div class="btn-group pull-right">
+            <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
+              <span class="filters-label">{{t common.filter}}: </span>
+              <span>
+                {{view.selectedCategory.label}}
+                <span class="caret"></span>
+              </span>
+            </a>
+            <ul class="dropdown-menu">
+              {{#each category in view.categories}}
+                <li>
+                  <a {{action selectCategory category target="view"}} href="#">
+                    {{category.label}}
+                  </a>
+                </li>
+              {{/each}}
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
 	  <table class="table advanced-header-table table-hover" id="upgrade-summary-table">
 	    <thead>
 	      <th>{{t common.direction}}</th>

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/main/alerts.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/alerts.hbs b/ambari-web/app/templates/main/alerts.hbs
index ed08943..c55396c 100644
--- a/ambari-web/app/templates/main/alerts.hbs
+++ b/ambari-web/app/templates/main/alerts.hbs
@@ -16,20 +16,19 @@
 * limitations under the License.
 }}
 
-{{#isAuthorized "SERVICE.TOGGLE_ALERTS"}}
-  <div id="alert-actions-button" class="pull-left">
-    {{view App.MainAlertDefinitionActionsView controllerBinding="App.router.mainAlertDefinitionActionsController"}}
-  </div>
-{{/isAuthorized}}
-
-<div id="alert-groups-filter" class="pull-left advanced-header-table groups-filter">
-{{#if App.router.clusterController.isAlertsLoaded}}
-  {{view view.alertGroupFilterView}}
-{{/if}}
-</div>
-
 <div id="alerts">
-  <div class="box-header row">
+  <div class="row">
+    <h2 class="table-title col-sm-1">{{t menu.item.alerts}}</h2>
+    <div class="table-controls row col-sm-11 pull-right">
+      <div class="col-sm-12">
+        {{#isAuthorized "SERVICE.TOGGLE_ALERTS"}}
+          {{view App.MainAlertDefinitionActionsView controllerBinding="App.router.mainAlertDefinitionActionsController"}}
+        {{/isAuthorized}}
+        {{#if App.router.clusterController.isAlertsLoaded}}
+          {{view view.alertGroupFilterView}}
+        {{/if}}
+      </div>
+    </div>
   </div>
   <table class="table advanced-header-table table-hover alerts-table" id="alert-definitions-table">
     <thead>

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/main/alerts/add_definition_to_group_popup.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/alerts/add_definition_to_group_popup.hbs b/ambari-web/app/templates/main/alerts/add_definition_to_group_popup.hbs
index b895d66..e79c399 100644
--- a/ambari-web/app/templates/main/alerts/add_definition_to_group_popup.hbs
+++ b/ambari-web/app/templates/main/alerts/add_definition_to_group_popup.hbs
@@ -86,12 +86,12 @@
       <table class="table table-hover">
         <thead>
         <tr>
-          <th width="10%">
-            {{view App.CheckboxView checkedBinding="view.allDefsSelected" disabledBinding="view.isDisabled"}}
-          </th>
           <th width="35%">{{t common.alertDefinition}}</th>
           <th width="25%">{{t common.service}}</th>
           <th width="30%">{{t common.component}}</th>
+          <th width="10%">
+            {{view App.CheckboxView checkedBinding="view.allDefsSelected" disabledBinding="view.isDisabled"}}
+          </th>
         </tr>
         </thead>
       </table>
@@ -101,18 +101,18 @@
             {{#if view.pageContent}}
               {{#each entry in view.pageContent}}
                 <tr {{bindAttr class="entry.filtered::hidden"}}>
-                  <td width="10%">
-                    {{view App.CheckboxView checkedBinding="entry.selected"}}
-                  </td>
                   <td width="35%">
                     {{entry.label}}
                   </td>
-                  <td>
+                  <td width="25%">
                     {{entry.serviceNameDisplay}}
                   </td>
-                  <td>
+                  <td width="30%">
                     {{entry.componentNameDisplay}}
                   </td>
+                  <td width="10%">
+                    {{view App.CheckboxView checkedBinding="entry.selected"}}
+                  </td>
                 </tr>
               {{/each}}
             {{else}}

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/main/alerts/alert_definitions_actions.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/alerts/alert_definitions_actions.hbs b/ambari-web/app/templates/main/alerts/alert_definitions_actions.hbs
index abdc076..0604ac2 100644
--- a/ambari-web/app/templates/main/alerts/alert_definitions_actions.hbs
+++ b/ambari-web/app/templates/main/alerts/alert_definitions_actions.hbs
@@ -16,19 +16,17 @@
 * limitations under the License.
 }}
 
-<div class="dropdown">
-  <button class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">{{t common.actions}} <span class="caret"></span></button>
-  <ul class="dropdown-menu pull-left">
-    {{#each action in controller}}
-      <li>
-        <a href="#" {{action actionHandler action target="controller"}}>
-          <span {{bindAttr class="action.icon"}}></span>
-          {{action.title}}
-        </a>
-      </li>
-      {{#if action.showDivider}}
-        <li class="divider"></li>
-      {{/if}}
-    {{/each}}
-  </ul>
-</div>
\ No newline at end of file
+<button class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">{{t common.actions}} <span class="caret"></span></button>
+<ul class="dropdown-menu pull-left">
+  {{#each action in controller}}
+    <li>
+      <a href="#" {{action actionHandler action target="controller"}}>
+        <span {{bindAttr class="action.icon"}}></span>
+        {{action.title}}
+      </a>
+    </li>
+    {{#if action.showDivider}}
+      <li class="divider"></li>
+    {{/if}}
+  {{/each}}
+</ul>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/main/alerts/definition_details.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/alerts/definition_details.hbs b/ambari-web/app/templates/main/alerts/definition_details.hbs
index 558614a..c39fe93 100644
--- a/ambari-web/app/templates/main/alerts/definition_details.hbs
+++ b/ambari-web/app/templates/main/alerts/definition_details.hbs
@@ -192,94 +192,89 @@
   {{! Right column end }}
 
   {{! List of alerts }}
-  <div class="definition-details-block row">
-  <span class="background-text">
-    <strong>{{t alerts.definition.details.instances}}</strong>
-  </span>
-    <hr>
-    <div>
+    <div class="row">
+      <h2 class="table-title col-sm-1">{{t alerts.definition.details.instances}}</h2>
+    </div>
 
-      {{#if App.router.mainAlertInstancesController.isLoaded}}
+    {{#if App.router.mainAlertInstancesController.isLoaded}}
 
-        <table class="table advanced-header-table table-hover alerts-table" id="alert-instances-table">
-          <thead>
-          {{#view view.sortView contentBinding="view.filteredContent"}}
-            {{view view.parentView.serviceSort class="first service-sorting"}}
-            {{view view.parentView.hostNameSort class="host-sorting"}}
-            {{view view.parentView.stateSort class="state-sorting"}}
-            <th>{{t alerts.definition.details.24-hour}}</th>
-            <th>{{t alerts.table.header.check.response}}</th>
-          {{/view}}
-          <tr class="filter-row">
-            <th class="first">{{view view.serviceFilterView}}</th>
-            <th>{{view view.hostNameFilterView}}</th>
-            <th>{{view view.stateFilterView }}</th>
-            <th>{{!}}</th>
-            <th>{{!}}</th>
-          </tr>
-          </thead>
-          <tbody>
-          {{#if view.pageContent}}
-            {{#each instance in view.pageContent}}
-              {{#view view.instanceTableRow}}
-                <td class="first">
-                  {{#if instance.serviceDisplayName}}
-                    {{#if instance.service.isLoaded}}
-                      <a {{action goToService instance.service target="view"}}
-                        href="#">{{instance.serviceDisplayName}}</a>
-                    {{else}}
-                      {{instance.serviceDisplayName}}
-                    {{/if}}
-                  {{/if}}
-                </td>
-                <td>
-                  {{#if instance.hostName}}
-                    <a {{action goToHostAlerts instance.host target="view"}} href="#">
-                      {{instance.hostName}}
-                    </a>
+      <table class="table advanced-header-table table-hover alerts-table" id="alert-instances-table">
+        <thead>
+        {{#view view.sortView contentBinding="view.filteredContent"}}
+          {{view view.parentView.serviceSort class="first service-sorting"}}
+          {{view view.parentView.hostNameSort class="host-sorting"}}
+          {{view view.parentView.stateSort class="state-sorting"}}
+          <th>{{t alerts.definition.details.24-hour}}</th>
+          <th>{{t alerts.table.header.check.response}}</th>
+        {{/view}}
+        <tr class="filter-row">
+          <th class="first">{{view view.serviceFilterView}}</th>
+          <th>{{view view.hostNameFilterView}}</th>
+          <th>{{view view.stateFilterView }}</th>
+          <th>{{!}}</th>
+          <th>{{!}}</th>
+        </tr>
+        </thead>
+        <tbody>
+        {{#if view.pageContent}}
+          {{#each instance in view.pageContent}}
+            {{#view view.instanceTableRow}}
+              <td class="first">
+                {{#if instance.serviceDisplayName}}
+                  {{#if instance.service.isLoaded}}
+                    <a {{action goToService instance.service target="view"}}
+                      href="#">{{instance.serviceDisplayName}}</a>
+                  {{else}}
+                    {{instance.serviceDisplayName}}
                   {{/if}}
-                </td>
-                <td>
-                  {{view App.AlertInstanceStateView instanceBinding="instance"}}
-                </td>
-                <td>{{view view.parentView.lastDayCount hostNameBinding="instance.hostName"}}</td>
-                <td>
-                  <a href="#" class="alert-text" {{action openFullResponse instance target="view"}} {{bindAttr data-original-title="instance.text"}}>
-                    {{instance.text}}
+                {{/if}}
+              </td>
+              <td>
+                {{#if instance.hostName}}
+                  <a {{action goToHostAlerts instance.host target="view"}} href="#">
+                    {{instance.hostName}}
                   </a>
-                </td>
-              {{/view}}
-            {{/each}}
-          {{else}}
-            <tr>
-              <td class="first" colspan="5">
-                {{t alerts.definition.details.noAlerts}}
+                {{/if}}
               </td>
-            </tr>
-          {{/if}}
-          </tbody>
-        </table>
+              <td>
+                {{view App.AlertInstanceStateView instanceBinding="instance"}}
+              </td>
+              <td>{{view view.parentView.lastDayCount hostNameBinding="instance.hostName"}}</td>
+              <td>
+                <a href="#" class="alert-text" {{action openFullResponse instance target="view"}} {{bindAttr data-original-title="instance.text"}}>
+                  {{instance.text}}
+                </a>
+              </td>
+            {{/view}}
+          {{/each}}
+        {{else}}
+          <tr>
+            <td class="first" colspan="5">
+              {{t alerts.definition.details.noAlerts}}
+            </td>
+          </tr>
+        {{/if}}
+        </tbody>
+      </table>
 
-        <div class="page-bar">
-          <div class="filtered-info col-md-4">
-            {{#if view.showFilteredContent}}
-              <label>{{view.filteredContentInfo}} - <a {{action clearFilters target="view"}}
-                href="#">{{t tableView.filters.clearAllFilters}}</a></label>
-            {{/if}}
-          </div>
-          <div class="items-on-page">
-            <label>{{t common.show}}: {{view view.rowsPerPageSelectView selectionBinding="view.displayLength"}}</label>
-          </div>
-          <div class="info">{{view.paginationInfo}}</div>
-          {{view view.pagination2Btns}}
+      <div class="page-bar">
+        <div class="filtered-info col-md-4">
+          {{#if view.showFilteredContent}}
+            <label>{{view.filteredContentInfo}} - <a {{action clearFilters target="view"}}
+              href="#">{{t tableView.filters.clearAllFilters}}</a></label>
+          {{/if}}
         </div>
+        <div class="items-on-page">
+          <label>{{t common.show}}: {{view view.rowsPerPageSelectView selectionBinding="view.displayLength"}}</label>
+        </div>
+        <div class="info">{{view.paginationInfo}}</div>
+        {{view view.pagination2Btns}}
+      </div>
 
-      {{else}}
-        {{view App.SpinnerView}}
-      {{/if}}
+    {{else}}
+      {{view App.SpinnerView}}
+    {{/if}}
 
-    </div>
-  </div>
   {{! List of alerts end }}
 
   </div>

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/main/dashboard/config_history.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/dashboard/config_history.hbs b/ambari-web/app/templates/main/dashboard/config_history.hbs
index 56480dd..bcb15be 100644
--- a/ambari-web/app/templates/main/dashboard/config_history.hbs
+++ b/ambari-web/app/templates/main/dashboard/config_history.hbs
@@ -17,6 +17,9 @@
 }}
 
 <div id="config_history">
+  <div class="row">
+    <h2 class="table-title col-sm-2">{{t dashboard.configHistory.title}}</h2>
+  </div>
   <table class="table advanced-header-table table-hover">
     <thead>
     {{#view view.sortView classNames="label-row config-history-sort-row"}}

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/main/host.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/host.hbs b/ambari-web/app/templates/main/host.hbs
index c8a0721..721728b 100644
--- a/ambari-web/app/templates/main/host.hbs
+++ b/ambari-web/app/templates/main/host.hbs
@@ -18,22 +18,22 @@
 
 <div id="hosts">
 
-  <div class="box-header row">
-    <div class="hosts-actions pull-left">
-      {{#isAuthorized "HOST.ADD_DELETE_COMPONENTS, HOST.TOGGLE_MAINTENANCE, HOST.ADD_DELETE_HOSTS"}}
-        {{view App.HostTableMenuView}}
-      {{/isAuthorized}}
+  <div class="row">
+    <h2 class="table-title col-sm-1">{{t common.hosts}}</h2>
+    <div class="table-controls row col-sm-10 pull-right">
+      <div class="col-sm-12">
+        {{#isAuthorized "HOST.ADD_DELETE_COMPONENTS, HOST.TOGGLE_MAINTENANCE, HOST.ADD_DELETE_HOSTS"}}
+          {{view App.HostTableMenuView}}
+        {{/isAuthorized}}
+        <div class="col-sm-10 pull-right">
+          {{outlet}}
+        </div>
+      </div>
     </div>
   </div>
-  {{outlet}}
   <table class="table advanced-header-table table-hover" id="hosts-table">
     <thead>
     {{#view view.sortView classNames="label-row" contentBinding="view.filteredContent"}}
-        <th class="first">
-          <div class="ember-view view-wrapper">
-            {{view App.CheckboxView classNames="host-select-all" checkedBinding="view.parentView.selectAllHosts"}}
-          </div>
-        </th>
         <th> </th>
         {{view view.parentView.nameSort}}
         <th> </th>
@@ -48,6 +48,11 @@
           {{t hosts.host.menu.stackVersions}}
         </th>
         <th class="sort-view-6">{{t common.components}}</th>
+        <th>
+          <div class="ember-view view-wrapper">
+            {{view App.CheckboxView classNames="host-select-all" checkedBinding="view.parentView.selectAllHosts"}}
+          </div>
+        </th>
       {{/view}}
     </thead>
     <tbody>
@@ -55,8 +60,6 @@
       {{#each host in view.pageContent}}
         {{#view view.HostView contentBinding="host"}}
 
-          <td class="first">{{view App.CheckboxView checkedBinding="host.selected"}}</td>
-
           <td class="health">
             <span rel="HealthTooltip" {{bindAttr class="host.healthClass host.healthIconClass"}} {{bindAttr data-original-title="host.healthToolTip" }}></span>
           </td>
@@ -105,6 +108,8 @@
               {{view.content.hostComponents.length}} {{pluralize view.content.hostComponents.length singular="t:common.component" plural="t:common.components"}}
             </a>
           </td>
+
+          <td>{{view App.CheckboxView checkedBinding="host.selected"}}</td>
         {{/view}}
       {{/each}}
     {{else}}

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/main/host/bulk_operation_menu.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/host/bulk_operation_menu.hbs b/ambari-web/app/templates/main/host/bulk_operation_menu.hbs
index 29bedf8..64ab4e9 100644
--- a/ambari-web/app/templates/main/host/bulk_operation_menu.hbs
+++ b/ambari-web/app/templates/main/host/bulk_operation_menu.hbs
@@ -16,122 +16,126 @@
 * limitations under the License.
 }}
 
-<div class="dropdown bulk-menu">
-  <button class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">{{t common.actions}} <span class="caret"></span></button>
-  <ul class="dropdown-menu">
-    {{#isAuthorized "HOST.ADD_DELETE_HOSTS"}}
-      <li><a href="#" {{action addHost}}><i class="glyphicon glyphicon-plus glyphicon-white"></i> {{t hosts.host.add}}</a></li>
-      <li class="divider"></li>
-    {{/isAuthorized}}
-    <li class="dropdown-submenu">
-      <a {{bindAttr class="view.parentView.showSelectedFilter::disabled"}} tabindex="-1" href="javascript:void(null);">{{view.menuItems.s.label}}
-        ({{view.parentView.selectedHosts.length}})</a>
-        <ul {{bindAttr class="view.parentView.showSelectedFilter::hidden :dropdown-menu"}}>
-          {{#view view.hostItemView}}
-              <a href="javascript:void(null);">{{view.label}}</a>
-              <ul class="dropdown-menu">
-                {{#each operation in view.operationsInfo}}
-                  {{#if operation.label.length}}
-                    {{#view view.operationView contentBinding="operation.operationData" selection="s"}}
-                        <a href="javascript:void(null);">{{operation.label}}</a>
-                    {{/view}}
-                  {{/if}}
-                {{/each}}
-              </ul>
+<button class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">{{t common.actions}} <span class="caret"></span></button>
+<ul class="dropdown-menu">
+  {{#isAuthorized "HOST.ADD_DELETE_HOSTS"}}
+    <li><a href="#" {{action addHost}}><i class="glyphicon glyphicon-plus glyphicon-white"></i> {{t hosts.host.add}}</a></li>
+    <li class="divider"></li>
+  {{/isAuthorized}}
+  <li class="dropdown-submenu submenu-left">
+    <a {{bindAttr class="view.parentView.showSelectedFilter::disabled"}} tabindex="-1" href="javascript:void(null);">{{view.menuItems.s.label}}
+      ({{view.parentView.selectedHosts.length}})</a>
+    <div class="dropdown-menu-wrap">
+      <ul {{bindAttr class="view.parentView.showSelectedFilter::hidden :dropdown-menu"}}>
+        {{#view view.hostItemView}}
+          <a href="javascript:void(null);">{{view.label}}</a>
+          <ul class="dropdown-menu">
+            {{#each operation in view.operationsInfo}}
+              {{#if operation.label.length}}
+                {{#view view.operationView contentBinding="operation.operationData" selection="s"}}
+                  <a href="javascript:void(null);">{{operation.label}}</a>
+                {{/view}}
+              {{/if}}
+            {{/each}}
+          </ul>
+        {{/view}}
+        {{#each component in view.components}}
+          {{#view view.slaveItemView contentBinding="component"}}
+            <a href="javascript:void(null);">{{component.componentNameFormatted}}</a>
+            <ul class="dropdown-menu">
+              {{#each operation in view.operationsInfo}}
+                {{#if operation.decommission}}
+                  {{#view view.advancedOperationView contentBinding="operation.operationData" selection="s"}}
+                    <a href="javascript:void(null);">{{operation.label}}</a>
+                  {{/view}}
+                {{else}}
+                  {{#view view.commonOperationView contentBinding="operation.operationData" selection="s"}}
+                    <a href="javascript:void(null);">{{operation.label}}</a>
+                  {{/view}}
+                {{/if}}
+              {{/each}}
+            </ul>
           {{/view}}
-          {{#each component in view.components}}
-            {{#view view.slaveItemView contentBinding="component"}}
-                <a href="javascript:void(null);">{{component.componentNameFormatted}}</a>
-                <ul class="dropdown-menu">
-                  {{#each operation in view.operationsInfo}}
-                    {{#if operation.decommission}}
-                      {{#view view.advancedOperationView contentBinding="operation.operationData" selection="s"}}
-                          <a href="javascript:void(null);">{{operation.label}}</a>
-                      {{/view}}
-                    {{else}}
-                      {{#view view.commonOperationView contentBinding="operation.operationData" selection="s"}}
-                          <a href="javascript:void(null);">{{operation.label}}</a>
-                      {{/view}}
-                    {{/if}}
-                  {{/each}}
-                </ul>
-            {{/view}}
-          {{/each}}
-        </ul>
-    </li>
-    <li class="dropdown-submenu">
-      <a {{bindAttr class="view.parentView.hasFilteredItems::disabled"}} tabindex="-1" href="javascript:void(null);">{{view.menuItems.f.label}}
-        ({{view.parentView.filteredCount}})</a>
-        <ul {{bindAttr class="view.parentView.hasFilteredItems::hidden :dropdown-menu"}}>
-          {{#view view.hostItemView}}
-            <a href="javascript:void(null);">{{view.label}}</a>
+        {{/each}}
+      </ul>
+    </div>
+  </li>
+  <li class="dropdown-submenu submenu-left">
+    <a {{bindAttr class="view.parentView.hasFilteredItems::disabled"}} tabindex="-1" href="javascript:void(null);">{{view.menuItems.f.label}}
+      ({{view.parentView.filteredCount}})</a>
+    <div class="dropdown-menu-wrap">
+      <ul {{bindAttr class="view.parentView.hasFilteredItems::hidden :dropdown-menu"}}>
+        {{#view view.hostItemView}}
+          <a href="javascript:void(null);">{{view.label}}</a>
+          <ul class="dropdown-menu">
+            {{#each operation in view.operationsInfo}}
+              {{#if operation.label.length}}
+                {{#view view.operationView contentBinding="operation.operationData" selection="f"}}
+                  <a href="javascript:void(null);">{{operation.label}}</a>
+                {{/view}}
+              {{/if}}
+            {{/each}}
+          </ul>
+        {{/view}}
+        {{#each component in view.components}}
+          {{#view view.slaveItemView contentBinding="component"}}
+            <a href="javascript:void(null);">{{component.componentNameFormatted}}</a>
             <ul class="dropdown-menu">
               {{#each operation in view.operationsInfo}}
-                {{#if operation.label.length}}
-                  {{#view view.operationView contentBinding="operation.operationData" selection="f"}}
+                {{#if operation.decommission}}
+                  {{#view view.advancedOperationView contentBinding="operation.operationData" selection="f"}}
+                    <a href="javascript:void(null);">{{operation.label}}</a>
+                  {{/view}}
+                {{else}}
+                  {{#view view.commonOperationView contentBinding="operation.operationData" selection="f"}}
                     <a href="javascript:void(null);">{{operation.label}}</a>
                   {{/view}}
                 {{/if}}
               {{/each}}
             </ul>
           {{/view}}
-          {{#each component in view.components}}
-              {{#view view.slaveItemView contentBinding="component"}}
-                <a href="javascript:void(null);">{{component.componentNameFormatted}}</a>
-                  <ul class="dropdown-menu">
-                    {{#each operation in view.operationsInfo}}
-                      {{#if operation.decommission}}
-                        {{#view view.advancedOperationView contentBinding="operation.operationData" selection="f"}}
-                        <a href="javascript:void(null);">{{operation.label}}</a>
-                        {{/view}}
-                      {{else}}
-                        {{#view view.commonOperationView contentBinding="operation.operationData" selection="f"}}
-                        <a href="javascript:void(null);">{{operation.label}}</a>
-                        {{/view}}
-                      {{/if}}
-                    {{/each}}
-                  </ul>
-              {{/view}}
-          {{/each}}
-        </ul>
-    </li>
-    <li class="dropdown-submenu">
-      <a tabindex="-1" href="javascript:void(null);">{{view.menuItems.a.label}}
-        ({{view.parentView.totalCount}})</a>
-        <ul class="dropdown-menu">
-          {{#view view.hostItemView}}
-              <a href="javascript:void(null);">{{view.label}}</a>
-              <ul class="dropdown-menu">
-                {{#each operation in view.operationsInfo}}
-                  {{#if operation.label.length}}
-                    {{#view view.operationView contentBinding="operation.operationData" selection="a"}}
-                        <a href="javascript:void(null);">{{operation.label}}</a>
+        {{/each}}
+      </ul>
+    </div>
+  </li>
+  <li class="dropdown-submenu submenu-left">
+    <a tabindex="-1" href="javascript:void(null);">{{view.menuItems.a.label}}
+      ({{view.parentView.totalCount}})</a>
+    <div class="dropdown-menu-wrap">
+      <ul class="dropdown-menu">
+        {{#view view.hostItemView}}
+          <a href="javascript:void(null);">{{view.label}}</a>
+          <ul class="dropdown-menu">
+            {{#each operation in view.operationsInfo}}
+              {{#if operation.label.length}}
+                {{#view view.operationView contentBinding="operation.operationData" selection="a"}}
+                  <a href="javascript:void(null);">{{operation.label}}</a>
+                {{/view}}
+              {{/if}}
+            {{/each}}
+          </ul>
+        {{/view}}
+        {{#each component in view.components}}
+          {{#view view.slaveItemView contentBinding="component"}}
+            <a href="javascript:void(null);">{{component.componentNameFormatted}}</a>
+            <ul class="dropdown-menu">
+              {{#each operation in view.operationsInfo}}
+                {{#if operation.decommission}}
+                  {{#view view.advancedOperationView contentBinding="operation.operationData" selection="a"}}
+                    <a href="javascript:void(null);">{{operation.label}}</a>
+                  {{/view}}
+                {{else}}
+                  {{#unless operation.delete}}
+                    {{#view view.commonOperationView contentBinding="operation.operationData" selection="a"}}
+                      <a href="javascript:void(null);">{{operation.label}}</a>
                     {{/view}}
-                  {{/if}}
-                {{/each}}
-              </ul>
+                  {{/unless}}
+                {{/if}}
+              {{/each}}
+            </ul>
           {{/view}}
-          {{#each component in view.components}}
-            {{#view view.slaveItemView contentBinding="component"}}
-                <a href="javascript:void(null);">{{component.componentNameFormatted}}</a>
-                <ul class="dropdown-menu">
-                  {{#each operation in view.operationsInfo}}
-                    {{#if operation.decommission}}
-                      {{#view view.advancedOperationView contentBinding="operation.operationData" selection="a"}}
-                          <a href="javascript:void(null);">{{operation.label}}</a>
-                      {{/view}}
-                    {{else}}
-                      {{#unless operation.delete}}
-                        {{#view view.commonOperationView contentBinding="operation.operationData" selection="a"}}
-                          <a href="javascript:void(null);">{{operation.label}}</a>
-                        {{/view}}
-                      {{/unless}}
-                    {{/if}}
-                  {{/each}}
-                </ul>
-            {{/view}}
-          {{/each}}
-        </ul>
-    </li>
-  </ul>
-</div>
+        {{/each}}
+      </ul>
+    </div>
+  </li>
+</ul>

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/main/host/combo_search_box.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/host/combo_search_box.hbs b/ambari-web/app/templates/main/host/combo_search_box.hbs
index 38b1d97..d54b7df 100644
--- a/ambari-web/app/templates/main/host/combo_search_box.hbs
+++ b/ambari-web/app/templates/main/host/combo_search_box.hbs
@@ -16,11 +16,10 @@
 * limitations under the License.
 }}
 {{#if App.supports.hostComboSearchBox}}
-<br/>
-{{#if view.errMsg}}
-<div class="alert alert-danger">
-    {{view.errMsg}}
-</div>
-{{/if}}
-<div id="combo_search_box"></div>
+  {{#if view.errMsg}}
+    <div class="alert alert-danger">
+      {{view.errMsg}}
+    </div>
+  {{/if}}
+  <div id="combo_search_box"></div>
 {{/if}}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/main/host/host_alerts.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/host/host_alerts.hbs b/ambari-web/app/templates/main/host/host_alerts.hbs
index 18eb387..f40575c 100644
--- a/ambari-web/app/templates/main/host/host_alerts.hbs
+++ b/ambari-web/app/templates/main/host/host_alerts.hbs
@@ -17,7 +17,8 @@
 }}
 
 <div id="alerts">
-  <div class="box-header row">
+  <div class="row">
+    <h2 class="table-title col-sm-1">{{t hosts.host.alerts.label}}</h2>
   </div>
 
   {{#if App.router.mainAlertInstancesController.isLoaded}}

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/main/host/logs.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/host/logs.hbs b/ambari-web/app/templates/main/host/logs.hbs
index 2cdee44..6153676 100644
--- a/ambari-web/app/templates/main/host/logs.hbs
+++ b/ambari-web/app/templates/main/host/logs.hbs
@@ -16,6 +16,9 @@
 * limitations under the License.
 }}
 
+<div class="row">
+  <h2 class="table-title col-sm-1">{{t hosts.host.menu.logs}}</h2>
+</div>
 <table class="table advanced-header-table table-hover">
   <thead>
     {{#view view.sortView contentBinding="view.filteredContent"}}

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/main/host/stack_versions.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/host/stack_versions.hbs b/ambari-web/app/templates/main/host/stack_versions.hbs
index e1666cc..27bb348 100644
--- a/ambari-web/app/templates/main/host/stack_versions.hbs
+++ b/ambari-web/app/templates/main/host/stack_versions.hbs
@@ -15,6 +15,9 @@
 * See the License for the specific language governing permissions and
 * limitations under the License.
 }}
+<div class="row">
+  <h2 class="table-title col-sm-1">{{t hosts.host.menu.stackVersions}}</h2>
+</div>
 <table class="table advanced-header-table table-hover">
   <thead>
   {{#view view.sortView classNames="label-row" contentBinding="view.filteredContent"}}

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/wizard/step3.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/wizard/step3.hbs b/ambari-web/app/templates/wizard/step3.hbs
index 22ee04c..a061da0 100644
--- a/ambari-web/app/templates/wizard/step3.hbs
+++ b/ambari-web/app/templates/wizard/step3.hbs
@@ -55,13 +55,10 @@
       </div>
     </div>
 
-    <div class="pre-scrollable" style="max-height: 440px;">
+    <div class="pre-scrollable col-sm-12" style="max-height: 440px;">
       <table id="confirm-hosts-table" class="table table-hover">
         <thead>
         <tr>
-          <th class="tinyspan">
-            {{view App.CheckboxView checkedBinding="view.pageChecked"}}
-          </th>
           <th class="col-md-5">{{t common.host}}</th>
           <!-- retrieved from local storage initially -->
           <th class="col-md-2">{{t common.progress}}</th>
@@ -70,15 +67,15 @@
           <th class="col-md-2">{{t common.action}}</th>
           <!-- trash icon -->
           <!-- retry icon -->
+          <th class="tinyspan">
+            {{view App.CheckboxView checkedBinding="view.pageChecked"}}
+          </th>
         </tr>
         </thead>
         <tbody>
           {{#if view.pageContent}}
             {{#each host in view.pageContent}}
               {{#view App.WizardHostView categoryBinding="controller.category" hostInfoBinding="host"}}
-              <td class="step3-table-checkbox">
-                {{view App.CheckboxView checkedBinding="host.isChecked"}}
-              </td>
               <td class="host">
                 <span title="{{unbound host.name}}" class="trim_hostname">{{host.name}}</span>
               </td>
@@ -96,6 +93,9 @@
                 <a class="btn btn-xs" {{action remove target="view"}}{{bindAttr disabled="isBackDisabled"}}><i class="glyphicon glyphicon-trash"></i>
                   {{t common.remove}}</a>
               </td>
+              <td class="step3-table-checkbox">
+                {{view App.CheckboxView checkedBinding="host.isChecked"}}
+              </td>
               {{/view}}
             {{/each}}
           {{else}}
@@ -108,7 +108,7 @@
         </tbody>
       </table>
     </div>
-    <div id="hosts">
+    <div id="hosts col-sm-12">
       <div class="page-bar">
         <div class="selected-hosts-info pull-left">
           {{#if view.selectedHostsCount}}

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/wizard/step4.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/wizard/step4.hbs b/ambari-web/app/templates/wizard/step4.hbs
index b1bf20b..ab7a8fa 100644
--- a/ambari-web/app/templates/wizard/step4.hbs
+++ b/ambari-web/app/templates/wizard/step4.hbs
@@ -25,11 +25,12 @@
   <table class="table table-hover">
     <thead>
     <tr>
-      <th class="col-md-3" id="service-name">
-        {{view App.CheckboxView disabledBinding="isInstalled" checkedBinding="isAllChecked" labelTranslate="common.service"}}
-      </th>
+      <th class="col-md-3">{{t common.service}}</th>
       <th id="service-version">{{t common.version}}</th>
       <th id="service-description">{{t common.description}}</th>
+      <th>
+        {{view App.CheckboxView disabledBinding="isInstalled" checkedBinding="isAllChecked"}}
+      </th>
     </tr>
     </thead>
     <tbody>
@@ -37,16 +38,18 @@
       {{#unless isHiddenOnSelectServicePage}}
         <tr {{bindAttr class="isSelected:active isSelected:service-selected"}}>
           <td>
+            <div class="checkbox">{{displayNameOnSelectServicePage}}</div>
+          </td>
+          <td>{{serviceVersionDisplay}}</td>
+          <td>{{{comments}}}</td>
+          <td>
             <div class="checkbox">
               {{view App.CheckboxView checkboxClassNamesBinding="serviceName"
-                disabledBinding="isInstalled"
-                checkedBinding="isSelected"
-                labelBinding="displayNameOnSelectServicePage"
+              disabledBinding="isInstalled"
+              checkedBinding="isSelected"
               }}
             </div>
           </td>
-          <td>{{serviceVersionDisplay}}</td>
-          <td>{{{comments}}}</td>
         </tr>
       {{/unless}}
     {{/each}}

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/wizard/step6.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/wizard/step6.hbs b/ambari-web/app/templates/wizard/step6.hbs
index 826e248..f4fea26 100644
--- a/ambari-web/app/templates/wizard/step6.hbs
+++ b/ambari-web/app/templates/wizard/step6.hbs
@@ -28,7 +28,7 @@
     </div>
   {{/if}}
 
-  <div class="pre-scrollable">
+  <div class="pre-scrollable col-sm-12">
     <table class="table table-hover" id="component_assign_table">
       <thead>
       <tr>

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/templates/wizard/step9.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/wizard/step9.hbs b/ambari-web/app/templates/wizard/step9.hbs
index cdfb797..d1bcf3d 100644
--- a/ambari-web/app/templates/wizard/step9.hbs
+++ b/ambari-web/app/templates/wizard/step9.hbs
@@ -61,8 +61,8 @@
         </ul>
       </div>
     </div>
-    <div class="pre-scrollable">
-      <table id="deploy-status-by-host" class="table table-bordered table-striped">
+    <div class="pre-scrollable col-sm-12">
+      <table id="deploy-status-by-host" class="table table-hover">
         <thead>
         <tr>
           <th class="host">

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/views/common/filter_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/common/filter_view.js b/ambari-web/app/views/common/filter_view.js
index a7cd050..56f68e5 100644
--- a/ambari-web/app/views/common/filter_view.js
+++ b/ambari-web/app/views/common/filter_view.js
@@ -32,7 +32,7 @@ var validator = require('utils/validator');
 
 var wrapperView = Ember.View.extend({
   classNames: ['view-wrapper'],
-  layout: Ember.Handlebars.compile('<a href="#" {{action "clearFilter" target="view"}} class="ui-icon ui-icon-circle-close"></a> {{yield}}'),
+  layout: Ember.Handlebars.compile('{{yield}} <a href="#" {{action "clearFilter" target="view"}} class="ui-icon ui-icon-circle-close"></a>'),
   template: Ember.Handlebars.compile(
     '{{#if view.fieldId}}<input type="hidden" id="{{unbound view.fieldId}}" value="" />{{/if}}' +
     '{{view view.filterView}}' +

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/views/common/modal_popups/dependent_configs_list_popup.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/common/modal_popups/dependent_configs_list_popup.js b/ambari-web/app/views/common/modal_popups/dependent_configs_list_popup.js
index fdaf528..728634e 100644
--- a/ambari-web/app/views/common/modal_popups/dependent_configs_list_popup.js
+++ b/ambari-web/app/views/common/modal_popups/dependent_configs_list_popup.js
@@ -37,7 +37,7 @@ App.showDependentConfigsPopup = function (recommendations, primary, secondary) {
     bodyClass: Em.View.extend({
       templateName: require('templates/common/modal_popups/dependent_configs_list'),
       toggleAllId: '',
-      toggleAll: Em.Checkbox.extend({
+      toggleAll: App.CheckboxView.extend({
         didInsertElement: function () {
           this.set('parentView.toggleAllId', this.get('elementId'));
           this.updateCheckbox();

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/views/main/admin/stack_upgrade/versions_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/main/admin/stack_upgrade/versions_view.js b/ambari-web/app/views/main/admin/stack_upgrade/versions_view.js
index 9847209..8fccbd9 100644
--- a/ambari-web/app/views/main/admin/stack_upgrade/versions_view.js
+++ b/ambari-web/app/views/main/admin/stack_upgrade/versions_view.js
@@ -180,10 +180,11 @@ App.MainAdminStackVersionsView = Em.View.extend({
    * @return {App.ModalPopup}
    */
   goToVersions: function () {
+    var self = this;
     return App.showConfirmationPopup(function () {
       App.ajax.send({
         name: 'ambari.service.load_server_version',
-        sender: this
+        sender: self
       }).then(function(data) {
         var components = Em.get(data,'components');
         if (Em.isArray(components)) {

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/views/main/alert_definitions_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/main/alert_definitions_view.js b/ambari-web/app/views/main/alert_definitions_view.js
index a4a2ee8..a578c84 100644
--- a/ambari-web/app/views/main/alert_definitions_view.js
+++ b/ambari-web/app/views/main/alert_definitions_view.js
@@ -348,21 +348,20 @@ App.MainAlertDefinitionsView = App.TableView.extend({
   alertGroupFilterView: filters.createSelectView({
     column: 7,
     fieldType: 'filter-input-width',
+    classNames: ['btn-group', 'pull-right', 'groups-filter'],
     template: Ember.Handlebars.compile(
-      '<div class="btn-group display-inline-block">' +
-        '<button class="btn btn-default dropdown-toggle" data-toggle="dropdown">' +
-          '<span class="filters-label">{{t common.groups}}:  </span>' +
-          '<span>{{view.selected.label}}&nbsp;<span class="caret"></span></span>' +
-        '</button>' +
-          '<ul class="dropdown-menu alert-groups-dropdown">' +
-            '{{#each category in view.content}}' +
-              '<li {{bindAttr class=":category-item category.selected:active"}}>' +
-                '<a {{action selectCategory category target="view"}} href="#">' +
-                   '<span {{bindAttr class="category.class"}}></span>{{category.label}}</a>' +
-              '</li>'+
-            '{{/each}}' +
-          '</ul>'+
-      '</div>'
+      '<button class="btn btn-default dropdown-toggle" data-toggle="dropdown">' +
+        '<span class="filters-label">{{t common.groups}}:  </span>' +
+        '<span>{{view.selected.label}}&nbsp;<span class="caret"></span></span>' +
+      '</button>' +
+      '<ul class="dropdown-menu alert-groups-dropdown">' +
+        '{{#each category in view.content}}' +
+          '<li {{bindAttr class=":category-item category.selected:active"}}>' +
+            '<a {{action selectCategory category target="view"}} href="#">' +
+               '<span {{bindAttr class="category.class"}}></span>{{category.label}}</a>' +
+          '</li>'+
+        '{{/each}}' +
+      '</ul>'
     ),
     content: [],
 

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/views/main/alerts/alert_definitions_actions_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/main/alerts/alert_definitions_actions_view.js b/ambari-web/app/views/main/alerts/alert_definitions_actions_view.js
index d1699f0..ad8ac5e 100644
--- a/ambari-web/app/views/main/alerts/alert_definitions_actions_view.js
+++ b/ambari-web/app/views/main/alerts/alert_definitions_actions_view.js
@@ -18,6 +18,8 @@
 
 App.MainAlertDefinitionActionsView = Em.View.extend({
 
+  classNames: ['btn-group', 'pull-right'],
+
   templateName: require('templates/main/alerts/alert_definitions_actions')
 
 });
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/ambari/blob/03014f0c/ambari-web/app/views/main/host/hosts_table_menu_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/main/host/hosts_table_menu_view.js b/ambari-web/app/views/main/host/hosts_table_menu_view.js
index c06f7b3..25b4052 100644
--- a/ambari-web/app/views/main/host/hosts_table_menu_view.js
+++ b/ambari-web/app/views/main/host/hosts_table_menu_view.js
@@ -24,6 +24,8 @@ var O = Em.Object;
  */
 App.HostTableMenuView = Em.View.extend({
 
+  classNames: ['btn-group', 'pull-right', 'bulk-menu'],
+
   templateName: require('templates/main/host/bulk_operation_menu'),
 
   controllerBinding: 'App.router.bulkOperationsController',