style(quickshell): align popout active-marker to a shared left column

Network and Bluetooth showed the connected check on the right, while
Audio and CpuGov use a leading check column. Move both to the same
left-aligned 12px marker slot so every popout has one bundled left edge.

Bluetooth keeps connecting…/pairing… in the right cluster — those are
transient status text, not the connected bool the marker represents.
This commit is contained in:
2026-07-05 12:09:27 +02:00
parent 27043d7b57
commit 7d118e23a4
2 changed files with 25 additions and 17 deletions
+15 -6
View File
@@ -71,9 +71,20 @@ PopoutPanel {
d.pair();
}
Text {
id: btCheck
anchors.left: parent.left
anchors.verticalCenter: parent.verticalCenter
width: 12
text: (devRow.modelData.state === BluetoothDeviceState.Connected) ? String.fromCodePoint(0xf012c) : "" // md-check
color: Theme.accent
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSize
}
Image {
id: devIcon
anchors.left: parent.left
anchors.left: btCheck.right
anchors.leftMargin: 6
anchors.verticalCenter: parent.verticalCenter
width: 16
height: 16
@@ -107,14 +118,12 @@ PopoutPanel {
visible: text.length > 0
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSize
color: (devRow.modelData.state === BluetoothDeviceState.Connected) ? Theme.accent : Theme.subtext0
color: Theme.subtext0
text: {
if (devRow.modelData.pairing)
return qsTr("pairing…");
if (devRow.modelData.state === BluetoothDeviceState.Connecting)
return qsTr("connecting…");
if (devRow.modelData.state === BluetoothDeviceState.Connected)
return String.fromCodePoint(0xf012c); // md-check
return "";
}
}
@@ -133,8 +142,8 @@ PopoutPanel {
}
}
Text {
anchors.left: devIcon.visible ? devIcon.right : parent.left
anchors.leftMargin: devIcon.visible ? 6 : 0
anchors.left: devIcon.visible ? devIcon.right : btCheck.right
anchors.leftMargin: 6
anchors.right: rightCluster.left
anchors.rightMargin: 6
anchors.verticalCenter: parent.verticalCenter
+10 -11
View File
@@ -73,6 +73,15 @@ PopoutPanel {
anchors.verticalCenter: parent.verticalCenter
spacing: 6
Text {
id: marker
anchors.verticalCenter: parent.verticalCenter
width: 12
text: netRow.modelData.connected ? String.fromCodePoint(0xf012c) : "" // md-check
color: Theme.accent
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSize
}
Text {
id: sig
anchors.verticalCenter: parent.verticalCenter
@@ -87,7 +96,7 @@ PopoutPanel {
}
Text {
anchors.verticalCenter: parent.verticalCenter
width: parent.width - sig.width - lockIcon.width - marker.width - parent.spacing * 3
width: parent.width - marker.width - sig.width - lockIcon.width - parent.spacing * 3
text: netRow.modelData.name
elide: Text.ElideRight
color: netRow.actionable ? Theme.text : Theme.subtext0
@@ -104,16 +113,6 @@ PopoutPanel {
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSize - 2
}
Text {
id: marker
anchors.verticalCenter: parent.verticalCenter
visible: netRow.modelData.connected
width: visible ? 14 : 0
text: String.fromCodePoint(0xf012c) // md-check
color: Theme.accent
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSize
}
}
}
}