From bca1bdc7d52b01ede5c0e85f06cd6c64e5aaab57 Mon Sep 17 00:00:00 2001 From: Shawn Severin Date: Wed, 20 Dec 2017 16:27:35 -0500 Subject: Updating versions of Sparky FE files Updating versions of Sparky FE files as previous ones were out-dated Issue-ID: AAI-543 Change-Id: Idc7d09e0efabaa5ef82db126cf7563fc8370f4f9 Signed-off-by: Shawn Severin --- resources/scss/tier-support/_search.scss | 64 +++++++++++----------- .../scss/tier-support/_selectedNodeDetails.scss | 13 ++--- resources/scss/tier-support/_splitPane.scss | 30 +++++----- 3 files changed, 52 insertions(+), 55 deletions(-) (limited to 'resources/scss/tier-support') diff --git a/resources/scss/tier-support/_search.scss b/resources/scss/tier-support/_search.scss index 6c349af..b65cb57 100644 --- a/resources/scss/tier-support/_search.scss +++ b/resources/scss/tier-support/_search.scss @@ -21,7 +21,6 @@ * ECOMP is a trademark and service mark of AT&T Intellectual Property. */ - .auto-complete-search { display: inline-block; vertical-align: text-bottom; @@ -31,9 +30,9 @@ float: left; } -.auto-complete-search-button-group{ - position: absolute; - width: 90px; +.auto-complete-search-button-group { + position: absolute !important; + padding-top: 3px; } .auto-complete-search input.form-control { @@ -41,36 +40,35 @@ } .auto-complete-search-button, .auto-complete-search-button:focus { - background-color: $light-gray; - padding-bottom: 8px; + background-color: $search-button-background-color; width: 45px; height: 30px; - border: solid 1px $gray; + border: solid 1px $search-border-color1; } .auto-complete-search button:hover { - background-color: $blue; + background-color: $search-background-color1; } .auto-complete-search .fa-lg { font-size: 1em; line-height: 1em; - background-color: $light-gray; + background-color: $search-button-background-color; } .auto-complete-search button:hover .fa-search { - color: $white; - background-color: $blue; + color: $primary-background-color; + background-color: $search-background-color1; } .auto-complete-search .btn-group .auto-complete-clear-button { border: none; - margin-left: -35px; - margin-top: 2px; - padding: 5px 12px 8px 12px; + margin-left: -35px !important; + height: 30px; + background-color: transparent; i { - color: #009fdb; + color: $search-text-color1; opacity: 0.3; filter: alpha(opacity=30); background-color: transparent; @@ -81,26 +79,28 @@ background-color: transparent; i.fa-times { - color: #009fdb; + color: $search-text-color1; opacity: 1; background-color: transparent; } } .auto-complete-search button:hover .fa-times { - color: $white; - background-color: $blue; + color: $primary-background-color; + background-color: $search-background-color1; } .react-autosuggest__container { display: inline-block; position: relative; + padding-top: 3px; } -.react-autosuggest__input{ +.react-autosuggest__input { width: 655px; height: 30px; display: inline-block; + padding-top: 10px; } .react-autosuggest__input:focus { @@ -117,20 +117,19 @@ overflow-y: scroll; height: 200px; border:1px ; - } -.react-autosuggest__suggestions-containerCopy{ +.react-autosuggest__suggestions-containerCopy { display: none; display: block; position: absolute; top: 30px; width: 655px; - border: 1px solid #aaa; - background-color: #fff; + border: 1px solid $search-border-color1; + background-color: $primary-background-color; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; - z-index: 2; + z-index: 90; overflow-y: hidden; } @@ -139,11 +138,11 @@ position: absolute; top: 30px; width: 655px; - border: 1px solid #aaa; - background-color: #fff; + border: 1px solid $search-border-color1; + background-color: $primary-background-color; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; - z-index: 2; + z-index: 99; overflow-x: hidden; } @@ -161,14 +160,14 @@ } .react-autosuggest__suggestion--focused { - background-color: #ddd; + background-color: $search-background-color3; } .react-autosuggest__section-title { padding: 10px 0 0 10px; font-size: 12px; - color: #777; - border-top: 1px dashed #ccc; + color: $search-background-color2; + border-top: 1px dashed $search-border-color1; } .react-autosuggest__section-container:first-child .react-autosuggest__section-title { @@ -185,10 +184,11 @@ flex: 20; } -.suggestionColumnTwo{ +.suggestionColumnTwo { flex: 80; } -.highlight{ + +.highlight { font-weight: bolder; background-color:inherit; padding: 0px; diff --git a/resources/scss/tier-support/_selectedNodeDetails.scss b/resources/scss/tier-support/_selectedNodeDetails.scss index 0532319..ec4798c 100644 --- a/resources/scss/tier-support/_selectedNodeDetails.scss +++ b/resources/scss/tier-support/_selectedNodeDetails.scss @@ -21,14 +21,13 @@ * ECOMP is a trademark and service mark of AT&T Intellectual Property. */ - .ts-selected-node-details { padding: 20px; - color: $dark-gray; + color: $border-color2; font-family: $body-font-1; h1 { - color: $blue; + color: $selected-node-details-color1; font-size: $heading-font-2; margin-bottom: 5px; } @@ -40,7 +39,7 @@ margin-top: 15px; th { - color: $gray; + color: $border-color2; } td { @@ -49,14 +48,14 @@ .left-column-cell { padding: 7px 5px 5px 0px; - border-bottom: solid 1px $light-gray; - border-right: solid 1px $light-gray; + border-bottom: solid 1px $border-color5; + border-right: solid 1px $border-color5; width: 50%; } .right-column-cell { padding: 7px 5px 5px 15px; - border-bottom: solid 1px $light-gray; + border-bottom: solid 1px $border-color5; } } diff --git a/resources/scss/tier-support/_splitPane.scss b/resources/scss/tier-support/_splitPane.scss index db0770e..dc07be0 100644 --- a/resources/scss/tier-support/_splitPane.scss +++ b/resources/scss/tier-support/_splitPane.scss @@ -21,15 +21,13 @@ * ECOMP is a trademark and service mark of AT&T Intellectual Property. */ - .SplitPane { - min-width: 1280px; - //108 is the height of the header in tsui - height: calc(100% - 108px) !important; + min-width: $minimum-application-width; + height: calc(100% - #{$total-header-height}) !important; } .Resizer { - background: #000; + background: $border-color1; opacity: .2; z-index: 1; -moz-box-sizing: border-box; @@ -48,28 +46,28 @@ .Resizer.horizontal { height: 11px; margin: -5px 0; - border-top: 5px solid rgba(255, 255, 255, 0); - border-bottom: 5px solid rgba(255, 255, 255, 0); + border-top: 5px solid transparent; + border-bottom: 5px solid transparent; cursor: row-resize; width: 100%; } .Resizer.horizontal:hover { - border-top: 5px solid rgba(0, 0, 0, 0.5); - border-bottom: 5px solid rgba(0, 0, 0, 0.5); + border-top: 5px solid $border-color2; + border-bottom: 5px solid $border-color2; } .Resizer.vertical { width: 11px; margin: 0 -5px; - border-left: 5px solid rgba(255, 255, 255, 0); - border-right: 5px solid rgba(255, 255, 255, 0); + border-left: 5px solid transparent; + border-right: 5px solid transparent; cursor: col-resize; } .Resizer.vertical:hover { - border-left: 5px solid rgba(0, 0, 0, 0.5); - border-right: 5px solid rgba(0, 0, 0, 0.5); + border-left: 5px solid $border-color2; + border-right: $border-color2; } Resizer.disabled { cursor: not-allowed; @@ -79,7 +77,7 @@ Resizer.disabled:hover { } .Pane2 { - background-color: $tlv-light-gray; - border-left: solid 2px $light-gray; - overflow: hidden; + background-color: $background-color4; + border-left: solid 2px $border-color5; + overflow: auto; } -- cgit 1.2.3-korg