UI Various 2 (#2480)

- Fixes icon-gear margin for #2477;
- Now applies mixed visual style to toggle frame visibility button in
Layout toolbar for #2460;
- Change Status area Indicators to right-justify;
- Adjust Status area collapse toggle button margin;

src/styles/_legacy-plots.scss

@@ -174,6 +174,10 @@ mct-plot {
             text-orientation: mixed;
             overflow: hidden;
             writing-mode: vertical-lr;
+            &:before {
+                // Icon denoting configurability
+                margin-bottom: $interiorMargin; // Uses margin-bottom due to writing-mode
+            }
         }
     }
 

src/ui/layout/Layout.vue

@@ -171,7 +171,7 @@
             [class*='__head__collapse-button'] {
                 align-self: start;
                 flex: 0 0 auto;
-                margin-top: 4px;
+                margin-top: 6px;
 
                 &:before {
                     content: $glyph-icon-arrow-down;
@@ -214,9 +214,9 @@
         &__create-button { margin-right: $interiorMarginLg; }
 
         &__indicators {
-            //@include test();
             flex: 1 1 auto;
             flex-wrap: wrap;
+            justify-content: flex-end;
             [class*='indicator-clock'] { order: 90; }
 
             .c-indicator .label {

src/ui/toolbar/components/toolbar-toggle-button.vue

@@ -2,7 +2,7 @@
     <div class="c-ctrl-wrapper">
         <div class="c-icon-button"
              :title="nextValue.title"
-             :class="[nextValue.icon, {'c-click-icon--mixed': nonSpecific}]"
+             :class="[nextValue.icon, {'c-icon-button--mixed': nonSpecific}]"
              @click="cycle">
         </div>
     </div>