AMBARI-4552 OOS status for component on host detail page makes button too big. (ababiichuk)

ambari-web/app/messages.js

@@ -1441,6 +1441,7 @@ Em.I18n.translations = {
   'hosts.component.passive.implied.host.mode.tooltip':'Cannot Turn Off Out-of-Service mode because Host is in Out-of-Service mode',
   'hosts.component.passive.implied.service.mode.tooltip':'Cannot Turn Off Out-of-Service mode because {0} is in Out-of-Service mode',
   'hosts.component.passive.mode':'Component is in Out-of-Service mode',
+  'hosts.component.passive.short.mode':'Out of Service',
   'hosts.host.passive.mode':'Host is in Out-of-Service mode',
   'hosts.host.alert.noAlerts':'No alerts',
   'hosts.host.alert.noAlerts.message':'There are no alerts for this host.',

ambari-web/app/styles/application.less

@@ -4384,7 +4384,7 @@ ul.inline li {
 /* TIME RANGE WIDGET END */
 
 #host-details .host-components .btn-group > .btn {
-  min-width: 130px;
+  width: 130px;
 }
 
 #host-details > .host-maintenance {

ambari-web/app/templates/main/host/details/host_component.hbs

@@ -24,7 +24,7 @@
       </a>
     {{/if}}
   {{else}}
-    <span rel='componentHealthTooltip' {{bindAttr class="view.statusClass :components-health" title="view.componentTextStatus"}}></span>&nbsp;
+    <span rel='componentHealthTooltip' {{bindAttr class="view.statusClass :components-health" data-original-title="view.componentTextStatus"}}></span>&nbsp;
   {{/if}}
   {{#if component.displayNameAdvanced}}
     {{component.displayNameAdvanced}}

ambari-web/app/views/main/host/details/host_component_view.js

@@ -74,7 +74,7 @@ App.HostComponentView = Em.View.extend({
    */
   componentTextStatus: function () {
     if (this.get('content.passiveState') != 'ACTIVE') {
-      return Em.I18n.t('hosts.component.passive.mode');
+      return Em.I18n.t('hosts.component.passive.short.mode');
     }
     var workStatus = this.get("workStatus");
     var componentTextStatus = this.get('content.componentTextStatus');