[vlc-devel] [PATCH 4/4] http: Ensure mobile buttons are on one line

Mathieu Parent math.parent at gmail.com
Thu Aug 3 18:27:04 CEST 2017


Tested with 320x480 or wider.
---
 share/lua/http/css/mobile.css |  5 +++--
 share/lua/http/mobile.html    | 20 ++++++++++----------
 2 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/share/lua/http/css/mobile.css b/share/lua/http/css/mobile.css
index e50333467f..005aea8080 100644
--- a/share/lua/http/css/mobile.css
+++ b/share/lua/http/css/mobile.css
@@ -7,6 +7,7 @@ root {
 body{
 	font: 11pt Helvetica, Arial, sans-serif;
 	background-color:#EEE;
+	margin: 0px;
 }
 
 #libraryTree{
@@ -81,12 +82,12 @@ body{
 #buttons{
 	margin:0 auto; 
 	position: relative; 
-	width:265px;
+	width: 288px;
 }
 .button48{
 	width: 48px;
 	height: 48px;
-	margin: 5px 0px 5px 15px;
+	margin: 5px 0px 5px 0px;
 	background: none;
 	border: none;
 	display: inline-block;
diff --git a/share/lua/http/mobile.html b/share/lua/http/mobile.html
index 475ab30ef7..3c5f660ae7 100644
--- a/share/lua/http/mobile.html
+++ b/share/lua/http/mobile.html
@@ -81,12 +81,12 @@
 		<div style="width:100%"><div id="mediaTitle" class="dynamic centered"></div></div>
 		<div id="play_controls">
 			<div id="buttons">
-				<div id="buttonPrev" class="button48  ui-corner-all" title="Previous"></div>
-				<div id="buttonRewd" class="button48  ui-corner-all" title="Rewind"></div>
-				<div id="buttonPlay" class="button48  ui-corner-all paused" title="Play"></div>
-				<div id="buttonStop" class="button48  ui-corner-all" title="Stop"></div>
-				<div id="buttonFwrd" class="button48  ui-corner-all" title="Forward"></div>
-				<div id="buttonNext" class="button48  ui-corner-all" title="Next"></div>
+				<div id="buttonPrev" class="button48  ui-corner-all" title="Previous">
+				</div><div id="buttonRewd" class="button48  ui-corner-all" title="Rewind">
+				</div><div id="buttonPlay" class="button48  ui-corner-all paused" title="Play">
+				</div><div id="buttonStop" class="button48  ui-corner-all" title="Stop">
+				</div><div id="buttonFwrd" class="button48  ui-corner-all" title="Forward">
+				</div><div id="buttonNext" class="button48  ui-corner-all" title="Next"></div>
 			</div>
 			<div id="seekSlider" title="Seek Time" style="font-size:15px;"></div>
 			<div id="currentTime" class="dynamic">00:00:00</div>
@@ -94,10 +94,10 @@
 		</div>
 		<div id="controls">
 			<div id="buttons">
-				<div id="buttonOpen" class="button48  ui-corner-all" title="Open Media"></div>
-				<div id="buttonFull" class="button48  ui-corner-all" title="Full Screen"></div>
-				<div id="buttonEQ" class="button48 ui-corner-all" title="Equalizer"></div>
-				<div id="buttonSout" class="button48  ui-corner-all" title="Easy Stream"></div>
+				<div id="buttonOpen" class="button48  ui-corner-all" title="Open Media">
+				</div><div id="buttonFull" class="button48  ui-corner-all" title="Full Screen">
+				</div><div id="buttonEQ" class="button48 ui-corner-all" title="Equalizer">
+				</div><div id="buttonSout" class="button48  ui-corner-all" title="Easy Stream"></div>
 			</div>
 			<div id="volumeSlider" title="Volume" style="font-size:15px;">
 				<img src="images/speaker-32.png" class="ui-slider-handle" alt="volume"/>
-- 
2.11.0



More information about the vlc-devel mailing list