diff options
Diffstat (limited to 'openecomp-ui/resources/scss/modules/_onboardingCatalog.scss')
| -rw-r--r-- | openecomp-ui/resources/scss/modules/_onboardingCatalog.scss | 180 |
1 files changed, 20 insertions, 160 deletions
diff --git a/openecomp-ui/resources/scss/modules/_onboardingCatalog.scss b/openecomp-ui/resources/scss/modules/_onboardingCatalog.scss index 6020866d4a..6c56d11049 100644 --- a/openecomp-ui/resources/scss/modules/_onboardingCatalog.scss +++ b/openecomp-ui/resources/scss/modules/_onboardingCatalog.scss @@ -1,164 +1,24 @@ $transitionLength: 0.6s; .catalog-view { - background-color: $background-gray; - height: 100%; - overflow: hidden; - height: 100%; - .catalog-header { - padding-top: 20px; - margin: 0 48px 0 20px; - border-bottom: 1px solid $light-gray; - display: flex; - flex-direction: row; - justify-content: space-between; - .catalog-header-title { - @extend .heading-2; - margin: 0 0 10px 0; - } - .expandable-input-wrapper { - margin: 0 0 10px 0; - } - } - .catalog-list { - max-height: 100%; - overflow: auto; - display: flex; - flex-wrap: wrap; - padding: 40px 10px 0 10px; - &:after { - content: ' '; - display:block; - width: 100%; - height: 85px; - } - .tile { - background-color: $white; - margin: 10px; - width: 214px; - height: 210px; - display: flex; - flex-direction: column; - - } - .create-catalog-item { - border: 2px dashed $light-gray; - background-color: transparent; - &:hover { - .plus-section { - display: none; - } - .primary-btn { - display: inherit; - } - } - justify-content: center; - .plus-section { - align-self: center; - display: flex; - flex-direction: column; - .plus-icon-button { - align-self: center; - background-size: 23px; - width: 23px; - height: 23px; - margin-bottom: 4px; - } - } - .primary-btn { - display: none; - width: 176px; - &.new-license-model { - margin-bottom: 18px; - } - &:hover { - background-color: $background-alice-blue; - } - } - } - .catalog-tile { - cursor: pointer; - border: 1px solid $tlv-light-gray; - &:hover { - @include box-shadow(3px 3px 5px 0 rgba(24,24,25,.04)); - } - &:active { - border: 1px solid $light-blue; - } - .catalog-tile-type { - padding-top: 7px; - border-radius: 50%; - width: 40px; - height: 40px; - background: white; - border: 4px solid #F2F2F2; - position: relative; - top: -12px; - left: -7px; - &:before { - @extend .body-1; - color: $light-blue; - } - &.license-model-type { - padding-left: 13px; - &:before { - content: "L" - } - } - &.software-product-type { - padding-left: 8px; - &:before { - content: "SP" - } - } - } - .catalog-tile-icon { - text-align: center; - flex-basis: 60%; - justify-content: center; - background-size: 60px 60px; - background-repeat: no-repeat; - background-position: center; - display: flex; - .icon { - align-self: center; - height: 65px; - width: 65px; - background-repeat: no-repeat; - margin-bottom: 27px; - &.license-model-type-icon { - background-image: url('../images/onboarding/vendor-license-model.svg'); - } - &.software-product-type-icon { - background-image: url('../images/onboarding/vendor-software-product.svg'); - } - } - } - .catalog-tile-content { - border-top: 1px solid $background-gray; - flex-basis: 30%; - padding: 8px; - display: flex; - justify-content: space-between; - .catalog-tile-item-details { - overflow: hidden; - } - .catalog-tile-item-name { - @extend .body-1-medium; - @include ellipsis(); - width: 150px; - color: $dark-gray - } - .catalog-tile-item-version { - @extend .body-1; - color: $gray; - } - .catalog-tile-check-in-status { - width: 25px; - height: 19px; - align-self: center; - } - } - } - } + background-color: $background-gray; + overflow: hidden; + height: 100%; + @import "onboardingCatalog/onboardHeader"; + @import "onboardingCatalog/catalogHeader"; + @import "onboardingCatalog/vendorPageHeader"; + @import "onboardingCatalog/catalogList"; + .catalog-wrapper { + height: 100%; + overflow: auto; + .tab-separator { + content: ''; + height: 25px; + border-right: 1px solid $dark-gray; + } + .catalog-list { + overflow: hidden; + height: auto; + } + } } |