diff --git a/platform/commonUI/general/res/sass/controls/_time-of-interest.scss b/platform/commonUI/general/res/sass/controls/_time-of-interest.scss index f341788eda..fa8d619725 100644 --- a/platform/commonUI/general/res/sass/controls/_time-of-interest.scss +++ b/platform/commonUI/general/res/sass/controls/_time-of-interest.scss @@ -20,21 +20,6 @@ * at runtime from the About dialog for additional information. *****************************************************************************/ - -/* -Plots --toi-holder:before vertical line --toi: glyphs - -Tables -tr: border color -td:before: glyphs - -TC --toi-holder:before, after: vertical lines --toi: glyphs - -*/ .l-toi-holder, .l-toi-holder:after, .l-toi-holder:before, @@ -44,7 +29,6 @@ TC position: absolute; } - .l-toi-holder { $p: 3px; @include transform(translateX(-50%)); @@ -52,14 +36,16 @@ TC position: absolute; top: 0; bottom: 0; - width: $toiW; // Needs to be an even number to avoid sub-pixel antialiasing of the vertical line + width: $toiW; &:not(.pinned) { opacity: 0; pointer-events: none; } + &.pinned { opacity: 1; } + &:before, &:after { // Vertical lines. TC uses both; plot only uses :before @@ -73,6 +59,7 @@ TC bottom: 0; width: 2px; } + .l-toi { // Holds clock icon an unpin button font-size: $toiW; @@ -91,12 +78,13 @@ TC .l-toi-val { $tbP: 1px; - background-color: $toiColorBg; //rgba($toiColorBg, 0.8); + background-color: $toiColorBg; border-radius: $controlCr; box-sizing: content-box; display: inline-block; color: $toiColorFg; font-size: 0.7rem; + font-weight: 400; height: $toiW; right: $toiW + $interiorMarginSm; top: 50%; @@ -120,38 +108,28 @@ table { tbody, .tbody { tr, .tr { &.l-toi.pinned { - td { - border-top: 1px dashed $toiColorBg; + border-top: 1px dashed $toiColorBg; + td, .td { &:first-child:before { - @extend .ui-symbol; + @extend .icon-clock; @include transform(translate(-50%, -50%)); - content: $glyph-icon-clock; + color: $toiColorBg; + cursor: pointer; display: block; position: absolute; - text-shadow: 0 1px 15px black; left: 50%; + bottom: auto; + text-shadow: 0 1px 15px black; top: 0; z-index: 2; - color: $toiColorBg; - } - } - - &.highlight-bottom-edge { - td { - border-bottom: 1px dashed $toiColorBg; - //border-top: 1px solid transparent; - &:first-child:before { - @include transform(translate(-50%, 50%)); - top: auto; - bottom: 0; - } } } &:hover { - td:first-child:before { - content: $glyph-icon-x-in-circle; - cursor: pointer; + td, .td { + &:first-child:before { + content: $glyph-icon-x-in-circle !important; + } } } } @@ -164,6 +142,7 @@ table { .gl-plot-wrapper-display-area-and-x-axis { .l-toi-holder { bottom: nth($plotDisplayArea, 3) - $interiorMargin; + z-index: 3; &:after { display: none; } @@ -172,8 +151,6 @@ table { @include transform(translateY(100%)); bottom: 0; } - - z-index: 3; } } } \ No newline at end of file diff --git a/platform/commonUI/general/res/sass/lists/_tabular.scss b/platform/commonUI/general/res/sass/lists/_tabular.scss index 1377744fbf..c197c3d840 100644 --- a/platform/commonUI/general/res/sass/lists/_tabular.scss +++ b/platform/commonUI/general/res/sass/lists/_tabular.scss @@ -58,6 +58,7 @@ table { }*/ } tr, .tr { + border-top: 1px solid $colorTabBorder; display: table-row; &:first-child .td { border-top: none; @@ -99,7 +100,6 @@ table { } } td, .td { - border-top: 1px solid $colorTabBorder; min-width: 20px; color: $colorTelemFresh; padding: $tabularTdPadTB $tabularTdPadLR; diff --git a/platform/commonUI/themes/espresso/res/sass/_constants.scss b/platform/commonUI/themes/espresso/res/sass/_constants.scss index 2319a96a2c..29981651b2 100644 --- a/platform/commonUI/themes/espresso/res/sass/_constants.scss +++ b/platform/commonUI/themes/espresso/res/sass/_constants.scss @@ -104,9 +104,9 @@ $colorInspectorSectionHeaderBg: $colorFormSectionHeader; $colorInspectorSectionHeaderFg: pullForward($colorInspectorBg, 40%); // Time of Interest -$toiColorBg: #6b93c6; //$colorBtnMajorBg; +$toiColorBg: #6b93c6; $toiColorFg: #000; -$toiW: 12px; +$toiW: 12px; // Needs to be an even number to avoid sub-pixel antialiasing of the vertical line // Status colors, mainly used for messaging and item ancillary symbols $colorStatusFg: #ccc; diff --git a/platform/commonUI/themes/snow/res/sass/_constants.scss b/platform/commonUI/themes/snow/res/sass/_constants.scss index 1ba115b563..ec36ee0385 100644 --- a/platform/commonUI/themes/snow/res/sass/_constants.scss +++ b/platform/commonUI/themes/snow/res/sass/_constants.scss @@ -106,7 +106,7 @@ $colorInspectorSectionHeaderFg: pullForward($colorInspectorBg, 40%); // Time of Interest $toiColorBg: #6b93c6; $toiColorFg: #fff; -$toiW: 12px; +$toiW: 12px; // Needs to be an even number to avoid sub-pixel antialiasing of the vertical line // Status colors, mainly used for messaging and item ancillary symbols $colorStatusFg: #fff; diff --git a/platform/features/conductor-v2/conductor/res/sass/_time-conductor-base.scss b/platform/features/conductor-v2/conductor/res/sass/_time-conductor-base.scss index 801aba6353..ec54e6a61e 100644 --- a/platform/features/conductor-v2/conductor/res/sass/_time-conductor-base.scss +++ b/platform/features/conductor-v2/conductor/res/sass/_time-conductor-base.scss @@ -244,9 +244,6 @@ left: nth($timeCondAxisLROffset, 1); right: nth($timeCondAxisLROffset, 2); &:hover { - // Hide the cursor, because the TOI element essentially "becomes" the cursor - // when the user is hovering over the visualization area. - cursor: none; .l-toi-holder.hover { opacity: 1; } diff --git a/platform/features/table/res/templates/mct-table.html b/platform/features/table/res/templates/mct-table.html index e3f3b1c009..e769645edd 100644 --- a/platform/features/table/res/templates/mct-table.html +++ b/platform/features/table/res/templates/mct-table.html @@ -50,7 +50,7 @@