refactor media controls layout and styling; enhance service title display

This commit is contained in:
mr. m
2025-03-12 15:41:23 +01:00
parent b5f32f1001
commit 39d090297e
4 changed files with 118 additions and 73 deletions

View 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>