Fix add button display property and add tooltips

* Add tooltips to list add buttons of instance groups, instances, and applications.

awx/ui/client/features/applications/applications.strings.js

@@ -16,6 +16,10 @@ function ApplicationsStrings (BaseString) {
         USERS: t.s('Tokens')
     };
 
+    ns.tooltips = {
+        ADD: t.s('Create a new Application')
+    };
+
     ns.add = {
         PANEL_TITLE: t.s('NEW APPLICATION')
     };

awx/ui/client/features/applications/list-applications.controller.js

@@ -38,6 +38,10 @@ function ListApplicationsController (
         vm.applicationsCount = dataset.count;
     });
 
+    vm.tooltips = {
+        add: strings.get('tooltips.ADD')
+    };
+
     vm.getModified = app => {
         const modified = _.get(app, 'modified');
 

awx/ui/client/features/applications/list-applications.view.html

@@ -24,6 +24,8 @@
                     ui-sref="applications.add"
                     class="at-Button--add"
                     id="button-add"
+                    aw-tool-tip="{{vm.tooltips.add}}"
+                    data-placement="top"
                     aria-haspopup="true"
                     aria-expanded="false">
                 </button>

awx/ui/client/lib/theme/_global.less

@@ -24,7 +24,7 @@
         font-size: 20px;
     }
     border: none;
-    display: flex;
+    display: inline-flex;
     margin-left: @at-space-4x;
 
     &[aria-expanded="true"] {

awx/ui/client/src/instance-groups/instance-groups.strings.js

@@ -19,6 +19,11 @@ function InstanceGroupsStrings (BaseString) {
         JOBS: t.s('JOBS')
     };
 
+    ns.tooltips = {
+        ADD_INSTANCE_GROUP: t.s('Create a new Instance Group'),
+        ASSOCIATE_INSTANCES: t.s('Associate an existing Instance')
+    };
+
     ns.instance = {
         PANEL_TITLE: t.s('SELECT INSTANCE')
     };

awx/ui/client/src/instance-groups/instances/instances-list.partial.html

@@ -29,6 +29,8 @@
                     class="at-Button--add"
                     id="button-add"
                     ng-show="vm.isSuperuser"
+                    aw-tool-tip="{{vm.tooltips.add}}"
+                    data-placement="top"
                     aria-expanded="false">
                 </button>
                 <div ui-view="modal"></div>

awx/ui/client/src/instance-groups/instances/instances.controller.js

@@ -48,6 +48,10 @@ function InstancesController ($scope, $state, $http, models, Instance, strings,
         }
     };
 
+    vm.tooltips = {
+        add: strings.get('tooltips.ASSOCIATE_INSTANCES')
+    };
+
     vm.rowAction = {
         toggle: {
             _disabled: !vm.isSuperuser

awx/ui/client/src/instance-groups/list/instance-groups-list.controller.js

@@ -33,6 +33,10 @@ export default ['$scope', '$filter', '$state', 'Alert', 'resolvedModels', 'Datas
             vm.activeId = parseInt($state.params.instance_group_id);
         });
 
+        vm.tooltips = {
+            add: strings.get('tooltips.ADD_INSTANCE_GROUP')
+        };
+
         vm.rowAction = {
             trash: instance_group => {
                 return vm.isSuperuser && instance_group.name !== 'tower';

awx/ui/client/src/instance-groups/list/instance-groups-list.partial.html

@@ -25,6 +25,8 @@
                     class="at-Button--add"
                     id="button-add"
                     ng-show="vm.isSuperuser"
+                    aw-tool-tip="{{vm.tooltips.add}}"
+                    data-placement="top"
                     aria-haspopup="true"
                     aria-expanded="false">
                 </button>

awx/ui/test/e2e/objects/inventories.js

@@ -121,9 +121,9 @@ module.exports = {
             return this.navigate();
         },
         selectAdd (name) {
-            this.api.waitForElementVisible('button[id="button-add"]');
-            this.expect.element('button[id="button-add"]').enabled;
-            this.api.click('button[id="button-add"]');
+            this.api.waitForElementVisible('#button-add');
+            this.expect.element('#button-add').enabled;
+            this.api.click('#button-add');
 
             this.api.useXpath();
             this.api.waitForElementVisible(`.//a[normalize-space(text())="${name}"]`);