diff options
Diffstat (limited to 'catalog-ui/src/app/ng2/pages')
20 files changed, 638 insertions, 716 deletions
diff --git a/catalog-ui/src/app/ng2/pages/attributes-outputs/attributes-outputs.page.component.less b/catalog-ui/src/app/ng2/pages/attributes-outputs/attributes-outputs.page.component.less index 9cce0a51c6..386d243976 100644 --- a/catalog-ui/src/app/ng2/pages/attributes-outputs/attributes-outputs.page.component.less +++ b/catalog-ui/src/app/ng2/pages/attributes-outputs/attributes-outputs.page.component.less @@ -17,7 +17,7 @@ height: 100%; } -/deep/ .tabs { +/deep/ tabs { display: flex; flex-direction: column; height: 100%; diff --git a/catalog-ui/src/app/ng2/pages/composition/capabilities-filter-properties-editor/capabilities-filter-properties-editor.component.less b/catalog-ui/src/app/ng2/pages/composition/capabilities-filter-properties-editor/capabilities-filter-properties-editor.component.less index 4ceb43ef5d..188fb7b5ef 100644 --- a/catalog-ui/src/app/ng2/pages/composition/capabilities-filter-properties-editor/capabilities-filter-properties-editor.component.less +++ b/catalog-ui/src/app/ng2/pages/composition/capabilities-filter-properties-editor/capabilities-filter-properties-editor.component.less @@ -14,7 +14,6 @@ .i-sdc-form-item { width: 250px; - &.operation { width: 60px; } @@ -23,25 +22,20 @@ .rule-builder-content { display: flex; align-items: flex-end; - .rule-input-field { flex: 1; - &:not(:last-of-type) { margin-right: 20px; } - - &.operator { + &.operator{ width: 55px; flex: 0 1 auto; } - &.assigned-value-field { margin-bottom: 10px; } - - /deep/ .ui-element-dropdown select, - /deep/ .ui-element-input input { + /deep/ ui-element-dropdown select, + /deep/ ui-element-input input { height: 30px; } } diff --git a/catalog-ui/src/app/ng2/pages/composition/graph/composition-graph.component.less b/catalog-ui/src/app/ng2/pages/composition/graph/composition-graph.component.less index aebea3bea6..b3e5ef3a0c 100644 --- a/catalog-ui/src/app/ng2/pages/composition/graph/composition-graph.component.less +++ b/catalog-ui/src/app/ng2/pages/composition/graph/composition-graph.component.less @@ -1,4 +1,4 @@ -:host(.composition-graph) { +:host(composition-graph) { flex: 1; padding-top: 53px; } @@ -34,7 +34,7 @@ right: 310px; } - .ng2-zone-container { + ng2-zone-container { display: flex; margin-left: 10px; } diff --git a/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/connection-properties-view/connection-properties-view.component.less b/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/connection-properties-view/connection-properties-view.component.less index 87e9ae1e03..07f9aa2135 100644 --- a/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/connection-properties-view/connection-properties-view.component.less +++ b/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/connection-properties-view/connection-properties-view.component.less @@ -1,4 +1,4 @@ -.connection-wizard-header { - display: block; - margin-bottom: 15px; +connection-wizard-header { + display: block; + margin-bottom: 15px; } diff --git a/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/create-interface-operation/create-input-row/create-input-row.component.less b/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/create-interface-operation/create-input-row/create-input-row.component.less index 2d77d9ae4a..316d49e406 100644 --- a/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/create-interface-operation/create-input-row/create-input-row.component.less +++ b/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/create-interface-operation/create-input-row/create-input-row.component.less @@ -24,7 +24,7 @@ align-items: center; justify-content: center; - .svg-icon { + svg-icon { position: relative; right: -3px; @@ -34,6 +34,7 @@ } } + .cell { min-height: 50px; padding: 10px; diff --git a/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/create-interface-operation/create-interface-operation.component.less b/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/create-interface-operation/create-interface-operation.component.less index 4c72281626..4c7f8aba48 100644 --- a/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/create-interface-operation/create-interface-operation.component.less +++ b/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/create-interface-operation/create-interface-operation.component.less @@ -44,7 +44,7 @@ height: 38px; line-height: 35px; - .svg-icon { + svg-icon { margin: 13px 6px; } } @@ -142,13 +142,11 @@ position: relative; top: 2px; } - /deep/ .tooltip-inner { padding: 2px; max-width: 270px; font-size: 11px; } - &.remove { padding: 10px; font-size: 10px; @@ -206,8 +204,7 @@ display: flex; justify-content: flex-end; align-items: center; - - .sdc-button { + sdc-button { margin: 0 5px; } } diff --git a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-param-row/input-param-row.component.less b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-param-row/input-param-row.component.less index 55fb59c526..12eacc6473 100644 --- a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-param-row/input-param-row.component.less +++ b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-param-row/input-param-row.component.less @@ -21,52 +21,52 @@ @import '../../../../../../../assets/styles/variables.less'; .remove { - display: flex; - align-items: center; - justify-content: center; + display: flex; + align-items: center; + justify-content: center; - .svg-icon { - position: relative; - right: -3px; + svg-icon { + position: relative; + right: -3px; - &:hover { - cursor: pointer; + &:hover { + cursor: pointer; + } } - } } .cell { - min-height: 50px; - padding: 10px; - display: flex; - align-items: center; + min-height: 50px; + padding: 10px; + display: flex; + align-items: center; - > * { - flex-basis: 100%; - } - - /deep/ select { - height: 30px; - } + > * { + flex-basis: 100%; + } - input { - height: 30px; - border: none; - padding-left: 10px; - } + /deep/ select { + height: 30px; + } - select { - width: 100%; - } + input { + height: 30px; + border: none; + padding-left: 10px; + } - &.field-property { - &:last-child { - flex: 1; + select { + width: 100%; } - .no-properties-error { - color: @func_color_q; - font-style: italic; + &.field-property { + &:last-child { + flex: 1; + } + + .no-properties-error { + color: @func_color_q; + font-style: italic; + } } - } } diff --git a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.less b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.less index 3d44cad740..8bbed9de02 100644 --- a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.less +++ b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.component.less @@ -22,181 +22,179 @@ @import '../../../../../../assets/styles/override.less'; .operation-handler { - font-family: @font-opensans-regular; - user-select: none; - padding-top: 12px; - padding-bottom: 20px; - - .i-sdc-form-label { - font-size: 12px; - } - - .w-sdc-form .i-sdc-form-item { - margin-bottom: 15px; - } - - textarea { - min-height: 74px; - margin-bottom: 18px; - } - - /deep/ .sdc-dropdown__component-container { - .sdc-dropdown__header { - height: 38px; - line-height: 35px; - - .svg-icon { - margin: 13px 6px; - } - } - } - - /deep/ .sdc-input { - margin-bottom: 0; + font-family: @font-opensans-regular; + user-select: none; + padding-top: 12px; + padding-bottom: 20px; - .sdc-input__input { - height: 38px; + .i-sdc-form-label { + font-size: 12px; } - } - .side-by-side { - display: flex; + .w-sdc-form .i-sdc-form-item { + margin-bottom: 15px; + } - .form-item { - flex: 1; + textarea { + min-height: 74px; + margin-bottom: 18px; + } - &:first-child { - margin-right: 14px; - flex-basis: 37%; - flex-grow: 0; - flex-shrink: 0; - } + /deep/ .sdc-dropdown__component-container { + .sdc-dropdown__header { + height: 38px; + line-height: 35px; - &:nth-child(3) { - margin-left: 14px; - flex: 0.4; - } + svg-icon { + margin: 13px 6px; + } + } + } - .i-sdc-form-file-upload { - height: 37px; + /deep/ .sdc-input { margin-bottom: 0; - .i-sdc-form-file-name { - padding: 8px 10px; + .sdc-input__input { + height: 38px; } + } - .i-sdc-form-file-upload-x-btn { - top: 13px; - } + .side-by-side { + display: flex; - .file-upload-browse-btn { - height: 100%; - padding: 7px 6px; - z-index: 1; - } - } + .form-item { + flex: 1; - } - } - - .archive-warning { - font-family: @font-opensans-bold; - color: @main_color_i; - } - - .no-workflow-warning { - font-family: @font-opensans-bold; - color: @sdcui_color_red; - float: right; - } - - .input-param-title { - font-size: 16px; - text-transform: uppercase; - } - - .separator-buttons { - display: flex; - justify-content: space-between; - margin-top: 10px; - - .add-param-link { - &:not(.disabled):hover { - cursor: pointer; - } - } + &:first-child { + margin-right: 14px; + flex-basis: 37%; + flex-grow: 0; + flex-shrink: 0; + } + + &:nth-child(3) { + margin-left: 14px; + flex: 0.4; + } + + .i-sdc-form-file-upload { + height: 37px; + margin-bottom: 0; - .tab { - width: 84px; - text-align: center; + .i-sdc-form-file-name { + padding: 8px 10px; + } + + .i-sdc-form-file-upload-x-btn { + top: 13px; + } + + .file-upload-browse-btn { + height: 100%; + padding: 7px 6px; + z-index: 1; + } + } + + } } - } - .generic-table { - max-height: 244px; - min-height: 91px; - background: @main_color_p; + .archive-warning { + font-family: @font-opensans-bold; + color: @main_color_i; + } - .header-row .header-cell { - .info-icon { + .no-workflow-warning { + font-family: @font-opensans-bold; + color: @sdcui_color_red; float: right; - position: relative; - top: 2px; - } - - /deep/ .tooltip-inner { - padding: 2px; - max-width: 270px; - font-size: 11px; - } - - &.remove { - padding: 10px; - font-size: 10px; - } } - .data-row { - &.empty-msg { - .bold-message { - font-family: @font-opensans-bold; - } + .input-param-title { + font-size: 16px; + text-transform: uppercase; + } - :first-child { - &:not(:only-child) { - margin: 6px 0; - } + .separator-buttons { + display: flex; + justify-content: space-between; + margin-top: 10px; + + .add-param-link { + &:not(.disabled):hover { + cursor: pointer; + } } - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - padding: 14px; - } + .tab { + width: 84px; + text-align: center; + } } - /deep/ .cell { - &.field-input-name, &.field-input-value { - flex: 1; - } + .generic-table { + max-height: 244px; + min-height: 91px; + background: @main_color_p; + + .header-row .header-cell { + .info-icon { + float: right; + position: relative; + top: 2px; + } + /deep/ .tooltip-inner { + padding: 2px; + max-width: 270px; + font-size: 11px; + } + &.remove { + padding: 10px; + font-size: 10px; + } + } - &.field-property { - &, &:last-child { - flex: 1; + .data-row { + &.empty-msg { + .bold-message { + font-family: @font-opensans-bold; + } + + :first-child { + &:not(:only-child) { + margin: 6px 0; + } + } + + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 14px; + } } - } - &.field-mandatory { - flex: 0.5; - text-align: center; - } + /deep/ .cell { + &.field-input-name, &.field-input-value{ + flex: 1; + } + + &.field-property { + &, &:last-child { + flex: 1; + } + } + + &.field-mandatory { + flex: 0.5; + text-align: center; + } + + &.remove { + min-width: 40px; + max-width: 40px; + } + } - &.remove { - min-width: 40px; - max-width: 40px; - } } - - } } diff --git a/catalog-ui/src/app/ng2/pages/composition/palette/palette.component.less b/catalog-ui/src/app/ng2/pages/composition/palette/palette.component.less index b7533cc664..37461ba1c5 100644 --- a/catalog-ui/src/app/ng2/pages/composition/palette/palette.component.less +++ b/catalog-ui/src/app/ng2/pages/composition/palette/palette.component.less @@ -1,20 +1,19 @@ @import "./../../../../../assets/styles/override"; -:host(.composition-palette) { - display: flex; +:host(composition-palette) { + display:flex; flex: 0 0 244px; } -.sdc-loader.inactive { - display: none; +sdc-loader.inactive { + display:none; } :host ::ng-deep .sdc-filter-bar .sdc-input { - margin-bottom: 0px; + margin-bottom:0px; } - :host ::ng-deep .sdc-loader-wrapper { - position: static; + position:static; } .composition-palette-component { @@ -23,7 +22,7 @@ overflow-x: hidden; display: flex; flex-direction: column; - position: relative; + position:relative; width: 244px; box-shadow: 7px -3px 6px -8px @sdcui_color_gray; @@ -32,7 +31,6 @@ line-height: 40px; padding: 0 17px; color: @sdcui_color_white; - .palette-elements-count-value { float: right; } @@ -43,23 +41,19 @@ .no-elements-found { padding-left: 40px; } - /deep/ .palette-category { display: flex; margin: 0px; - .sdc-accordion-header { background-color: @sdcui_color_silver; margin: 0px; line-height: 40px; padding: 0px 10px; } - .sdc-accordion-body { padding: 0px; } } - .palette-subcategory { padding: 0 10px; background-color: @sdcui_color_lighter-silver; diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.less b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.less index 9a39871e7a..124d606079 100644 --- a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.less +++ b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.less @@ -2,28 +2,27 @@ @import '../../../../../assets/styles/mixins_old'; :host ::ng-deep .sdc-loader-wrapper { - position: static; + position:static; } .component-details-panel-tabs { - flex: 1; - display: flex; - overflow: hidden; -} - -.component-details-panel-tabs /deep/ .sdc-tabs { - display: flex; - flex-direction: column; - width: 100%; - - /deep/ .sdc-tab { - display: flex; - flex-direction: column; - overflow-y: auto; + flex: 1; + display:flex; + overflow:hidden; } - .svg-icon-wrapper.label-placement-left .svg-icon-label { - margin-right: 0; - } +.component-details-panel-tabs /deep/ sdc-tabs { + display:flex; + flex-direction:column; + width: 100%; + + /deep/ sdc-tab { + display: flex; + flex-direction: column; + overflow-y: auto; + } + .svg-icon-wrapper.label-placement-left .svg-icon-label { + margin-right: 0; + } } diff --git a/catalog-ui/src/app/ng2/pages/home/home.component.less b/catalog-ui/src/app/ng2/pages/home/home.component.less index 687b06674d..c5b73748ba 100644 --- a/catalog-ui/src/app/ng2/pages/home/home.component.less +++ b/catalog-ui/src/app/ng2/pages/home/home.component.less @@ -1,6 +1,5 @@ @import '../../../../assets/styles/mixins_old'; @import '../../../../assets/styles/sprite'; - .w-sdc-left-sidebar-nav { margin-top: 46px; } @@ -28,13 +27,11 @@ font-weight: bold; } -.i-sdc-left-sidebar-item { +.i-sdc-left-sidebar-item{ display: flex; - - &.category-title .title-text, .sdc-checkbox { + &.category-title .title-text, sdc-checkbox{ flex-grow: 1; } - &:not(.category-title).i-sdc-left-sidebar-item-state-count { line-height: 14px; } @@ -99,31 +96,28 @@ width: 140px; - .sdc-button, - .sdc-button-file-opener { + sdc-button, + sdc-button-file-opener { padding-bottom: 5px; - - &:last-child { + &:last-child{ padding-bottom: 0; } } - - .import-file { + + .import-file{ position: relative; - - .file-opener { + file-opener{ position: absolute; top: 0; - /deep/ input[type="file"] { - .hand; - filter: alpha(opacity=0); - opacity: 0; - position: absolute; - top: 0; - left: 0; - width: 140px; - height: 36px; + .hand; + filter: alpha(opacity=0); + opacity: 0; + position: absolute; + top: 0; + left: 0; + width: 140px; + height: 36px; } } } diff --git a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.less b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.less index 084744ad68..2721d300c4 100644 --- a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.less +++ b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/operation-creator.component.less @@ -2,181 +2,179 @@ @import '../../../../../assets/styles/override.less'; .operation-creator { - font-family: @font-opensans-regular; - user-select: none; - padding-top: 12px; - padding-bottom: 20px; - - .i-sdc-form-label { - font-size: 12px; - } - - .w-sdc-form .i-sdc-form-item { - margin-bottom: 15px; - } - - textarea { - min-height: 74px; - margin-bottom: 18px; - } - - /deep/ .sdc-dropdown__component-container { - .sdc-dropdown__header { - height: 38px; - line-height: 35px; - - .svg-icon { - margin: 13px 6px; - } - } - } - - /deep/ .sdc-input { - margin-bottom: 0; + font-family: @font-opensans-regular; + user-select: none; + padding-top: 12px; + padding-bottom: 20px; - .sdc-input__input { - height: 38px; + .i-sdc-form-label { + font-size: 12px; } - } - .side-by-side { - display: flex; + .w-sdc-form .i-sdc-form-item { + margin-bottom: 15px; + } - .form-item { - flex: 1; + textarea { + min-height: 74px; + margin-bottom: 18px; + } - &:first-child { - margin-right: 14px; - flex-basis: 37%; - flex-grow: 0; - flex-shrink: 0; - } + /deep/ .sdc-dropdown__component-container { + .sdc-dropdown__header { + height: 38px; + line-height: 35px; - &:nth-child(3) { - margin-left: 14px; - flex: 0.4; - } + svg-icon { + margin: 13px 6px; + } + } + } - .i-sdc-form-file-upload { - height: 37px; + /deep/ .sdc-input { margin-bottom: 0; - .i-sdc-form-file-name { - padding: 8px 10px; + .sdc-input__input { + height: 38px; } + } - .i-sdc-form-file-upload-x-btn { - top: 13px; - } + .side-by-side { + display: flex; - .file-upload-browse-btn { - height: 100%; - padding: 7px 6px; - z-index: 1; - } - } + .form-item { + flex: 1; - } - } - - .archive-warning { - font-family: @font-opensans-bold; - color: @main_color_i; - } - - .no-workflow-warning { - font-family: @font-opensans-bold; - color: @sdcui_color_red; - float: right; - } - - .input-param-title { - font-size: 16px; - text-transform: uppercase; - } - - .separator-buttons { - display: flex; - justify-content: space-between; - margin-top: 10px; - - .add-param-link { - &:not(.disabled):hover { - cursor: pointer; - } - } + &:first-child { + margin-right: 14px; + flex-basis: 37%; + flex-grow: 0; + flex-shrink: 0; + } + + &:nth-child(3) { + margin-left: 14px; + flex: 0.4; + } + + .i-sdc-form-file-upload { + height: 37px; + margin-bottom: 0; - .tab { - width: 84px; - text-align: center; + .i-sdc-form-file-name { + padding: 8px 10px; + } + + .i-sdc-form-file-upload-x-btn { + top: 13px; + } + + .file-upload-browse-btn { + height: 100%; + padding: 7px 6px; + z-index: 1; + } + } + + } } - } - .generic-table { - max-height: 244px; - min-height: 91px; - background: @main_color_p; + .archive-warning { + font-family: @font-opensans-bold; + color: @main_color_i; + } - .header-row .header-cell { - .info-icon { + .no-workflow-warning { + font-family: @font-opensans-bold; + color: @sdcui_color_red; float: right; - position: relative; - top: 2px; - } - - /deep/ .tooltip-inner { - padding: 2px; - max-width: 270px; - font-size: 11px; - } - - &.remove { - padding: 10px; - font-size: 10px; - } } - .data-row { - &.empty-msg { - .bold-message { - font-family: @font-opensans-bold; - } + .input-param-title { + font-size: 16px; + text-transform: uppercase; + } - :first-child { - &:not(:only-child) { - margin: 6px 0; - } + .separator-buttons { + display: flex; + justify-content: space-between; + margin-top: 10px; + + .add-param-link { + &:not(.disabled):hover { + cursor: pointer; + } } - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - padding: 14px; - } + .tab { + width: 84px; + text-align: center; + } } - /deep/ .cell { - &.field-name, &.field-type { - flex: 1; - } + .generic-table { + max-height: 244px; + min-height: 91px; + background: @main_color_p; + + .header-row .header-cell { + .info-icon { + float: right; + position: relative; + top: 2px; + } + /deep/ .tooltip-inner { + padding: 2px; + max-width: 270px; + font-size: 11px; + } + &.remove { + padding: 10px; + font-size: 10px; + } + } - &.field-property { - &, &:last-child { - flex: 1; + .data-row { + &.empty-msg { + .bold-message { + font-family: @font-opensans-bold; + } + + :first-child { + &:not(:only-child) { + margin: 6px 0; + } + } + + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 14px; + } } - } - &.field-mandatory { - flex: 0.5; - text-align: center; - } + /deep/ .cell { + &.field-name, &.field-type { + flex: 1; + } + + &.field-property { + &, &:last-child { + flex: 1; + } + } + + &.field-mandatory { + flex: 0.5; + text-align: center; + } + + &.remove { + min-width: 40px; + max-width: 40px; + } + } - &.remove { - min-width: 40px; - max-width: 40px; - } } - - } } diff --git a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.less b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.less index 76cc79e5e7..5447fe532b 100644 --- a/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.less +++ b/catalog-ui/src/app/ng2/pages/interface-operation/operation-creator/param-row/param-row.component.less @@ -1,53 +1,53 @@ @import '../../../../../../assets/styles/variables.less'; .remove { - display: flex; - align-items: center; - justify-content: center; + display: flex; + align-items: center; + justify-content: center; - .svg-icon { - position: relative; - right: -3px; + svg-icon { + position: relative; + right: -3px; - &:hover { - cursor: pointer; + &:hover { + cursor: pointer; + } } - } } .cell { - min-height: 50px; - padding: 10px; - display: flex; - align-items: center; - - > * { - flex-basis: 100%; - } - - /deep/ select { - height: 30px; - } - - input { - height: 30px; - border: none; - padding-left: 10px; - } - - select { - width: 100%; - } - - &.field-property { - &:last-child { - flex: 1; + min-height: 50px; + padding: 10px; + display: flex; + align-items: center; + + > * { + flex-basis: 100%; + } + + /deep/ select { + height: 30px; + } + + input { + height: 30px; + border: none; + padding-left: 10px; + } + + select { + width: 100%; } - .no-properties-error { - color: @func_color_q; - font-style: italic; + &.field-property { + &:last-child { + flex: 1; + } + + .no-properties-error { + color: @func_color_q; + font-style: italic; + } } - } } diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.less b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.less index dacc3303f6..a1309aba61 100644 --- a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.less +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.less @@ -1,6 +1,5 @@ @import '../../../../assets/styles/variables'; @import '../../../../assets/styles/mixins'; - @ng2-shadow-gray: #f8f8f8; @ng2-light-gray: #eaeaea; @ng2-medium-gray: #d2d2d2; @@ -8,227 +7,210 @@ @ng2-dark-gray: #5a5a5a; @ng2-shadow-blue: #e6f6fb; @ng2-bold-blue: #009fdb; -@ng2-success-green: #4ca90c; -@ng2-title-font-size: 16px; +@ng2-success-green:#4ca90c; +@ng2-title-font-size:16px; @ng2-text-font-size: 14px; -:host { - display: block; - height: 100%; -} - -/deep/ .tabs { - display: flex; - flex-direction: column; - height: 100%; -} +:host { display:block; height: 100%; } +/deep/ tabs {display:flex; flex-direction:column; height:100%; } .properties-assignment-page { - height: 100%; - font-family: @font-opensans-regular; - - .main-content { - display: flex; - flex-direction: row; height: 100%; - } - - .left-column { - flex: 1 0 500px; - position: relative; - min-width: 930px; + font-family: @font-opensans-regular; - /deep/ .tabs { - width: 33%; - text-align: center; + .main-content { + display:flex; + flex-direction:row; + height: 100%; } - /deep/ .tab { - padding: 12px; - flex: 1; - font-family: @font-opensans-regular; - - &.active { - color: #009fdb; - border-color: #d2d2d2; - border-top: solid 4px #009fdb; - background-color: white; - padding-top: 9px; - font-family: @font-opensans-medium; - } - - .tab-indication { - background-color: #4ca90c; - border: solid 2px #fff; - border-radius: 50%; - font-size: 12px; - } - } + .left-column { + flex: 1 0 500px; + position: relative; + min-width:930px; - .header { - position: absolute; - top: 0; - right: 0; - display: flex; - } - - .search-filter-container { - display: flex; - flex-direction: row; - - .search-box { - border: 1px solid @ng2-medium-gray; - border-radius: 3px; - height: 32px; - margin: 0; - padding: 2px 20px 4px 10px; - outline: none; - font-style: italic; - color: @ng2-med-dark-gray; - width: auto; - - &::-moz-placeholder { - color: @ng2-med-dark-gray; + /deep/ .tabs { + width:33%; + text-align:center; } - &::-webkit-input-placeholder { - color: @ng2-med-dark-gray; + /deep/ .tab { + padding: 12px; + flex: 1; + font-family: @font-opensans-regular; + + &.active { + color:#009fdb; + border-color: #d2d2d2; + border-top: solid 4px #009fdb; + background-color: white; + padding-top:9px; + font-family: @font-opensans-medium; + } + + .tab-indication { + background-color:#4ca90c; + border:solid 2px #fff; + border-radius:50%; + font-size:12px; + } } - } - - .search-icon { - background-position: -48px -3137px; - width: 14px; - height: 14px; - position: absolute; - left: 170px; - top: 8px; - } - - &.without-filter { - margin-right: 10px; - - .search-icon { - right: 4px; + + .header { + position:absolute; + top:0; + right:0; + display: flex; } - } - } + .search-filter-container{ + display:flex; + flex-direction:row; + + .search-box { + border: 1px solid @ng2-medium-gray; + border-radius: 3px; + height: 32px; + margin: 0; + padding: 2px 20px 4px 10px; + outline: none; + font-style: italic; + color:@ng2-med-dark-gray; + width: auto; + + &::-moz-placeholder { color:@ng2-med-dark-gray;} + &::-webkit-input-placeholder{ color:@ng2-med-dark-gray;} + } + + .search-icon { + background-position: -48px -3137px; + width: 14px; + height: 14px; + position: absolute; + left:170px; + top: 8px; + } + + &.without-filter { + margin-right:10px; + .search-icon { + right: 4px; + } + } - .clear-filter { - cursor: pointer; - color: #009fdb; - font-family: @font-opensans-medium-italic; - text-decoration: underline; - padding-right: 10px; - font-size: 12px; - } + } + + .clear-filter{ + cursor: pointer; + color:#009fdb; + font-family: @font-opensans-medium-italic; + text-decoration: underline; + padding-right:10px; + font-size:12px; + } - .declare-button { - &:not(:last-of-type) { - margin-right: 10px; - } - } + .declare-button{ + &:not(:last-of-type) { + margin-right: 10px; + } + } - .main-tabs-section { - position: relative; + .main-tabs-section { + position: relative; - .main-tabs-section-buttons { - position: absolute; - top: 45px; - right: 0; - padding: 4px; - } + .main-tabs-section-buttons { + position: absolute; + top: 45px; + right: 0; + padding: 4px; + } + } } - } - .right-column { - display: flex; - flex: 0 0 350px; - flex-direction: column; - margin: 0px 0 0 1em; - overflow-x: auto; + .right-column { + display:flex; + flex:0 0 350px; + flex-direction:column; + margin: 0px 0 0 1em; + overflow-x:auto; + .add-btn{ + + align-self: flex-end; + margin-top: 10px; + margin-bottom: 19px; + } + /deep/ .tabs { + border-bottom: solid 1px #d0d0d0; + } - .add-btn { + /deep/ .tab { + flex: none; + padding: 8px 20px 0; + font-size: 14px; + line-height:30px; + font-family: @font-opensans-regular; - align-self: flex-end; - margin-top: 10px; - margin-bottom: 19px; + &.active { + font-family: @font-opensans-medium; + } + } } - /deep/ .tabs { - border-bottom: solid 1px #d0d0d0; + .hierarchy-tabs { + flex: 0 0 40px; } - /deep/ .tab { - flex: none; - padding: 8px 20px 0; - font-size: 14px; - line-height: 30px; - font-family: @font-opensans-regular; - - &.active { - font-family: @font-opensans-medium; - } + .gray-border { + border: 1px solid #ddd; } - } - - .hierarchy-tabs { - flex: 0 0 40px; - } - - .gray-border { - border: 1px solid #ddd; - } - - /deep/ .white-sub-header { - background-color: #fffefe; - box-shadow: 0px 1px 0.99px 0.01px rgba(34, 31, 31, 0.15); - border-bottom: #d2d2d2 solid 1px; - font-size: 14px; - text-align: left; - flex: 0 0 auto; - padding: 10px; - text-overflow: ellipsis; - white-space: nowrap; - overflow: hidden; - .a_13_r; - text-transform: uppercase; - - &.hierarchy-header { - padding-left: 20px; - - &.selected { - background-color: #e6f6fb; - } + + /deep/ .white-sub-header { + background-color: #fffefe; + box-shadow: 0px 1px 0.99px 0.01px rgba(34, 31, 31, 0.15); + border-bottom: #d2d2d2 solid 1px; + font-size:14px; + text-align:left; + flex:0 0 auto; + padding: 10px; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + .a_13_r; + text-transform: uppercase; + + &.hierarchy-header { + padding-left:20px; + &.selected { + background-color: #e6f6fb; + } + } + } - } + .hierarchy-nav-container { + display:flex; + flex-direction: column; + height: 100%; + } - .hierarchy-nav-container { - display: flex; - flex-direction: column; - height: 100%; - } + .hierarchy-header { - .hierarchy-header { + span{ + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + max-width: 290px; + } + } - span { - text-overflow: ellipsis; - overflow: hidden; - white-space: nowrap; - max-width: 290px; + .hierarchy-nav { + flex:1; + overflow:auto; + display: grid; + margin-top: 1em; + margin-left: 1em; + font-size: 12px; + padding-top: 1em; } - } - - .hierarchy-nav { - flex: 1; - overflow: auto; - display: grid; - margin-top: 1em; - margin-left: 1em; - font-size: 12px; - padding-top: 1em; - } } diff --git a/catalog-ui/src/app/ng2/pages/service-consumption-editor/service-consumption-editor.component.less b/catalog-ui/src/app/ng2/pages/service-consumption-editor/service-consumption-editor.component.less index 6b77b18fcd..83481c1d74 100644 --- a/catalog-ui/src/app/ng2/pages/service-consumption-editor/service-consumption-editor.component.less +++ b/catalog-ui/src/app/ng2/pages/service-consumption-editor/service-consumption-editor.component.less @@ -7,17 +7,14 @@ .sdc-modal-top-bar { display: flex; justify-content: space-between; - .operation-name { text-transform: capitalize; font-family: @font-opensans-bold; font-size: 18px; } } - .expand-collapse-all { display: flex; - .expand-all, .collapse-all { color: @main_color_a; border-bottom: solid 1px @main_color_a; @@ -27,7 +24,6 @@ width: max-content; line-height: 24px; } - .separator-line { border-left: 1px solid @main_color_o; margin: 0 7px; @@ -39,20 +35,16 @@ padding-top: 10px; height: 390px; overflow: auto; - &.no-inputs { border: 1px solid @main_color_o; } - .no-inputs-text { text-align: center; padding: 30px; opacity: 0.7; } - .i-sdc-form-content-operation-input-box { border: solid 1px @main_color_o; - &:not(:last-of-type) { margin-bottom: 17px; } @@ -64,28 +56,23 @@ padding-left: 10px; height: 38px; font-size: 14px; - .expand-collapse-icon { .sprite-new; .expand-collapse-plus-icon; vertical-align: middle; - &.expanded { .expand-collapse-minus-icon; } } - .operation-input-name { margin-left: 10px; margin-right: 7px; font-family: @font-opensans-bold } - .operation-input-type { .type-text { font-family: @font-opensans-bold; } - .type-val { font-family: @font-opensans-regular; } @@ -96,34 +83,29 @@ &.with-top-border, .separator { border-top: 1px solid @main_color_o; } - background-color: @tlv_color_t; display: flex; padding: 19px 20px 12px 19px; - .operation-input-section-col { flex: 45%; - &:not(:last-of-type) { margin-right: 38px; } - .i-sdc-form-label { font-size: 12px; font-family: @font-opensans-bold; } &.assigned-value { - display: flex; - flex-direction: column; - + display: flex; + flex-direction: column; .i-sdc-form-label { margin-bottom: 0; } } - /deep/ .ui-element-dropdown select, select, - /deep/ .dynamic-element input { + /deep/ ui-element-dropdown select, select, + /deep/ dynamic-element input { height: 30px; } @@ -138,22 +120,18 @@ /deep/ .operation-input-complex-type-section { background-color: @tlv_color_t; padding: 0 20px 12px 19px; - .separator { border-top: 1px solid @main_color_o; padding-bottom: 19px; } - .static-values-title-for-complex-type { font-size: 14px; font-family: @font-opensans-bold; margin-bottom: 10px; } - .flat-children-container { border: solid 1px @main_color_o; } - .dynamic-property { .dynamic-property-row { background-color: @tlv_color_t; diff --git a/catalog-ui/src/app/ng2/pages/service-dependencies-editor/service-dependencies-editor.component.less b/catalog-ui/src/app/ng2/pages/service-dependencies-editor/service-dependencies-editor.component.less index 9d00d86142..e03b73c8c0 100644 --- a/catalog-ui/src/app/ng2/pages/service-dependencies-editor/service-dependencies-editor.component.less +++ b/catalog-ui/src/app/ng2/pages/service-dependencies-editor/service-dependencies-editor.component.less @@ -13,7 +13,6 @@ .i-sdc-form-item { width: 250px; - &.operation { width: 60px; } @@ -22,25 +21,20 @@ .rule-builder-content { display: flex; align-items: flex-end; - .rule-input-field { flex: 1; - &:not(:last-of-type) { margin-right: 20px; } - - &.operator { + &.operator{ width: 55px; flex: 0 1 auto; } - &.assigned-value-field { margin-bottom: 10px; } - - /deep/ .ui-element-dropdown select, - /deep/ .ui-element-input input { + /deep/ ui-element-dropdown select, + /deep/ ui-element-input input { height: 30px; } } diff --git a/catalog-ui/src/app/ng2/pages/workspace/activity-log/activity-log.component.less b/catalog-ui/src/app/ng2/pages/workspace/activity-log/activity-log.component.less index ae28aa36ae..4845f4f606 100644 --- a/catalog-ui/src/app/ng2/pages/workspace/activity-log/activity-log.component.less +++ b/catalog-ui/src/app/ng2/pages/workspace/activity-log/activity-log.component.less @@ -1,9 +1,8 @@ .sdc-filter-bar-wrapper { - .sdc-filter-bar { + sdc-filter-bar { flex: 0 0 30%; } - display: flex; justify-content: flex-end; margin-bottom: 10px; -} +}
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/workspace/deployment/deployment-page.component.less b/catalog-ui/src/app/ng2/pages/workspace/deployment/deployment-page.component.less index 5213babd9e..4b7a1e7e9f 100644 --- a/catalog-ui/src/app/ng2/pages/workspace/deployment/deployment-page.component.less +++ b/catalog-ui/src/app/ng2/pages/workspace/deployment/deployment-page.component.less @@ -1,6 +1,5 @@ @import './../../../../../assets/styles/variables.less'; @import './../../../../../assets/styles/override.less'; - .deployment-page { width: 100%; height: 100%; @@ -8,18 +7,16 @@ /deep/ .sdc-tabs { height: 100%; } - /deep/ .sdc-tabs-list { position: absolute; top: 22px; right: 303px; background-color: @sdcui_color_silver; - .svg-icon-label { + svg-icon-label { vertical-align: middle; } } - /deep/ .sdc-tab-content { height: 100%; } diff --git a/catalog-ui/src/app/ng2/pages/workspace/deployment/panel/panel-tabs/hierarchy-tab/hierarchy-tab.component.less b/catalog-ui/src/app/ng2/pages/workspace/deployment/panel/panel-tabs/hierarchy-tab/hierarchy-tab.component.less index e5415a323b..269ca0aee0 100644 --- a/catalog-ui/src/app/ng2/pages/workspace/deployment/panel/panel-tabs/hierarchy-tab/hierarchy-tab.component.less +++ b/catalog-ui/src/app/ng2/pages/workspace/deployment/panel/panel-tabs/hierarchy-tab/hierarchy-tab.component.less @@ -1,5 +1,4 @@ @import './../../../../../../../../assets/styles/variables.less'; - .sdc-hierarchy-tab { padding: 15px 0 0 0; background-color: #f8f8f8; @@ -68,7 +67,7 @@ } } - .sdc-accordion.selected { + sdc-accordion.selected { /deep/ .expand-collapse-container { .sdc-accordion-header { background-color: @main_color_a; @@ -103,7 +102,6 @@ border: 1px solid @main_color_a; border-top: 4px solid @main_color_a; box-shadow: 0.3px 1px 2px rgba(24, 24, 25, 0.32); - .module-data { color: @main_color_a; padding: 10px 0 10px 0; @@ -141,7 +139,7 @@ height: 20px; padding-left: 12px; - .svg-icon { + svg-icon { padding-top: 3px; fill: @main_color_s; diff --git a/catalog-ui/src/app/ng2/pages/workspace/disribution/distribution.component.less b/catalog-ui/src/app/ng2/pages/workspace/disribution/distribution.component.less index 442eb537ec..b630881fdc 100644 --- a/catalog-ui/src/app/ng2/pages/workspace/disribution/distribution.component.less +++ b/catalog-ui/src/app/ng2/pages/workspace/disribution/distribution.component.less @@ -2,8 +2,7 @@ .ngx-datatable { > div { min-height: 500px; - - .datatable-body { + datatable-body { max-height: max-content; } } @@ -19,7 +18,7 @@ flex-grow: 5; } - .w-sdc-distribution-view-title { + .w-sdc-distribution-view-title{ color: #191919; font-family: OpenSans-Regular, sans-serif; font-size: 14px; @@ -39,47 +38,47 @@ max-height: 150px; } -.distributionIDBlock { - display: inline-block; -} + .distributionIDBlock { + display: inline-block; + } -.expand-collapse-cell { - display: inline-block; -} + .expand-collapse-cell { + display: inline-block; + } -.statusIcon { - display: inline-block; - margin-right: 10px; -} + .statusIcon { + display: inline-block; + margin-right: 10px; + } -.btnMarkAsDistributed { - float: right; - background-color: #E5F3FF; - border: 1px solid #8DCCD5; - width: 55px; - height: 21px; - text-align: center; -} + .btnMarkAsDistributed { + float: right; + background-color: #E5F3FF; + border: 1px solid #8DCCD5; + width: 55px; + height: 21px; + text-align: center; + } -.distributionRowContainer { - background-color: #eaeaea; - text-align: center; -} + .distributionRowContainer{ + background-color: #eaeaea; + text-align: center; + } -.distributionRowLabel { - overflow: hidden; - padding-top: 10px; - color: #000000; - font-family: OpenSans-Semibold, sans-serif; - font-size: 12px; - font-weight: bold; -} + .distributionRowLabel { + overflow: hidden; + padding-top: 10px; + color: #000000; + font-family: OpenSans-Semibold, sans-serif; + font-size: 12px; + font-weight: bold; + } -.distributionRowValue { - color: #263d4d; - font-family: OpenSans-Regular, sans-serif; - font-size: 14px; -} + .distributionRowValue { + color: #263d4d; + font-family: OpenSans-Regular, sans-serif; + font-size: 14px; + } .ellipsisCell { width: 92%; |