rope/nixos
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

quickshell: clickable mute icon on all volume sliders via VolIcon

Browse source 
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
rope 2026-06-17 13:22:28 +01:00
parent 2697614e1b
commit 700d3f7de1
1 changed files with 28 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

34
settings/quickshell.nix
View file

@ -368,6 +368,19 @@ in
font.pixelSize: 16 font.pixelSize: 16
} }
// ── VolIcon: a slider's volume glyph that toggles its audio
// node's mute on click. Glyph reflects the mute state; pair it
// with a fill that greys when `audioNode.muted`.
component VolIcon: SIcon {
property var audioNode: null
text: (audioNode && audioNode.muted) ? "volume_off" : "volume_up"
MouseArea {
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onClicked: if (audioNode) audioNode.muted = !audioNode.muted
}
}
// ── Card: the rounded base01 section surface used by every // ── Card: the rounded base01 section surface used by every
// dropdown. Children flow into a padded auto-height column, // dropdown. Children flow into a padded auto-height column,
// so callers just set `width` and drop content in. // so callers just set `width` and drop content in.
@ -1712,7 +1725,7 @@ in
Row { Row {
spacing: 6 spacing: 6
SIcon { anchors.verticalCenter: parent.verticalCenter; text: "volume_up" } VolIcon { anchors.verticalCenter: parent.verticalCenter; audioNode: volWidget.sink ? volWidget.sink.audio : null }
SText { SText {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
text: "Master" text: "Master"
@ -1824,8 +1837,16 @@ in
width: parent.width width: parent.width
spacing: 8 spacing: 8
VolIcon {
anchors.verticalCenter: parent.verticalCenter
width: 18
color: Theme.base04
font.pixelSize: 15
audioNode: modelData.audio
}
PillSlider { PillSlider {
width: parent.width - appVolLabel.width - 8 width: parent.width - 18 - appVolLabel.width - 16
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
height: 16 height: 16
trackH: 4 trackH: 4
@ -2541,20 +2562,21 @@ in
spacing: 8 spacing: 8
visible: mediaCard.pwNode !== null && mediaCard.pwNode.audio !== null visible: mediaCard.pwNode !== null && mediaCard.pwNode.audio !== null
SIcon { VolIcon {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
text: "volume_up" width: 18
color: Theme.base04 color: Theme.base04
font.pixelSize: 15 font.pixelSize: 15
audioNode: mediaCard.pwNode ? mediaCard.pwNode.audio : null
} }
PillSlider { PillSlider {
width: parent.width - 22 - mediaVolLabel.width - 16 width: parent.width - 18 - mediaVolLabel.width - 16
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
height: 16 height: 16
trackH: 4 trackH: 4
value: mediaCard.pwNode && mediaCard.pwNode.audio ? Math.min(1, mediaCard.pwNode.audio.volume) : 0 value: mediaCard.pwNode && mediaCard.pwNode.audio ? Math.min(1, mediaCard.pwNode.audio.volume) : 0
fillColor: Theme.base0C fillColor: mediaCard.pwNode && mediaCard.pwNode.audio && mediaCard.pwNode.audio.muted ? Theme.base03 : Theme.base0C
onMoved: (v) => { if (mediaCard.pwNode && mediaCard.pwNode.audio) mediaCard.pwNode.audio.volume = v; } onMoved: (v) => { if (mediaCard.pwNode && mediaCard.pwNode.audio) mediaCard.pwNode.audio.volume = v; }
} }