[Frontend] Styling for controls

Fixes #1324
New reset glyph; Reset button complete,
final sanding.

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

@@ -76,6 +76,7 @@ $glyph-icon-two-parts-one-only: '\e1035';
 $glyph-icon-x-in-circle: '\e1036';
 $glyph-icon-brightness: '\e1038';
 $glyph-icon-contrast: '\e1039';
+$glyph-icon-reset: '\e1040';
 $glyph-icon-activity: '\e1100';
 $glyph-icon-activity-mode: '\e1101';
 $glyph-icon-autoflow-tabular: '\e1102';
@@ -177,6 +178,7 @@ $glyph-icon-box-with-dashed-lines: '\e1129';
 .icon-x-in-circle {  @include glyph($glyph-icon-x-in-circle); }
 .icon-brightness {  @include glyph($glyph-icon-brightness); }
 .icon-contrast {  @include glyph($glyph-icon-contrast); }
+.icon-reset {  @include glyph($glyph-icon-reset); }
 .icon-activity {  @include glyph($glyph-icon-activity); }
 .icon-activity-mode {  @include glyph($glyph-icon-activity-mode); }
 .icon-autoflow-tabular {  @include glyph($glyph-icon-autoflow-tabular); }

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

@@ -133,7 +133,7 @@
     &.s-wrapper-transluc {
         // Semi-opaque wrapper to visually distinguish a control
         // from the background
-        background: rgba($colorTransLucBg, 0.5);
+        background: rgba($colorTransLucBg, 0.7);
         box-sizing: border-box;
         border-radius: $controlCr;
     }
@@ -467,7 +467,7 @@ input[type="search"] {
     width: $h;
     height: $h;
     margin-top: 1 + floor($h/2) * -1;
-    @include btnSubtle(pullForward($colorBtnBg, 10%));
+    @include btnSubtle(pullForward($colorBtnBg, 20%));
     border-radius: 50% !important;
 }
 

platform/commonUI/general/res/sass/features/_imagery.scss

@@ -151,11 +151,36 @@
         }
     }
 
+    .t-reset-btn-holder {
+        $bc: $scrollbarTrackColorBg;
+        &:before,
+        &:after {
+            border-right: 1px solid $bc;
+            content:'';
+            display: block;
+            width: 5px;
+            height: 4px;
+        }
+
+        &:before {
+            border-top: 1px solid $bc;
+            margin-bottom: 2px;
+        }
+
+        &:after {
+            border-bottom: 1px solid $bc;
+            margin-top: 2px;
+        }
+    }
+
     &.s-wrapper-transluc {
-        display: inline-block;
         left: auto;
         padding: $interiorMargin $interiorMarginLg;
     }
+
+    &.l-flex-row {
+        align-items: center;
+    }
 }
 
 /*************************************** WHEN IN FRAME */