mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2025-10-17 07:16:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

New features for media control

Browse Source
This commit is contained in:
Slowlife01
2025-03-16 21:04:08 +07:00
parent a69876325a
commit 0af85f8c03
5 changed files with 286 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/browser/base/content/zen-media-player.inc.xhtml
View File

@@ -6,10 +6,20 @@
<toolbaritem>
<vbox id="zen-media-main-vbox">
<vbox>
<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-info-container" class="show-on-hover">
<vbox id="zen-media-info-vbox">
<label id="zen-media-title" fadein="true"/>
<label id="zen-media-artist" fadein="true"/>
</vbox>
<hbox id="zen-media-buttons-hbox">
<toolbarbutton id="zen-media-pip-button"
class="toolbarbutton-1"
oncommand="gZenMediaController.onMediaPip();" />
<toolbarbutton id="zen-media-close-button"
class="toolbarbutton-1"
oncommand="gZenMediaController.onControllerClose();" />
</hbox>
</hbox>
<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"

26
src/browser/base/content/zen-styles/zen-media-controls.css
View File

@@ -13,6 +13,21 @@
color: white;
}
#zen-media-buttons-hbox {
align-items: start;
}
&:not([can-pip]) {
#zen-media-info-vbox {
width: calc(100% - 26px);
flex-shrink: 0;
}
#zen-media-pip-button {
display: none;
}
}
#zen-media-prev-button,
#zen-media-play-pause-button,
#zen-media-next-button {
@@ -234,6 +249,17 @@
--toolbarbutton-outer-padding: 0;
}
#zen-media-controls-toolbar[can-pip] {
#zen-media-info-vbox {
width: calc(100% - 58px);
flex-shrink: 0;
}
#zen-media-pip-button {
display: flex;
}
}
:root:not([zen-sidebar-expanded='true']) {
#zen-media-controls-toolbar {
display: none;