[Frontend] New symbols font and CSS adjustments

WTD-980
WTD-396
Changed glyph for stacked plots;
Normalized button line-heights and size of required symbol;
Updated symbol art in symbols font;
Restored mistakenly removed "menu" gesture to grid-item;

platform/commonUI/general/res/sass/_constants.scss

@@ -157,4 +157,9 @@ $bubbleMaxW: 300px;
 
 
 // Timing
-$controlFadeMs: 100ms;
+$controlFadeMs: 100ms;
+
+// Forms
+$reqSymbolW: 15px;
+$reqSymbolM: $interiorMargin * 2;
+$reqSymbolFontSize: 0.7em;

platform/commonUI/general/res/sass/controls/_buttons.scss

@@ -25,17 +25,24 @@ $pad: $interiorMargin * $baseRatio;
 /******* LAYOUT AND SIZING */
 .btn,
 .l-btn {
-	line-height: 1.25em;
+	line-height: 1.5em; // Was 1.25em
 	padding: 0 $pad;
 	text-decoration: none;
 	&.lg,
 	&.create-btn {
 		$h: $ueTopBarH; // - $interiorMargin;
 		height: $h;
-		//line-height: $h;
+		line-height: $h - 2;
+		//padding: 0 $pad * 6 0 $pad;
 		padding: 0 $pad * 3;
 	}
 	&.create-btn {
+		&:before {
+			content:"+";
+			font-family: symbolsfont;
+			font-size: 0.8em;
+			//margin-right: $interiorMarginSm;
+		}
 		.menu {
 			margin-left: $pad * -1;
 		}
@@ -59,7 +66,7 @@ $pad: $interiorMargin * $baseRatio;
 	@include box-sizing(border-box);
 	@include text-shadow(rgba(black, 0.3) 0 1px 1px);
 	cursor: pointer;
-	line-height: 1.2em;
+	//line-height: 1.2em;
 	text-decoration: none;
 	&.major {
 		$bg: $colorKey;

platform/commonUI/general/res/sass/controls/_menus.scss

@@ -68,8 +68,8 @@
     .super-menu {
         $w: 450px;
         $h: $w - 20;
-        $plw: $w * 0.5;
-        $prw: $w - $plw;
+        $plw: 50%; //$w * 0.5;
+        $prw: 50%; //$w - $plw;
         width: $w;
         height: $h;
         .contents {
@@ -78,12 +78,12 @@
         .pane {
             @include box-sizing(border-box);
             &.left {
-//                @include test();
+                //@include test();
                 border-right: 1px solid rgba(white, 0.2);
                 left: 0;
                 padding-right: $interiorMargin;
                 right: auto;
-                width: $plw !important;
+                width: $plw;
                 overflow-x: hidden;
                 overflow-y: auto;
                 ul {
@@ -104,10 +104,11 @@
                 }
             }
             &.right {
-                left: $plw;
+	            //@include test(red);
+	            left: auto;
                 right: 0;
                 padding: $interiorMargin * 5;
-                width: $prw !important;
+                width: $prw;
             }
         }
     }
@@ -115,7 +116,7 @@
         .desc-area {
 //            @include test(green);
             &.icon {
-//                @include test(red);
+                //@include test(red);
                 $h: 150px;
                 position: relative;
                 color: lighten($bg, 30%);
@@ -123,19 +124,20 @@
                 left: 0;
                 height: $h;
                 line-height: $h;
+	            margin-bottom: $interiorMargin * 5;
 //                top: 0; right: 0; bottom: 5em; left: 0;
 //                height: 5em;
                 text-align: center;
             }
-            &.description {
-                color: lighten($bg, 30%);
-                font-size: 0.8em;
-            }
             &.title {
                 color: lighten($bg, 60%);
                 font-size: 1.2em;
-                margin-bottom: 1rem;
+                margin-bottom: 0.5em;
             }
+	        &.description {
+		        color: lighten($bg, 30%);
+		        font-size: 0.8em;
+	        }
         }
     }
     .context-menu {

platform/commonUI/general/res/sass/forms/_validation.scss

@@ -20,23 +20,21 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 .validates {
-    $symbolW: 15px;
-    $symbolM: $interiorMargin * 2;
     > .label {
         //        @include test(green, 0.1);
-        padding-right: $symbolW + $symbolM; // Keep room for validation element
+        padding-right: $reqSymbolW + $reqSymbolM; // Keep room for validation element
         &::after {
             //            @include test(yellow, 0.3);
             display: block;
             position: absolute;
             top: 0;
-            right: $symbolM;
+            right: $reqSymbolM;
             bottom: 0;
             left: auto;
             height: auto;
-            width: $symbolW;
+            width: $reqSymbolW;
             font-family: symbolsfont;
-            font-size: 1.1em;
+            font-size: $reqSymbolFontSize;
             text-align: right;
             vertical-align: middle;
         }
@@ -62,7 +60,9 @@
         }
     }
 }
-
+.req {
+	font-size: $reqSymbolFontSize;
+}
 span.req {
     color: $colorFormRequired;
 }

platform/commonUI/general/res/sass/overlay/_overlay.scss

@@ -50,6 +50,7 @@
     .title {
 	    @include ellipsize();
         font-size: 1.3em;
+	    margin-bottom: $interiorMargin;
     }
     
     .top-bar {