From a8856c061247b3edc758b4961dbe2325bc4b62ae Mon Sep 17 00:00:00 2001
From: Charles Hacskaylo <charlesh88@gmail.com>
Date: Tue, 27 Oct 2015 11:40:35 -0700
Subject: [PATCH] [Frontend] Platform-specific mods to limits

vista#54
Refactor limits into multiple classes, separating
upr/lwr from red/yellow;
Modded SineWaveLimitCapability accordingly;
Normalized upr/lwr glyphs;
(cherry picked from commit a26d71b)
---
 .../generator/src/SinewaveLimitCapability.js  |  8 +--
 .../commonUI/general/res/sass/_constants.scss |  5 ++
 .../commonUI/general/res/sass/_limits.scss    | 49 ++++++++++++++-----
 3 files changed, 45 insertions(+), 17 deletions(-)

diff --git a/example/generator/src/SinewaveLimitCapability.js b/example/generator/src/SinewaveLimitCapability.js
index 30d222b0c7..ac4f4718a2 100644
--- a/example/generator/src/SinewaveLimitCapability.js
+++ b/example/generator/src/SinewaveLimitCapability.js
@@ -30,25 +30,25 @@ define(
             YELLOW = 0.5,
             LIMITS = {
                 rh: {
-                    cssClass: "s-limit-upr-red",
+                    cssClass: "s-limit-upr s-limit-red",
                     low: RED,
                     high: Number.POSITIVE_INFINITY,
                     name: "Red High"
                 },
                 rl: {
-                    cssClass: "s-limit-lwr-red",
+                    cssClass: "s-limit-lwr s-limit-red",
                     high: -RED,
                     low: Number.NEGATIVE_INFINITY,
                     name: "Red Low"
                 },
                 yh: {
-                    cssClass: "s-limit-upr-yellow",
+                    cssClass: "s-limit-upr s-limit-yellow",
                     low: YELLOW,
                     high: RED,
                     name: "Yellow High"
                 },
                 yl: {
-                    cssClass: "s-limit-lwr-yellow",
+                    cssClass: "s-limit-lwr s-limit-yellow",
                     low: -RED,
                     high: -YELLOW,
                     name: "Yellow Low"
diff --git a/platform/commonUI/general/res/sass/_constants.scss b/platform/commonUI/general/res/sass/_constants.scss
index 918ace8c0f..6ef636cdcd 100644
--- a/platform/commonUI/general/res/sass/_constants.scss
+++ b/platform/commonUI/general/res/sass/_constants.scss
@@ -106,3 +106,8 @@ $dirImgs: $dirCommonRes + 'images/';
 
 /************************** TIMINGS */
 $controlFadeMs: 100ms;
+
+/************************** LIMITS */
+$glyphLimit: '\e603';
+$glyphLimitUpr: '\0000eb';
+$glyphLimitLwr: '\0000ee';
diff --git a/platform/commonUI/general/res/sass/_limits.scss b/platform/commonUI/general/res/sass/_limits.scss
index 12411554cd..8e43f6629a 100644
--- a/platform/commonUI/general/res/sass/_limits.scss
+++ b/platform/commonUI/general/res/sass/_limits.scss
@@ -1,14 +1,15 @@
-@mixin limit($bg, $ic, $glyph) {
-	background: $bg !important;
-	//color: $fg !important;
-	&:before {
-		//@include pulse(1000ms);
-		color: $ic;
-		content: $glyph;
-	}
+@mixin limitGlyph($iconColor, $glyph: $glyphLimit) {
+    &:before {
+        color: $iconColor;
+        content: $glyph;
+        font-family: symbolsfont;
+        display: inline;
+        margin-right: $interiorMarginSm;
+    }
+
 }
 
-[class*="s-limit"] {
+/*[class*="s-limit"] {
 	//white-space: nowrap;
 	&:before {
 		display: inline-block;
@@ -18,9 +19,31 @@
 		margin-right: $interiorMarginSm;
 		vertical-align: middle;
 	}
+}*/
+
+.s-limit-red { background: $colorLimitRedBg !important; }
+.s-limit-yellow { background: $colorLimitYellowBg !important; }
+
+// Handle limit when applied to a tr
+tr[class*="s-limit"] {
+    &.s-limit-red td:first-child {
+        @include limitGlyph($colorLimitRedIc);
+    }
+    &.s-limit-yellow td:first-child {
+        @include limitGlyph($colorLimitYellowIc);
+    }
+    &.s-limit-upr td:first-child:before { content:$glyphLimitUpr; }
+    &.s-limit-lwr td:first-child:before { content:$glyphLimitLwr; }
 }
 
-.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"); };
\ No newline at end of file
+// Handle limit when applied directly to a non-tr element
+:not(tr)[class*="s-limit"] {
+    &.s-limit-red {
+        @include limitGlyph($colorLimitRedIc);
+    }
+    &.s-limit-yellow {
+        @include limitGlyph($colorLimitYellowIc);
+    }
+    &.s-limit-upr:before { content:$glyphLimitUpr; }
+    &.s-limit-lwr:before { content:$glyphLimitLwr; }
+}
\ No newline at end of file