AMBARI-11033. Missing tooltips and action alignment issues

ambari-web/app/messages.js

@@ -1753,7 +1753,7 @@ Em.I18n.translations = {
   'services.service.config.configHistory.dismissIcon.tooltip': 'Dismiss',
   'services.service.config.configHistory.makeCurrent.message': 'Created from service config version {0}',
   'services.service.config.configHistory.comparing': 'Comparing',
-  'services.service.config.setRecommendedValue': 'Set Recommended Value',
+  'services.service.config.setRecommendedValue': 'Set Recommended',
 
   'services.service.widgets.list-widget.nothingSelected': 'Nothing selected',
 

ambari-web/app/mixins/main/service/configs/config_overridable.js

@@ -65,6 +65,7 @@ App.ConfigOverridable = Em.Mixin.create({
     else {
       serviceConfigController.addOverrideProperty(serviceConfigProperty, selectedConfigGroup, serviceConfigProperty.get('widget') ? serviceConfigProperty.get('value') : null);
     }
+    Em.$('body>.tooltip').remove();
   },
 
   /**

ambari-web/app/styles/widgets.less

@@ -18,6 +18,7 @@
 @import 'common.less';
 
 @undo-btn-margin: 10px;
+@controls-min-width: 39px;
 @combo-widget-width: 100px;
 @green: #6ebd45;
 @slider-light-grey: #e6e6e6;
@@ -67,7 +68,9 @@
     display: inline-block;
     margin-left: 10px;
     min-height: 65px;
-    min-width: 39px;
+    min-width: @controls-min-width;
+    z-index: 1;
+    position: relative;
     &.version-labels {
       min-width: 52px;
       .label-current {
@@ -100,6 +103,16 @@
       }
     }
   }
+  .widget-config-raw {
+    width: calc(~"100% - 30px -"@controls-min-width);
+  }
+  &.slider-widget {
+    width: 100%;
+    overflow-x: hidden;
+    margin-left: -20px;
+    margin-right: 0;
+    padding-left: 20px;
+  }
 }
 
 .directory-textarea-wrapper {

ambari-web/app/templates/common/configs/widgets/controls.hbs

@@ -18,7 +18,7 @@
 
 {{#if view.canEdit}}
   {{#if view.supportSwitchToCheckBox}}
-    <div {{bindAttr class="view.showAsTextBox::hide :left"}}>
+    <div {{bindAttr class="view.showAsTextBox::hide :left :widget-config-raw"}}>
       {{view App.PlainConfigTextField serviceConfigBinding="view.config"}}
     </div>
   {{/if}}
@@ -26,7 +26,9 @@
     <div class="widget-col left">
       {{#if view.config.isNotDefaultValue}}
         {{#if view.undoAllowed}}
-          <a class="widget-action widget-action-undo" href="#" {{action "restoreValue" target="view"}}>
+            <a class="widget-action widget-action-undo" href="#"
+               data-toggle="tooltip" {{translateAttr data-original-title="common.undo"}}
+               {{action "restoreValue" target="view"}}>
             <i class="icon-undo"></i>
           </a>
         {{/if}}
@@ -34,6 +36,7 @@
       {{#if view.showPencil}}
         {{#if view.isWidgetViewAllowed}}
           <a href="#"
+            data-toggle="tooltip" {{translateAttr data-original-title="common.edit"}}
             {{bindAttr class=":icon-pencil :widget-action :widget-action-switch-view view.isHover::hide view.showAsTextBox::active"}}
             {{action "toggleWidgetView" target="view"}}>
           </a>

ambari-web/app/views/common/configs/widgets/config_widget_view.js

@@ -238,6 +238,7 @@ App.ConfigWidgetView = Em.View.extend(App.SupportsDependentConfigs, App.WidgetPo
     if (this.get('config.supportsFinal')) {
       this.get('config').set('isFinal', this.get('config.defaultIsFinal'));
     }
+    Em.$('body > .tooltip').remove();
   },
 
   /**

ambari-web/app/views/common/configs/widgets/plain_config_text_field.js

@@ -27,7 +27,7 @@ require('views/common/controls_view');
 App.PlainConfigTextField = Ember.View.extend(App.SupportsDependentConfigs, {
   templateName: require('templates/common/configs/widgets/plain_config_text_field'),
   valueBinding: 'serviceConfig.value',
-  classNames: ['span10', 'widget-config-plain-text-field'],
+  classNames: ['widget-config-plain-text-field'],
   placeholderBinding: 'serviceConfig.defaultValue',
   unit: function() {
     return Em.getWithDefault(this, 'serviceConfig.stackConfigProperty.valueAttributes.unit', false);