[Frontend] Apply flex layout to object header elements

open #250
open #260
vista#132
Major refactoring to markup and CSS to apply
flex layout strategy to object headers;
Flex necessary to fix 'overflow: hidden' setting
applied in open90 to object-browse-bar that
was preventing the view switcher menu from
appearing;
Browse, edit, mobile, frames in layouts, etc. all
visually checked in a first go round;
Mobile classes tweaked to fix left and right
margin problems resulting from open90 changes;
z-indexing of Inspector pane and splitters changed
to allow primary pane elements to overflow beneath
when primary pane width is severely constrained;

platform/features/imagery/res/templates/imagery.html

@@ -33,8 +33,8 @@
             >
         </div>
 
-        <div class="l-image-main-controlbar l-flex bar">
-            <div class="left">
+        <div class="l-image-main-controlbar l-flex-row">
+            <div class="left flex-elem grows">
                 <a
                     class="s-btn show-thumbs sm hidden"
                     ng-click="showThumbsBubble = (showThumbsBubble)? false:true"
@@ -43,7 +43,7 @@
                 <span class="l-time">{{imagery.getTime()}}</span>
                 <span class="l-date">{{imagery.getDate()}}</span>
             </div>
-            <div class="right">
+            <div class="right flex-elem">
                 <a
                     class="s-btn pause-play"
                     ng-click="imagery.paused(!imagery.paused())"