41 lines
1.1 KiB
QML
41 lines
1.1 KiB
QML
import QtQuick
|
|
import QtQuick.Layouts
|
|
import "../config"
|
|
|
|
// A pill showing a coloured Nerd Font icon followed by a value string.
|
|
Pill {
|
|
id: root
|
|
property string icon: ""
|
|
property string value: ""
|
|
property color iconColor: Theme.text
|
|
property alias label: valueText
|
|
// Widest value the pill will ever show, e.g. "100%". When set, the value
|
|
// column reserves that width so changing values never shift other widgets.
|
|
property string reserve: ""
|
|
|
|
Text {
|
|
text: root.icon
|
|
font.family: Theme.monoFont
|
|
font.pixelSize: Theme.fontSize + 1
|
|
color: root.iconColor
|
|
Layout.alignment: Qt.AlignVCenter
|
|
}
|
|
|
|
TextMetrics {
|
|
id: reserveMetrics
|
|
font: valueText.font
|
|
text: root.reserve
|
|
}
|
|
|
|
Text {
|
|
id: valueText
|
|
text: root.value
|
|
font.family: Theme.font
|
|
font.pixelSize: Theme.fontSize
|
|
color: Theme.text
|
|
horizontalAlignment: Text.AlignRight
|
|
Layout.alignment: Qt.AlignVCenter
|
|
Layout.preferredWidth: root.reserve ? reserveMetrics.advanceWidth : implicitWidth
|
|
}
|
|
}
|