diff --git a/platform/features/conductor-v2/conductor/res/sass/_time-of-interest.scss b/platform/features/conductor-v2/conductor/res/sass/_time-of-interest.scss index 8c646ea3634..93d0231b749 100644 --- a/platform/features/conductor-v2/conductor/res/sass/_time-of-interest.scss +++ b/platform/features/conductor-v2/conductor/res/sass/_time-of-interest.scss @@ -66,7 +66,7 @@ align-items: center; box-sizing: content-box; height: $toiH; - right: $toiPad * -2; + left: $toiPad * -2; @include transform(translateY(-50%)); top: 50%; padding: $toiPad; z-index: 1; @@ -79,7 +79,6 @@ height: 100%; line-height: $toiH; padding: $toiPad; - order: 2; overflow: hidden; white-space: nowrap; justify-content: space-between; @@ -100,13 +99,13 @@ } .t-button-resync { - order: 2; + order: 1; &:before { content: $glyph-icon-resync; } } .t-button-unpin { - order: 1; + order: 2; &:hover { color: $toiColorBgAlert; } @@ -146,8 +145,9 @@ .show-val .l-toi-holder { .l-toi { .l-toi-buttons { + order: 1; &:hover { - margin-left: $interiorMarginSm; + margin-right: $interiorMarginSm; } } .l-toi-val { @@ -161,28 +161,28 @@ font-weight: 400; height: $toiH; line-height: $toiH; - order: 1; + order: 2; padding: 1px 3px; white-space: nowrap; } } - &.val-to-right { + &.val-to-left { .l-toi { - right: auto; - left: $toiPad * -2; + left: auto; + right: $toiPad * -2; .l-toi-buttons { - order: 1; + order: 2; &:hover { - .t-button-resync { order: 1; } - .t-button-unpin { order: 2; } - margin-right: $interiorMarginSm; + .t-button-resync { order: 2; } + .t-button-unpin { order: 1; } + margin-left: $interiorMarginSm; } } .l-toi-val { - order: 2; + order: 1; } } } @@ -198,6 +198,7 @@ table { z-index: 1; td, .td { .l-toi-holder { + left: 50% !important; &:before, &:after { display: none; diff --git a/platform/features/conductor-v2/conductor/res/sass/time-conductor-espresso.scss b/platform/features/conductor-v2/conductor/res/sass/time-conductor-espresso.scss index 7f1da67cc0d..03bb41dc7e9 100644 --- a/platform/features/conductor-v2/conductor/res/sass/time-conductor-espresso.scss +++ b/platform/features/conductor-v2/conductor/res/sass/time-conductor-espresso.scss @@ -39,10 +39,10 @@ $colorTimeCondDataVisRtBg: pushBack($colorTimeCondKeyBg, 10%); // Time of Interest $toiColorBg: #6b93c6; -$toiColorBlocker: $colorBodyBg; // Color of blocker element beneath the TOI icon -$toiColorFg: #000; +$toiColorBlocker: $colorBodyBg; // Color of blocker element beneath the TOI icons +$toiColorFg: #000; // Used by value display $toiColorCtrlFg: #fff; -$toiColorBgAlert: #cf2a12; +$toiColorBgAlert: #cf2a12; // Used by unpin button on hover $colorTimeCondTOIBg: darken($toiColorBg, 20%); $colorTimeCondTOIBgHov: $toiColorBg; diff --git a/platform/features/conductor-v2/conductor/res/sass/time-conductor-snow.scss b/platform/features/conductor-v2/conductor/res/sass/time-conductor-snow.scss index 31213965374..a927791b5c1 100644 --- a/platform/features/conductor-v2/conductor/res/sass/time-conductor-snow.scss +++ b/platform/features/conductor-v2/conductor/res/sass/time-conductor-snow.scss @@ -39,10 +39,10 @@ $colorTimeCondDataVisRtBg: pushBack($colorTimeCondKeyBg, 30%); // Time of Interest $toiColorBg: #6b93c6; -$toiColorBlocker: $colorBodyBg; // Color of blocker element beneath the TOI icon -$toiColorFg: #fff; +$toiColorBlocker: $colorBodyBg; // Color of blocker element beneath the TOI icons +$toiColorFg: #fff; // Used by value display $toiColorCtrlFg: #fff; -$toiColorBgAlert: #a7292a; // $colorFormInvalid; +$toiColorBgAlert: #ff9540; // Used by unpin button on hover $colorTimeCondTOIBg: darken($toiColorBg, 20%); $colorTimeCondTOIBgHov: $toiColorBg; diff --git a/platform/features/conductor-v2/conductor/res/templates/time-of-interest.html b/platform/features/conductor-v2/conductor/res/templates/time-of-interest.html index 941b73c0260..134e48d8349 100644 --- a/platform/features/conductor-v2/conductor/res/templates/time-of-interest.html +++ b/platform/features/conductor-v2/conductor/res/templates/time-of-interest.html @@ -1,20 +1,6 @@ - - -