diff options
Diffstat (limited to 'workflow-designer-ui/src/main/frontend/resources/scss')
26 files changed, 0 insertions, 2045 deletions
diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/_common.scss b/workflow-designer-ui/src/main/frontend/resources/scss/_common.scss deleted file mode 100644 index 825609d7..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/_common.scss +++ /dev/null @@ -1,5 +0,0 @@ -@import '~onap-ui-common/lib/scss/_typography.scss'; -@import '~onap-ui-common/lib/scss/variables.scss'; -@import 'common/fonts'; -@import 'common/utils'; -@import 'common/customVariables'; diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/_components.scss b/workflow-designer-ui/src/main/frontend/resources/scss/_components.scss deleted file mode 100644 index 3baac0b0..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/_components.scss +++ /dev/null @@ -1,12 +0,0 @@ -@import 'components/layout'; -@import 'components/inputOptions'; -@import 'components/navigationSideBar'; -@import 'components/versionController'; -@import 'components/expandableInput'; -@import 'components/notifications'; -@import 'components/searchInput'; -@import 'components/loader'; -@import 'components/tree'; -@import 'components/customModal'; -@import 'components/scrollbars'; -@import 'components/archiveLabel';
\ No newline at end of file diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/_features.scss b/workflow-designer-ui/src/main/frontend/resources/scss/_features.scss deleted file mode 100644 index c83b6e75..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/_features.scss +++ /dev/null @@ -1,6 +0,0 @@ -@import "features/general"; -@import "features/workflow"; -@import "features/catalog"; -@import "features/composition"; -@import "features/overview"; -@import "features/inputOutput"; diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/common/_customVariables.scss b/workflow-designer-ui/src/main/frontend/resources/scss/common/_customVariables.scss deleted file mode 100644 index 5e5bef84..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/common/_customVariables.scss +++ /dev/null @@ -1,51 +0,0 @@ -$cursor-disabled: not-allowed !default; -$cursor-pointer: pointer; - -$camunda-panel-error-border-color: #cc3333; -$camunda-panel-error-background-color: #f0c2c2; - -@mixin body-1-emphasis() { - @include base-font-semibold; - font-size: $body-font-1; -} - -@mixin heading-1-emphasis() { - @include base-font-semibold; - font-size: $heading-font-1; -} - -.flex { - display: flex; - flex: 1; -} - -.flex-column { - @extend .flex; - flex-direction: column; -} - -.text-uppercase { - text-transform: uppercase; -} - -.content-area { - padding: 30px 60px 70px 60px; - overflow-y: auto; - overflow-x: hidden; - height: 100%; - &.no-padding-content-area { - padding: 0; - } -} - -.page-title { - @include heading-1; - @extend .text-uppercase !optional; - margin-bottom: 20px; - color: $blue; -} - -.disabled { - opacity: 0.7 !important; - cursor: $cursor-disabled; -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/common/_fonts.scss b/workflow-designer-ui/src/main/frontend/resources/scss/common/_fonts.scss deleted file mode 100644 index f367c23b..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/common/_fonts.scss +++ /dev/null @@ -1,26 +0,0 @@ -@font-face { - font-family: 'OpenSans-Regular'; - font-style: normal; - font-weight: 400; - src: local('Open Sans Regular'), local('OpenSans-Regular'), - url('../fonts/open-sans-v15-latin-regular.woff2') format('woff2'), - url('../fonts/open-sans-v15-latin-regular.woff') format('woff'); -} - -@font-face { - font-family: 'OpenSans-Italic'; - font-style: italic; - font-weight: 400; - src: local('Open Sans Italic'), local('OpenSans-Italic'), - url('../fonts/open-sans-v15-latin-italic.woff2') format('woff2'), - url('../fonts/open-sans-v15-latin-italic.woff') format('woff'); -} - -@font-face { - font-family: 'OpenSans-SemiBold'; - font-style: normal; - font-weight: 600; - src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'), - url('../fonts/open-sans-v15-latin-600.woff2') format('woff2'), - url('../fonts/open-sans-v15-latin-600.woff') format('woff'); -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/common/_utils.scss b/workflow-designer-ui/src/main/frontend/resources/scss/common/_utils.scss deleted file mode 100644 index 7a35b38c..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/common/_utils.scss +++ /dev/null @@ -1,317 +0,0 @@ - -/* Prefix */ - -$box-sizing-prefix: webkit moz spec; -$border-radius-prefix: webkit spec; -$box-shadow-radius-prefix: webkit moz spec; -$text-shadow-radius-prefix: spec; -$text-shadow-prefix: spec; -$box-shadow-prefix: all; -$linear-gradient-prefix: all; -$transition-prefix: webkit moz o spec; -$flex-prefix: webkit spec; -$browserPrefixes: webkit moz o ms; - -@mixin prefix($property, $value, $prefixeslist: 'all') { - @if $prefixeslist == all { - -webkit-#{$property}: $value; - -moz-#{$property}: $value; - -ms-#{$property}: $value; - -o-#{$property}: $value; - #{$property}: $value; - } @else { - @each $prefix in $prefixeslist { - @if $prefix == webkit { - -webkit-#{$property}: $value; - } @else if $prefix == moz { - -moz-#{$property}: $value; - } @else if $prefix == ms { - -ms-#{$property}: $value; - } @else if $prefix == o { - -o-#{$property}: $value; - } @else if $prefix == spec { - #{$property}: $value; - } @else { - @warn "No such prefix: #{$prefix}"; - } - } - } -} - -/* Value Prefix*/ -@mixin value-suffix-with-range($property, $valuesuffix, $from, $to, $prefixeslist) { - - @if $prefixeslist == all { - #{property} : -webkit-#{$valuesuffix}($from, $to); - #{property} : -moz-#{$valuesuffix}($from, $to); - #{property} : -o-#{$valuesuffix}($from, $to); - #{property} : -ms-#{$valuesuffix}($from, $to); - - } @else { - @each $prefix in $prefixeslist { - @if $prefix == webkit { - #{property} : -webkit-#{$valuesuffix}($from, $to); - } @else if $prefix == moz { - #{property} : -moz-#{$valuesuffix}($from, $to); - } @else if $prefix == ms { - #{property} : -ms-#{$valuesuffix}($from, $to); - } @else if $prefix == o { - #{property} : -o-#{$valuesuffix}($from, $to); - } @else { - @warn "No such prefix: #{$prefix}"; - } - } - } -} - -/* Box sizing */ -@mixin box-sizing($value: border-box) { - @include prefix(box-sizing, $value, $box-sizing-prefix); -} - -/* Borders & Shadows */ -@mixin box-shadow($value) { - @include prefix(box-shadow, $value, $box-shadow-radius-prefix); -} - -@mixin sticky($value) { - position: sticky; - top: $value; -} - -@mixin text-shadow($value) { - @include prefix(text-shadow, $value, $text-shadow-radius-prefix); -} - -@mixin border-radius($value, $positions: all) { - @if ($positions == all) { - @include prefix(border-radius, $value, $border-radius-prefix); - } @else { - @each $position in $positions { - @include prefix(border-#{$position}-radius, $value, $border-radius-prefix); - } - } - -} - -@mixin transition($value) { - @include prefix(transition, $value, $transition-prefix); -} - -/* Opacity */ -@mixin opacity($alpha) { - $ie-opacity: round($alpha * 100); - opacity: $alpha; - filter: unquote("alpha(opacity = #{$ie-opacity})"); -} - -/* Ellipsis */ -@mixin ellipsis($width: 100%, $display: inline-block, $max-width: none) { - overflow: hidden; - text-overflow: ellipsis; - width: $width; - white-space: nowrap; - display: $display; - max-width: $max-width; -} - -@mixin multiline-ellipsis($lineHeight: 1.3em, $lineCount: 2, $bgColor: $white){ - overflow: hidden; - position: relative; - line-height: $lineHeight; - max-height: $lineHeight * $lineCount; - text-align: justify; - word-break: break-all; - // margin-right: -1em; - padding-right: 1em; - &:before { - content: '...'; - position: absolute; - right: 3px; - bottom: 0; - } - &:after { - content: ''; - position: absolute; - right: 0; - width: 1em; - height: 1em; - margin-top: 0.2em; - background: $bgColor; - } -} - -@mixin gradient($from, $to) { - /* fallback/image non-cover color */ - background-color: $from; - background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from($from), to($to)); - @include value-suffix-with-range(background-color, linear-gradient, $from, $to, $linear-gradient-prefix); -} - -/* Vertical placement of multuple lines of text */ -@mixin vertical-text($height) { - position: absolute; - top: 50%; - margin-top: -$height/2; -} - -@mixin text-vertical-align($align: middle) { - display: table; - width: 100%; - - & > * { - vertical-align: $align; - display: table-cell; - } -} - -@mixin center-element($width) { - width: $width; - margin-left: auto; - margin-right: auto; -} - -@mixin center-content($width) { - & > * { - @include center-element($width); - } -} - -/* transform-rotate */ -// @mixin -// Defines a 2D rotation, the angle is specified in the parameter -// @param -// $deg - angle in degrees -@mixin transform-rotate($deg) { - transform: rotate($deg + deg); /* IE10 and Mozilla */ - -ms-transform: rotate($deg + deg); /* IE 9 */ - -webkit-transform: rotate($deg + deg); /* Safari and Chrome */ -} - -/* transform-translate */ -// @mixin -// Defines a 2D rotation, the angle is specified in the parameter -// @param -// $deg - angle in degrees -@mixin transform-translate($x, $y) { - transform: translate($x, $y); /* IE10 and Mozilla */ - -ms-transform: translate($x, $y); /* IE 9 */ - -webkit-transform: translate($x, $y); /* Safari and Chrome */ -} - -/* transform-scale */ -// @mixin -// Defines a 2D scale transformation, changing the elements width and height -// @param -// $width - width -// @param -// $height - height -@mixin transform-scale($width, $height) { - transform: scale($width, $height); /* IE10 and Mozilla */ - -ms-transform: scale($width, $height); /* IE 9 */ - -webkit-transform: scale($width, $height); /* Safari and Chrome */ -} - -@mixin scrollable() { - ::-webkit-scrollbar { - width: 8px; - } -} - -@mixin create-circle($size, $bgcolor) { - border-radius: 50%; - width: $size; - height: $size; - background: $bgcolor; - border: 3px solid $bgcolor; - display: flex; - align-items: center; - justify-content: center; -} - -/**/ -@mixin keyframe-animation($animationType, $properties, $fromValue, $toValue) { - - @keyframes #{$animationType} { - from { - $startIndex: 1; - @each $property in $properties { - #{$property}: nth($fromValue, $startIndex); - $startIndex: $startIndex + 1; - } - } - to { - $startIndex: 1; - @each $property in $properties { - #{$property}: nth($toValue, $startIndex); - $startIndex: $startIndex + 1; - } - } - } - @-moz-keyframes #{$animationType}{ - /* Firefox */ - from { - $startIndex: 1; - @each $property in $properties { - #{$property}: nth($fromValue, $startIndex); - $startIndex: $startIndex + 1; - } - } - to { - $startIndex: 1; - @each $property in $properties { - #{$property}: nth($toValue, $startIndex); - $startIndex: $startIndex + 1; - } - } - } - @-webkit-keyframes #{$animationType} { - /* Safari and Chrome */ - from { - $startIndex: 1; - @each $property in $properties { - #{$property}: nth($fromValue, $startIndex); - $startIndex: $startIndex + 1; - } - } - to { - $startIndex: 1; - @each $property in $properties { - #{$property}: nth($toValue, $startIndex); - $startIndex: $startIndex + 1; - } - } - } - @-o-keyframes #{$animationType} { - /* Opera */ - from { - $startIndex: 1; - @each $property in $properties { - #{$property}: nth($fromValue, $startIndex); - $startIndex: $startIndex + 1; - } - } - to { - $startIndex: 1; - @each $property in $properties { - #{$property}: nth($toValue, $startIndex); - $startIndex: $startIndex + 1; - } - } - } -} - - -/**/ -@mixin border-shadow($xShadow: 0.545px, $yShadow: 0.839px, $blur: 4px, $spread: 0, $color: $light-gray, $opacity: 0.2) { - @include box-shadow($xShadow $yShadow $blur $spread rgba($color, $opacity)); -} - -/* percent-plus-value */ -// @mixin -// Calculate length property (e.g. width, margin) by adding a value (e.g. in pixels) -// to a percentage of container height/width -@mixin percent-plus-value($property, $value, $percent: 100%) { - $string: 'calc(' + $percent + ' + ' + $value + ')'; - #{$property}: unquote($string); -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_archiveLabel.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_archiveLabel.scss deleted file mode 100644 index a3fa8479..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_archiveLabel.scss +++ /dev/null @@ -1,10 +0,0 @@ -.archive-label { - @include body-3; - color: $white; - background-color: $dark-purple; - margin-left: 20px; - border-radius: 3px; - padding: 1px 10px; - align-self: center; - text-transform: none; -}
\ No newline at end of file diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_customModal.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_customModal.scss deleted file mode 100644 index fe8bd0cf..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_customModal.scss +++ /dev/null @@ -1,24 +0,0 @@ -.sdc-modal { - .custom-modal-wrapper { - width: auto; - } - - .form-custom-modal { - padding: 30px 35px 20px 35px; - - .sdc-input { - margin-bottom: 15px; - } - } - -} - -.modal-action-bar { - display: flex; - justify-content: flex-end; -} - -textarea.field-section.sdc-input__input { - height: 75px; - padding-top: 5px; -}
\ No newline at end of file diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_expandableInput.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_expandableInput.scss deleted file mode 100644 index 2484a73e..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_expandableInput.scss +++ /dev/null @@ -1,56 +0,0 @@ -.expandable-input-top { - display: flex; - height: 22px; - .expandable-input-wrapper { - display: flex; - &.closed { - .svg-icon - { - &.__search { - height: 17px; - width: 17px; - transition: fill 0.5s ease-in; - fill: $blue; - cursor: pointer; - &:hover { - transition: fill 0.5s ease-in; - fill: $dark-blue; - } - } - } - } - &.opened { - .svg-icon-wrapper { - margin-left: 3px; - } - .svg-icon { - &.__search { - height: 17px; - width: 17px; - fill: $dark-blue; - } - } - .svg-icon { - &.__close { - margin-left: 7px; - opacity: 0.6; - fill: $dark-gray; - &:hover { - opacity: 1; - } - } - } - } - .expandable-input-control { - .form-control { - border: none; - background-color: transparent; - border-radius: 0; - border-bottom: 1px solid $gray; - height: 22px; - padding: 0 5px; - } - margin: 0; - } - } -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_inputOptions.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_inputOptions.scss deleted file mode 100644 index 4f7e309a..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_inputOptions.scss +++ /dev/null @@ -1,48 +0,0 @@ -.disabled { - .Select-control { - background-color: $silver; - .Select-placeholder { - color: $dark-gray; - } - } -} - -.input-options { - display: flex; - border: 1px solid $light-gray; - border-radius: 2px; - height: 30px; - &:hover { - border-color: $gray; - } - .input-options-select { - float: left; - border: none; - transition-property: width; - transition-duration: 300ms; - padding-top:0px; - padding-bottom: 0px; - height:28px; - - } - - .input-options-other{ - float: left; - height: 30px; - border: none; - padding-top:0px; - padding-bottom: 0px; - height:28px; - } - .input-options-separator { - width: 1px; - height: 24px; - margin-top: 2px; - margin-bottom: 2px; - border:1px solid $light-gray; - } -} - -.input-options.has-error { - border-color: $red; -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_layout.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_layout.scss deleted file mode 100644 index 6862d554..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_layout.scss +++ /dev/null @@ -1,34 +0,0 @@ -.workflow-app { - position: fixed; - top: 0; - left: 0; - right: 0; - bottom: 0; - - * { - box-sizing: border-box; - } - - .custom-textarea { - resize: none; - } - - .version-wrapper { - display: grid; - grid-template-rows: 70px 1fr; - height: 100vh; - } - - .disabled { - pointer-events: none; - opacity: 0.4; - } - - .selectable { - user-select: text; - } - - .separator { - border-left: 1px solid $silver; - } -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_loader.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_loader.scss deleted file mode 100644 index 36488e93..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_loader.scss +++ /dev/null @@ -1,159 +0,0 @@ -.onboarding-loader { - .onboarding-loader-backdrop { - top: 0; - right: 0; - bottom: 0; - left: 0; - position: absolute; - background-color: #E1E4E6; - opacity: 0.5; - z-index: 99999; - } - .tlv-loader { - height: 63px; - width: 63px; - position: absolute; - top: 30%; - left: 50%; - margin-top: -10.5px; - margin-left: -10.5px; - } - .tlv-loader.large { - transform: scale(1); - } - .tlv-loader::before { - background-color: $gray; - border-radius: 50%; - box-shadow: 21px 21px 0px 0px $gray, 0px 42px 0px 0px $gray, -21px 21px 0px 0px $gray; - content: ''; - display: block; - height: 21px; - width: 21px; - position: absolute; - left: 50%; - margin-left: -10.5px; - } - .tlv-loader::after { - border-radius: 50%; - content: ''; - display: block; - position: absolute; - height: 21px; - width: 21px; - animation: dot-move-2 4.5s infinite ease-in; - } - @keyframes dot-move { - 0% { - background-color: $blue; - left: 21px; - top: 0; - } - 25% { - background-color: $yellow; - left: 42px; - top: 21px; - } - 50% { - background-color: $light-purple; - left: 21px; - top: 42px; - } - 75% { - background-color: $light-green; - left: 0; - top: 21px; - } - 100% { - background-color: $blue; - left: 21px; - top: 0; - } - } - @keyframes dot-move-2 { - 0% { - background-color: $blue; - left: 21px; - top: 0; - } - 6.25% { - background-color: $blue; - left: 42px; - top: 21px; - } - 12.5% { - background-color: $blue; - left: 21px; - top: 42px; - } - 18.75% { - background-color: $blue; - left: 0; - top: 21px; - } - 25% { - background-color: $yellow; - left: 21px; - top: 0; - } - 31.25% { - background-color: $yellow; - left: 42px; - top: 21px; - } - 37.5% { - background-color: $yellow; - left: 21px; - top: 42px; - } - 43.75% { - background-color: $yellow; - left: 0; - top: 21px; - } - 50% { - background-color: $light-purple; - left: 21px; - top: 0; - } - 56.25% { - background-color: $light-purple; - left: 42px; - top: 21px; - } - 62.5% { - background-color: $light-purple; - left: 21px; - top: 42px; - } - 68.75% { - background-color: $light-purple; - left: 0; - top: 21px; - } - 75% { - background-color: $light-green; - left: 21px; - top: 0; - } - 81.25% { - background-color: $light-green; - left: 42px; - top: 21px; - } - 87.5% { - background-color: $light-green; - left: 21px; - top: 42px; - } - 93.75% { - background-color: $light-green; - left: 0; - top: 21px; - } - 100% { - background-color: $blue; - left: 21px; - top: 0; - } - } - } diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_navigationSideBar.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_navigationSideBar.scss deleted file mode 100644 index c830c028..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_navigationSideBar.scss +++ /dev/null @@ -1,60 +0,0 @@ -.workflow-navigation-side-bar { - width: 245px; - height: 100%; - background-color: $white; - border-right: 1px solid $light-gray; - @include box-shadow(1px -1px 3px 0px $silver); - border-bottom: 0; - - .navigation-side-content { - overflow: hidden; - height: 100%; - - .navigation-group { - height: 100%; - display: flex; - flex-direction: column; - background-color: $light-silver; - .group-name { - @include heading-4-emphasis; - @include ellipsis; - display: block; - padding: 24px 12px 13px 40px; - background-color: $white; - border-bottom: 1px solid $silver; - } - } - - .navigation-group-items { - padding-left: 20px; - - .navigation-group-item { - @include body-1; - cursor: pointer; - margin: 18px 0; - padding-left: 20px; - color: $dark-gray; - line-height: 17px; - &.selected-item { - padding-left: 0; - .collapse.in { - padding-left: 20px; - } - } - .navigation-group-item-name { - @include ellipsis; - white-space: normal; - &.selected { - @include body-1-emphasis; - border-left: 4px solid $blue; - padding-left: 18px; - color: $blue; - } - &.bold-name { - @include body-1-emphasis; - } - } - } - } - } -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_notifications.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_notifications.scss deleted file mode 100644 index 855c372e..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_notifications.scss +++ /dev/null @@ -1,8 +0,0 @@ -.workflow-notifications-container { - position: absolute; - z-index: 99999; - &.position-top-right { - right: 30px; - top: 50px; - } -}
\ No newline at end of file diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_scrollbars.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_scrollbars.scss deleted file mode 100644 index d036c714..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_scrollbars.scss +++ /dev/null @@ -1,63 +0,0 @@ -.ps__rail-x { - opacity: 1; - height: 4px; - /* there must be 'bottom' or 'top' for ps__rail-x */ - bottom: 0px; -} - -.ps__rail-y { - opacity: 1; - width: 4px; - /* there must be 'right' or 'left' for ps__rail-y */ - right: 0; -} - -.ps__thumb-x { - background-color: $light-gray; - border-radius: 0px; - height: 4px; - /* there must be 'bottom' for ps__thumb-x */ - bottom: 0px; -} - -.ps__thumb-y { - background-color: $light-gray; - border-radius: 0px; - width: 4px; - /* there must be 'right' for ps__thumb-y */ - right: 0px; -} - -.ps:hover > .ps__rail-x, -.ps:hover > .ps__rail-y, -.ps--focus > .ps__rail-x, -.ps--focus > .ps__rail-y, -.ps--scrolling-x > .ps__rail-x, -.ps--scrolling-y > .ps__rail-y { - opacity: 1; - background-color: transparent; -} - -.ps .ps__rail-x:hover, -.ps .ps__rail-y:hover, -.ps .ps__rail-x:focus, -.ps .ps__rail-y:focus, -.ps .ps__rail-x.ps--clicking, -.ps .ps__rail-y.ps--clicking { - opacity: 1; - background-color: transparent; -} - -.ps__rail-x:hover > .ps__thumb-x, -.ps__rail-x:focus > .ps__thumb-x, -.ps__rail-x.ps--clicking .ps__thumb-x { - background-color: $light-gray; - height: 4px; -} - -.ps__rail-y:hover > .ps__thumb-y, -.ps__rail-y:focus > .ps__thumb-y, -.ps__rail-y.ps--clicking .ps__thumb-y { - background-color: $light-gray; - width: 4px; -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_searchInput.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_searchInput.scss deleted file mode 100644 index efd68496..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_searchInput.scss +++ /dev/null @@ -1,59 +0,0 @@ -.search-input-top { - display: flex; - height: 22px; - .search-input-wrapper { - display: flex; - &.closed { - .svg-icon { - &.__search { - height: 17px; - width: 17px; - transition: fill 0.5s ease-in; - fill: $blue; - cursor: pointer; - &:hover { - transition: fill 0.5s ease-in; - fill: $dark-blue; - } - } - } - } - &.opened { - .svg-icon-wrapper { - margin-left: 3px; - } - .svg-icon { - &.__search { - height: 17px; - width: 17px; - fill: $dark-blue; - } - } - .svg-icon { - &.__close { - margin-left: 7px; - opacity: 0.6; - fill: $dark-gray; - &:hover { - opacity: 1; - } - } - } - } - .search-input-control { - .input-control { - border: none; - background-color: transparent; - border-radius: 0; - border-bottom: 1px solid $gray; - height: 22px; - padding: 0 5px; - outline: 0; - box-shadow: none; - transition: border-color ease-in-out 0.95s, - box-shadow ease-in-out 0.95s; - } - margin: 0; - } - } -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_tree.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_tree.scss deleted file mode 100644 index 58f1f995..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_tree.scss +++ /dev/null @@ -1,56 +0,0 @@ - -.tree-view { - overflow: hidden; - - &.scrollable { - overflow: auto; - } - - .node { - text-shadow: none; - stroke: none; - - .outer-circle { - stroke: $blue; - stroke-width: 2px; - fill: $white; - } - - .inner-circle { - fill: $blue; - } - - text { - text-anchor: end; - @include body-2-emphasis; - fill: $blue; - } - - &.clickable { - cursor: pointer; - } - - &.selectedNode { - .outer-circle { - fill: $blue; - } - - .inner-circle { - fill: $blue; - } - - text { - fill: $blue; - } - } - } - - - .link { - fill: none; - stroke: $dark-gray; - stroke-opacity: 0.4; - stroke-width: 1.5px; - } - -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_validationForm.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_validationForm.scss deleted file mode 100644 index 176e5469..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_validationForm.scss +++ /dev/null @@ -1,117 +0,0 @@ -form { - .validation-form-content { - .validation-input-wrapper { - position: relative; - flex: 1; - } - .validation-radio-wrapper { - position: relative; - } - .sdc-tabs { - position: relative; - .invalid-tab:not(.sdc-tab-active) { - color: $red; - } - } - .validation-error-message { - &.bottom { - .tooltip-arrow { - border-bottom-color: $red; - } - } - &.right { - .tooltip-arrow { - border-right-color: $red; - } - } - &.left { - .tooltip-arrow { - border-left-color: $red; - } - } - .tooltip-inner { - background-color: $red; - } - } - .input-row { - padding-bottom: 32px; - &:only-child { - padding-bottom: 0; - } - &:last-child { - padding-bottom: 0; - } - .form-group { - margin-bottom: 0; - } - } - - .rows-section { - .row-flex-components { - display: flex; - } - .validation-input-wrapper { - flex: 1; - } - .empty-col { - flex: 1.2; - content: ' '; - } - .empty-two-col { - flex: 2.4; - content: ' '; - } - - .two-col { - flex: 2.2; - } - .three-col { - flex: 3.4; - } - .single-col { - flex: 1.2; - display: flex; - &:after { - flex: 0.2; - content: ' '; - } - @media (min-width: 1389px) { - &.add-line-break { - .control-label { - &:after { - content: "\00a0"; - display: block; - } - } - } - } - - } - } - } - - .validation-buttons { - padding: 20px 0; - text-align: right; - button:first-child { - margin-right: 15px; - } - .svg-icon { - height: 14px; - width: 14px; - } - .svg-icon.check { - fill: $white; - } - .svg-icon.close { - fill: $blue; - } - } -} - -.modal-body { - .validation-buttons { - padding: 20px 15px; - background-color: $light-silver; - } -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_versionController.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_versionController.scss deleted file mode 100644 index 3cf9b05e..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_versionController.scss +++ /dev/null @@ -1,196 +0,0 @@ -.version-controller-bar { - display: flex; - height: 70px; - border-bottom: 1px solid $silver; - background-color: transparent; - justify-content: space-between; - .group-name-wrapper { - width: 245px; - .group-name { - @include heading-4-emphasis; - @include ellipsis; - display: block; - padding: 24px 12px 13px 20px; - background-color: $white; - } - } - - .vc-container { - display: flex; - flex: 1; - align-self: center; - background-color: transparent; - justify-content: space-between; - align-items: center; - padding-left: 16px; - padding-right: 100px; - border-left: 1px solid #eaeaea; - height: 45px; - &.vs-container-operation { - flex: inherit; - } - .vc-separator { - border-left: 1px solid $silver; - height: 37px; - } - - .version-status-container { - display: flex; - align-items: center; - .version-selector-more-versions { - @include body-1-emphasis; - color: $blue; - cursor: pointer; - } - - .version-selector { - margin-top: 0; - padding-right: 10px; - margin-right: 15px; - margin-left: 10px; - border-color: $light-gray; - border-radius: 2px; - width: 243px; - height: 30px; - @include body-1; - } - - .version-section { - .form-group { - margin-right: 20px; - - .input-options { - border: none; - - .input-options-select { - padding-top: 4px; - } - } - } - } - - .vc-status { - display: flex; - padding-left: 20px; - border-left: $light-gray thin solid; - - .status-text { - align-self: center; - margin-top: 2px; - @include heading-5; - color: $dark-gray; - } - } - } - - .save-submit-cancel-container { - display: flex; - align-items: center; - height: 100%; - - .action-buttons, - .select-action-buttons, - .vc-save-section, - .vc-submit-section { - display: flex; - align-items: center; - height: 100%; - cursor: $cursor-pointer; - - .vc-submit-button { - border: 1px solid $dark-gray; - width: 94px; - height: 30px; - border-radius: 2px; - padding-top: 5px; - padding-left: 10px; - margin-left: 10px; - margin-right: 10px; - - &:hover:not(.disabled) { - cursor: pointer; - background-color: $silver; - } - - &.disabled { - border-color: $light-gray; - } - - .vc-v-submit { - width: 11px; - height: 8px; - margin-right: 10px; - position: relative; - top: -1px; - } - } - - .certifyBtn { - margin-left: 20px; - } - - .version-control-buttons { - display: flex; - } - - .action-button-wrapper { - display: flex; - align-items: center; - height: 70px; - padding: 10px; - - &:hover { - background-color: $silver; - } - - &:active { - background-color: $light-gray; - } - - .action-buttons-svg { - padding-left: 10px; - padding-right: 10px; - - .svg-icon { - fill: $text-black; - height: 20px; - - &, - &.__version-controller-save { - width: 20px; - } - &.__version-controller-permissions { - width: 32px; - } - &.__version-controller-undo, - &.__version-controller-revert { - width: 20px; - } - &.__version-controller-sync, - &.__version-controller-commit { - width: 28px; - } - } - .vs-back-btn { - height: '35px'; - width: '35px'; - .svg-icon { - height: '35px'; - width: '35px'; - transform: rotate(90deg); - } - } - } - } - - .action-button-label { - @include body-4; - display: block; - height: 1em; - margin-top: 5px; - margin-bottom: 0; - } - } - } - } -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/features/_catalog.scss b/workflow-designer-ui/src/main/frontend/resources/scss/features/_catalog.scss deleted file mode 100644 index c5c32030..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/features/_catalog.scss +++ /dev/null @@ -1,102 +0,0 @@ -.wf-catalog { - overflow: auto; - background-color: $light-silver; - grid-template-rows: 35px 1fr; - height: 100vh; - padding-bottom: 20px; - .header { - align-items: center; - display: flex; - justify-content: space-between; - background-color: $silver; - margin-bottom: 2px; - @include box-shadow(0px 1px 3px 0 rgba(0, 0, 0, 0.2)); - padding: 8px 60px 0 0px; - .wf-status-select { - - display: grid; - width: 200px; - height: 34px; - margin-top: -8px; - background-color: $light-silver; - color: $blue; - } - &__search { - height: 25px; - } - } - .main { - &__header { - display: flex; - justify-content: space-between; - align-items: center; - padding: 25px 60px; - &__total { - @include body-1; - color: $dark-gray; - } - &__order { - display: flex; - &__label { - @include body-1; - color: $dark-gray; - } - &__alphabetical { - cursor: pointer; - display: flex; - &__label { - margin-left: 5px; - @include body-1; - color: $blue; - } - &__icon { - display: flex; - align-items: center; - margin-left: 5px; - .svg-icon { - width: 9px; - height: 9px; - } - &--flip { - transform: rotate(180deg); - } - } - } - } - } - &__content { - display: grid; - grid-template-columns: repeat(auto-fit, 204px); - grid-gap: 20px; - padding: 0 60px; - } - .add-workflow { - border: 2px dashed #a8b3b9; - width: 204px; - height: 204px; - padding: 10px; - box-sizing: border-box; - cursor: pointer; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - color: $gray; - &__icon { - color: $gray; - fill: $gray; - } - &__label { - text-transform: uppercase; - @include body-1-emphasis; - } - &:hover { - color: $blue; - .svg-icon-wrapper { - color: $blue; - fill: $blue; - } - } - } - } -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/features/_composition.scss b/workflow-designer-ui/src/main/frontend/resources/scss/features/_composition.scss deleted file mode 100644 index b2b701b2..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/features/_composition.scss +++ /dev/null @@ -1,94 +0,0 @@ -.composition-view { - display: flex; - width: 100%; - - .bpmn-container { - flex-basis: 100%; - flex-grow: 1; - .djs-palette.open { - border: none; - } - .djs-palette-entries { - border: solid 1px $light-gray; - &:empty { - border: none; - } - } - } - .bpmn-sidebar { - background-color: $light-silver; - height: 100%; - width: 320px; - - label { - @include body-1; - } - .group-label { - @include heading-4-emphasis; - font-size: 110%; - } - .properties-panel { - background-color: $light-silver; - overflow-y: auto; - max-height: calc(100vh - 70px); - &, .bpp-properties-panel { - [disabled], [editable-readonly=false] { - background-color: $light-gray; - color: $dark-gray; - pointer-events: none; - } - label[for] { - cursor: default; - background: transparent; - } - background-color: $light-silver; - #camunda-activitySelect-select { - &.invalid { - border-color: $camunda-panel-error-border-color; - background-color: $camunda-panel-error-background-color; - } - } - } - } - [editable-readonly] { - font-family: OpenSans-Regular, Arial, sans-serif; - font-style: normal; - font-weight: 400; - font-size: 14px; - box-sizing: border-box; - } - - .composition-buttons { - position: fixed; - background-color: $light-silver; - left: 265px; - bottom: 46px; - border: 1px solid $light-gray; - width: 189px; - display: flex; - flex-direction: row; - justify-content: space-around; - height: 57px; - align-items: center; - padding: 10px; - .divider { - height: 35px; - border: 1px solid $light-gray; - } - .diagram-btn { - - &:hover { - fill: $blue; - cursor: pointer; - } - &.disabled { - fill: $gray; - } - .svg-icon { - width: 25px; - height: 23px; - } - } - } - } -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/features/_general.scss b/workflow-designer-ui/src/main/frontend/resources/scss/features/_general.scss deleted file mode 100644 index f11c2c0a..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/features/_general.scss +++ /dev/null @@ -1,39 +0,0 @@ -.general-page { - @include body-1; - padding: 35px 90px 0 50px; - background-color: #fff; - - .general-page-title { - height: 110px; - line-height: 110px; - @include heading-1-emphasis; - color: $dark-gray; - } - - .general-page-content { - display: grid; - grid-template-columns: 60% 40%; - grid-gap: 40px; - color: #444; - - .description-part textarea { - height: 200px; - padding-top: 5px; - } - - .version-info-part { - background-color: $light-silver; - height: 200px; - margin-top: 22px; - padding: 20px; - box-sizing: border-box; - .label { - @include body-3; - margin-bottom: 5px; - } - .value { - margin-bottom: 10px; - } - } - } -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/features/_inputOutput.scss b/workflow-designer-ui/src/main/frontend/resources/scss/features/_inputOutput.scss deleted file mode 100644 index 56a8dd6b..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/features/_inputOutput.scss +++ /dev/null @@ -1,155 +0,0 @@ -.input-output { - @mixin border($top: 1px, $right: 1px, $bottom: 1px, $left: 1px) { - border-width: $top $right $bottom $left; - border-style: solid; - border-color: $light-gray; - } - padding: 44px; - max-width: 1567px; - - &__title { - height: 110px; - line-height: 110px; - @include heading-1-emphasis; - color: $dark-gray; - } - - &__header { - display: flex; - &__right { - flex: 1; - display: flex; - justify-content: flex-end; - align-items: center; - } - } - - &__tab { - padding: 12px; - @include body-1-emphasis; - @include border(1px, 1px, 0, 1px); - background-color: $light-silver; - color: $gray; - min-width: 128px; - text-align: center; - cursor: pointer; - &--active { - color: $blue; - padding-top: 9px; - border-top: 4px solid $blue; - background-color: $white; - } - & + & { - border-left: none; - } - } - - &__table { - &__thead { - background-color: $silver; - @include body-1-emphasis; - } - .scrollbars { - min-height: 102px; - max-height: calc(100vh - 243px); - overflow: auto; - position: relative; - } - - &__tbody { - } - } - - &__tr { - display: flex; - @include border(); - &:hover:not(&--no-hover) { - background-color: $light-silver; - } - & + & { - border-top: none; - } - } - - &__th { - flex: 1; - padding: 10px; - color: $black; - display: flex; - align-items: center; - } - - &__td { - flex: 1; - display: flex; - align-items: center; - padding: 22px 17px; - &--empty { - padding: 20px; - color: $dark-gray; - @include body-1; - text-transform: uppercase; - justify-content: center; - } - - .input-output-select { - width: 100%; - height: 32px; - @include border(); - border-radius: 2px; - padding-left: 5px; - color: $text-black; - } - - .sdc-input { - width: 100%; - position: relative; - margin: unset; - .sdc-input__label { - display: none; - } - .sdc-input__input { - height: 32px; - } - .sdc-label__error { - margin: unset; - position: absolute; - bottom: -22px; - } - } - } - - &__add { - cursor: pointer; - @include body-1; - text-transform: uppercase; - @include border(0, 0, 0, 1px); - padding-left: 10px; - margin-left: 10px; - } - - &__td, - &__th { - .sdc-checkbox { - height: 14px; - } - &--unflex { - flex: unset; - justify-content: center; - text-align: center; - width: 127px; - } - &--icon { - width: 98px; - .svg-icon-wrapper { - cursor: pointer; - &:hover { - fill: $blue; - } - } - } - & + & { - @include border(0, 0, 0, 1px); - } - } -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/features/_overview.scss b/workflow-designer-ui/src/main/frontend/resources/scss/features/_overview.scss deleted file mode 100644 index c1c371fd..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/features/_overview.scss +++ /dev/null @@ -1,337 +0,0 @@ -.overview-page { - @include body-1; - color: $dark-gray; - overflow-y: auto; - height: 100vh; - - .overview-content { - display: flex; - flex-wrap: wrap; - min-height: 775px; - - .overview-separator { - border-left: 1px solid $silver; - } - - .workflow-details { - @extend .flex; - @media (min-width: 1076px) { - @include sticky(30px); - } - max-height: 600px; - padding: 0 45px 0 56px; - flex-direction: column; - - .description-part { - padding-top: 20px; - textarea{ - height: 200px; - } - } - - .save-description { - display: flex; - justify-content: flex-end; - } - - .version-info-part { - background-color: $light-silver; - margin-top: 25px; - padding: 20px; - box-sizing: border-box; - .label { - @include body-1; - margin-bottom: 5px; - } - .value { - margin-bottom: 20px; - &:last-child { - margin-bottom: 0; - } - } - } - } - - .workflow-versions { - display: flex; - flex: 2; - } - } - - .overview-header { - display: flex; - margin: 35px 60px 35px 60px; - color: $blue; - justify-content: space-between; - .title { - display: flex; - @include heading-1; - text-transform: uppercase; - } - .go-catalog-btn { - fill: $blue; - @include heading-4; - &:hover { - fill: $light-blue; - color: $light-blue; - cursor: pointer; - } - .svg-icon { - width: 16px; - height: 16px; - } - } - .restore-btn { - margin-left: 20px; - } - .archive-btn { - margin-left: 20px; - fill: $gray; - &:hover { - fill: $blue; - color: $light-blue; - cursor: pointer; - } - } - } - - @mixin version-page-box-shadow() { - box-shadow: 1px 1px 0 0 rgba(24, 24, 24, 0.06); - } - - @mixin version-page-sub-title(){ - color: $text-black; - text-transform: uppercase; - border-bottom: 1px solid $light-gray; - padding: 12px 0 10px 45px; - } - - .versions-page-view { - padding: 0 56px 0 45px; - display: flex; - flex: 2; - flex-direction: column; - - .create-new-version { - @extend .text-uppercase; - display: flex; - flex-direction: row-reverse; - color: $blue; - margin-left: auto; - cursor: pointer; - } - .newVersionDisabled > *, .svg-icon-wrapper{ - pointer-events: none; - color: $gray; - } - .version-page-header { - display: flex; - justify-content: space-between; - .versions-page-title { - @include heading-1; - text-transform: uppercase; - margin-bottom: 29px; - color: $blue; - } - .depricate-btn-wrapper { - display: flex; - justify-content: flex-end; - margin-bottom: 10px; - } - } - - .versions-page-list-and-tree { - display: flex; - margin-top: 10px; - - .version-tree-wrapper { - display: flex; - flex-direction: column; - transition: all 1s ease; - @include version-page-box-shadow(); - - .version-tree-title-container { - @include body-1-emphasis(); - @media (min-width: 1076px) { - @include sticky(1px); - } - background-color: $light-silver; - display: flex; - align-items: center; - height: 40px; - @include version-page-sub-title(); - padding-right: 10px; - - .version-tree-full-screen { - margin-left: auto; - } - } - - .tree-view { - flex: 1; - border-left: 1px solid $silver; - &:last-child { - border-bottom: 1px solid $silver; - } - .node:not(.selectedNode):hover { - .outer-circle, .inner-circle { - transform: scale(1.1); - } - } - } - } - } - - .version-list { - @extend .flex; - flex-direction: column; - - .version-list-items { - @extend .flex-column; - - .item-version, .item-status { - font-size: 12px; - font-weight: 600; - } - .version-item-row { - &:last-child { - border-bottom: 1px solid $silver; - } - } - } - - .version-item-row { - $row-hover-color: lighten($blue, 54%); - $row-active-color: lighten($blue, 51%); - cursor: $cursor-pointer; - - display: flex; - align-items: center; - padding: 15px 30px; - @include version-page-box-shadow(); - height: 70px; - max-height: 70px; - - &:hover { - background-color: $row-hover-color; - } - - &.selected { - box-shadow: 0 1px 4px 0 rgba(24, 24, 24, 0.06), inset 5px 0 0 0 $blue; - background-color: $row-active-color; - - &:hover { - box-shadow: 0 1px 4px 0 rgba(24, 24, 24, 0.06), inset 5px 0 0 0 lighten($blue, 35%); - } - } - - &.header-row { - height: 40px; - background-color: $light-silver; - @media (min-width: 1076px) { - @include sticky(1px); - } - @include body-1-emphasis(); - @include version-page-sub-title(); - padding: 15px 27px; - - &:hover { - pointer-events: none; - &:active { - @include version-page-box-shadow(); - } - } - .header-field.actions { - margin-right: 57px; - } - } - - .version-item-field { - @extend .flex; - margin-right: 10px; - - &.item-version, &.item-status { - flex: 0 1 10%; - color: $text-black; - } - - &.item-description, &.item-last-edited { - @include body-1; - } - - &.item-description, &.header-description { - flex: 1 1 0; - } - - &.item-description > .description-text { - margin-right: 10px; - @include ellipsis($max-width: 280px); - width: initial; - } - - &.item-actions { - display: flex; - flex: 1 1 3%; - justify-content: space-between; - } - - &.item-select, &.item-create { - @include body-1; - flex: 0 1 auto; - margin-right: 0; - - .svg-icon-wrapper { - fill: $blue; - color: $blue; - - &[disabled] { - cursor: default; - } - - .svg-icon { - width: 16px; - height: 16px; - } - - &:hover:not([disabled]) { - fill: $dark-blue; - color: $dark-blue; - } - } - } - - } - - /* To keep ellipsis hider's background the same color as row background */ - &:not(.selected):hover .item-description > .description-text:after { - background: $row-hover-color; - } - - &:hover:active .item-description > .description-text:after { - background: $row-active-color; - } - - } - - } - - &.clickable { - cursor: pointer; - } - } - -} - -.inputinput-selector { - padding-right: 10px; - border-color: $light-gray; - border-radius: 2px; - width: 100%; - height: 30px; - @include body-1; - - &:disabled { - @extend .disabled; - background-color: $silver; - } -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/features/_workflow.scss b/workflow-designer-ui/src/main/frontend/resources/scss/features/_workflow.scss deleted file mode 100644 index f959d17f..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/features/_workflow.scss +++ /dev/null @@ -1,4 +0,0 @@ -.workflow-view { - display: grid; - grid-template-columns: 245px 1fr; -} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/style.scss b/workflow-designer-ui/src/main/frontend/resources/scss/style.scss deleted file mode 100644 index 09e8c8bc..00000000 --- a/workflow-designer-ui/src/main/frontend/resources/scss/style.scss +++ /dev/null @@ -1,7 +0,0 @@ -@import '~bpmn-js/dist/assets/diagram-js.css'; -@import '~bpmn-js/dist/assets/bpmn-font/css/bpmn.css'; -@import 'common'; -@import '~onap-ui-common/lib/style.css'; -@import '~perfect-scrollbar/css/perfect-scrollbar.css'; -@import 'components'; -@import 'features'; |