[Frontend] Added CSS and markup for stale; cleanup

WTD-1172
Added stale CSS in _data-status.scss;
Added pulse animation in _effects.scss, not used;
Removed temp-limits directory and files;
Sanding and refining of limits styles and in .tabular;
This commit is contained in:
Charles Hacskaylo
2015-05-06 19:30:36 -07:00
parent db74e2f84a
commit 2d13745823
10 changed files with 143 additions and 94 deletions

View File

@@ -28,7 +28,7 @@ $colorGridLines: rgba(#fff, 0.05);
$colorLimitYellow: #9d7500;
$colorLimitRed: #aa0000;
$colorTelemFresh: #fff;
$colorTelemStale: #aaa;
$colorTelemStale: #888;
$styleTelemState: italic;
// Ratios
@@ -71,7 +71,7 @@ $colorItemTreeIconHover: lighten($colorItemTreeIcon, 20%);
$colorItemTreeVCHover: $colorAlt1;
//Tabular
$tabularHeaderH: 20px;
$tabularHeaderH: 18px;
$tabularTdPadLR: $itemPadLR;
$tabularTdPadTB: 2px;
$tabularColorBorder: rgba(white, 0.1);

View File

@@ -1,5 +1,12 @@
@mixin s-stale($a: 0.5) {
color: rgba($colorTelemFresh, $a) !important;
font-style: italic;
}
.s-stale {
//color: $colorTelemStale !important;
opacity: 0.5 !important;
font-style: italic !important;
}
@include s-stale();
.td {
@include s-stale();
}
}

View File

@@ -20,4 +20,21 @@ a.disabled {
.test {
@include test();
}
@include keyframes(pulse) {
0% { opacity: 0.2; }
100% { opacity: 1; }
}
@mixin pulse($dur: 500ms) {
@include animation-name(pulse);
@include animation-duration($dur);
@include animation-direction(alternate);
@include animation-iteration-count(infinite);
@include animation-timing-function(ease-in-out);
}
.pulse {
@include pulse(1000ms);
}

View File

@@ -1,6 +1,7 @@
@mixin limit($c, $glyph) {
background: $c;
&:before {
//@include pulse(500ms);
color: lighten($c, 30%);
content: $glyph;
}
@@ -14,7 +15,8 @@
&:before {
display: inline-block;
font-family: symbolsfont;
font-size: 0.8em;
font-size: 0.85em;
font-style: normal !important;
margin-right: $interiorMarginSm;
vertical-align: middle;
}

View File

@@ -177,7 +177,6 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
$c: #7748d6;
$a: 0.5;
$h: 10px;
@include animation(pulse 2s infinite);
@include absPosDefault();
pointer-events: none;
height: $h;
@@ -212,9 +211,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
width: $swatchD;
//margin-right: $interiorMarginSm;
}
.title-label {
}
.title-label {}
}
}