diff --git a/awx/ui/client/legacy-styles/lists.less b/awx/ui/client/legacy-styles/lists.less index 7e36f610cc..c1fc2b1164 100644 --- a/awx/ui/client/legacy-styles/lists.less +++ b/awx/ui/client/legacy-styles/lists.less @@ -60,7 +60,7 @@ table, tbody { height: 40px; font-size: 14px; color: @list-item; - border-bottom: 1px solid #d7d7d7; + border-bottom: 1px solid #E1E1E1; } .List-tableRow:last-of-type { @@ -81,8 +81,7 @@ table, tbody { } .List-tableCell { - padding-left: 15px; - padding-right: 15px; + padding: 7px 15px; border-top:0px!important; word-wrap: break-word; } diff --git a/awx/ui/client/src/templates/labels/labelsList.block.less b/awx/ui/client/src/templates/labels/labelsList.block.less index 9eab78e389..b384579314 100644 --- a/awx/ui/client/src/templates/labels/labelsList.block.less +++ b/awx/ui/client/src/templates/labels/labelsList.block.less @@ -7,10 +7,11 @@ align-items: flex-start; } -.LabelList-tagContainer, + +.LabelList-tagContainer, .LabelList-seeMoreLess { display: flex; - max-width: 100%; + max-width: 200px; } .LabelList-tag { @@ -22,9 +23,6 @@ background-color: @default-list-header-bg; margin-right: 5px; max-width: 100%; - white-space: nowrap; - text-overflow: ellipsis; - overflow: hidden; } .LabelList-seeMoreLess { @@ -86,3 +84,9 @@ .LabelList-deleteContainer:hover > .LabelList-tagDelete { color: @default-bg; } + +@media (max-width: 1200px) { + .List-tableCell.col-md-4 { + padding-left: 40px; + } +} \ No newline at end of file diff --git a/awx/ui/client/src/templates/labels/labelsList.directive.js b/awx/ui/client/src/templates/labels/labelsList.directive.js index 69a2295549..ba7bc06d1b 100644 --- a/awx/ui/client/src/templates/labels/labelsList.directive.js +++ b/awx/ui/client/src/templates/labels/labelsList.directive.js @@ -50,7 +50,7 @@ export default scope.seeLess = function() { // Trim the labels array back down to 10 items - scope.labels = scope.labels.slice(0, 10); + scope.labels = scope.labels.slice(0, 5); // Re-set the seeMoreInteractive flag so that the "See More" will be displayed scope.seeMoreInactive = true; }; @@ -95,7 +95,7 @@ export default // To keep the array of labels fresh, we need to set up a watcher - otherwise, the // array will get set initially and then never be updated as labels are removed if (scope[scope.$parent.list.iterator].summary_fields.labels){ - scope.labels = scope[scope.$parent.list.iterator].summary_fields.labels.results; + scope.labels = scope[scope.$parent.list.iterator].summary_fields.labels.results.slice(0, 5); scope.count = scope[scope.$parent.list.iterator].summary_fields.labels.count; } else{ diff --git a/awx/ui/client/src/templates/labels/labelsList.partial.html b/awx/ui/client/src/templates/labels/labelsList.partial.html index e614692a6e..15ca1e905a 100644 --- a/awx/ui/client/src/templates/labels/labelsList.partial.html +++ b/awx/ui/client/src/templates/labels/labelsList.partial.html @@ -8,7 +8,7 @@ {{ label.name }} -
View More
-
View Less