Review and integrate mobile-2008 (#2040)

Fixes #2008
* Viewport metatag updated
* Fix to Time Conductor for Safari
* Remove data visualization element in TC
* Hide TC ticks when on mobile
* Add touch functionality to mct-drag
* Reduced size of image thumbnails; Changed min-heights of image and thumbnail
holders for .mobile.phone
* remove create dialog from mobile

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

@@ -81,7 +81,7 @@ $tabularTdPadLR: $itemPadLR;
 $tabularTdPadTB: 2px;
 /*************** Imagery */
 $imageMainControlBarH: 25px;
-$imageThumbsD: 120px;
+$imageThumbsD: 100px;
 $imageThumbsWrapperH: 155px;
 $imageThumbPad: 1px;
 /*************** Ticks */

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

@@ -205,3 +205,14 @@
 		display: none;
 	}
 }
+
+/*************************************** MOBILE */
+body.mobile.phone {
+  .t-imagery {
+    .l-image-main-wrapper,
+    .l-image-thumbs-wrapper {
+      //background: red;
+      min-height: 10px !important;
+    }
+  }
+}

platform/commonUI/general/res/sass/mobile/_layout.scss

@@ -26,8 +26,8 @@ body.mobile {
     }
 
     .pane.right.items {
-        //@include test();
         @include slMenuTransitions;
+        left: 0 !important;
         margin-left: 0 !important;
         .holder-object-and-inspector {
             @include slMenuTransitions;
@@ -47,12 +47,10 @@ body.mobile {
         right: $bodyMargin !important;
     }
 
-// When the tree is hidden, these are the
-    // classes used for the left menu and the
-    // right representation.
+    // Assume landscape layout or either orientation for tablet
+    // Phone portrait overrides below via media query
     .pane-tree-hidden {
-        // Sets the left tree menu when the tree
-        // is hidden.
+        // Sets the left tree menu when the tree is hidden.
         .pane.left.treeview {
             @include trans-prop-nice(opacity, 150ms);
             opacity: 0 !important;
@@ -73,12 +71,12 @@ body.mobile {
         .pane.left.treeview {
             @include trans-prop-nice(opacity, 250ms, $delay: 250ms);
             @include background-image(linear-gradient(90deg, rgba(black, 0) 98%, rgba(black, 0.3) 100%));
-            right: auto !important;
             width: $proporMenuWithView !important;
+            right: auto !important;
         }
         // Sets the right representation when the tree is shown.
         .pane.right.items {
-            left: $proporMenuWithView !important;
+            transform: translateX($proporMenuWithView);
         }
     }
 
@@ -92,12 +90,19 @@ body.mobile {
     }
 
     .object-browse-bar {
-        &.t-primary { margin-left: 45px; }
+        &.t-primary {
+            margin-left: 45px;
+
+            .title-label {
+                // Prevent inline editing of the object title in the main view in mobile
+                pointer-events: none;
+            }
+        }
         .context-available {
+            font-size: 0.9em;
             opacity: 1 !important;
         }
         .view-switcher {
-            margin-right: 0 !important;
             .title-label {
                 // Hide the name in mobile
                 display: none;
@@ -131,16 +136,17 @@ body.mobile {
     }
 }
 
-body.phone.portrait {
-    .pane-tree-showing {
-        .pane.left.treeview {
-            width: $proporMenuOnly !important;
-        }
-        .pane.right.items {
-            left: 0 !important;
-            transform: translateX($proporMenuOnly);
-            .holder-object-and-inspector {
-                opacity: 0;
+@media only screen and (max-device-width: $phoMaxW) and (orientation: portrait) {
+    body.mobile {
+        .pane-tree-showing {
+            .pane.left.treeview {
+                width: $proporMenuOnly !important;
+            }
+            .pane.right.items {
+                transform: translateX($proporMenuOnly);
+                .holder-object-and-inspector {
+                    opacity: 0;
+                }
             }
         }
     }

platform/commonUI/general/res/sass/startup-base.scss

@@ -28,7 +28,8 @@ $output-bourbon-deprecation-warnings: false;
 }
 
 body, html {
-    overflow: hidden;
+    height: 100%;
+    width: 100%;
 }
 
 .l-splash-holder {

platform/commonUI/general/res/sass/user-environ/_layout.scss

@@ -20,6 +20,7 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
+.user-environ,
 .browse-area,
 .edit-area,
 .editor {
@@ -47,6 +48,9 @@
 }
 
 .user-environ {
+    height: 100%;
+    width: 100%;
+    overflow: hidden !important;
     .browse-area,
     .editor {
         top: 0; left: 0; right: 0; bottom: $ueFooterH;