Repository: brooklyn-ui Updated Branches: refs/heads/master 43c154c39 -> e226b481d
add compact list view mode Project: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/repo Commit: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/commit/cb074a5c Tree: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/tree/cb074a5c Diff: http://git-wip-us.apache.org/repos/asf/brooklyn-ui/diff/cb074a5c Branch: refs/heads/master Commit: cb074a5c4210fcc5bff57bbd490d5a3077b71e29 Parents: 65d3740 Author: Juan Cabrerizo <[email protected]> Authored: Wed Nov 7 16:41:39 2018 +0000 Committer: Juan Cabrerizo <[email protected]> Committed: Wed Nov 7 16:41:39 2018 +0000 ---------------------------------------------------------------------- .../catalog-selector.directive.js | 3 ++- .../catalog-selector/catalog-selector.less | 22 +++++++++++++++++--- 2 files changed, 21 insertions(+), 4 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/cb074a5c/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.directive.js ---------------------------------------------------------------------- diff --git a/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.directive.js b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.directive.js index 60f7beb..298ba80 100644 --- a/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.directive.js +++ b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.directive.js @@ -36,6 +36,7 @@ const PALETTE_VIEW_MODES = { normal: { name: "Normal", classes: "col-xs-3", itemsPerRow: 4 }, large: { name: "Large", classes: "col-xs-4", itemsPerRow: 3 }, list: { name: "List", classes: "col-xs-12 item-full-width", itemsPerRow: 1 }, + compactList: { name: "Compact list", classes: "col-xs-12 item-compact-list", itemsPerRow: 1, rowHeightPx: 30 }, }; // fields in either bundle or type record: @@ -63,7 +64,7 @@ function link($scope, $element, attrs, controller) { // repaginate when load completes (and items are shown), or it is resized $scope.$watchGroup( - [ () => $scope.isLoading, () => main[0].offsetHeight, () => $scope.state.viewMode.itemsPerRow ], + [ () => $scope.isLoading, () => main[0].offsetHeight, () => $scope.state.viewMode.name ], (values) => controller.$timeout( () => repaginate($scope, $element) ) ); // also repaginate on window resize angular.element(window).bind('resize', () => repaginate($scope, $element)); http://git-wip-us.apache.org/repos/asf/brooklyn-ui/blob/cb074a5c/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.less ---------------------------------------------------------------------- diff --git a/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.less b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.less index d22ef1f..95e550e 100644 --- a/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.less +++ b/ui-modules/blueprint-composer/app/components/catalog-selector/catalog-selector.less @@ -45,7 +45,8 @@ catalog-selector { &.item-compact { height: 75px; } - + + &.item-compact-list, &.item-full-width { .item { display: flex; @@ -53,8 +54,6 @@ catalog-selector { .item-logo { flex: 0 0 auto; width: auto; - height: 78px; - min-width: 90px; img { margin: 0; width: auto; @@ -72,6 +71,23 @@ catalog-selector { } } } + &.item-compact-list{ + height: 30px; + .item { + .item-logo { + height: 20px; + min-width: 20px; + } + } + } + &.item-full-width{ + .item { + .item-logo { + height: 78px; + min-width: 90px; + } + } + } } .catalog-palette-footer { padding-bottom: 5px;
