[Frontend] Layout and styling of Time Conductor

open #889
open #298
Fixes for mobile;
Moved popup z-index def into sass;
Datetime picker compressed for
better fit in mobile phone;
Removed hours selector from datetime
picker to enable better fit in mobile;

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

@@ -145,3 +145,8 @@
 .flex-justify-end {
     @include justify-content(flex-end);
 }
+
+/********************************************* POPUPS */
+.t-popup {
+    z-index: 75;
+}

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

@@ -434,7 +434,6 @@ body.desktop .object-header {
     @include user-select(none);
     font-size: 0.8rem;
     padding: $interiorMarginLg !important;
-    width: 230px;
     .l-month-year-pager {
         $pagerW: 20px;
         height: $r1H;
@@ -526,6 +525,19 @@ body.desktop .object-header {
     }
 }
 
+@include phone {
+    .l-datetime-picker {
+        padding: $interiorMargin !important;
+    }
+    .l-calendar {
+        ul.l-cal-row {
+            li {
+                padding: 2px $interiorMargin;
+            }
+        }
+    }
+}
+
 /******************************************************** TEXTAREA */
 textarea {
     @include nice-textarea($colorInputBg, $colorInputFg);

platform/commonUI/general/res/templates/controls/datetime-field.html

@@ -37,8 +37,7 @@
         <div mct-click-elsewhere="picker.active = false">
             <mct-control key="'datetime-picker'"
                          ng-model="pickerModel"
-                         field="'value'"
-                         options="{ hours: true }">
+                         field="'value'">
             </mct-control>
         </div>
     </mct-popup>

platform/commonUI/general/src/directives/MCTPopup.js

@@ -49,10 +49,7 @@ define(
                     position = [ rect.left, rect.top ],
                     popup = popupService.display(div, position);
 
-                // TODO: Handle in CSS;
-                //       https://github.com/nasa/openmctweb/issues/298
-                div.css('z-index', 75);
-
+                div.addClass('t-popup');
                 transclude(function (clone) {
                     div.append(clone);
                 });