diff --git a/.config/quickshell/modules/common/widgets/StyledSlider.qml b/.config/quickshell/modules/common/widgets/StyledSlider.qml index 23a6179f..1deb3341 100644 --- a/.config/quickshell/modules/common/widgets/StyledSlider.qml +++ b/.config/quickshell/modules/common/widgets/StyledSlider.qml @@ -12,14 +12,16 @@ Slider { property real scale: 0.85 property real backgroundDotSize: 4 * scale property real backgroundDotMargins: 4 * scale - property real handleMargins: (slider.pressed ? 3 : 6) * scale + // property real handleMargins: 0 * scale + property real handleMargins: (slider.pressed ? 0 : 2) * scale property real handleWidth: (slider.pressed ? 3 : 5) * scale property real handleHeight: 44 * scale property real handleLimit: slider.backgroundDotMargins * scale - property real trackHeight: 15 * scale + property real trackHeight: 30 * scale property color highlightColor: Appearance.m3colors.m3primary property color trackColor: Appearance.m3colors.m3secondaryContainer property color handleColor: Appearance.m3colors.m3onSecondaryContainer + property real trackRadius: Appearance.rounding.verysmall property real limitedHandleRangeWidth: (slider.availableWidth - handleWidth - slider.handleLimit * 2) property string tooltipContent: `${Math.round(value * 100)}%` @@ -55,11 +57,11 @@ Slider { Rectangle { anchors.verticalCenter: parent.verticalCenter anchors.left: parent.left - width: slider.handleLimit + slider.visualPosition * slider.limitedHandleRangeWidth - (slider.handleMargins + slider.handleWidth / 2) + width: slider.handleLimit * 2 + slider.visualPosition * slider.limitedHandleRangeWidth - (slider.handleMargins + slider.handleWidth / 2) height: trackHeight color: slider.highlightColor - topLeftRadius: Appearance.rounding.full - bottomLeftRadius: Appearance.rounding.full + topLeftRadius: slider.trackRadius + bottomLeftRadius: slider.trackRadius topRightRadius: Appearance.rounding.unsharpen bottomRightRadius: Appearance.rounding.unsharpen } @@ -68,13 +70,13 @@ Slider { Rectangle { anchors.verticalCenter: parent.verticalCenter anchors.right: parent.right - width: slider.handleLimit + (1 - slider.visualPosition) * slider.limitedHandleRangeWidth - (slider.handleMargins + slider.handleWidth / 2) + width: slider.handleLimit * 2 + (1 - slider.visualPosition) * slider.limitedHandleRangeWidth - (slider.handleMargins + slider.handleWidth / 2) height: trackHeight color: slider.trackColor topLeftRadius: Appearance.rounding.unsharpen bottomLeftRadius: Appearance.rounding.unsharpen - topRightRadius: Appearance.rounding.full - bottomRightRadius: Appearance.rounding.full + topRightRadius: slider.trackRadius + bottomRightRadius: slider.trackRadius } // Dot at the end diff --git a/.config/quickshell/modules/sidebarRight/volumeMixer/VolumeMixerEntry.qml b/.config/quickshell/modules/sidebarRight/volumeMixer/VolumeMixerEntry.qml index 5d2eb7c4..78b48be2 100644 --- a/.config/quickshell/modules/sidebarRight/volumeMixer/VolumeMixerEntry.qml +++ b/.config/quickshell/modules/sidebarRight/volumeMixer/VolumeMixerEntry.qml @@ -22,19 +22,10 @@ Item { anchors.fill: parent spacing: 10 - Image { - Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter - visible: source != "" - sourceSize.width: 38 - sourceSize.height: 38 - source: { - const icon = Icons.noKnowledgeIconGuess(root.node.properties["application.icon-name"]); - return Quickshell.iconPath(icon, "image-missing"); - } - } - ColumnLayout { Layout.fillWidth: true + spacing: 0 + RowLayout { StyledText { Layout.fillWidth: true @@ -50,6 +41,17 @@ Item { } RowLayout { + Image { + property real size: slider.trackHeight * 1.3 + Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter + visible: source != "" + sourceSize.width: size + sourceSize.height: size + source: { + const icon = Icons.noKnowledgeIconGuess(root.node.properties["application.icon-name"]); + return Quickshell.iconPath(icon, "image-missing"); + } + } StyledSlider { id: slider value: root.node.audio.volume