diff options
author | Michael Lando <ml636r@att.com> | 2017-02-19 12:57:33 +0200 |
---|---|---|
committer | Michael Lando <ml636r@att.com> | 2017-02-19 13:47:13 +0200 |
commit | efa037d34be7b1570efdc767c79fad8d4005f10e (patch) | |
tree | cf1036ba2728dea8a61492b678fa91954e629403 /openecomp-ui/resources/scss/components/_listEditorView.scss | |
parent | f5f13c4f6b6fe3b4d98e349dfd7db59339803436 (diff) |
Add new code new version
Change-Id: Ic02a76313503b526f17c3df29eb387a29fe6a42a
Signed-off-by: Michael Lando <ml636r@att.com>
Diffstat (limited to 'openecomp-ui/resources/scss/components/_listEditorView.scss')
-rw-r--r-- | openecomp-ui/resources/scss/components/_listEditorView.scss | 157 |
1 files changed, 157 insertions, 0 deletions
diff --git a/openecomp-ui/resources/scss/components/_listEditorView.scss b/openecomp-ui/resources/scss/components/_listEditorView.scss new file mode 100644 index 0000000000..704faaf098 --- /dev/null +++ b/openecomp-ui/resources/scss/components/_listEditorView.scss @@ -0,0 +1,157 @@ +.list-editor-view { + @extend .flex-column; + background-color: $content-background-color; + + .list-editor-view-title { + @extend .section-title; + } + + .list-editor-view-title-inline { + @extend .list-editor-view-title; + position: relative; + top: 9px; + &:first-child { + padding: 0; + } + } + + .list-editor-view-add-section { + display: inline-block; + padding: 0 10px 0 10px; + } + + .list-editor-view-actions { + display: flex; + justify-content: space-between; + align-items: center; + border-bottom: 1px solid $light-gray; + padding-bottom: 18px; + .list-editor-view-add-controller { + @extend .body-1-medium; + color: $blue; + display: table; + cursor: pointer; + position: relative; + top: 9px; + span { + display: table-cell; + vertical-align: middle; + &:nth-child(2) { + padding-left: 10px; + } + } + } + + .search-wrapper { + width: 265px; + } + } + + .list-editor-view-list-scroller { + @extend .flex; + overflow: auto; + margin: 18px 0 30px 0; + } + + .list-editor-view-list { + @extend .flex-column; + + + .list-editor-item-view { + margin: 8px 0; + border: 1px solid $light-gray; + background-color: $white; + cursor: pointer; + display: flex; + height: 100px; + min-height: 100px; + overflow: hidden; + .list-editor-item-view-content { + padding: 10px 28px; + display: flex; + flex-basis: 95%; + width: 95%; + .list-editor-item-view-field { + flex: 1 1; + color: $black; + padding: 0; + @include ellipsis; + overflow-wrap: break-word; + white-space: initial; + .number-field { + align-content: center; + } + .title { + @extend .body-1; + padding-bottom: 5px; + &:not(:first-child) { + line-height: 0.9; + } + } + .text { + @extend .body-1; + } + } + } + .list-editor-item-view-controller { + display: flex; + flex-basis: 5%; + align-self: center; + justify-content: center; + flex-direction: column; + .fa { + transition: color .3s; + font-size: 22px; + color: $white; + &:first-child{ + margin-bottom: 10px; + } + } + } + &:hover { + @extend .box-hover; + .list-editor-item-view-controller { + .fa { + color: $gray; + } + } + } + } + } + + &.thinner-list { + background-color: $white; + padding: 0; + margin-top: 35px; + + .list-editor-view-list { + border-top: 0; + padding-top: 0; + margin-top: 23px; + .list-editor-item-view { + &:hover { + border-color: $light-gray; + } + margin: 5px 0 0 0; + height: 30px; + border-top: 0; + border-left: 0; + border-right: 0; + .list-editor-item-view-content { + padding: 4px; + .name { + @extend .body-2-medium; + flex-basis: 36%; + } + } + .list-editor-item-view-controller { + .fa-trash-o { + font-size: 20px; + } + } + } + } + } +} + + |