From b2ea19f9fb121b367449b07214aac2dfd7820f55 Mon Sep 17 00:00:00 2001
From: Luke Pulverenti <luke.pulverenti@gmail.com>
Date: Fri, 24 May 2013 11:19:32 -0400
Subject: [PATCH] more mobile playback fixes

---
 dashboard-ui/css/site.css    | 20 ++++++++++++++++++++
 dashboard-ui/library.html    |  2 +-
 dashboard-ui/scripts/site.js |  2 +-
 3 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/dashboard-ui/css/site.css b/dashboard-ui/css/site.css
index 24568f953b..55d77ba342 100644
--- a/dashboard-ui/css/site.css
+++ b/dashboard-ui/css/site.css
@@ -846,6 +846,26 @@ input[type="range"]::-ms-fill-upper {
 }
 
 
+@media all and (max-width: 500px) {
+    .volumeButton, .volumeSlider, .fullscsreenButton {
+        display: none!important;
+    }
+
+    .positionSlider {
+        width: 50px;
+    }
+
+    .itemVideo:not(.fullscreenVideo) {
+        left: -300px;
+    }
+}
+
+@media all and (max-width: 750px) {
+    .positionSlider {
+        width: 50px;
+    }
+}
+
 /* VideoJS overrides */
 
 #videoWindow.tubecss .vjs-menu-button {
diff --git a/dashboard-ui/library.html b/dashboard-ui/library.html
index 2d87a75fe0..772559ad94 100644
--- a/dashboard-ui/library.html
+++ b/dashboard-ui/library.html
@@ -32,7 +32,7 @@
                     </div>
                 </div>
                 <br />
-                <div>Define images for collections by <a href="index.html">browsing and editing.</a></div>
+                <div>Define images by <a href="index.html">browsing and editing collections.</a></div>
             </div>
         </div>
         <div data-role="popup" id="popupEnterText" class="ui-corner-all popup">
diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js
index 42242e6c53..b15e1118c3 100644
--- a/dashboard-ui/scripts/site.js
+++ b/dashboard-ui/scripts/site.js
@@ -1118,7 +1118,7 @@ $(function () {
     footerHtml += '<button id="muteButton" onclick="MediaPlayer.mute();" class="imageButton mediaButton volumeButton" title="Volume" type="button"><img src="css/images/media/volume.png" /></button>';
     footerHtml += '<button id="unmuteButton" onclick="MediaPlayer.unmute();" class="imageButton mediaButton volumeButton" title="Volume" type="button"><img src="css/images/media/mute.png" /></button>';
     footerHtml += '<input type="range" class="mediaSlider volumeSlider" step=".05" min="0" max="1" value="0" />';
-    footerHtml += '<button onclick="MediaPlayer.toggleFullscreen();" id="fullscsreenButton" class="imageButton mediaButton" title="Fullscreen" type="button"><img src="css/images/media/fullscreen.png" /></button>';
+    footerHtml += '<button onclick="MediaPlayer.toggleFullscreen();" id="fullscsreenButton" class="imageButton mediaButton fullscsreenButton" title="Fullscreen" type="button"><img src="css/images/media/fullscreen.png" /></button>';
 
     footerHtml += '</div>';