diff --git a/platform/features/conductor-v2/conductor/res/sass/_constants.scss b/platform/features/conductor-v2/conductor/res/sass/_constants.scss index a550260a51c..9c29313e97a 100644 --- a/platform/features/conductor-v2/conductor/res/sass/_constants.scss +++ b/platform/features/conductor-v2/conductor/res/sass/_constants.scss @@ -2,4 +2,6 @@ $ueTimeConductorH: (25px, 16px, 20px); // Heights for Ticks, Data Visualization, $ueTimeConductorRtH: (25px, 3px, 20px); // Heights for elements in Real-time mode $timeCondInputTimeSysDefW: 165px; // Default width for datetime value inputs $timeCondInputDeltaDefW: 60px; // Default width for delta value inputs, typically 00:00:00 -$timeCondAxisLROffset: (5px, 5px); // Margin to left, right of tick axis and vis bar. For paging, use 15, 20px \ No newline at end of file +$timeCondAxisLROffset: (6px, 6px); // Margin to left, right of tick axis and vis bar. For paging, use 15, 20px +$timeCondTOIIconD: 12px; // height and width of icon used for TOI indicator +$timeCondTOIValOffset: 0px; \ No newline at end of file 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 068e7e26a0e..dd8393a068e 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 @@ -255,7 +255,7 @@ $linesVOffset: 2px; @include transform(translateX(-50%)); top: 0px; bottom: 0px; - width: $r2H; + width: $timeCondTOIIconD; left: auto; right: auto; z-index: 1; &:before, @@ -263,7 +263,8 @@ // Vertical lines content: ''; background-color: $c; - left: 50%; height: 35%; width: 1px; + left: 50%; + height: (($r2H - $timeCondTOIIconD)/2) + $linesVOffset; width: 1px; z-index: 0; } @@ -278,7 +279,7 @@ } .l-toi { - $d: $r2H * 0.65; + $d: $timeCondTOIIconD; //$r2H * 0.65; @include transform(translate(-50%, -50%)); color: $c; font-size: $d; @@ -294,15 +295,38 @@ } } + .l-toi-val { + @include transform(translateY(-50%)); + display: none; // Only show when TOI is active + font-size: 0.7rem; + position: absolute; + top: 50%; + white-space: nowrap; + right: $timeCondTOIIconD + $interiorMarginSm; + } + + &.val-to-right { + .l-toi-val { + right: auto; + left: $timeCondTOIIconD + $interiorMarginSm; + } + } + + &.s-status-active { + .l-toi-val { + display: block; + } + } + &:hover { &:before, &:after { background-color: $cHov !important; } - .l-toi { + .l-toi, + .l-toi-val { color: $cHov !important; } - } } diff --git a/platform/features/conductor-v2/conductor/res/templates/time-conductor.html b/platform/features/conductor-v2/conductor/res/templates/time-conductor.html index b807e8c748f..f04b09487dd 100644 --- a/platform/features/conductor-v2/conductor/res/templates/time-conductor.html +++ b/platform/features/conductor-v2/conductor/res/templates/time-conductor.html @@ -82,9 +82,13 @@
+ +
+
2016-09-15 21:31:30.000Z