add new slider

dashboard-ui/css/mediaplayer.css

@@ -146,29 +146,6 @@ paper-icon-button.mediaButton {
     margin-right: .5em !important;
 }
 
-::-ms-thumb {
-    background-image: linear-gradient(#fefefe,#dddddd);
-    width: 15px;
-}
-
-::-ms-track {
-    padding: 0;
-    border: 0;
-    color: #777;
-}
-
-input[type="range"]::-ms-fill-lower {
-    background-color: #777;
-}
-
-input[type="range"]::-ms-fill-upper {
-    background-color: #777;
-}
-
-::-ms-tooltip {
-    display: none; /* display and visibility only */
-}
-
 @media all and (max-width: 800px) {
 
     .nowPlayingBar .mediaButton {

dashboard-ui/css/nowplaying.css

@@ -13,24 +13,12 @@
     max-width: 360px;
 }
 
-.nowPlayingTimeContainer {
-    max-width: 280px;
-    margin: 1.5em auto;
-}
-
-.nowPlayingPage .positionSliderContainer {
-    width: 100%;
+.nowPlayingPageTimeContainer {
     min-width: 200px;
+    max-width: 280px;
+    margin: 0 auto 1em;
 }
 
-    .nowPlayingPage .positionSliderContainer .ui-slider-track {
-        margin: 0 0 !important;
-    }
-
-    .nowPlayingPage .positionSliderContainer .ui-slider {
-        height: 20px;
-    }
-
 .nowPlayingNavButtonContainer {
     width: 400px;
 }
@@ -134,6 +122,13 @@
     }
 }
 
+@media all and (min-width: 800px) {
+
+    .nowPlayingPageTimeContainer {
+        max-width: 340px;
+    }
+}
+
 @media (orientation: landscape) {
     .nowPlayingInfoMetadata, .nowPlayingInfoButtons {
         display: inline-block;
@@ -153,14 +148,14 @@
 
 @media (orientation: landscape) and (max-height: 400px) {
     .nowPlayingPageTitle {
-        margin-top: -1em;
+        margin-top: -1.5em;
         padding: 0 60px;
     }
 }
 
 @media (orientation: portrait) and (max-height: 600px) {
     .nowPlayingPageTitle {
-        margin-top: -1em;
+        margin-top: -1.5em;
         padding: 0 60px;
     }
 }
@@ -172,9 +167,12 @@
     margin-right: .25em;
 }
 
-@media all and (max-width: 600px) {
+@media all and (max-width: 700px) {
 
     .nowPlayingSelectedPlayer {
         display: none;
     }
 }
+
+.nowPlayingPositionSlider .pin > #sliderKnob > #sliderKnobInner::after {
+}

dashboard-ui/css/site.css

@@ -305,6 +305,9 @@ html {
     touch-action: manipulation;
     /* Prevent white flickering */
     background-color: #1f1f1f;
+    /* Normalize for different browsers */
+    margin: 0;
+    padding: 0;
 }
 
 body {
@@ -315,11 +318,16 @@ body {
     /*-webkit-overflow-scrolling: touch;*/
     /* Remove the white default from jqm */
     background-color: transparent !important;
+    /* Normalize for different browsers */
+    margin: 0;
+    padding: 0;
 }
 
 /* Without this, no content will be displayed in mobile safari */
 .pageContainer {
     overflow-x: visible !important;
+    /* jqm often wants to assign a background color to this */
+    background-color: transparent !important;
 }
 
 .bodyWithPopupOpen {
@@ -1388,4 +1396,4 @@ progress {
 
 .supporterMembershipDisabled .tabSupporterMembership {
     display: none;
-}
+}