[Frontend] Tweaks to markup and CSS

WTD-1172
scrolling.html markup and CSS hooks;
added comments to change points;
CSS tweaking;
This commit is contained in:
Charles Hacskaylo
2015-05-06 16:55:25 -07:00
parent c8d06cb32a
commit f114f742c4
7 changed files with 56 additions and 44 deletions

View File

@ -25,8 +25,11 @@ $colorFormValid: #33cc33;
$colorFormError: #cc0000;
$colorFormInvalid: #ff9900;
$colorGridLines: rgba(#fff, 0.05);
$colorLimitYellow: #cc9900;
$colorLimitRed: #cc0000;
$colorLimitYellow: #9d7500;
$colorLimitRed: #aa0000;
$colorTelemFresh: #fff;
$colorTelemStale: #aaa;
$styleTelemState: italic;
// Ratios
$ltGamma: 20%;
@ -57,6 +60,7 @@ $ueBrowseGridItemBottomBarH: 40px;
$colorItemBase: lighten($colorBodyBg, 5%);
$colorItemFg: lighten($colorItemBase, 20%);
$colorItemSelected: $colorKey;
$itemPadLR: 5px;
// Tree
$treeVCW: 10px;
@ -68,7 +72,7 @@ $colorItemTreeVCHover: $colorAlt1;
//Tabular
$tabularHeaderH: 20px;
$tabularTdPadLR: 5px;
$tabularTdPadLR: $itemPadLR;
$tabularTdPadTB: 2px;
$tabularColorBorder: rgba(white, 0.1);
$tabularColorBodyBg: darken($colorBodyBg, 10%);

View File

@ -1,4 +1,13 @@
.s-limit {
@mixin limit($c, $glyph) {
background: $c;
&:before {
color: lighten($c, 30%);
content: $glyph;
}
}
.s-limit-upr,
.s-limit-lwr {
$a: 0.5;
$l: 30%;
white-space: nowrap;
@ -6,40 +15,17 @@
display: inline-block;
font-family: symbolsfont;
font-size: 0.8em;
//line-height: 1.1em;
margin-right: $interiorMarginSm;
vertical-align: middle;
}
&.s-limit-upr {
&.s-limit-yellow {
background: rgba($colorLimitYellow, $a);
&:before {
color: lighten($colorLimitYellow, $l);
content: "\0000ed";
}
}
&.s-limit-red {
background: rgba($colorLimitRed, $a);
&:before {
color: lighten($colorLimitRed, $l);
content: "\0000eb";
}
}
}
&.s-limit-lwr {
&.s-limit-yellow {
background: rgba($colorLimitYellow, $a);
&:before {
color: lighten($colorLimitYellow, $l);
content: "\0000ec";
}
}
&.s-limit-red {
background: rgba($colorLimitRed, $a);
&:before {
color: lighten($colorLimitRed, $l);
content: "\0000ee";
}
}
}
}
.s-limit-upr {
&.s-limit-yellow { @include limit($colorLimitYellow, "\0000ed"); }
&.s-limit-red { @include limit($colorLimitRed, "\0000eb"); }
}
.s-limit-lwr {
&.s-limit-yellow { @include limit($colorLimitYellow, "\0000ec"); }
&.s-limit-red { @include limit($colorLimitRed, "\0000ee"); }
}

View File

@ -71,10 +71,19 @@
}
.td {
border-top: 1px solid $tabularColorBorder;
color: $colorTelemFresh;
padding: $tabularTdPadTB $tabularTdPadLR;
&.numeric {
text-align: right;
}
&.s-cell-type-value {
text-align: right;
.l-cell-contents {
@include border-radius($smallCr);
padding-left: $itemPadLR;
padding-right: $itemPadLR;
}
}
}
}
}

View File

@ -224,7 +224,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
@include border-radius($smallCr);
color: #fff;
line-height: 1.5em;
padding: 0px 5px;
padding: 0px $itemPadLR;
.plot-color-swatch {
border: 1px solid $colorBodyBg;
height: $swatchD + 1;