themed icons for states
This commit is contained in:
parent
a67cdbd66f
commit
df58449ef5
4 changed files with 13 additions and 4 deletions
|
|
@ -17,6 +17,10 @@ M.BarSection {
|
||||||
readonly property var dev: UPower.displayDevice
|
readonly property var dev: UPower.displayDevice
|
||||||
readonly property real pct: (dev?.percentage ?? 0) * 100
|
readonly property real pct: (dev?.percentage ?? 0) * 100
|
||||||
readonly property bool charging: dev?.state === UPowerDeviceState.Charging
|
readonly property bool charging: dev?.state === UPowerDeviceState.Charging
|
||||||
|
readonly property color _stateColor: charging ? M.Theme.base0B
|
||||||
|
: pct < 15 ? M.Theme.base08
|
||||||
|
: pct < 30 ? M.Theme.base09
|
||||||
|
: M.Theme.base05
|
||||||
|
|
||||||
M.BarIcon {
|
M.BarIcon {
|
||||||
icon: {
|
icon: {
|
||||||
|
|
@ -25,13 +29,13 @@ M.BarSection {
|
||||||
const icons = ["\uDB80\uDC8E", "\uDB80\uDC7A", "\uDB80\uDC7B", "\uDB80\uDC7C", "\uDB80\uDC7D", "\uDB80\uDC7E", "\uDB80\uDC7F", "\uDB80\uDC80", "\uDB80\uDC81", "\uDB80\uDC82", "\uDB85\uDFE2"];
|
const icons = ["\uDB80\uDC8E", "\uDB80\uDC7A", "\uDB80\uDC7B", "\uDB80\uDC7C", "\uDB80\uDC7D", "\uDB80\uDC7E", "\uDB80\uDC7F", "\uDB80\uDC80", "\uDB80\uDC81", "\uDB80\uDC82", "\uDB85\uDFE2"];
|
||||||
return icons[Math.min(10, Math.floor(root.pct / 10))];
|
return icons[Math.min(10, Math.floor(root.pct / 10))];
|
||||||
}
|
}
|
||||||
color: root.pct < 15 ? M.Theme.base08 : M.Theme.base05
|
color: root._stateColor
|
||||||
font.pixelSize: M.Theme.fontSize + 2
|
font.pixelSize: M.Theme.fontSize + 2
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
}
|
}
|
||||||
M.BarLabel {
|
M.BarLabel {
|
||||||
label: Math.round(root.pct) + "%"
|
label: Math.round(root.pct) + "%"
|
||||||
color: root.pct < 15 ? M.Theme.base08 : M.Theme.base05
|
color: root._stateColor
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -52,7 +52,9 @@ M.BarSection {
|
||||||
|
|
||||||
M.BarIcon {
|
M.BarIcon {
|
||||||
icon: "\uF294"
|
icon: "\uF294"
|
||||||
color: root.state === "off" ? M.Theme.base04 : M.Theme.base05
|
color: root.state === "connected" ? M.Theme.base0D
|
||||||
|
: root.state === "off" ? M.Theme.base04
|
||||||
|
: M.Theme.base05
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
}
|
}
|
||||||
M.BarLabel {
|
M.BarLabel {
|
||||||
|
|
|
||||||
|
|
@ -61,12 +61,13 @@ M.BarSection {
|
||||||
return "\uDB85\uDE16";
|
return "\uDB85\uDE16";
|
||||||
return "\uDB82\uDCFD";
|
return "\uDB82\uDCFD";
|
||||||
}
|
}
|
||||||
|
color: root.state === "disconnected" ? M.Theme.base08 : M.Theme.base05
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
}
|
}
|
||||||
Text {
|
Text {
|
||||||
visible: root.state === "wifi"
|
visible: root.state === "wifi"
|
||||||
text: root.essid
|
text: root.essid
|
||||||
color: M.Theme.base05
|
color: root.state === "disconnected" ? M.Theme.base08 : M.Theme.base05
|
||||||
font.pixelSize: M.Theme.fontSize + 1
|
font.pixelSize: M.Theme.fontSize + 1
|
||||||
font.family: M.Theme.fontFamily
|
font.family: M.Theme.fontFamily
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
|
|
||||||
|
|
@ -17,10 +17,12 @@ M.BarSection {
|
||||||
|
|
||||||
M.BarIcon {
|
M.BarIcon {
|
||||||
icon: root.muted ? "\uF026" : (root.volume > 0.5 ? "\uF028" : (root.volume > 0 ? "\uF027" : "\uF026"))
|
icon: root.muted ? "\uF026" : (root.volume > 0.5 ? "\uF028" : (root.volume > 0 ? "\uF027" : "\uF026"))
|
||||||
|
color: root.muted ? M.Theme.base04 : M.Theme.base05
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
}
|
}
|
||||||
M.BarLabel {
|
M.BarLabel {
|
||||||
label: Math.round(root.volume * 100) + "%"
|
label: Math.round(root.volume * 100) + "%"
|
||||||
|
color: root.muted ? M.Theme.base04 : M.Theme.base05
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue