On related sets, moved create button near filter widget and added labels to all buttons.

ansibleworks/ui/static/css/ansible-ui.css

@@ -259,6 +259,7 @@
  /* Display list actions next to search widget */
  .search-widget {
     display: inline-block;
+    vertical-align: bottom;
  }
 
  .list-actions {

ansibleworks/ui/static/js/forms/JobTemplates.js

@@ -158,8 +158,9 @@ angular.module('JobTemplateFormDefinition', [])
                 
                 fieldActions: {
                     edit: {
+                        label: 'View',
                         ngClick: "edit('jobs', \{\{ job.id \}\}, '\{\{ job.name \}\}')",
-                        icon: 'icon-edit'
+                        icon: 'icon-zoom-in'
                         }
                     }
                 },

ansibleworks/ui/static/js/forms/Organizations.js

@@ -77,10 +77,13 @@ angular.module('OrganizationFormDefinition', [])
                 
                 fieldActions: {
                     edit: {
+                        label: 'Edit',
                         ngClick: "edit('users', \{\{ user.id \}\}, '\{\{ user.username \}\}')",
-                        icon: 'icon-edit'
+                        icon: 'icon-edit',
+                        class: 'btn-success'
                         },
                     delete: {
+                        label: 'Delete',
                         ngClick: "delete('users', \{\{ user.id \}\}, '\{\{ user.username \}\}', 'users')",
                         icon: 'icon-remove',
                         class: 'btn-danger'
@@ -113,7 +116,14 @@ angular.module('OrganizationFormDefinition', [])
                         }
                     },
                 fieldActions: {                                           // Actions available on each row
+                    edit: {
+                        label: 'Edit',
+                        ngClick: "edit('users', \{\{ admin.id \}\}, '\{\{ admin.username \}\}')",
+                        icon: 'icon-edit',
+                        class: 'btn-success'
+                        },
                     delete: {
+                        label: 'Delete',
                         ngClick: "delete('admins', \{\{ admin.id \}\}, '\{\{ admin.username \}\}', 'administrators')",
                         icon: 'icon-remove',
                         class: 'btn-danger'

ansibleworks/ui/static/js/forms/Teams.js

@@ -86,10 +86,13 @@ angular.module('TeamFormDefinition', [])
                 
                 fieldActions: {
                     edit: {
+                        label: 'Edit',
                         ngClick: "edit('users', \{\{ user.id \}\}, '\{\{ user.username \}\}')",
-                        icon: 'icon-edit'
+                        icon: 'icon-edit',
+                        class: 'btn-success'
                         },
                     delete: {
+                        label: 'Delete',
                         ngClick: "delete('users', \{\{ user.id \}\}, '\{\{ user.username \}\}', 'users')",
                         icon: 'icon-remove',
                         class: 'btn-danger'
@@ -122,10 +125,13 @@ angular.module('TeamFormDefinition', [])
                 
                 fieldActions: {
                     edit: {
+                        label: 'Edit',
                         ngClick: "edit('credentials', \{\{ credential.id \}\}, '\{\{ credential.name \}\}')",
-                        icon: 'icon-edit'
+                        icon: 'icon-edit',
+                        class: 'btn-success'
                         },
                     delete: {
+                        label: 'Delete',
                         ngClick: "delete('credentials', \{\{ credential.id \}\}, '\{\{ credential.name \}\}', 'credentials')",
                         icon: 'icon-remove',
                         class: 'btn-danger'
@@ -158,10 +164,13 @@ angular.module('TeamFormDefinition', [])
                 
                 fieldActions: {
                     edit: {
+                        label: 'Edit',
                         ngClick: "edit('projects', \{\{ project.id \}\}, '\{\{ project.name \}\}')",
-                        icon: 'icon-edit'
+                        icon: 'icon-edit',
+                        class: 'btn-success'
                         },
                     delete: {
+                        label: 'Delete',
                         ngClick: "delete('projects', \{\{ project.id \}\}, '\{\{ project.name \}\}', 'projects')",
                         icon: 'icon-remove',
                         class: 'btn-danger'

ansibleworks/ui/static/js/forms/Users.js

@@ -178,10 +178,13 @@ angular.module('UserFormDefinition', [])
 
                 fieldActions: {
                     edit: {
+                        label: 'Edit',
                         ngClick: "edit('credentials', \{\{ credential.id \}\}, '\{\{ credential.name \}\}')",
-                        icon: 'icon-edit'
+                        icon: 'icon-edit',
+                        class: 'btn-success'
                         },
                     delete: {
+                        label: 'Delete',
                         ngClick: "delete('credentials', \{\{ credential.id \}\}, '\{\{ credential.name \}\}', 'credentials')",
                         icon: 'icon-remove',
                         class: 'btn-danger'

ansibleworks/ui/static/lib/ansible/form-generator.js

@@ -619,7 +619,7 @@ angular.module('FormGenerator', ['GeneratorHelpers'])
                     html += "<div class=\"text-right actions\">\n";
                     for (var act in form.related[itm].actions) {
                         var action = form.related[itm].actions[act];
-                        html += "<button class=\"btn btn-mini btn-success\" ";
+                        html += "<button class=\"btn btn-small btn-success\" ";
                         html += this.attr(action,'ngClick');
                         html += (action.awToolTip) ? this.attr(action,'awToolTip') : "";
                         html += ">" + this.icon(action.icon) + "</button>\n";
@@ -635,7 +635,7 @@ angular.module('FormGenerator', ['GeneratorHelpers'])
                   html += SearchWidget({ iterator: form.related[itm].iterator, template: form.related[itm], mini: true });
 
                   // Add actions(s)
-                  html += "<div class=\"text-right actions\">\n";
+                  html += "<div class=\"list-actions\">\n";
                   for (var action in form.related[itm].actions) {
                       html += "<button class=\"btn btn-mini btn-success\" ";
                       html += this.attr(form.related[itm]['actions'][action],'ngClick');
@@ -690,11 +690,12 @@ angular.module('FormGenerator', ['GeneratorHelpers'])
                   html += "<td class=\"actions\">";
                   for (action in form.related[itm].fieldActions) {
                       html += "<button class=\"btn btn-mini"; 
-                      if (form.related[itm]['fieldActions'][action].class) {
+                      html += (form.related[itm]['fieldActions'][action].class) ?
-                         html += " " + form.related[itm]['fieldActions'][action].class;
+                          " " + form.related[itm]['fieldActions'][action].class : "";
-                      }
                       html += "\" " + this.attr(form.related[itm]['fieldActions'][action],'ngClick') +
-                              ">" + this.icon(form.related[itm]['fieldActions'][action].icon) + "</button> ";
+                          ">" + this.icon(form.related[itm]['fieldActions'][action].icon);
+                      html += (form.related[itm].fieldActions[action].label) ?  " " + form.related[itm].fieldActions[action].label : ""; 
+                      html += "</button> ";
                   }
                   html += "</td>";
                   html += "</tr>\n";