vlc | branch: master | Francois Cartegnie <fcvlc...@free.fr> | Thu Sep 22 00:11:24 2011 +0200| [69d2375629241714bdedd4625200e96d60c8c6fc] | committer: Francois Cartegnie
web intf: drop top table design. We're in 2011 guys ! > http://git.videolan.org/gitweb.cgi/vlc.git/?a=commit;h=69d2375629241714bdedd4625200e96d60c8c6fc --- share/lua/http/css/main.css | 36 +++++++++++++++++-- share/lua/http/index.html | 83 ++++++++++++++++-------------------------- 2 files changed, 65 insertions(+), 54 deletions(-) diff --git a/share/lua/http/css/main.css b/share/lua/http/css/main.css index c0caf51..c73c15e 100644 --- a/share/lua/http/css/main.css +++ b/share/lua/http/css/main.css @@ -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; } diff --git a/share/lua/http/index.html b/share/lua/http/index.html index df65669..ca831d3 100644 --- a/share/lua/http/index.html +++ b/share/lua/http/index.html @@ -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> _______________________________________________ vlc-commits mailing list vlc-commits@videolan.org http://mailman.videolan.org/listinfo/vlc-commits
