[Frontend] IN-PROGRESS Theme changes continuing

open #95 Limits, plots, etc.; Misc sanding and shimming; Updated symbols font to replace missing Info symbol;
2015-09-11 16:25:19 -07:00
parent a840b59044
commit 3e5d46a62b
22 changed files with 395 additions and 428 deletions
--- a/platform/commonUI/general/res/sass/_effects.scss
+++ b/platform/commonUI/general/res/sass/_effects.scss
@@ -52,7 +52,7 @@ a.disabled {
 }

@include keyframes(pulse) {
-	0%   { opacity: 0.2; }
+	0%   { opacity: 0.5; }
 	100% { opacity: 1; }
 }

--- a/platform/commonUI/general/res/sass/_limits.scss
+++ b/platform/commonUI/general/res/sass/_limits.scss
@@ -1,52 +1,26 @@
-@mixin limit($c, $glyph) {
-	background: $c;
+@mixin limit($bg, $ic, $glyph) {
+	background: $bg !important;
+	//color: $fg !important;
 	&:before {
-		//@include pulse(500ms);
-		color: lighten($c, 30%);
+		//@include pulse(1000ms);
+		color: $ic;
 		content: $glyph;
 	}
 }

-/*.s-limit-upr,
-.s-limit-lwr {
-	$a: 0.5;
-	$l: 30%;
-	white-space: nowrap;
-	&:before {
-		display: inline-block;
-		font-family: symbolsfont;
-		font-size: 0.85em;
-		font-style: normal !important;
-		margin-right: $interiorMarginSm;
-		vertical-align: middle;
-	}
-}
-
-.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"); }
-}*/
-
 [class*="s-limit"] {
-	$a: 0.5;
-	$l: 30%;
-	white-space: nowrap;
+	//white-space: nowrap;
 	&:before {
 		display: inline-block;
 		font-family: symbolsfont;
-		font-size: 0.85em;
+		font-size: 0.75em;
 		font-style: normal !important;
 		margin-right: $interiorMarginSm;
 		vertical-align: middle;
 	}
 }

-.s-limit-upr-red { @include limit($colorLimitRed, "\0000eb"); };
-.s-limit-upr-yellow { @include limit($colorLimitYellow, "\0000ed"); };
-.s-limit-lwr-yellow { @include limit($colorLimitYellow, "\0000ec"); };
-.s-limit-lwr-red { @include limit($colorLimitRed, "\0000ee"); };
+.s-limit-upr-red { @include limit($colorLimitRedBg, $colorLimitRedIc, "\0000eb"); };
+.s-limit-upr-yellow { @include limit($colorLimitYellowBg, $colorLimitYellowIc, "\0000ed"); };
+.s-limit-lwr-yellow { @include limit($colorLimitYellowBg, $colorLimitYellowIc, "\0000ec"); };
+.s-limit-lwr-red { @include limit($colorLimitRedBg, $colorLimitRedIc, "\0000ee"); };
--- a/platform/commonUI/general/res/sass/controls/_buttons.scss
+++ b/platform/commonUI/general/res/sass/controls/_buttons.scss
@@ -63,16 +63,6 @@ $pad: $interiorMargin * $baseRatio;

    }

