bar: clearer sidebar active state

This commit is contained in:
end-4
2025-05-23 16:43:45 +02:00
parent 40c0d12004
commit f7349e6346
+42 -13
View File
@@ -2,6 +2,7 @@ import "root:/"
import "root:/modules/common" import "root:/modules/common"
import "root:/modules/common/widgets" import "root:/modules/common/widgets"
import "root:/services" import "root:/services"
import "root:/modules/common/functions/color_utils.js" as ColorUtils
import QtQuick import QtQuick
import QtQuick.Controls import QtQuick.Controls
import QtQuick.Layouts import QtQuick.Layouts
@@ -120,16 +121,27 @@ Scope {
anchors.fill: parent anchors.fill: parent
spacing: 10 spacing: 10
Rectangle { RippleButton { // Left sidebar button
Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
Layout.leftMargin: Appearance.rounding.screenRounding Layout.leftMargin: Appearance.rounding.screenRounding
Layout.fillWidth: false Layout.fillWidth: false
property real buttonPadding: 5
implicitWidth: distroIcon.width + buttonPadding * 2
implicitHeight: distroIcon.height + buttonPadding * 2
// Layout.fillHeight: true buttonRadius: Appearance.rounding.full
radius: Appearance.rounding.full colBackground: barLeftSideMouseArea.hovered ? Appearance.colors.colLayer1Hover : ColorUtils.transparentize(Appearance.colors.colLayer1Hover, 1)
color: (barLeftSideMouseArea.pressed || GlobalStates.sidebarLeftOpen) ? Appearance.colors.colLayer1Active : barLeftSideMouseArea.hovered ? Appearance.colors.colLayer1Hover : "transparent" colBackgroundHover: Appearance.colors.colLayer1Hover
implicitWidth: distroIcon.width + 5*2 colRipple: Appearance.colors.colLayer1Active
implicitHeight: distroIcon.height + 5*2 colBackgroundToggled: Appearance.m3colors.m3secondaryContainer
colBackgroundToggledHover: Appearance.colors.colSecondaryContainerHover
colRippleToggled: Appearance.colors.colSecondaryContainerActive
toggled: GlobalStates.sidebarLeftOpen
property color colText: toggled ? Appearance.m3colors.m3onSecondaryContainer : Appearance.colors.colOnLayer0
onPressed: {
Hyprland.dispatch('global quickshell:sidebarLeftToggle')
}
CustomIcon { CustomIcon {
id: distroIcon id: distroIcon
@@ -295,13 +307,30 @@ Scope {
spacing: 5 spacing: 5
layoutDirection: Qt.RightToLeft layoutDirection: Qt.RightToLeft
Rectangle { RippleButton { // Right sidebar button
id: rightSidebarButton
Layout.margins: 4 Layout.margins: 4
Layout.rightMargin: Appearance.rounding.screenRounding Layout.rightMargin: Appearance.rounding.screenRounding
Layout.fillHeight: true Layout.fillHeight: true
implicitWidth: indicatorsRowLayout.implicitWidth + 10*2 implicitWidth: indicatorsRowLayout.implicitWidth + 10*2
radius: Appearance.rounding.full buttonRadius: Appearance.rounding.full
color: (barRightSideMouseArea.pressed || GlobalStates.sidebarRightOpen) ? Appearance.colors.colLayer1Active : barRightSideMouseArea.hovered ? Appearance.colors.colLayer1Hover : "transparent" colBackground: barRightSideMouseArea.hovered ? Appearance.colors.colLayer1Hover : ColorUtils.transparentize(Appearance.colors.colLayer1Hover, 1)
colBackgroundHover: Appearance.colors.colLayer1Hover
colRipple: Appearance.colors.colLayer1Active
colBackgroundToggled: Appearance.m3colors.m3secondaryContainer
colBackgroundToggledHover: Appearance.colors.colSecondaryContainerHover
colRippleToggled: Appearance.colors.colSecondaryContainerActive
toggled: GlobalStates.sidebarRightOpen
property color colText: toggled ? Appearance.m3colors.m3onSecondaryContainer : Appearance.colors.colOnLayer0
Behavior on colText {
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
}
onPressed: {
Hyprland.dispatch('global quickshell:sidebarRightToggle')
}
RowLayout { RowLayout {
id: indicatorsRowLayout id: indicatorsRowLayout
anchors.centerIn: parent anchors.centerIn: parent
@@ -322,7 +351,7 @@ Scope {
MaterialSymbol { MaterialSymbol {
text: "volume_off" text: "volume_off"
iconSize: Appearance.font.pixelSize.larger iconSize: Appearance.font.pixelSize.larger
color: Appearance.colors.colOnLayer0 color: rightSidebarButton.colText
} }
} }
Revealer { Revealer {
@@ -339,7 +368,7 @@ Scope {
MaterialSymbol { MaterialSymbol {
text: "mic_off" text: "mic_off"
iconSize: Appearance.font.pixelSize.larger iconSize: Appearance.font.pixelSize.larger
color: Appearance.colors.colOnLayer0 color: rightSidebarButton.colText
} }
} }
MaterialSymbol { MaterialSymbol {
@@ -352,12 +381,12 @@ Scope {
"signal_wifi_0_bar" "signal_wifi_0_bar"
) : "signal_wifi_off" ) : "signal_wifi_off"
iconSize: Appearance.font.pixelSize.larger iconSize: Appearance.font.pixelSize.larger
color: Appearance.colors.colOnLayer0 color: rightSidebarButton.colText
} }
MaterialSymbol { MaterialSymbol {
text: Bluetooth.bluetoothConnected ? "bluetooth_connected" : Bluetooth.bluetoothEnabled ? "bluetooth" : "bluetooth_disabled" text: Bluetooth.bluetoothConnected ? "bluetooth_connected" : Bluetooth.bluetoothEnabled ? "bluetooth" : "bluetooth_disabled"
iconSize: Appearance.font.pixelSize.larger iconSize: Appearance.font.pixelSize.larger
color: Appearance.colors.colOnLayer0 color: rightSidebarButton.colText
} }
} }
} }