summaryrefslogtreecommitdiffstats
path: root/openecomp-ui/resources/scss/modules
diff options
context:
space:
mode:
authortalig <talig@amdocs.com>2017-12-20 14:30:43 +0200
committerVitaly Emporopulo <Vitaliy.Emporopulo@amdocs.com>2017-12-21 11:12:33 +0000
commit8e9c0653dd6c6862123c9609ae34e1206d86456e (patch)
tree5eeef00ec0677133baa439ca8d7ffd7aca4804b6 /openecomp-ui/resources/scss/modules
parent785ebcc95de3e064e843bec04ba7a209d854fc7c (diff)
Add collaboration feature
Issue-ID: SDC-767 Change-Id: I14fb4c1f54086ed03a56a7ff7fab9ecd40381795 Signed-off-by: talig <talig@amdocs.com>
Diffstat (limited to 'openecomp-ui/resources/scss/modules')
-rw-r--r--openecomp-ui/resources/scss/modules/_entitlementPools.scss33
-rw-r--r--openecomp-ui/resources/scss/modules/_featureGroup.scss43
-rw-r--r--openecomp-ui/resources/scss/modules/_licenseAgreement.scss38
-rw-r--r--openecomp-ui/resources/scss/modules/_licenseKeyGroup.scss5
-rw-r--r--openecomp-ui/resources/scss/modules/_licenseModel.scss16
-rw-r--r--openecomp-ui/resources/scss/modules/_licenseModelOverview.scss23
-rw-r--r--openecomp-ui/resources/scss/modules/_mergeEditor.scss207
-rw-r--r--openecomp-ui/resources/scss/modules/_onboardingCatalog.scss33
-rw-r--r--openecomp-ui/resources/scss/modules/_permissions.scss55
-rw-r--r--openecomp-ui/resources/scss/modules/_revisions.scss86
-rw-r--r--openecomp-ui/resources/scss/modules/_softwareProductAttachmentPage.scss28
-rw-r--r--openecomp-ui/resources/scss/modules/_softwareProductComponentGeneral.scss3
-rw-r--r--openecomp-ui/resources/scss/modules/_softwareProductComponentImage.scss11
-rw-r--r--openecomp-ui/resources/scss/modules/_softwareProductComponentNetwork.scss11
-rw-r--r--openecomp-ui/resources/scss/modules/_softwareProductComponentProcessesPage.scss3
-rw-r--r--openecomp-ui/resources/scss/modules/_softwareProductDependencies.scss25
-rw-r--r--openecomp-ui/resources/scss/modules/_softwareProductDeployment.scss13
-rw-r--r--openecomp-ui/resources/scss/modules/_softwareProductLandingPage.scss45
-rw-r--r--openecomp-ui/resources/scss/modules/_softwareProductProcessesPage.scss40
-rw-r--r--openecomp-ui/resources/scss/modules/_softwareproductComponentLoadBalancing.scss6
-rw-r--r--openecomp-ui/resources/scss/modules/_uploadScreen.scss14
-rw-r--r--openecomp-ui/resources/scss/modules/_versionsPage.scss325
-rw-r--r--openecomp-ui/resources/scss/modules/_vspComponentCompute.scss13
-rw-r--r--openecomp-ui/resources/scss/modules/_vspComponentMonitoring.scss28
-rw-r--r--openecomp-ui/resources/scss/modules/_vspComponentQuestionnaire.scss9
-rw-r--r--openecomp-ui/resources/scss/modules/onboardingCatalog/_catalogHeader.scss2
-rw-r--r--openecomp-ui/resources/scss/modules/onboardingCatalog/_onboardHeader.scss5
-rw-r--r--openecomp-ui/resources/scss/modules/onboardingCatalog/_vspOverlay.scss2
28 files changed, 810 insertions, 312 deletions
diff --git a/openecomp-ui/resources/scss/modules/_entitlementPools.scss b/openecomp-ui/resources/scss/modules/_entitlementPools.scss
index ad0bb77e8d..d9919c27e3 100644
--- a/openecomp-ui/resources/scss/modules/_entitlementPools.scss
+++ b/openecomp-ui/resources/scss/modules/_entitlementPools.scss
@@ -1,51 +1,22 @@
.entitlement-pools-list-editor {
- .list-editor-view-list {
- .list-editor-item-view {
- min-height: 110px;
- height: 110px;
- }
.list-editor-item-view-field {
- .entitlement-pools-count, .contract-number, .type{
- color: $purple;
- }
.entitlement-pools-count {
@extend .heading-1;
- margin-top: -10px;
-
- }
+ color: $purple;
}
}
}
.entitlement-pools-modal {
- .modal-body {
- padding: 0;
- }
- .sdc-tab-content {
- margin: 0;
- }
.entitlement-pools-form {
- .threshold-section {
+ .threshold-section, .date-section {
display: flex;
justify-content: space-between;
.validation-input-wrapper {
flex: 0 0 46%;
}
}
- .date-section {
- display: flex;
- justify-content: space-between;
- .validation-input-wrapper {
- flex: 0 0 46%;
- }
- }
- .validation-form-content {
- padding: 20px 50px;
}
- }
- .validation-buttons {
- padding: 20px 50px;
- }
}
diff --git a/openecomp-ui/resources/scss/modules/_featureGroup.scss b/openecomp-ui/resources/scss/modules/_featureGroup.scss
index 5f98ed2c05..cf681b8758 100644
--- a/openecomp-ui/resources/scss/modules/_featureGroup.scss
+++ b/openecomp-ui/resources/scss/modules/_featureGroup.scss
@@ -37,48 +37,5 @@
}
}
-.feature-group-modal {
- .modal-body {
- padding: 0;
- }
- .feature-group-form {
- .no-items-msg {
- margin-top: 55px;
- color: $dark-gray;
- }
- .validation-form-content {
- padding: 0;
- }
- .nav.nav-tabs {
- padding-left: 50px;
- }
- .tab-content {
- padding: 50px;
- .field-section {
- @extend .body-2-semibold;
- margin-bottom: 23px;
- width: 400px;
- color: $black;
- }
- .description-field {
- height: 170px;
- }
- .list-editor-item-view-content {
- white-space: nowrap;
- overflow: hidden;
- > div {
- overflow: hidden;
- text-overflow: ellipsis;
- &:not(:last-of-type) {
- margin-right: 24px;
- }
- }
- }
- }
- .validation-buttons {
- padding: 20px 50px;
- }
- }
-}
diff --git a/openecomp-ui/resources/scss/modules/_licenseAgreement.scss b/openecomp-ui/resources/scss/modules/_licenseAgreement.scss
index 7a7b87677e..579e9bab2b 100644
--- a/openecomp-ui/resources/scss/modules/_licenseAgreement.scss
+++ b/openecomp-ui/resources/scss/modules/_licenseAgreement.scss
@@ -2,10 +2,6 @@
.license-agreement-list-editor {
.list-editor-view-list {
- .list-editor-item-view {
- min-height: 110px;
- height: 110px;
- }
.list-editor-item-view-field {
.list-editor-item-view-field-tight {
vertical-align: top;
@@ -17,46 +13,14 @@
overflow-wrap: break-word;
}
}
- .feature-groups-count, .contract-number, .type {
+ .feature-groups-count, .type {
color: $light-green;
}
.feature-groups-count {
@extend .heading-1;
padding-top: 2px;
- text-align: center;
- }
- .contract-number {
- margin-bottom: 8px;
}
- }
- }
-}
-.license-agreement-modal {
- .modal-body {
- padding: 0;
- }
- .license-agreement-form {
- .no-items-msg {
- margin-top: 55px;
- color: $dark-gray;
- }
- .tab-content {
- padding: 50px;
- .list-editor-item-view-content {
- white-space: nowrap;
- overflow: hidden;
- > div {
- overflow: hidden;
- text-overflow: ellipsis;
- &:not(:last-of-type) {
- margin-right: 24px;
- }
- }
- }
- }
- .validation-buttons {
- padding: 20px 50px;
}
}
}
diff --git a/openecomp-ui/resources/scss/modules/_licenseKeyGroup.scss b/openecomp-ui/resources/scss/modules/_licenseKeyGroup.scss
index d072849c08..bcb6abc83d 100644
--- a/openecomp-ui/resources/scss/modules/_licenseKeyGroup.scss
+++ b/openecomp-ui/resources/scss/modules/_licenseKeyGroup.scss
@@ -1,16 +1,11 @@
.license-key-groups-list-editor {
.list-editor-view-list {
- .list-editor-item-view {
- min-height: 110px;
- height: 110px;
- }
.list-editor-item-view-field {
.operational-scope, .type {
color: $orange;
}
.operational-scope {
- margin-bottom: 0px;
@include ellipsis;
}
}
diff --git a/openecomp-ui/resources/scss/modules/_licenseModel.scss b/openecomp-ui/resources/scss/modules/_licenseModel.scss
index fab091fe67..e93ea989fd 100644
--- a/openecomp-ui/resources/scss/modules/_licenseModel.scss
+++ b/openecomp-ui/resources/scss/modules/_licenseModel.scss
@@ -6,9 +6,6 @@
border-bottom: none;
padding-bottom: 30px;
}
- .modal-body {
- padding: 0;
- }
.sdc-tabs-list {
padding-left: 50px;
border-bottom: 1px solid $tlv-light-gray;
@@ -25,10 +22,7 @@
text-align: end;
}
.license-model-form {
- .validation-form-content {
- padding: 20px 50px;
- }
- .validation-buttons {
+ .validation-form-content, .validation-buttons {
padding: 20px 50px;
}
&.license-agreement-form, &.feature-group-form {
@@ -51,3 +45,11 @@
}
}
}
+.license-model-list-editor {
+ .list-editor-view-list {
+ .list-editor-item-view {
+ min-height: 110px;
+ height: 110px;
+ }
+ }
+}
diff --git a/openecomp-ui/resources/scss/modules/_licenseModelOverview.scss b/openecomp-ui/resources/scss/modules/_licenseModelOverview.scss
index 9246b5fcbf..21c5bd8007 100644
--- a/openecomp-ui/resources/scss/modules/_licenseModelOverview.scss
+++ b/openecomp-ui/resources/scss/modules/_licenseModelOverview.scss
@@ -4,17 +4,14 @@ $icon-margin: 30px;
$arrow-element-width: 30px;
$list-item-padding: 15px;
-@mixin overview-tile-shadow() {
- @include box-shadow(0.5px 0.8px 4px 0 rgba(24, 24, 25, 0.05));
-}
-// @mixin vlm-list-item-inset($color) {
-// @include box-shadow(inset 6px 0 0 0 $color);
-// }
$la-color: $dark-blue;
$fg-color: $blue;
$lkg-ep-color: $light-blue;
+@mixin overview-tile-shadow() {
+ @include box-shadow(0.5px 0.8px 4px 0 rgba(24, 24, 25, 0.05));
+}
.license-model-overview {
.overview-top-section {
@@ -185,11 +182,8 @@ $lkg-ep-color: $light-blue;
width: 100%;
}
.svg-icon-wrapper {
-
.svg-icon {
&.__plusCircle {
- width: 20px;
- height: 20px;
margin-top: 3px;
margin-left: auto;
fill: $dark-gray;
@@ -197,7 +191,8 @@ $lkg-ep-color: $light-blue;
fill: $blue;
}
}
- }
+ }
+
}
.summary-name-and-count {
@@ -406,7 +401,7 @@ $lkg-ep-color: $light-blue;
&.vlm-list-item-la {
margin-top: 10px;
.la-icon {
- @include create-circle($circle-icon-size,$la-color,'LA');
+ @include create-circle($circle-icon-size, $la-color);
color: $white;
}
.vlm-list-item-title {
@@ -439,7 +434,7 @@ $lkg-ep-color: $light-blue;
margin-left: 29px;
}
.fg-icon {
- @include create-circle($circle-icon-size,$fg-color,'FG');
+ @include create-circle($circle-icon-size, $fg-color);
color: $white;
}
@@ -467,7 +462,7 @@ $lkg-ep-color: $light-blue;
margin-top: 10px;
cursor: default;
.ep-icon {
- @include create-circle($circle-icon-size,$lkg-ep-color,'EP');
+ @include create-circle($circle-icon-size, $lkg-ep-color);
color: $white;
}
.vlm-list-item-title {
@@ -490,7 +485,7 @@ $lkg-ep-color: $light-blue;
margin-left: $list-indentation * 2;
cursor: default;
.lkg-icon {
- @include create-circle($circle-icon-size,$lkg-ep-color,'KG');
+ @include create-circle($circle-icon-size, $lkg-ep-color);
color: $white;
}
.vlm-list-item-title {
diff --git a/openecomp-ui/resources/scss/modules/_mergeEditor.scss b/openecomp-ui/resources/scss/modules/_mergeEditor.scss
new file mode 100644
index 0000000000..96648dd20f
--- /dev/null
+++ b/openecomp-ui/resources/scss/modules/_mergeEditor.scss
@@ -0,0 +1,207 @@
+$yours-bg-color: $tlv-gray;
+$theirs-bg-color: $tlv-light-gray;
+$error-text-color: $red;
+$selected-width: 1px;
+$selected-color: $blue;
+
+@mixin levels {
+ @for $i from 1 to 6 {
+ .level-#{$i} {
+ padding-left: 18px + 10 * $i;
+ }
+ }
+}
+
+.merge-editor-modal {
+ .modal-lg {
+ width: 1300px;
+ }
+}
+
+.merge-editor {
+ margin: 30px 40px;
+ max-height: 600px;
+ border: 1px solid $light-gray;
+ .grid-section {
+ &.conflict-titles-section {
+ @extend .body-1;
+ background-color: $blue;
+ height: 33px;
+ padding-top: 6px;
+ padding-bottom: 3px;
+ color: $white;
+ position: sticky;
+ top: 0;
+ z-index: 2;
+ border-bottom: 1px solid $tlv-light-gray;
+ .grid-item {
+ padding-left: 10px;
+ }
+ .form-group {
+ margin-bottom: 0;
+ .checkbox {
+ label {
+ margin-right: 0;
+ }
+
+ text-align: right;
+
+ input[type="checkbox"] {
+ cursor: pointer;
+ margin-top: 1px;
+ }
+ }
+ }
+ }
+ }
+ .merge-editor-body {
+ max-height: 500px;
+ overflow-y: scroll;
+ padding: 10px;
+ .conflict-section {
+ margin-bottom: 0;
+ border-left: 0;
+ border-right: 0;
+ padding: 5px 0;
+
+ .conflict-resolve-btn {
+ align-self: flex-end;
+ }
+
+ .grid-items {
+ align-items: center;
+
+ input[type="radio"]:not(:checked) {
+ cursor: pointer;
+ }
+ }
+ }
+
+ .collapsible-section {
+ display: flex;
+ cursor: pointer;
+
+ .conflict-title {
+ @extend .heading-5-semibold;
+ text-transform: uppercase;
+ }
+ }
+
+ .merge-chevron {
+ margin-right: 7px;
+ &.right {
+ transform: rotate(90deg);
+ }
+ }
+
+ .grid-section .grid-items .field-col:not(.grid-col-title) {
+ &.grid-col-yours {
+ border-top: $selected-width solid $yours-bg-color;
+ border-bottom: $selected-width solid $yours-bg-color;
+ }
+
+ &.theirs-color {
+ border-top: $selected-width solid $theirs-bg-color;
+ border-bottom: $selected-width solid $theirs-bg-color;
+ }
+ }
+
+ .merge-editor-text-field {
+ display: flex;
+ justify-content: space-between;
+ // margin: 0 0 10px 0;
+ margin: 0;
+
+ .field {
+ color: $text-black;
+
+ &.field-name:not(.field-object-name) {
+ color: $gray;
+ }
+ }
+
+ &.diff {
+ .field {
+ color: $red;
+ }
+ }
+
+ &.grid-section {
+ padding-bottom: 0;
+
+ .grid-items {
+ flex: 1;
+
+
+ .field-col {
+ padding: 7px 0;
+ height: 100%;
+
+ &:not(:first-child) {
+ padding-left: 8px;
+ }
+
+ &.grid-col-yours {
+ background-color: $yours-bg-color;
+ }
+
+ &.grid-col-theirs {
+ background-color: $theirs-bg-color;
+ }
+
+ @include levels;
+
+
+ .field {
+ @extend .body-1;
+ flex: 2;
+ min-width: 0;
+
+ &.field-name {
+ @include multiline-ellipsis($bgColor: white);
+ &.diff {
+ color: $red;
+ }
+ text-transform: uppercase;
+ &.field-object-name {
+ @extend .body-1-semibold;
+ margin-bottom: 5px;
+ margin-top: 10px;
+
+ }
+ }
+
+ &.field-yours {
+ @include multiline-ellipsis($bgColor: $yours-bg-color);
+ }
+
+ &.field-theirs {
+ @include multiline-ellipsis($bgColor: $theirs-bg-color);
+ }
+ &.field-name, &.field.field-yours, &.field.field-theirs {
+ word-break: break-word;
+ text-align: initial;
+ }
+ &.empty-field {
+ padding-top: 2px;
+ }
+ }
+
+ *::after {
+ bottom: 0;
+ }
+ }
+ }
+ }
+
+ &.field-error {
+ @extend .body-1;
+ color: $error-text-color;
+ min-width: 0;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+ }
+ }
+}
diff --git a/openecomp-ui/resources/scss/modules/_onboardingCatalog.scss b/openecomp-ui/resources/scss/modules/_onboardingCatalog.scss
index 6c56d11049..4fb0f7c99e 100644
--- a/openecomp-ui/resources/scss/modules/_onboardingCatalog.scss
+++ b/openecomp-ui/resources/scss/modules/_onboardingCatalog.scss
@@ -8,6 +8,7 @@ $transitionLength: 0.6s;
@import "onboardingCatalog/catalogHeader";
@import "onboardingCatalog/vendorPageHeader";
@import "onboardingCatalog/catalogList";
+ @import "onboardingCatalog/vspOverlay";
.catalog-wrapper {
height: 100%;
overflow: auto;
@@ -19,6 +20,38 @@ $transitionLength: 0.6s;
.catalog-list {
overflow: hidden;
height: auto;
+ .sdc-tile {
+ margin: 9px;
+ .sdc-tile-header {
+ position: initial;
+ display: block;
+ flex-shrink: initial;
+ align-items: initial;
+ flex-direction: initial;
+ }
+ .sdc-tile-content {
+ position: initial;
+ flex: initial;
+ display: flex;
+ align-items: initial;
+ flex-direction: column;
+ justify-content: space-between;
+ overflow: initial;
+ .sdc-tile-info-line {
+ .with-overlay {
+ line-height: 1.2em;
+ @include ellipsis($width: initial, $max-width: 100%);
+ }
+ }
+ }
+ .sdc-tile-footer {
+ position: initial;
+ flex-shrink: initial;
+ display: flex;
+ align-items: center;
+ flex-direction: row;
+ }
+ }
}
}
}
diff --git a/openecomp-ui/resources/scss/modules/_permissions.scss b/openecomp-ui/resources/scss/modules/_permissions.scss
new file mode 100644
index 0000000000..e652d9d82f
--- /dev/null
+++ b/openecomp-ui/resources/scss/modules/_permissions.scss
@@ -0,0 +1,55 @@
+.modal-content {
+ .modal-body {
+ .manage-permissions-page {
+ .validation-form-content {
+ overflow-y: visible;
+ }
+
+ .manage-permissions-title {
+ @extend .body-1-semibold;
+ margin-bottom: 10px;
+ }
+ .owner-details {
+ @extend .body-2;
+ display: flex;
+ margin-bottom: 30px;
+ .change-owner {
+ margin-left: auto;
+ color: $blue;
+ cursor: pointer;
+ &:hover {
+ color: $dark-blue;
+ }
+ }
+ }
+ .change-owner-wrapper {
+ .form-group {
+ margin-bottom: 30px;
+ }
+
+ }
+ .change-owner-title {
+ display: flex;
+ align-items: center;
+ margin-bottom: 10px;
+ .manage-permissions-title {
+ margin-bottom: 0;
+ }
+ .svg-icon-wrapper {
+ margin-left: 5px;
+ .svg-icon {
+ width: 13px;
+ height: 13px;
+ fill: $dark-gray;
+ }
+ }
+ }
+ .contributors-select {
+ .Select-menu {
+ max-height: 150px;
+ overflow-y: auto
+ }
+ }
+ }
+ }
+}
diff --git a/openecomp-ui/resources/scss/modules/_revisions.scss b/openecomp-ui/resources/scss/modules/_revisions.scss
new file mode 100644
index 0000000000..2b196c132c
--- /dev/null
+++ b/openecomp-ui/resources/scss/modules/_revisions.scss
@@ -0,0 +1,86 @@
+.manage-revisions-modal {
+ .modal-dialog {
+ width: 700px;
+ }
+ .modal-content {
+ .modal-body {
+ .validation-form-content {
+ padding-top: 30px;
+ }
+ //.selected {
+ // .selectable {
+ // border-color: $light-blue;
+ // }
+ // .selectable:hover{
+ // border-color: hotpink;
+ // }
+ //}
+
+ .revision-list-item {
+ &.selected {
+ .selectable, .selectable:hover {
+ border-width: 2px;
+ border-color: $light-blue;
+ }
+ }
+ .selectable:hover{
+ border-color: $gray;
+ }
+ .selectable:active {
+ border-color: $light-blue;
+ }
+ }
+
+ .list-editor-view-list-scroller {
+ margin-top : 0px;
+ }
+
+ .list-editor-view-header {
+ border-bottom: none;
+ .list-editor-view-title {
+ @extend .heading-5;
+ text-transform: none;
+ color: $blue;
+ }
+ }
+
+ .list-editor-item-view-content {
+ background-color: $background-gray;
+ }
+ .revision-list-item-fields {
+ width: 100%;
+ display: flex;
+ flex-wrap: wrap;
+ .revision-user {
+ flex-basis: 50%;
+ fill: transparent;
+ stroke: $blue;
+ .svg-icon-label {
+ margin-left: 13px;
+ }
+ }
+
+ .revision-date {
+ flex-basis: 50%;
+ text-align: right;
+ @extend .body-3;
+ color: $gray;
+ .revision-time {
+ margin-left: 5px;
+ }
+ }
+
+ .revision-message {
+ flex-basis: 100%;
+ margin-top: 5px;
+ @extend .body-2;
+ .more-less {
+ @extend .body-3;
+ color: $blue;
+ margin-left: 5px;
+ }
+ }
+ }
+ }
+ }
+}
diff --git a/openecomp-ui/resources/scss/modules/_softwareProductAttachmentPage.scss b/openecomp-ui/resources/scss/modules/_softwareProductAttachmentPage.scss
index c8d8cf4e0b..0ae3f00a29 100644
--- a/openecomp-ui/resources/scss/modules/_softwareProductAttachmentPage.scss
+++ b/openecomp-ui/resources/scss/modules/_softwareProductAttachmentPage.scss
@@ -1,21 +1,25 @@
.vsp-attachments-view {
position: relative;
- #attachments-tabs {
- .nav-tabs {
+ .attachments-tabs {
+ .sdc-tabs-list {
+ padding-left: 28px;
background-color: $tlv-gray;
box-shadow: none;
border-bottom: 1px solid $light-gray;
- & > li {
- & > a {
+ .sdc-tab {
@extend .heading-2;
- padding-left: 0;
- padding-right: 0;
- margin-right: 40px;
- };
- &.active > a {color: $blue;};
+ padding-top: 10px;
+ margin-top: 0;
+ &.sdc-tab-active {
+ color: $blue;
+ font-weight: bold;
+ }
}
}
+ .sdc-tab-content {
+ margin-top: 0;
+ }
}
.attachments-view-controllers {
position: absolute;
@@ -91,6 +95,11 @@
z-index: 1;
padding-right: 20px;
.counter {
+ .svg-icon {
+ &.__exclamationTriangleLine {
+ fill: $orange;
+ }
+ }
display: flex;
&:first-child {
margin-right: 20px;
@@ -215,6 +224,7 @@
.svg-icon {
width: 20px;
height: 20px;
+ fill: $orange;
}
}
.error-item-file-type {
diff --git a/openecomp-ui/resources/scss/modules/_softwareProductComponentGeneral.scss b/openecomp-ui/resources/scss/modules/_softwareProductComponentGeneral.scss
index 6c5bcee03c..d31c7f0b92 100644
--- a/openecomp-ui/resources/scss/modules/_softwareProductComponentGeneral.scss
+++ b/openecomp-ui/resources/scss/modules/_softwareProductComponentGeneral.scss
@@ -10,7 +10,4 @@
}
}
}
- .additional-validation-form {
- margin-top: 50px;
- }
}
diff --git a/openecomp-ui/resources/scss/modules/_softwareProductComponentImage.scss b/openecomp-ui/resources/scss/modules/_softwareProductComponentImage.scss
index dad837f356..b67c448b54 100644
--- a/openecomp-ui/resources/scss/modules/_softwareProductComponentImage.scss
+++ b/openecomp-ui/resources/scss/modules/_softwareProductComponentImage.scss
@@ -23,9 +23,6 @@
}
.image-modal-edit, .image-modal-new {
- .modal-body {
- padding: 0;
- }
.vsp-components-image-editor {
.image-format, .image-md5, .image-version {
@@ -35,13 +32,19 @@
padding-left: 30px;
}
.section-title {
- text-transform: capitalize;
+ text-transform: uppercase;
font-size: 18px;
}
}
}
.vsp-components-image {
+ .list-editor-view {
+ margin-top: 50px;
+ .manual-title {
+ @extend .body-1-semibold;
+ }
+ }
.list-editor-item-view-content {
flex:1;
min-width: 0;
diff --git a/openecomp-ui/resources/scss/modules/_softwareProductComponentNetwork.scss b/openecomp-ui/resources/scss/modules/_softwareProductComponentNetwork.scss
index 402918bc5e..eaba47acb4 100644
--- a/openecomp-ui/resources/scss/modules/_softwareProductComponentNetwork.scss
+++ b/openecomp-ui/resources/scss/modules/_softwareProductComponentNetwork.scss
@@ -20,16 +20,7 @@
display: flex;
}
}
-.network-nic-modal-edit, .network-nic-modal-create {
- .modal-body {
- padding: 0;
- }
- .validation-form-content {
- padding-left: 50px;
- padding-right: 50px;
- padding-top: 20px;
- }
-}
+
.network-nic-modal-edit {
.modal-dialog {
width: 900px;
diff --git a/openecomp-ui/resources/scss/modules/_softwareProductComponentProcessesPage.scss b/openecomp-ui/resources/scss/modules/_softwareProductComponentProcessesPage.scss
index be4caacfb5..9476d7043d 100644
--- a/openecomp-ui/resources/scss/modules/_softwareProductComponentProcessesPage.scss
+++ b/openecomp-ui/resources/scss/modules/_softwareProductComponentProcessesPage.scss
@@ -1,7 +1,4 @@
.edit-process-modal {
- .vsp-process-dropzone-view .grid-section {
- padding-bottom: 30px !important;
- }
.component-process-description > textarea {
height: 113px;
}
diff --git a/openecomp-ui/resources/scss/modules/_softwareProductDependencies.scss b/openecomp-ui/resources/scss/modules/_softwareProductDependencies.scss
index 8fb739234f..65c558fa0e 100644
--- a/openecomp-ui/resources/scss/modules/_softwareProductDependencies.scss
+++ b/openecomp-ui/resources/scss/modules/_softwareProductDependencies.scss
@@ -2,14 +2,22 @@
.software-product-dependencies-title {
@extend .heading-1;
@extend .text-uppercase !optional;
+ position: sticky;
+ top: -30px;
+ z-index: 1;
+ background: $white;
margin-bottom: 20px;
color: $blue;
}
.select-action-table-controllers {
+ position: sticky;
+ top: 4px;
+ z-index: 1;
+ background: $white;
justify-content: flex-end;
cursor: pointer;
color: $blue;
- padding-right: 33px;
+ padding-right: 27px;
margin-bottom: 3px;
&:hover {
color: $dark-blue;
@@ -18,8 +26,23 @@
.select-action-table-view {
min-width: 770px;
}
+ .select-action-table-headers {
+ position: sticky;
+ top: 27px;
+ z-index: 1;
.select-action-table-header {
@extend .body-1-semibold;
color: $text-black;
+ }
+ }
+ .select-action-table-row-wrapper {
+ .svg-icon {
+ &.__trashO, &.__plusCircle {
+ fill: $dark-gray;
+ &:hover {
+ fill: $black;
}
+ }
+ }
+ }
}
diff --git a/openecomp-ui/resources/scss/modules/_softwareProductDeployment.scss b/openecomp-ui/resources/scss/modules/_softwareProductDeployment.scss
index e0de8fc969..b5f9a546d9 100644
--- a/openecomp-ui/resources/scss/modules/_softwareProductDeployment.scss
+++ b/openecomp-ui/resources/scss/modules/_softwareProductDeployment.scss
@@ -2,9 +2,6 @@
.modal-dialog {
width: 780px;
}
- .grid-section {
- padding-bottom: 25px;
- }
.deployment-feature-groups-section.no-feature-groups {
padding-bottom: 0;
.form-group {
@@ -25,15 +22,12 @@
}
.modal-content {
.modal-body {
- padding: 0;
.validation-form-content {
+ overflow-y: visible;
.grid-col-1 {
- flex-basis: 35%;
+ flex-basis: 30%;
}
- .Select-value, .Select-placeholder {
- font-family: omnes-regular, sans-serif;
- }
.grid-section.vfc-table {
padding-bottom: 50px;
@@ -46,9 +40,6 @@
.grid-col-3 {
flex-basis: 65%;
}
- padding-left: 54px;
- padding-right: 33px;
- overflow-y: visible;
}
}
}
diff --git a/openecomp-ui/resources/scss/modules/_softwareProductLandingPage.scss b/openecomp-ui/resources/scss/modules/_softwareProductLandingPage.scss
index 28b54cc78f..99027d66ed 100644
--- a/openecomp-ui/resources/scss/modules/_softwareProductLandingPage.scss
+++ b/openecomp-ui/resources/scss/modules/_softwareProductLandingPage.scss
@@ -18,12 +18,7 @@
.description {
@extend .body-1;
- // overflow: hidden;
padding-right: 20px;
- // text-overflow: ellipsis;
- // display: -webkit-box;
- // -webkit-line-clamp: 2;
- // -webkit-box-orient: vertical;
.missing-license {
display: flex;
@@ -56,15 +51,9 @@
}
}
.software-product-landing-view {
- transition: border .2s;
padding-bottom: 50px;
- .list-editor-view {
- padding-top: 50px;
- padding-left: 0;
- padding-right: 0;
- }
.software-product-landing-view-top {
.details-container {
@extend .flex-column;
@@ -110,6 +99,10 @@
&:last-child {
margin-right: 0;
}
+ .software-product-landing-view-top-block-col-upl {
+ height: 215px;
+ width: initial;
+ }
}
.col-md-6 {
padding: 0;
@@ -134,16 +127,19 @@
}
}
.software-product-landing-view-top-block {
+ &.clickable {
cursor: pointer;
+ &:hover {
+ @extend .box-hover;
+ }
+ }
border: 1px solid $light-gray;
padding: 20px 18px 0 18px;
height: 215px;
display: flex;
justify-content: space-between;
background-color: $white;
- &:hover {
- @extend .box-hover;
- }
+
.col-md-6 {
@extend .body-1;
}
@@ -164,30 +160,12 @@
color: $light-blue;
}
}
- }
.software-product-landing-view-top-block-col-upl {
@extend .flex;
- height: 215px;
- text-align: center;
- flex-direction: column;
- justify-content: center;
- border: 2px dashed $light-gray;
margin-bottom: 20px;
- @extend .body-1;
- align-items: center;
- .upload-btn {
- padding: 15px 55px;
}
- .drag-text {
- color: $blue;
- @extend .body-1-semibold;
- }
- .or-text {
- margin-top: 10px;
- margin-bottom: 10px;
- }
}
}
}
@@ -195,6 +173,9 @@
}
.vsp-details-page {
+ .grid-section-general {
+ padding-bottom: 30px;
+ }
.vsp-general-tab {
.validation-form-content {
margin: 0;
diff --git a/openecomp-ui/resources/scss/modules/_softwareProductProcessesPage.scss b/openecomp-ui/resources/scss/modules/_softwareProductProcessesPage.scss
index d75e7447ab..3f2a2f9a69 100644
--- a/openecomp-ui/resources/scss/modules/_softwareProductProcessesPage.scss
+++ b/openecomp-ui/resources/scss/modules/_softwareProductProcessesPage.scss
@@ -1,10 +1,5 @@
.edit-process-modal {
- background-color: $white;
height: 100%;
- &.modal-body {
- padding: 0;
- background-color: $white;
- }
.vsp-processes-editor {
padding-left: 0;
padding-right: 0;
@@ -23,41 +18,22 @@
padding-top: 20px;
padding-bottom: 20px;
- align-items: center;
- .upload-btn {
- padding: 4px 20px;
- }
- .drag-text {
- color: $blue;
- @extend .body-1-semibold;
- }
- .or-text {
- margin-top: 10px;
- margin-bottom: 10px;
+ .process-type {
+ width: 100%;
}
}
.vsp-processes-editor-data {
- transition: border .2s;
- .vsp-process-dropzone-view {
- background-color: transparent;
- &.active-dragging {
- border: 3px dashed $dark-blue;
- border-radius: 20px;
- .draggable-wrapper {
- opacity: 0.5;
- }
- }
- .grid-section {
- .section-title {
- padding-bottom: 0;
- }
- }
- }
.validation-input-wrapper {
.form-group.vsp-process-description > textarea {
height: 113px;
}
}
+ .process-type {
+ width: 100%;
+ }
+ .process-editor-file-box {
+ width: 380px;
+ }
}
}
}
diff --git a/openecomp-ui/resources/scss/modules/_softwareproductComponentLoadBalancing.scss b/openecomp-ui/resources/scss/modules/_softwareproductComponentLoadBalancing.scss
index d1f3f488bd..440b2424df 100644
--- a/openecomp-ui/resources/scss/modules/_softwareproductComponentLoadBalancing.scss
+++ b/openecomp-ui/resources/scss/modules/_softwareproductComponentLoadBalancing.scss
@@ -5,12 +5,6 @@
}
.halb-data {
- .load-balancing-page-title {
- @extend .section-title;
- &:first-child {
- padding: 0 0 40px 0;
- }
- }
.question {
padding-top: 10px;
&:first-child {
diff --git a/openecomp-ui/resources/scss/modules/_uploadScreen.scss b/openecomp-ui/resources/scss/modules/_uploadScreen.scss
index 4aa07f1580..23f41c8816 100644
--- a/openecomp-ui/resources/scss/modules/_uploadScreen.scss
+++ b/openecomp-ui/resources/scss/modules/_uploadScreen.scss
@@ -5,20 +5,6 @@
text-align: center;
margin-bottom: 50px;
}
- .upload-screen-upload-block {
- text-align: center;
- padding: 50px;
- border: 2px dashed lightgray;
- }
- .upload-screen-drop-zone {
- &.active-dragging {
- border: 3px dashed $dark-blue;
- border-radius: 20px;
- .draggable-wrapper {
- opacity: 0.5;
- }
- }
- }
}
.attachments-screen {
diff --git a/openecomp-ui/resources/scss/modules/_versionsPage.scss b/openecomp-ui/resources/scss/modules/_versionsPage.scss
new file mode 100644
index 0000000000..fa1dc11ec6
--- /dev/null
+++ b/openecomp-ui/resources/scss/modules/_versionsPage.scss
@@ -0,0 +1,325 @@
+.dox-ui-punch-out {
+ background-color: $content-background-color;
+}
+
+.dox-ui-punch-out.dox-ui-punch-out-full-page {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ overflow-y: auto;
+}
+
+@mixin version-page-box-shadow() {
+ box-shadow: 0 1px 4px 0 rgba(24, 24, 24, 0.06);
+}
+
+@mixin version-page-sub-title(){
+ color: $text-black;
+ text-transform: uppercase;
+ background-color: $white;
+ border-bottom: 1px solid $light-gray;
+ padding: 12px 0 10px 23px;
+}
+
+.versions-tree-modal {
+ .modal-dialog {
+ width: 800px;
+ }
+
+ .tree-view {
+ display: flex;
+ align-items: center;
+ }
+}
+
+.versions-page-view {
+ height: 100%;
+ background-color: $background-gray;
+ overflow: auto;
+ padding: 35px 50px 20px 50px;
+
+ .svg-icon-wrapper {
+ justify-content: flex-start;
+ }
+
+ .versions-page-title {
+ @extend .heading-1;
+ text-transform: uppercase;
+ margin-bottom: 29px;
+ color: $blue;
+ }
+
+ .versions-page-permissions-view-wrapper {
+ @extend .body-1-semibold;
+ @include version-page-box-shadow();
+
+ .permissions-view-wrapper-title {
+ @include version-page-sub-title();
+ }
+
+ .svg-icon-wrapper.user-view {
+ fill: transparent;
+ stroke: $blue;
+ .svg-icon {
+ height: 18px;
+ width: 16px;
+ margin: 0 7px;
+ }
+ &.current-user {
+ .svg-icon {
+ background-color: $blue;
+ stroke: $white;
+ padding-top: 5px;
+ padding-bottom: 3px;
+ height: 29px;
+ width: 29px;
+ border-radius: 20px;
+ border: 1px solid $blue;
+ box-shadow: inset 0px 0px 0px 2px $white;
+ margin: 0;
+ }
+ .svg-icon-label {
+ margin-left: 7px;
+ }
+ }
+ .svg-icon-label {
+ @extend .body-2;
+ color: $dark-gray;
+ margin-left: 6px;
+ }
+ }
+
+ .permissions-view-content {
+ padding: 20px 40px 20px 25px;
+ background-color: $white;
+
+ height: 120px;
+ display: flex;
+ }
+
+ .permissions-view {
+ display: flex;
+ flex: 1;
+ flex-direction: column;
+ justify-content: space-around;
+
+ .permissions-view-title {
+ text-transform: uppercase;
+ color: $dark-gray;
+ }
+
+ .contributors-view, .owner-view {
+ display: flex;
+ height: 16px;
+ @extend .body-1-semibold;
+
+ .permissions-view-title {
+ width: 130px;
+ line-height: 16px;
+ }
+
+ .extra-contributors {
+ border-radius: 30px;
+ background-color: $gray;
+ width: 26px;
+ height: 26px;
+ padding-right: 2px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: $white;
+ cursor: default;
+ &:hover {
+ background-color: $dark-gray;
+ }
+ }
+
+ .user-view {
+ margin-right: 38px;
+ }
+
+ .manage-permissions {
+ color: $blue;
+ margin-left: auto;
+ cursor: pointer;
+
+ &:hover {
+ color: $dark-blue;
+ }
+ }
+ }
+ }
+ }
+
+ .versions-page-list-and-tree {
+ display: flex;
+ margin-top: 20px;
+
+ .version-tree-wrapper {
+ display: flex;
+ flex-direction: column;
+ margin-right:10px;
+ transition: all 1s ease;
+ @include version-page-box-shadow();
+
+ .version-tree-title-container {
+ display: flex;
+ align-items: center;
+ height: 40px;
+ @include version-page-sub-title();
+ padding-right: 10px;
+
+ .version-tree-full-screen {
+ margin-left: auto;
+ }
+ }
+
+ .tree-view {
+ background-color: $white;
+ flex: 1;
+ }
+ }
+ }
+
+ .version-list {
+ flex: 1;
+ @extend .body-1-semibold;
+ color: $text-black;
+ display: flex;
+ flex-direction: column;
+
+ .version-list-items {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+
+ .version-item-row {
+ border-bottom: 1px solid $tlv-light-gray;
+
+ &:last-child {
+ border-bottom: none;
+ }
+ }
+ }
+
+ .version-item-row {
+ $row-hover-color: lighten($blue, 54%);
+ $row-active-color: lighten($blue, 51%);
+
+ display: flex;
+ align-items: center;
+ padding: 15px 30px;
+ @include version-page-box-shadow();
+ background-color: $white;
+ 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 {
+ background-color: $row-hover-color;
+ box-shadow: 0 1px 4px 0 rgba(24, 24, 24, 0.06), inset 5px 0 0 0 lighten($blue, 35%);
+ }
+ }
+
+ &.header-row {
+ height: 40px;
+
+ @extend .body-1-semibold;
+ @include version-page-sub-title();
+ padding: 15px 27px;
+
+ &:hover {
+ background-color: $white;
+ pointer-events: none;
+ &:active {
+ background-color: $white;
+ @include version-page-box-shadow();
+ }
+ }
+ .header-field.actions {
+ margin-right: 57px;
+ }
+ }
+
+ .version-item-field {
+ flex: 1;
+ display: flex;
+ margin-right: 10px;
+
+ &.item-version, &.item-status {
+ flex: 0 1 10%;
+ @extend .body-1-semibold;
+ color: $text-black;
+ }
+
+ &.item-description, &.item-last-edited {
+ @extend .body-1;
+ color: $dark-gray;
+ }
+
+ &.item-description, &.header-description {
+ flex: 2 1 0;
+ }
+
+ &.item-description > .description-text {
+ margin-right: 10px;
+ @include ellipsis($max-width: 300px);
+ }
+
+ &.item-actions {
+ display: flex;
+ flex: 1 1 3%;
+ justify-content: space-between;
+ }
+
+ &.item-select, &.item-create {
+ @extend .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;
+ }
+}
diff --git a/openecomp-ui/resources/scss/modules/_vspComponentCompute.scss b/openecomp-ui/resources/scss/modules/_vspComponentCompute.scss
index ee8cfa5c7f..9f88e94393 100644
--- a/openecomp-ui/resources/scss/modules/_vspComponentCompute.scss
+++ b/openecomp-ui/resources/scss/modules/_vspComponentCompute.scss
@@ -1,16 +1,3 @@
-.vsp-component-computeFlavor-view {
- .component-questionnaire-validation-form {
- .vm-sizing-section {
- .section-title {
- text-transform: capitalize;
- font-size: 18px;
- }
- .duplicate-title-line label.control-label{
- height: 2.7em;
- }
- }
- }
-}
.compute-flavor-editor-modal-edit {
.modal-lg {
diff --git a/openecomp-ui/resources/scss/modules/_vspComponentMonitoring.scss b/openecomp-ui/resources/scss/modules/_vspComponentMonitoring.scss
index bda8512f36..14bad18179 100644
--- a/openecomp-ui/resources/scss/modules/_vspComponentMonitoring.scss
+++ b/openecomp-ui/resources/scss/modules/_vspComponentMonitoring.scss
@@ -1,34 +1,9 @@
.vsp-component-monitoring {
.dropzone {
- .section-title {
- padding-bottom: 20px;
- }
&:not(:last-child) {
padding-bottom: 50px;
}
- .software-product-landing-view-top-block-col-upl {
- @extend .body-1;
- width: 400px;
- display: flex;
- text-align: center;
- flex-direction: column;
- justify-content: center;
- border: 2px dashed $light-gray;
- padding: 25px 0;
- align-items: center;
- .upload-btn {
- padding: 4px 20px;
- }
- .drag-text {
- color: $blue;
- @extend .body-1-semibold
- }
- .or-text {
- margin-top: 10px;
- margin-bottom: 10px;
- }
- }
.monitoring-file {
display: flex;
@@ -46,7 +21,4 @@
}
}
- .delete-button {
- min-width: 0;
- }
}
diff --git a/openecomp-ui/resources/scss/modules/_vspComponentQuestionnaire.scss b/openecomp-ui/resources/scss/modules/_vspComponentQuestionnaire.scss
index 5696b354a7..2a99263285 100644
--- a/openecomp-ui/resources/scss/modules/_vspComponentQuestionnaire.scss
+++ b/openecomp-ui/resources/scss/modules/_vspComponentQuestionnaire.scss
@@ -1,6 +1,6 @@
.vsp-component-questionnaire-view {
- input[type='radio'], input[type='checkbox'] {
+ input[type='checkbox'] {
&:before {
border: 1px solid $dark-gray;
cursor: pointer;
@@ -30,14 +30,13 @@
.radio-options-content-row {
display: flex;
margin-top: -4px;
- .validation-input-wrapper {
- width: 240px;
- margin-right: 7px;
+ .validation-radio-wrapper {
+ margin-right: 20px;
& > .form-group {
display: flex;
}
- .form-group .radio {
+ .form-group .sdc-radio {
width: auto;
margin-right: 0;
}
diff --git a/openecomp-ui/resources/scss/modules/onboardingCatalog/_catalogHeader.scss b/openecomp-ui/resources/scss/modules/onboardingCatalog/_catalogHeader.scss
index d29a95d3d6..0a234a5a96 100644
--- a/openecomp-ui/resources/scss/modules/onboardingCatalog/_catalogHeader.scss
+++ b/openecomp-ui/resources/scss/modules/onboardingCatalog/_catalogHeader.scss
@@ -14,7 +14,7 @@
flex-direction: row;
.tab-separator {
position: relative;
- top: 13px;
+ top: 8px;
}
.catalog-header-tab {
@extend .heading-1;
diff --git a/openecomp-ui/resources/scss/modules/onboardingCatalog/_onboardHeader.scss b/openecomp-ui/resources/scss/modules/onboardingCatalog/_onboardHeader.scss
index 32ebac98cf..f97641cbe3 100644
--- a/openecomp-ui/resources/scss/modules/onboardingCatalog/_onboardHeader.scss
+++ b/openecomp-ui/resources/scss/modules/onboardingCatalog/_onboardHeader.scss
@@ -5,15 +5,16 @@
justify-content: flex-end;
background-color: $tlv-light-gray;
margin-bottom: 2px;
+ padding-left: 60px;
+ padding-right: 40px;
@include box-shadow(0px 1px 3px 0 rgba(0, 0, 0, 0.2));
.expandable-input-top {
- margin-right: 60px;
+ margin-right: 20px;
margin-left: auto;
}
.onboard-header-tabs {
display: flex;
flex-direction: row;
- margin-left: 60px;
.onboard-header-tab {
@extend .body-1-semibold;
margin-right: 40px;
diff --git a/openecomp-ui/resources/scss/modules/onboardingCatalog/_vspOverlay.scss b/openecomp-ui/resources/scss/modules/onboardingCatalog/_vspOverlay.scss
index 80ed7385e0..e0b72bf9ff 100644
--- a/openecomp-ui/resources/scss/modules/onboardingCatalog/_vspOverlay.scss
+++ b/openecomp-ui/resources/scss/modules/onboardingCatalog/_vspOverlay.scss
@@ -54,7 +54,7 @@
&:hover {
color: $blue;
}
- text-transform: uppercase;
+ text-transform: none;
@include ellipsis(auto, block);
border-bottom: 1px solid $tlv-light-gray;
cursor: pointer;