diff --git a/awx/ui/client/legacy-styles/ansible-ui.less b/awx/ui/client/legacy-styles/ansible-ui.less index 41076d3dc9..5a825ba5c6 100644 --- a/awx/ui/client/legacy-styles/ansible-ui.less +++ b/awx/ui/client/legacy-styles/ansible-ui.less @@ -1406,7 +1406,7 @@ input[type="checkbox"].checkbox-no-label { #inventories_table i[class*="icon-job-"], #home_groups_table i[class*="icon-job-"] { - margin-left: 10px; + margin-left: 5px; } .selected { @@ -1990,6 +1990,10 @@ button.dropdown-toggle, border-left-color: #848992; } +.tooltip.right .tooltip-arrow { + border-right-color: #848992; +} + .tooltip.Tooltip.fade.bottom.in { opacity: 1; padding-top: 4px; diff --git a/awx/ui/client/legacy-styles/jobs.less b/awx/ui/client/legacy-styles/jobs.less index bc1fe5cbc5..05f4fd8d44 100644 --- a/awx/ui/client/legacy-styles/jobs.less +++ b/awx/ui/client/legacy-styles/jobs.less @@ -17,10 +17,6 @@ } .job-list { - thead >tr >th, .page-row { - font-size: 12px; - color: #666; - } .pagination li { } diff --git a/awx/ui/client/legacy-styles/lists.less b/awx/ui/client/legacy-styles/lists.less index 55b3242fa1..22d259e535 100644 --- a/awx/ui/client/legacy-styles/lists.less +++ b/awx/ui/client/legacy-styles/lists.less @@ -271,3 +271,17 @@ table, tbody { .List-searchRow { margin-bottom: 20px; } + +.List-staticColumn--smallStatus { + width: 25px; + padding-right: 0px!important; +} + +.List-staticColumn--mediumStatus { + width: 51px; + padding-right: 0px!important; +} + +.List-staticColumnAdjacent { + padding-left: 10px!important; +} diff --git a/awx/ui/client/src/forms/Inventories.js b/awx/ui/client/src/forms/Inventories.js index 1c5567c503..746c8a49a9 100644 --- a/awx/ui/client/src/forms/Inventories.js +++ b/awx/ui/client/src/forms/Inventories.js @@ -98,7 +98,7 @@ export default fields: { smart_status: { label: 'Status', - // columnClass: 'col-md-2 col-sm-2 col-xs-2', + columnClass: 'List-tableCell', searchable: false, nosort: true, ngInclude: "'/static/partials/scan-job-template-smart-status.html'", diff --git a/awx/ui/client/src/lists/AllJobs.js b/awx/ui/client/src/lists/AllJobs.js index eb33c23744..3a99817c99 100644 --- a/awx/ui/client/src/lists/AllJobs.js +++ b/awx/ui/client/src/lists/AllJobs.js @@ -17,30 +17,13 @@ export default well: false, fields: { - id: { - label: 'ID', - ngClick:"viewJobLog(all_job.id)", - searchType: 'int', - columnClass: 'col-lg-1 col-md-1 col-sm-2 col-xs-2', - awToolTip: "{{ all_job.status_tip }}", - dataPlacement: 'top' - }, - name: { - label: 'Name', - columnClass: 'col-lg-3 col-md-3 col-sm-3 col-xs-3', - ngClick: "viewJobLog(all_job.id, all_job.nameHref)", - defaultSearchField: true, - awToolTip: "{{ all_job.name | sanitize }}", - dataPlacement: 'top' - }, status: { - label: 'Status', - columnClass: 'col-lg-2 col-md-2 col-sm-2 col-xs-3', + label: '', + columnClass: 'List-staticColumn--smallStatus', awToolTip: "{{ all_job.status_tip }}", - awTipPlacement: "top", + awTipPlacement: "right", dataTitle: "{{ all_job.status_popover_title }}", icon: 'icon-job-{{ all_job.status }}', - alt_text: "{{all_job.status_label}}", iconOnly: true, ngClick:"viewJobLog(all_job.id)", searchable: true, @@ -53,11 +36,27 @@ export default { name: "Canceled", value: "canceled" } ] }, + id: { + label: 'ID', + ngClick:"viewJobLog(all_job.id)", + searchType: 'int', + columnClass: 'col-lg-1 col-md-1 col-sm-2 col-xs-2 List-staticColumnAdjacent', + awToolTip: "{{ all_job.status_tip }}", + dataPlacement: 'top' + }, + name: { + label: 'Name', + columnClass: 'col-lg-3 col-md-3 col-sm-4 col-xs-6', + ngClick: "viewJobLog(all_job.id, all_job.nameHref)", + defaultSearchField: true, + awToolTip: "{{ all_job.name | sanitize }}", + dataPlacement: 'top' + }, type: { label: 'Type', ngBind: 'all_job.type_label', link: false, - columnClass: "col-lg-2 col-md-2 hidden-sm hidden-xs", + columnClass: "col-lg-3 col-md-3 hidden-sm hidden-xs", columnShow: "showJobType", searchable: true, searchType: 'select', @@ -68,7 +67,7 @@ export default noLink: true, searchable: false, filter: "longDate", - columnClass: "col-lg-2 col-md-2 col-sm-2 hidden-xs", + columnClass: "col-lg-3 col-md-3 col-sm-3 hidden-xs", key: true, desc: true }, diff --git a/awx/ui/client/src/lists/CompletedJobs.js b/awx/ui/client/src/lists/CompletedJobs.js index ec7ba5d62b..4ed0d96dbf 100644 --- a/awx/ui/client/src/lists/CompletedJobs.js +++ b/awx/ui/client/src/lists/CompletedJobs.js @@ -19,19 +19,11 @@ export default well: false, fields: { - id: { - label: 'ID', - ngClick:"viewJobLog(completed_job.id)", - searchType: 'int', - columnClass: 'col-lg-1 col-md-1 col-sm-2 col-xs-2', - awToolTip: "{{ completed_job.status_tip }}", - dataPlacement: 'top' - }, status: { - label: 'Status', - columnClass: 'col-lg-1 col-md-2 col-sm-2 col-xs-2', + label: '', + columnClass: 'List-staticColumn--smallStatus', awToolTip: "{{ completed_job.status_tip }}", - awTipPlacement: "top", + awTipPlacement: "right", dataTitle: "{{ completed_job.status_popover_title }}", icon: 'icon-job-{{ completed_job.status }}', iconOnly: true, @@ -46,12 +38,28 @@ export default { name: "Canceled", value: "canceled" } ] }, + id: { + label: 'ID', + ngClick:"viewJobLog(completed_job.id)", + searchType: 'int', + columnClass: 'col-lg-1 col-md-1 col-sm-2 col-xs-2 List-staticColumnAdjacent', + awToolTip: "{{ completed_job.status_tip }}", + dataPlacement: 'top' + }, + name: { + label: 'Name', + columnClass: 'col-lg-4 col-md-4 col-sm-4 col-xs-6', + ngClick: "viewJobLog(completed_job.id, completed_job.nameHref)", + defaultSearchField: true, + awToolTip: "{{ completed_job.name | sanitize }}", + dataPlacement: 'top' + }, finished: { label: 'Finished', noLink: true, searchable: false, filter: "longDate", - columnClass: "col-lg-2 col-md-2 hidden-xs", + columnClass: "col-lg-3 col-md-3 col-sm-3 hidden-xs", key: true, desc: true }, @@ -65,14 +73,6 @@ export default searchType: 'select', searchOptions: [] // populated via GetChoices() in controller }, - name: { - label: 'Name', - columnClass: 'col-md-3 col-sm-4 col-xs-4', - ngClick: "viewJobLog(completed_job.id, completed_job.nameHref)", - defaultSearchField: true, - awToolTip: "{{ completed_job.name | sanitize }}", - dataPlacement: 'top' - }, failed: { label: 'Job failed?', searchSingleValue: true, @@ -86,6 +86,9 @@ export default actions: { }, fieldActions: { + + columnClass: 'col-lg-2 col-md-2 col-sm-3 col-xs-4', + stdout: { mode: 'all', href: '/#/jobs/{{ completed_job.id }}/stdout', diff --git a/awx/ui/client/src/lists/HomeGroups.js b/awx/ui/client/src/lists/HomeGroups.js index bcb242d132..ad7180dff0 100644 --- a/awx/ui/client/src/lists/HomeGroups.js +++ b/awx/ui/client/src/lists/HomeGroups.js @@ -18,8 +18,8 @@ export default fields: { status: { - label: 'Status', - columnClass: 'col-md-2 col-sm-2 col-xs-2', + label: '', + columnClass: 'List-staticColumn--mediumStatus', searchable: false, nosort: true, ngClick: "null", @@ -28,13 +28,13 @@ export default icon: "{{ 'icon-cloud-' + group.status_class }}", awToolTip: "{{ group.status_tooltip }}", dataTipWatch: "group.launch_tooltip", - awTipPlacement: "top", + awTipPlacement: "right", ngClick: "viewUpdateStatus(group.id)", ngClass: "group.launch_class" },{ icon: "{{ 'icon-job-' + group.hosts_status_class }}", awToolTip: "{{ group.hosts_status_tip }}", - awTipPlacement: "top", + awTipPlacement: "right", ngClick: "showHostSummary($event, group.id)", ngClass: "" }] @@ -43,13 +43,13 @@ export default key: true, label: 'Group', ngClick: "editGroup(group.id, group.inventory)", - columnClass: 'col-lg-4 col-md3 col-sm-3 col-xs-6 ellipsis' + columnClass: 'col-lg-6 col-md-5 col-sm-5 col-xs-8 ellipsis List-staticColumnAdjacent' }, inventory_name: { label: 'Inventory', sourceModel: 'inventory', sourceField: 'name', - columnClass: 'col-lg-3 col-md2 col-sm-2 hidden-xs elllipsis', + columnClass: 'col-lg-4 col-md-5 col-sm-3 hidden-xs elllipsis', linkTo: "{{ '/#/inventories/' + group.inventory + '/' }}" }, source: { @@ -117,6 +117,9 @@ export default }, fieldActions: { + + columnClass: 'col-lg-2 col-md-2 col-sm-4 col-xs-4', + /* sync_status: { mode: 'all', @@ -161,7 +164,7 @@ export default }, actions: { - + } }); diff --git a/awx/ui/client/src/lists/HomeHosts.js b/awx/ui/client/src/lists/HomeHosts.js index c3cfcf0ccd..9d36d7dc2c 100644 --- a/awx/ui/client/src/lists/HomeHosts.js +++ b/awx/ui/client/src/lists/HomeHosts.js @@ -19,23 +19,22 @@ export default fields: { status: { - label: "Status", + label: "", iconOnly: true, icon: "{{ 'icon-job-' + host.active_failures }}", awToolTip: "{{ host.badgeToolTip }}", - awTipPlacement: "top", + awTipPlacement: "right", dataPlacement: "right", awPopOver: "{{ host.job_status_html }}", - dataTitle: "{{ host.job_status_title }}", ngClick:"bob", - columnClass: "col-md-1 col-sm-2 col-xs-3", + columnClass: "List-staticColumn--smallStatus", searchable: false, nosort: true }, name: { key: true, label: 'Name', - columnClass: 'col-lg-4 col-md3 col-sm-3 col-xs-7 ellipsis', + columnClass: 'col-lg-5 col-md-5 col-sm-5 col-xs-8 ellipsis List-staticColumnAdjacent', ngClass: "{ 'host-disabled-label': !host.enabled }", ngClick: "editHost(host.id)" }, @@ -43,7 +42,7 @@ export default label: 'Inventory', sourceModel: 'inventory', sourceField: 'name', - columnClass: 'col-lg-3 col-md2 col-sm-2 hidden-xs elllipsis', + columnClass: 'col-lg-5 col-md-4 col-sm-4 hidden-xs elllipsis', linkTo: "{{ '/#/inventories/' + host.inventory }}" }, enabled: { @@ -74,6 +73,9 @@ export default }, fieldActions: { + + columnClass: 'col-lg-2 col-md-3 col-sm-3 col-xs-4', + /*active_failures: { //label: 'Job Status', //ngHref: "\{\{'/#/hosts/' + host.id + '/job_host_summaries/?inventory=' + inventory_id \}\}", @@ -94,7 +96,7 @@ export default }, actions: { - + } }); diff --git a/awx/ui/client/src/lists/Inventories.js b/awx/ui/client/src/lists/Inventories.js index 25770b8a01..75c02ad7c3 100644 --- a/awx/ui/client/src/lists/Inventories.js +++ b/awx/ui/client/src/lists/Inventories.js @@ -21,8 +21,8 @@ export default fields: { status: { - label: 'Status', - columnClass: 'col-md-2 col-sm-2 col-xs-2', + label: '', + columnClass: 'List-staticColumn--mediumStatus', searchable: false, nosort: true, ngClick: "null", @@ -31,13 +31,13 @@ export default icons: [{ icon: "{{ 'icon-cloud-' + inventory.syncStatus }}", awToolTip: "{{ inventory.syncTip }}", - awTipPlacement: "top", + awTipPlacement: "right", ngClick: "showGroupSummary($event, inventory.id)", ngClass: "inventory.launch_class" },{ icon: "{{ 'icon-job-' + inventory.hostsStatus }}", awToolTip: "{{ inventory.hostsTip }}", - awTipPlacement: "top", + awTipPlacement: "right", ngClick: "showHostSummary($event, inventory.id)", ngClass: "" }] @@ -45,7 +45,7 @@ export default name: { key: true, label: 'Name', - columnClass: 'col-md-4 col-sm-6 col-xs-6', + columnClass: 'col-md-5 col-sm-5 col-xs-8 List-staticColumnAdjacent', modalColumnClass: 'col-md-8', linkTo: '/#/inventories/{{inventory.id}}/manage' }, @@ -56,7 +56,7 @@ export default sourceModel: 'organization', sourceField: 'name', excludeModal: true, - columnClass: 'col-md-4 hidden-sm hidden-xs' + columnClass: 'col-md-5 col-sm-3 hidden-xs' }, has_inventory_sources: { label: 'Cloud sourced?', diff --git a/awx/ui/client/src/lists/PortalJobs.js b/awx/ui/client/src/lists/PortalJobs.js index 07fa2af312..645eb90e32 100644 --- a/awx/ui/client/src/lists/PortalJobs.js +++ b/awx/ui/client/src/lists/PortalJobs.js @@ -18,26 +18,12 @@ export default well: true, fields: { - id: { - label: 'ID', - //ngClick:"viewJobLog(job.id)", - key: true, - noLink: true, //undocumented: 'key' above will automatically made the fields a link, but 'noLink' will override this setting - desc: true, - searchType: 'int', - columnClass: 'col-lg-1 col-md-1 col-sm-2 col-xs-2', - // awToolTip: "{{ job.status_tip }}", - // awTipPlacement: "top", - }, status: { - label: 'Status', - columnClass: 'col-lg-1 col-md-2 col-sm-2 col-xs-2', - // awToolTip: "{{ job.status_tip }}", - // awTipPlacement: "top", + label: '', + columnClass: 'List-staticColumn--smallStatus', dataTitle: "{{ portal_job.status_popover_title }}", icon: 'icon-job-{{ portal_job.status }}', iconOnly: true, - // ngClick:"viewJobLog(job.id)", searchable: true, nosort: true, searchType: 'select', @@ -48,24 +34,34 @@ export default { name: "Canceled", value: "canceled" } ] }, + id: { + label: 'ID', + key: true, + noLink: true, //undocumented: 'key' above will automatically made the fields a link, but 'noLink' will override this setting + desc: true, + searchType: 'int', + columnClass: 'col-lg-1 col-md-1 col-sm-2 col-xs-2 List-staticColumnAdjacent', + }, + name: { + label: 'Name', + columnClass: 'col-lg-4 col-md-4 col-sm-4 col-xs-6', + defaultSearchField: true + }, started: { label: 'Started', noLink: true, searchable: false, filter: "longDate", - columnClass: "col-lg-3 col-md-3 hidden-sm" - }, - name: { - label: 'Name', - columnClass: 'col-md-5 col-xs-5', - //ngClick: "viewJobLog(job.id, job.nameHref)", - defaultSearchField: true + columnClass: "col-lg-4 col-md-4 col-sm-3 xs-hidden" } }, actions: { }, fieldActions: { + + columnClass: 'col-lg-3 col-md-4 col-sm-3 col-xs-4', + job_details: { mode: 'all', ngClick: "viewJobLog(portal_job.id)", diff --git a/awx/ui/client/src/lists/Projects.js b/awx/ui/client/src/lists/Projects.js index aeeb484fa5..cd76d48dcd 100644 --- a/awx/ui/client/src/lists/Projects.js +++ b/awx/ui/client/src/lists/Projects.js @@ -21,14 +21,14 @@ export default fields: { status: { - label: 'Status', + label: '', iconOnly: true, ngClick: 'showSCMStatus(project.id)', awToolTip: '{{ project.statusTip }}', dataTipWatch: 'project.statusTip', - dataPlacement: 'top', + dataPlacement: 'right', icon: "icon-job-{{ project.statusIcon }}", - columnClass: "col-lg-1 col-md-1 col-sm-2 col-xs-2", + columnClass: "List-staticColumn--smallStatus", nosort: true, searchType: 'select', searchOptions: [], //set in the controller @@ -37,7 +37,7 @@ export default name: { key: true, label: 'Name', - columnClass: "col-lg-5 col-md-4 col-sm-6 col-xs-6", + columnClass: "col-lg-4 col-md-4 col-sm-5 col-xs-7 List-staticColumnAdjacent", modalColumnClass: 'col-md-8' }, scm_type: { @@ -45,12 +45,12 @@ export default searchType: 'select', searchOptions: [], // will be set by Options call to projects resource excludeModal: true, - columnClass: 'col-lg-2 col-md-2 hidden-sm hidden-xs' + columnClass: 'col-lg-3 col-md-2 col-sm-3 hidden-xs' }, last_updated: { label: 'Last Updated', filter: "longDate", - columnClass: "col-lg-2 col-md-2 hidden-sm hidden-xs", + columnClass: "col-lg-3 col-md-3 hidden-sm hidden-xs", excludeModal: true, searchable: false, nosort: true @@ -77,7 +77,7 @@ export default fieldActions: { - columnClass: 'col-lg-2 col-md-3 col-sm-4 col-xs-4', + columnClass: 'col-lg-2 col-md-3 col-sm-4 col-xs-5', scm_update: { ngClick: 'SCMUpdate(project.id, $event)', diff --git a/awx/ui/client/src/lists/ScheduledJobs.js b/awx/ui/client/src/lists/ScheduledJobs.js index 82ad8b558a..07ab0256c0 100644 --- a/awx/ui/client/src/lists/ScheduledJobs.js +++ b/awx/ui/client/src/lists/ScheduledJobs.js @@ -18,10 +18,10 @@ export default fields: { status: { - label: 'Status', - columnClass: 'col-lg-1 col-md-2 col-sm-2 col-xs-2', + label: '', + columnClass: 'List-staticColumn--smallStatus', awToolTip: "{{ schedule.status_tip }}", - awTipPlacement: "top", + awTipPlacement: "right", icon: 'icon-job-{{ schedule.status }}', iconOnly: true, ngClick: "toggleSchedule($event, schedule.id)", @@ -30,7 +30,7 @@ export default }, name: { label: 'Name', - columnClass: 'col-lg-3 col-md-3 col-sm-3 col-xs-5', + columnClass: 'col-lg-4 col-md-5 col-sm-5 col-xs-7 List-staticColumnAdjacent', sourceModel: 'unified_job_template', sourceField: 'name', ngClick: "editSchedule(schedule.id)",