mirror of
https://github.com/zen-browser/desktop.git
synced 2025-10-17 23:32:02 +00:00
refactor media controls layout and styling; enhance service title display
This commit is contained in:
51
src/browser/base/content/zen-media-player.inc.xhtml
Normal file
51
src/browser/base/content/zen-media-player.inc.xhtml
Normal file
@@ -0,0 +1,51 @@
|
||||
<toolbar id="zen-media-controls-toolbar"
|
||||
class="browser-toolbar customization-target zen-sidebar-toolbar"
|
||||
context="toolbar-context-menu"
|
||||
mode="icons"
|
||||
hidden="true">
|
||||
<toolbaritem>
|
||||
<vbox id="zen-media-main-vbox">
|
||||
<hbox id="zen-media-service-hbox" class="show-on-hover">
|
||||
<hbox id="zen-media-service-button">
|
||||
<image/>
|
||||
</hbox>
|
||||
<hbox id="zen-media-service-title" fadein="true">
|
||||
<label class="service" />
|
||||
<label class="tld" />
|
||||
</hbox>
|
||||
</hbox>
|
||||
|
||||
<vbox id="zen-media-info-vbox" class="show-on-hover">
|
||||
<label id="zen-media-title" fadein="true"/>
|
||||
<label id="zen-media-artist" fadein="true"/>
|
||||
</vbox>
|
||||
|
||||
<hbox id="zen-media-progress-hbox" class="show-on-hover">
|
||||
<label id="zen-media-current-time">0:00</label>
|
||||
<html:input type="range" id="zen-media-progress-bar"
|
||||
value="0" min="0" max="100" step="0.1"
|
||||
oninput="gZenMediaController.onMediaSeekDrag(event);"
|
||||
onchange="gZenMediaController.onMediaSeekComplete(event);"/>
|
||||
<label id="zen-media-duration">0:00</label>
|
||||
</hbox>
|
||||
|
||||
<hbox id="zen-media-controls-hbox">
|
||||
<toolbarbutton id="zen-media-focus-button"
|
||||
class="toolbarbutton-1"
|
||||
oncommand="gZenMediaController.onMediaFocus();" />
|
||||
<toolbarbutton id="zen-media-previoustrack-button"
|
||||
class="toolbarbutton-1"
|
||||
oncommand="gZenMediaController.onMediaPlayPrev();" />
|
||||
<toolbarbutton id="zen-media-playpause-button"
|
||||
class="toolbarbutton-1"
|
||||
oncommand="gZenMediaController.onMediaToggle();" />
|
||||
<toolbarbutton id="zen-media-nexttrack-button"
|
||||
class="toolbarbutton-1"
|
||||
oncommand="gZenMediaController.onMediaPlayNext();" />
|
||||
<toolbarbutton id="zen-media-mute-button"
|
||||
class="toolbarbutton-1"
|
||||
oncommand="gZenMediaController.onMediaMute();" />
|
||||
</hbox>
|
||||
</vbox>
|
||||
</toolbaritem>
|
||||
</toolbar>
|
Reference in New Issue
Block a user