mirror of
https://code.videolan.org/videolan/vlc
synced 2024-09-04 09:11:33 +02:00
web intf: drop top table design.
We're in 2011 guys !
This commit is contained in:
parent
3fa047734a
commit
69d2375629
@ -35,33 +35,56 @@ body{
|
||||
#volumeSlider{
|
||||
width: 100px;
|
||||
display: inline-block;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
#currentVolume{
|
||||
display: inline-block;
|
||||
margin-left: -110px;
|
||||
}
|
||||
#mediaTitle{
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
left: 0px;
|
||||
width: 500px;
|
||||
text-align: left;
|
||||
padding: 5px;
|
||||
overflow: hidden;
|
||||
}
|
||||
#currentTime{
|
||||
float: left;
|
||||
text-align: left;
|
||||
}
|
||||
#totalTime{
|
||||
float: right;
|
||||
text-align: right;
|
||||
}
|
||||
#controlTable{
|
||||
position:relative;
|
||||
height: 140px;
|
||||
}
|
||||
#controlButtons{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
text-align: left;
|
||||
width: 380px;
|
||||
}
|
||||
|
||||
#buttonszone{
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
left: 388px;
|
||||
width: 42px;
|
||||
vertical-align: top;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#volumesliderzone{
|
||||
margin-left: 20px;
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 440px;
|
||||
width: 205px;
|
||||
}
|
||||
|
||||
#volumeSlider{
|
||||
@ -69,11 +92,18 @@ body{
|
||||
}
|
||||
|
||||
#artszone{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 650px;
|
||||
width: 141px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
#seekContainer{
|
||||
position:absolute;
|
||||
left: 0;
|
||||
top: 100px;
|
||||
width: 650px;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
|
@ -201,57 +201,38 @@
|
||||
<div class="ui-widget-header" style="text-align: left;">
|
||||
<img src="images/vlc16x16.png" alt="VLC" width="16" height="16"/> Controls
|
||||
</div>
|
||||
<table width="100%" border="0" cellspacing="0" id="controlTable" class="ui-widget-content">
|
||||
<tr>
|
||||
<td id="controlButtons">
|
||||
<div id="buttonPrev" class="button48 ui-corner-all" title="Previous"></div>
|
||||
<div id="buttonPlay" class="button48 ui-corner-all paused" title="Play"></div>
|
||||
<div id="buttonNext" class="button48 ui-corner-all" title="Next"></div>
|
||||
<div id="buttonOpen" class="button48 ui-corner-all" title="Open Media"></div>
|
||||
<div id="buttonStop" class="button48 ui-corner-all" title="Stop"></div>
|
||||
<div id="buttonFull" class="button48 ui-corner-all" title="Full Screen"></div>
|
||||
<div id="buttonSout" class="button48 ui-corner-all" title="Easy Stream"></div>
|
||||
</td>
|
||||
<td id="buttonszone">
|
||||
<div id="buttonPlayList" class="button ui-widget ui-state-default ui-corner-all" title="Hide / Show Library" style="float: left;"><span class="ui-icon ui-icon-note"></span></div>
|
||||
<div id="buttonViewer" class="button ui-widget ui-state-default ui-corner-all" title="Hide / Show Viewer" style="float: left;"><span class="ui-icon ui-icon-video"></span></div>
|
||||
<div id="buttonStreams" class="button ui-widget ui-state-default ui-corner-all" title="Manage Streams" style="float: left;"><span class="ui-icon ui-icon-script"></span></div>
|
||||
<div id="buttonOffsets" class="button ui-widget ui-state-default ui-corner-all" title="Track Synchronisation" style="float: left;"><span class="ui-icon ui-icon-transfer-e-w"></span></div>
|
||||
<div id="buttonEqualizer" class="button ui-widget ui-state-default ui-corner-all" title="Equalizer" style="float: left;"><span class="ui-icon ui-icon-signal"></span></div>
|
||||
<div id="buttonBatch" class="button ui-widget ui-state-default ui-corner-all" title="VLM Batch Commands" style="float: left;"><span class="ui-icon ui-icon-suitcase"></span></div>
|
||||
</td>
|
||||
<td>
|
||||
<div id="volumesliderzone">
|
||||
<div id="volumeSlider" title="Volume"><img src="images/speaker-32.png" class="ui-slider-handle" alt="volume"/></div>
|
||||
<div id="currentVolume" class="dynamic">50%</div>
|
||||
</div>
|
||||
</td>
|
||||
<td id="artszone" rowspan="3">
|
||||
<img id="albumArt" src="/art" width="141px" height="130px" alt="Album Art"/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3">
|
||||
<div id="mediaTitle" class="dynamic"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td id="seekContainer" colspan="3">
|
||||
<div id="seekSlider" title="Seek Time" style="width:98%; margin-left:10px;"></div>
|
||||
<table width="100%">
|
||||
<tr>
|
||||
<td>
|
||||
<div id="currentTime" class="dynamic">00:00:00</div>
|
||||
</td>
|
||||
<td>
|
||||
<div id="totalTime" class="dynamic">00:00:00</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
<div id="controlTable" class="ui-widget-content">
|
||||
<ul id="controlButtons">
|
||||
<li id="buttonPrev" class="button48 ui-corner-all" title="Previous"></li>
|
||||
<li id="buttonPlay" class="button48 ui-corner-all paused" title="Play"></li>
|
||||
<li id="buttonNext" class="button48 ui-corner-all" title="Next"></li>
|
||||
<li id="buttonOpen" class="button48 ui-corner-all" title="Open Media"></li>
|
||||
<li id="buttonStop" class="button48 ui-corner-all" title="Stop"></li>
|
||||
<li id="buttonFull" class="button48 ui-corner-all" title="Full Screen"></li>
|
||||
<li id="buttonSout" class="button48 ui-corner-all" title="Easy Stream"></li>
|
||||
</ul>
|
||||
<ul id="buttonszone">
|
||||
<li id="buttonPlayList" class="button ui-widget ui-state-default ui-corner-all" title="Hide / Show Library" style="float: left;"><span class="ui-icon ui-icon-note"></span></li>
|
||||
<li id="buttonViewer" class="button ui-widget ui-state-default ui-corner-all" title="Hide / Show Viewer" style="float: left;"><span class="ui-icon ui-icon-video"></span></li>
|
||||
<li id="buttonStreams" class="button ui-widget ui-state-default ui-corner-all" title="Manage Streams" style="float: left;"><span class="ui-icon ui-icon-script"></span></li>
|
||||
<li id="buttonOffsets" class="button ui-widget ui-state-default ui-corner-all" title="Track Synchronisation" style="float: left;"><span class="ui-icon ui-icon-transfer-e-w"></span></li>
|
||||
<li id="buttonEqualizer" class="button ui-widget ui-state-default ui-corner-all" title="Equalizer" style="float: left;"><span class="ui-icon ui-icon-signal"></span></li>
|
||||
<li id="buttonBatch" class="button ui-widget ui-state-default ui-corner-all" title="VLM Batch Commands" style="float: left;"><span class="ui-icon ui-icon-suitcase"></span></li>
|
||||
</ul>
|
||||
<div id="volumesliderzone">
|
||||
<div id="volumeSlider" title="Volume"><img src="images/speaker-32.png" class="ui-slider-handle" alt="volume"/></div>
|
||||
<div id="currentVolume" class="dynamic">50%</div>
|
||||
</div>
|
||||
<div id="artszone">
|
||||
<img id="albumArt" src="/art" width="141px" height="130px" alt="Album Art"/>
|
||||
</div>
|
||||
<div id="mediaTitle" class="dynamic"></div>
|
||||
<div id="seekContainer">
|
||||
<div id="seekSlider" title="Seek Time" style="width:98%; margin-left:10px;"></div>
|
||||
<div id="currentTime" class="dynamic">00:00:00</div>
|
||||
<div id="totalTime" class="dynamic">00:00:00</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="viewContainer" class="ui-widget">
|
||||
<div class="ui-widget-header" style="text-align: left;"><img src="images/vlc16x16.png" alt="VLC" width="16" height="16"/> Viewer</div>
|
||||
|
Loading…
Reference in New Issue
Block a user