-    //&.paused {
-    //    @include btnSubtle($colorPausedBg, lighten($colorPausedBg, 10%), $colorPausedFg, $colorPausedFg);
-    //    .icon {
-    //        @include pulse(500ms);
-    //        &:before {
-    //            content: "\0000EF";
-    //        }
-    //    }
-    //}
-
    &.pause-play {
        .icon:before {
            content: "\0000F1";
--- a/platform/commonUI/general/res/sass/controls/_controls.scss
+++ b/platform/commonUI/general/res/sass/controls/_controls.scss
@@ -154,7 +154,7 @@ label.checkbox.custom {
 		min-width: $d;
 		&:before {
 			@include border-radius($basicCr * .75);
-			//background: $bg;
+			background: $bg;
 			//border-bottom: 1px solid lighten($bg, 10%);
 			@include box-shadow(inset rgba(black, 0.4) 0 1px 2px);
 			box-sizing: border-box;
@@ -241,7 +241,7 @@ label.checkbox.custom {
 	//}

 	> .type-icon {
-		color: $colorObjHdrIcon;
+		color: $colorObjHdrIc;
 		font-size: 120%;
 		float: left;
 		margin-right: $interiorMargin;
@@ -264,6 +264,7 @@ label.checkbox.custom {

 	.title-label {
 		//@include test(green, 0.9);
+		color: $colorObjHdrTxt;
 		@include ellipsize();
 		//color: pushBack($colorBodyFg, 40%);
 		@include webkitProp(flex, '0 1 auto');
--- a/platform/commonUI/general/res/sass/forms/_validation.scss
+++ b/platform/commonUI/general/res/sass/forms/_validation.scss
@@ -21,22 +21,11 @@
 *****************************************************************************/
 .validates {
    > .label {
-        //        @include test(green, 0.1);
-        padding-right: $reqSymbolW + $reqSymbolM; // Keep room for validation element
+        padding-right: $reqSymbolM; // Keep room for validation element
        &::after {
-            //            @include test(yellow, 0.3);
-/*            display: block;
-            position: absolute;
-            top: 0;
-            right: $reqSymbolM;
-            bottom: 0;
-            left: auto;
-            height: auto;
-            width: $reqSymbolW;*/
+	        float: right;
            font-family: symbolsfont;
            font-size: $reqSymbolFontSize;
-            //text-align: right;
-            //vertical-align: middle;
        }
    }
    &.invalid,
--- a/platform/commonUI/general/res/sass/items/_item.scss
+++ b/platform/commonUI/general/res/sass/items/_item.scss
@@ -32,7 +32,7 @@
            $iconMargin: 40px;
            $iconD: ($d - ($iconMargin * 2)) * 0.85;
            $transTime: 200ms;
-            @include btnSubtle($colorItemBg, pullForward($colorItemBg, 20%), $colorItemFg, $colorItemIc);
+            @include btnSubtle($colorItemBg, $colorItemBgHov, $colorItemFg, $colorItemIc);
            box-sizing: border-box;
            cursor: pointer;
            float: left;
--- a/platform/commonUI/general/res/sass/mobile/overlay/_overlay.scss
+++ b/platform/commonUI/general/res/sass/mobile/overlay/_overlay.scss
@@ -47,5 +47,10 @@
            float: none;
            width: 100%;
        }
+	    > .label {
+		    &:after {
+			    float: none;
+		    }
+	    }
    }
 }
--- a/platform/commonUI/general/res/sass/overlay/_overlay.scss
+++ b/platform/commonUI/general/res/sass/overlay/_overlay.scss
@@ -89,5 +89,10 @@
 	    bottom: $myM;
 	    left: $myM;
        overflow: auto;
+	    .field.l-med {
+		    input[type='text'] {
+			    width: 100%;
+		    }
+	    }
    }
 }
--- a/platform/commonUI/general/res/sass/plots/_plots-main.scss
+++ b/platform/commonUI/general/res/sass/plots/_plots-main.scss
@@ -23,8 +23,8 @@ $yBarW: 60px;
 $yLabelW: auto;
 $xBarH: 32px;
 $legendH: 20px;
-$colorHash: rgba(white, 0.3);
-$styleHash: dashed;
+//$colorHash: rgba(white, 0.3); // MOVED INTO CONSTANTS
+//$styleHash: dashed; // MOVED INTO CONSTANTS
 $swatchD: 8px;
 $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBarW); // Top, right, bottom, left

@@ -83,7 +83,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
 		bottom: nth($plotDisplayArea, 3);
 		left: nth($plotDisplayArea, 4);
 		cursor: crosshair;
-		border: 1px solid $colorInteriorBorder;
+		border: 1px solid $colorPlotAreaBorder;
 	}

 	.gl-plot-label,
@@ -133,7 +133,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa

 	.gl-plot-hash {
 		position: absolute;
-		border: 0 $colorHash $styleHash;
+		border: 0 $colorPlotHash $stylePlotHash;
 		&.hash-v {
 			border-right-width: 1px;
 			height: 100%;
@@ -173,8 +173,8 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa

 		height: auto;
 		z-index: 0;
-		&.s-limit-yellow { @include limitBg($colorLimitYellow); }
-		&.s-limit-red { @include limitBg($colorLimitRed); }
+		&.s-limit-yellow { @include limitBg($colorLimitYellowBg); }
+		&.s-limit-red { @include limitBg($colorLimitRedBg); }
 	}

 	.l-oob-data {
@@ -218,7 +218,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
 		}
 		&[class*='s-limit'] {
 			.title-label {
-				color: #fff;
+				//color: #fff;
 			}
 		}
 	}
@@ -241,7 +241,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa

 .tick {
 	position: absolute;
-	border: 0 $colorHash solid;
+	border: 0 $colorPlotHash solid;
 	&.tick-x {
 		border-right-width: 1px;
 		height: 100%; // Assumption is that the tick will be in a holder that will set it's height;
--- a/platform/commonUI/general/res/sass/user-environ/_frame.scss
+++ b/platform/commonUI/general/res/sass/user-environ/_frame.scss
@@ -47,10 +47,12 @@
 	}
 	&.frame-template {
 		.view-switcher {
-			font-size: 80%;
 			height: $ohH;
 			line-height: $ohH;
 			z-index: 10;
+			> span {
+				font-size: 0.7rem;
+			}
 		}
 		// Hide the view switcher by default when it's in an element that's in a frame context
 		// Frame template is used because we need to target the lowest nested frame
--- a/platform/commonUI/general/res/sass/user-environ/_layout.scss
+++ b/platform/commonUI/general/res/sass/user-environ/_layout.scss
@@ -341,6 +341,7 @@
 	.left {
 		//@include test(red);
 		@include webkitProp(flex, '1 1 0');
+		padding-right: $interiorMarginLg;
 	}
 }