ZacharyZhang-NY/omarchycn
3
4
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases 5 Wiki Activity

Standardize shell UI theme tokens

Browse Source
This commit is contained in:
Ryan Hughes
2026-05-18 20:13:12 -04:00
parent 44dff2d23d
commit 8b2bb217d6
43 changed files with 1622 additions and 873 deletions
Download Patch File Download Diff File Expand all files Collapse all files
shell/plugins/bar/widgets/activeWindow.qml
+3 -3
View File
@@ -22,7 +22,7 @@ Item {
readonly property bool vertical: bar ? bar.vertical : false
visible: title !== "" && !vertical
implicitWidth: visible ? Math.min(maxLabelWidth, labelText.implicitWidth) + 16 : 0
implicitWidth: visible ? Math.min(maxLabelWidth, labelText.implicitWidth) + Style.spacing.controlPaddingX * 2 : 0
implicitHeight: bar ? bar.barSize : 26
Behavior on implicitWidth {
@@ -31,8 +31,8 @@ Item {
Item {
anchors.fill: parent
anchors.leftMargin: 8
anchors.rightMargin: 8
anchors.leftMargin: Style.space(8)
anchors.rightMargin: Style.space(8)
clip: true
Text {
shell/plugins/bar/widgets/audioPanel.qml
+48 -48
View File
@@ -98,10 +98,10 @@ Item {
property int selectedIndex: -1
readonly property color hoverFill: bar
? Qt.rgba(bar.foreground.r, bar.foreground.g, bar.foreground.b, 0.08)
? Style.hoverFillFor(bar.foreground, Color.accent)
: "transparent"
readonly property color selectedFill: bar
? Qt.rgba(bar.foreground.r, bar.foreground.g, bar.foreground.b, 0.18)
? Style.selectedFillFor(bar.foreground, Color.accent)
: "transparent"
function sectionCount(section) {
@@ -376,8 +376,8 @@ Item {
owner: root
bar: root.bar
open: root.popupOpen
contentWidth: 370
contentHeight: Math.min(560, panelColumn.implicitHeight + 28)
contentWidth: panel.fittedContentWidth(Style.space(370))
contentHeight: panel.fittedContentHeight(panelColumn.implicitHeight, Style.space(560))
PanelKeyCatcher {
id: keyCatcher
@@ -414,16 +414,16 @@ Item {
Column {
id: panelColumn
width: scrollArea.availableWidth
spacing: 14
spacing: Style.space(14)
// ---- Output ----
Column {
width: parent.width
spacing: 6
spacing: Style.space(6)
Row {
width: parent.width
spacing: 8
spacing: Style.space(8)
PanelSectionHeader {
text: "Output"
@@ -439,7 +439,7 @@ Item {
font.family: root.bar.fontFamily
font.pixelSize: Style.font.bodySmall
elide: Text.ElideRight
width: parent.width - 70
width: parent.width - Style.space(70)
anchors.verticalCenter: parent.verticalCenter
}
}
@@ -450,7 +450,7 @@ Item {
CursorSurface {
id: outputSliderRow
width: parent.width
height: outputSliderInner.implicitHeight + 8
height: outputSliderInner.implicitHeight + Style.spacing.controlGap
hasCursor: root.focusSection === "output" && root.selectedIndex === -1
onHasCursorChanged: if (hasCursor) root.ensureCursorVisible(outputSliderRow)
foreground: root.bar.foreground
@@ -459,9 +459,9 @@ Item {
Row {
id: outputSliderInner
anchors.fill: parent
anchors.leftMargin: 6
anchors.rightMargin: 6
spacing: 8
anchors.leftMargin: Style.space(6)
anchors.rightMargin: Style.space(6)
spacing: Style.space(8)
Text {
id: outputIconText
@@ -469,7 +469,7 @@ Item {
color: root.bar.foreground
font.family: root.bar.fontFamily
font.pixelSize: Style.font.heading
width: 22
width: Style.space(22)
horizontalAlignment: Text.AlignHCenter
anchors.verticalCenter: parent.verticalCenter
opacity: root.outputMuted ? 0.5 : 1.0
@@ -484,7 +484,7 @@ Item {
PanelSlider {
id: outputSlider
bar: root.bar
width: parent.width - outputIconText.width - outputPercent.width - 16
width: parent.width - outputIconText.width - outputPercent.width - Style.space(16)
anchors.verticalCenter: parent.verticalCenter
minimum: 0
maximum: 1
@@ -502,7 +502,7 @@ Item {
color: root.bar.foreground
font.family: root.bar.fontFamily
font.pixelSize: Style.font.bodySmall
width: 36
width: Style.space(36)
horizontalAlignment: Text.AlignRight
anchors.verticalCenter: parent.verticalCenter
opacity: root.outputMuted ? 0.5 : 1.0
@@ -537,12 +537,12 @@ Item {
// ---- Input ----
Column {
width: parent.width
spacing: 6
spacing: Style.space(6)
visible: root.audioSources.length > 0 || !!root.source
Row {
width: parent.width
spacing: 8
spacing: Style.space(8)
PanelSectionHeader {
text: "Input"
@@ -558,7 +558,7 @@ Item {
font.family: root.bar.fontFamily
font.pixelSize: Style.font.bodySmall
elide: Text.ElideRight
width: parent.width - 56
width: parent.width - Style.space(56)
anchors.verticalCenter: parent.verticalCenter
}
}
@@ -567,7 +567,7 @@ Item {
id: inputSliderRow
visible: !!root.source
width: parent.width
height: inputSliderInner.implicitHeight + 8
height: inputSliderInner.implicitHeight + Style.spacing.controlGap
hasCursor: root.focusSection === "input" && root.selectedIndex === -1
onHasCursorChanged: if (hasCursor) root.ensureCursorVisible(inputSliderRow)
foreground: root.bar.foreground
@@ -576,9 +576,9 @@ Item {
Row {
id: inputSliderInner
anchors.fill: parent
anchors.leftMargin: 6
anchors.rightMargin: 6
spacing: 8
anchors.leftMargin: Style.space(6)
anchors.rightMargin: Style.space(6)
spacing: Style.space(8)
Text {
id: inputIconText
@@ -586,7 +586,7 @@ Item {
color: root.bar.foreground
font.family: root.bar.fontFamily
font.pixelSize: Style.font.heading
width: 22
width: Style.space(22)
horizontalAlignment: Text.AlignHCenter
anchors.verticalCenter: parent.verticalCenter
opacity: root.inputMuted ? 0.5 : 1.0
@@ -601,7 +601,7 @@ Item {
PanelSlider {
id: inputSlider
bar: root.bar
width: parent.width - inputIconText.width - inputPercent.width - 16
width: parent.width - inputIconText.width - inputPercent.width - Style.space(16)
anchors.verticalCenter: parent.verticalCenter
minimum: 0
maximum: 1
@@ -619,7 +619,7 @@ Item {
color: root.bar.foreground
font.family: root.bar.fontFamily
font.pixelSize: Style.font.bodySmall
width: 36
width: Style.space(36)
horizontalAlignment: Text.AlignRight
anchors.verticalCenter: parent.verticalCenter
opacity: root.inputMuted ? 0.5 : 1.0
@@ -654,7 +654,7 @@ Item {
// ---- Per-app streams ----
Column {
width: parent.width
spacing: 6
spacing: Style.space(6)
visible: root.audioStreams.length > 0
PanelSectionHeader {
@@ -698,23 +698,23 @@ Item {
foreground: root.bar.foreground
fill: root.hoverFill
currentFill: root.selectedFill
implicitHeight: sinkInner.implicitHeight + 10
implicitHeight: sinkInner.implicitHeight + Style.spacing.xl
Row {
id: sinkInner
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
anchors.leftMargin: 6
anchors.rightMargin: 6
spacing: 8
anchors.leftMargin: Style.space(6)
anchors.rightMargin: Style.space(6)
spacing: Style.space(8)
Text {
text: root.sinkGlyph(sinkRow.node)
color: root.bar.foreground
font.family: root.bar.fontFamily
font.pixelSize: Style.font.title
width: 22
width: Style.space(22)
horizontalAlignment: Text.AlignHCenter
anchors.verticalCenter: parent.verticalCenter
}
@@ -725,7 +725,7 @@ Item {
font.family: root.bar.fontFamily
font.pixelSize: Style.font.body
elide: Text.ElideRight
width: parent.width - 22 - 14 - 16
width: parent.width - Style.space(22) - Style.space(14) - Style.space(16)
anchors.verticalCenter: parent.verticalCenter
}
@@ -734,7 +734,7 @@ Item {
color: root.bar.foreground
font.family: root.bar.fontFamily
font.pixelSize: Style.font.subtitle
width: 14
width: Style.space(14)
horizontalAlignment: Text.AlignRight
anchors.verticalCenter: parent.verticalCenter
}
@@ -765,23 +765,23 @@ Item {
foreground: root.bar.foreground
fill: root.hoverFill
currentFill: root.selectedFill
implicitHeight: sourceInner.implicitHeight + 10
implicitHeight: sourceInner.implicitHeight + Style.spacing.xl
Row {
id: sourceInner
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
anchors.leftMargin: 6
anchors.rightMargin: 6
spacing: 8
anchors.leftMargin: Style.space(6)
anchors.rightMargin: Style.space(6)
spacing: Style.space(8)
Text {
text: root.sourceGlyph(sourceRow.node)
color: root.bar.foreground
font.family: root.bar.fontFamily
font.pixelSize: Style.font.title
width: 22
width: Style.space(22)
horizontalAlignment: Text.AlignHCenter
anchors.verticalCenter: parent.verticalCenter
}
@@ -792,7 +792,7 @@ Item {
font.family: root.bar.fontFamily
font.pixelSize: Style.font.body
elide: Text.ElideRight
width: parent.width - 22 - 14 - 16
width: parent.width - Style.space(22) - Style.space(14) - Style.space(16)
anchors.verticalCenter: parent.verticalCenter
}
@@ -801,7 +801,7 @@ Item {
color: root.bar.foreground
font.family: root.bar.fontFamily
font.pixelSize: Style.font.subtitle
width: 14
width: Style.space(14)
horizontalAlignment: Text.AlignRight
anchors.verticalCenter: parent.verticalCenter
}
@@ -836,20 +836,20 @@ Item {
foreground: root.bar.foreground
fill: root.hoverFill
currentFill: root.selectedFill
implicitHeight: streamColumn.implicitHeight + 8
implicitHeight: streamColumn.implicitHeight + Style.spacing.rowGap
Column {
id: streamColumn
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
anchors.leftMargin: 6
anchors.rightMargin: 6
spacing: 2
anchors.leftMargin: Style.space(6)
anchors.rightMargin: Style.space(6)
spacing: Style.space(2)
Row {
width: parent.width
spacing: 6
spacing: Style.space(6)
Text {
id: streamMuteIcon
@@ -857,7 +857,7 @@ Item {
color: root.bar.foreground
font.family: root.bar.fontFamily
font.pixelSize: Style.font.body
width: 14
width: Style.space(14)
horizontalAlignment: Text.AlignHCenter
anchors.verticalCenter: parent.verticalCenter
opacity: streamRow.streamMuted ? 0.5 : 1.0
@@ -878,7 +878,7 @@ Item {
font.family: root.bar.fontFamily
font.pixelSize: Style.font.bodySmall
elide: Text.ElideRight
width: parent.width - streamMuteIcon.width - streamPct.width - 12
width: parent.width - streamMuteIcon.width - streamPct.width - Style.space(12)
anchors.verticalCenter: parent.verticalCenter
}
@@ -888,7 +888,7 @@ Item {
color: Qt.darker(root.bar.foreground, 1.5)
font.family: root.bar.fontFamily
font.pixelSize: Style.font.bodySmall
width: 36
width: Style.space(36)
horizontalAlignment: Text.AlignRight
anchors.verticalCenter: parent.verticalCenter
}
shell/plugins/bar/widgets/bluetoothPanel.qml
+17 -17
View File
@@ -110,10 +110,10 @@ Item {
property string focusedKnownAddress: ""
readonly property color hoverFill: bar
? Qt.rgba(bar.foreground.r, bar.foreground.g, bar.foreground.b, 0.08)
? Style.hoverFillFor(bar.foreground, Color.accent)
: "transparent"
readonly property color selectedFill: bar
? Qt.rgba(bar.foreground.r, bar.foreground.g, bar.foreground.b, 0.18)
? Style.selectedFillFor(bar.foreground, Color.accent)
: "transparent"
function sectionCount(section) {
@@ -362,8 +362,8 @@ Item {
owner: root
bar: root.bar
open: root.popupOpen
contentWidth: 320
contentHeight: column.implicitHeight + 28
contentWidth: panel.fittedContentWidth(Style.space(320))
contentHeight: panel.fittedContentHeight(column.implicitHeight)
PanelKeyCatcher {
id: keyCatcher
@@ -379,7 +379,7 @@ Item {
Column {
id: column
anchors.fill: parent
spacing: 10
spacing: Style.space(10)
// Header: title left, on/off toggle + actions right.
Item {
@@ -389,7 +389,7 @@ Item {
Row {
anchors.left: parent.left
anchors.verticalCenter: parent.verticalCenter
spacing: 8
spacing: Style.space(8)
PanelSectionHeader {
id: titleText
@@ -412,7 +412,7 @@ Item {
Row {
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
spacing: 4
spacing: Style.space(4)
HeaderPill {
pillIndex: 0
@@ -447,7 +447,7 @@ Item {
Flickable {
id: deviceFlick
width: parent.width
height: Math.min(deviceList.implicitHeight, 400)
height: Math.min(deviceList.implicitHeight, Style.space(400))
contentWidth: width
contentHeight: deviceList.implicitHeight
clip: true
@@ -458,7 +458,7 @@ Item {
Column {
id: deviceList
width: parent.width
spacing: 10
spacing: Style.space(10)
// Paired / known devices.
Repeater {
@@ -526,8 +526,8 @@ Item {
tooltipForeground: root.bar.foreground
foreground: root.bar.foreground
fontFamily: root.bar.fontFamily
horizontalPadding: 6
verticalPadding: 4
horizontalPadding: Style.spacing.md
verticalPadding: Style.spacing.labelGap
iconSize: 14
enabled: pillEnabled
opacity: pillEnabled ? 1 : 0.4
@@ -622,7 +622,7 @@ Item {
return Qt.darker(root.bar.foreground, 1.5)
}
implicitHeight: rowContent.implicitHeight + 12
implicitHeight: rowContent.implicitHeight + Style.spacing.rowPaddingX
MouseArea {
id: rowMouse
@@ -664,8 +664,8 @@ Item {
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
anchors.leftMargin: 10
anchors.rightMargin: 10
anchors.leftMargin: Style.space(10)
anchors.rightMargin: Style.space(10)
implicitHeight: Math.max(deviceIcon.implicitHeight, info.implicitHeight, disconnectBtn.implicitHeight)
Text {
@@ -705,11 +705,11 @@ Item {
Column {
id: info
spacing: 1
spacing: Style.space(1)
anchors.left: deviceIcon.right
anchors.leftMargin: 10
anchors.leftMargin: Style.space(10)
anchors.right: disconnectBtn.visible ? disconnectBtn.left : parent.right
anchors.rightMargin: disconnectBtn.visible ? 8 : 0
anchors.rightMargin: disconnectBtn.visible ? Style.space(8) : 0
anchors.verticalCenter: parent.verticalCenter
Text {
shell/plugins/bar/widgets/calendar.qml
+11 -11
View File
@@ -83,12 +83,12 @@ Item {
bar: root.bar
owner: root
open: root.popupOpen
contentWidth: 300
contentHeight: header.implicitHeight + grid.implicitHeight + 36
contentWidth: popup.fittedContentWidth(Style.space(300))
contentHeight: popup.fittedContentHeight(header.implicitHeight + grid.implicitHeight + Style.spacing.rowGap)
Column {
anchors.fill: parent
spacing: 8
spacing: Style.space(8)
Item {
id: header
@@ -101,8 +101,8 @@ Item {
anchors.verticalCenter: parent.verticalCenter
iconText: "󰅁"
foreground: root.bar.foreground
horizontalPadding: 8
verticalPadding: 4
horizontalPadding: Style.spacing.controlGap
verticalPadding: Style.spacing.labelGap
onClicked: root.shiftMonth(-1)
}
@@ -121,8 +121,8 @@ Item {
anchors.verticalCenter: parent.verticalCenter
iconText: "󰅂"
foreground: root.bar.foreground
horizontalPadding: 8
verticalPadding: 4
horizontalPadding: Style.spacing.controlGap
verticalPadding: Style.spacing.labelGap
onClicked: root.shiftMonth(1)
}
}
@@ -130,8 +130,8 @@ Item {
Grid {
id: grid
columns: 7
rowSpacing: 4
columnSpacing: 4
rowSpacing: Style.space(4)
columnSpacing: Style.space(4)
width: parent.width
Repeater {
@@ -140,7 +140,7 @@ Item {
Item {
required property string modelData
width: (grid.width - grid.columnSpacing * 6) / 7
height: 18
height: Math.max(Style.space(18), Style.font.caption + Style.spacing.xxs)
Text {
anchors.centerIn: parent
@@ -177,7 +177,7 @@ Item {
}
width: (grid.width - grid.columnSpacing * 6) / 7
height: 28
height: Math.max(Style.space(28), Style.font.body + Style.spacing.sm)
radius: 4
color: isToday ? root.bar.foreground : "transparent"
border.color: isToday ? root.bar.foreground : "transparent"
shell/plugins/bar/widgets/lockKeys.qml
+4 -4
View File
@@ -61,8 +61,8 @@ Item {
readonly property bool vertical: bar ? bar.vertical : false
implicitWidth: vertical ? (bar ? bar.barSize : 28) : (lay.item ? lay.item.implicitWidth + 8 : 0)
implicitHeight: vertical ? (lay.item ? lay.item.implicitHeight + 8 : 0) : (bar ? bar.barSize : 26)
implicitWidth: vertical ? (bar ? bar.barSize : Style.bar.sizeVertical) : (lay.item ? lay.item.implicitWidth + Style.spacing.controlGap : 0)
implicitHeight: vertical ? (lay.item ? lay.item.implicitHeight + Style.spacing.controlGap : 0) : (bar ? bar.barSize : Style.bar.sizeHorizontal)
Loader {
id: lay
@@ -73,7 +73,7 @@ Item {
Component {
id: rowLayout
Row {
spacing: 4
spacing: Style.space(4)
LockGlyph { glyph: "A"; active: root.capsOn; visible: !root.hideWhenOff || root.capsOn }
LockGlyph { glyph: "1"; active: root.numOn; visible: !root.hideWhenOff || root.numOn }
LockGlyph { glyph: "S"; active: root.scrollOn; visible: !root.hideWhenOff || root.scrollOn }
@@ -83,7 +83,7 @@ Item {
Component {
id: colLayout
Column {
spacing: 2
spacing: Style.space(2)
LockGlyph { glyph: "A"; active: root.capsOn; visible: !root.hideWhenOff || root.capsOn }
LockGlyph { glyph: "1"; active: root.numOn; visible: !root.hideWhenOff || root.numOn }
LockGlyph { glyph: "S"; active: root.scrollOn; visible: !root.hideWhenOff || root.scrollOn }
shell/plugins/bar/widgets/media.qml
+23 -23
View File
@@ -39,13 +39,13 @@ Item {
property real maxLabelWidth: 180
visible: hasMedia
implicitWidth: hasMedia ? row.implicitWidth + 14 : 0
implicitWidth: hasMedia ? row.implicitWidth + Style.space(14) : 0
implicitHeight: bar ? bar.barSize : 26
Row {
id: row
anchors.centerIn: parent
spacing: 6
spacing: Style.space(6)
Text {
id: glyph
@@ -119,29 +119,29 @@ Item {
bar: root.bar
owner: root
open: root.popupOpen
contentWidth: 320
contentHeight: column.implicitHeight + 28
contentWidth: popup.fittedContentWidth(Style.space(320))
contentHeight: popup.fittedContentHeight(column.implicitHeight)
Column {
id: column
anchors.fill: parent
spacing: 10
spacing: Style.space(10)
Row {
spacing: 10
spacing: Style.space(10)
width: parent.width
Rectangle {
width: 64
height: 64
radius: 4
color: Qt.rgba(root.bar.foreground.r, root.bar.foreground.g, root.bar.foreground.b, 0.08)
border.color: Qt.rgba(root.bar.foreground.r, root.bar.foreground.g, root.bar.foreground.b, 0.2)
border.width: 1
width: Style.space(64)
height: Style.space(64)
radius: Style.spacing.labelGap
color: Style.normalFillFor(root.bar.foreground, Color.accent)
border.color: Style.normalBorderFor(root.bar.foreground, Color.accent)
border.width: Style.normalBorderWidth
Image {
anchors.fill: parent
anchors.margins: 2
anchors.margins: Style.space(2)
fillMode: Image.PreserveAspectCrop
asynchronous: true
source: root.activePlayer && root.activePlayer.trackArtUrl ? root.activePlayer.trackArtUrl : ""
@@ -159,8 +159,8 @@ Item {
}
Column {
spacing: 4
width: parent.width - 74
spacing: Style.space(4)
width: parent.width - Style.space(74)
Text {
text: root.title || "Nothing playing"
@@ -196,13 +196,13 @@ Item {
Row {
anchors.horizontalCenter: parent.horizontalCenter
spacing: 6
spacing: Style.space(6)
Button {
iconText: "󰒮"
foreground: root.bar.foreground
horizontalPadding: 10
verticalPadding: 6
horizontalPadding: Style.spacing.controlPaddingX
verticalPadding: Style.spacing.controlPaddingY
enabled: root.activePlayer && root.activePlayer.canGoPrevious
opacity: enabled ? 1.0 : 0.4
onClicked: if (root.activePlayer) root.activePlayer.previous()
@@ -211,9 +211,9 @@ Item {
Button {
iconText: root.activePlayer && root.activePlayer.isPlaying ? "󰏤" : "󰐊"
foreground: root.bar.foreground
horizontalPadding: 14
verticalPadding: 6
iconSize: 18
horizontalPadding: Style.spacing.panelGap
verticalPadding: Style.spacing.controlPaddingY
iconSize: Style.font.iconLarge
enabled: root.activePlayer && root.activePlayer.canTogglePlaying
opacity: enabled ? 1.0 : 0.4
onClicked: if (root.activePlayer) root.activePlayer.togglePlaying()
@@ -222,8 +222,8 @@ Item {
Button {
iconText: "󰒭"
foreground: root.bar.foreground
horizontalPadding: 10
verticalPadding: 6
horizontalPadding: Style.spacing.controlPaddingX
verticalPadding: Style.spacing.controlPaddingY
enabled: root.activePlayer && root.activePlayer.canGoNext
opacity: enabled ? 1.0 : 0.4
onClicked: if (root.activePlayer) root.activePlayer.next()
shell/plugins/bar/widgets/monitorPanel.qml
+16 -16
View File
@@ -367,8 +367,8 @@ Item {
owner: root
bar: root.bar
open: root.popupOpen
contentWidth: 320
contentHeight: Math.min(560, panelColumn.implicitHeight + 28)
contentWidth: panel.fittedContentWidth(Style.space(320))
contentHeight: panel.fittedContentHeight(panelColumn.implicitHeight, Style.space(560))
PanelKeyCatcher {
id: keyCatcher
@@ -393,12 +393,12 @@ Item {
Column {
id: panelColumn
width: scrollArea.availableWidth
spacing: 14
spacing: Style.space(14)
// ---- Brightness ----
Column {
width: parent.width
spacing: 6
spacing: Style.space(6)
PanelSectionHeader {
text: "Brightness"
@@ -411,7 +411,7 @@ Item {
id: brightnessRow
visible: root.brightnessAvailable
width: parent.width
height: brightnessInner.implicitHeight + 8
height: brightnessInner.implicitHeight + Style.spacing.controlGap
hasCursor: root.focusSection === "brightness" && root.selectedIndex === -1
onHasCursorChanged: if (hasCursor) root.ensureCursorVisible(brightnessRow)
foreground: root.bar.foreground
@@ -420,16 +420,16 @@ Item {
Row {
id: brightnessInner
anchors.fill: parent
anchors.leftMargin: 6
anchors.rightMargin: 6
spacing: 8
anchors.leftMargin: Style.space(6)
anchors.rightMargin: Style.space(6)
spacing: Style.space(8)
Text {
text: "󰃠"
color: root.bar.foreground
font.family: root.bar.fontFamily
font.pixelSize: Style.font.heading
width: 22
width: Style.space(22)
horizontalAlignment: Text.AlignHCenter
anchors.verticalCenter: parent.verticalCenter
}
@@ -437,7 +437,7 @@ Item {
PanelSlider {
id: brightnessSlider
bar: root.bar
width: parent.width - 22 - brightnessLabel.width - 16
width: parent.width - Style.space(22) - brightnessLabel.width - Style.space(16)
anchors.verticalCenter: parent.verticalCenter
minimum: 1
maximum: 100
@@ -457,7 +457,7 @@ Item {
color: root.bar.foreground
font.family: root.bar.fontFamily
font.pixelSize: Style.font.bodySmall
width: 36
width: Style.space(36)
horizontalAlignment: Text.AlignRight
anchors.verticalCenter: parent.verticalCenter
}
@@ -483,7 +483,7 @@ Item {
// ---- Scale ----
Column {
width: parent.width
spacing: 6
spacing: Style.space(6)
PanelSectionHeader {
text: "Scale"
@@ -494,7 +494,7 @@ Item {
Row {
width: parent.width
spacing: 6
spacing: Style.space(6)
Repeater {
model: root.scaleValues
@@ -503,7 +503,7 @@ Item {
required property string modelData
required property int index
width: (panelColumn.width - 30) / 6
width: (panelColumn.width - Style.space(30)) / 6
text: modelData + "x"
foreground: root.bar.foreground
background: "transparent"
@@ -512,7 +512,7 @@ Item {
fontFamily: root.bar.fontFamily
fontSize: Style.font.bodySmall
horizontalPadding: 0
verticalPadding: 6
verticalPadding: Style.spacing.controlPaddingY
active: root.normalizeScale(root.monitorScale) === root.normalizeScale(modelData)
hasCursor: root.focusSection === "scale" && root.selectedIndex === index
onClicked: root.setScale(modelData)
@@ -530,7 +530,7 @@ Item {
// ---- Monitors ----
Column {
width: parent.width
spacing: 6
spacing: Style.space(6)
visible: root.displays.length > 0
PanelSectionHeader {
shell/plugins/bar/widgets/networkPanel.qml
+35 -35
View File
@@ -69,8 +69,8 @@ Item {
// Mouse hover and keyboard nav both mutate this state at the root; items
// never read containsMouse for visuals. See CursorSurface for the
// shared chrome (fill / border) shared by NetworkRow and DnsProviderPill.
readonly property color hoverFill: bar ? Qt.rgba(bar.foreground.r, bar.foreground.g, bar.foreground.b, 0.08) : "transparent"
readonly property color selectedFill: bar ? Qt.rgba(bar.foreground.r, bar.foreground.g, bar.foreground.b, 0.18) : "transparent"
readonly property color hoverFill: bar ? Style.hoverFillFor(bar.foreground, Color.accent) : "transparent"
readonly property color selectedFill: bar ? Style.selectedFillFor(bar.foreground, Color.accent) : "transparent"
// The panel below is its own layer-shell with Exclusive keyboard focus,
// so Hyprland grants focus when the surface is mapped (popupOpen flips
@@ -599,8 +599,8 @@ iwctl station "$station" get-networks rssi-dbms 2>/dev/null \\
owner: root
bar: root.bar
open: root.popupOpen
contentWidth: 340
contentHeight: column.implicitHeight + 28
contentWidth: panel.fittedContentWidth(Style.space(340))
contentHeight: panel.fittedContentHeight(column.implicitHeight)
// Catches all unhandled keys for keyboard navigation. AfterItem priority
// lets the passphrase TextField (a child via focus chain) get its keys
@@ -647,7 +647,7 @@ iwctl station "$station" get-networks rssi-dbms 2>/dev/null \\
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
spacing: 12
spacing: Style.space(12)
// Header — interface name + type, refresh on the right.
Item {
@@ -658,7 +658,7 @@ iwctl station "$station" get-networks rssi-dbms 2>/dev/null \\
id: headerInfo
anchors.left: parent.left
anchors.verticalCenter: parent.verticalCenter
spacing: 10
spacing: Style.space(10)
Text {
text: root.icon
@@ -669,7 +669,7 @@ iwctl station "$station" get-networks rssi-dbms 2>/dev/null \\
}
Column {
spacing: 2
spacing: Style.space(2)
anchors.verticalCenter: parent.verticalCenter
Text {
@@ -706,9 +706,9 @@ iwctl station "$station" get-networks rssi-dbms 2>/dev/null \\
tooltipBackground: root.bar.background
tooltipForeground: root.bar.foreground
foreground: root.bar.foreground
horizontalPadding: 8
verticalPadding: 4
iconSize: 14
horizontalPadding: Style.spacing.controlGap
verticalPadding: Style.spacing.labelGap
iconSize: Style.font.icon
active: root.scanning
onClicked: root.refresh()
}
@@ -724,8 +724,8 @@ iwctl station "$station" get-networks rssi-dbms 2>/dev/null \\
visible: !!root.info.iface
width: parent.width
columns: 2
columnSpacing: 14
rowSpacing: 4
columnSpacing: Style.space(14)
rowSpacing: Style.space(4)
// IP address.
Text {
@@ -815,7 +815,7 @@ iwctl station "$station" get-networks rssi-dbms 2>/dev/null \\
Column {
width: parent.width
spacing: 8
spacing: Style.space(8)
PanelSectionHeader {
text: "DNS provider"
@@ -825,7 +825,7 @@ iwctl station "$station" get-networks rssi-dbms 2>/dev/null \\
Row {
width: parent.width
spacing: 6
spacing: Style.space(6)
DnsProviderPill {
provider: "DHCP"
@@ -879,8 +879,8 @@ iwctl station "$station" get-networks rssi-dbms 2>/dev/null \\
id: networkList
visible: root.wifiStationAvailable
width: parent.width
height: Math.min(contentHeight, 240)
spacing: 4
height: Math.min(contentHeight, Style.space(240))
spacing: Style.space(4)
clip: true
boundsBehavior: Flickable.StopAtBounds
interactive: contentHeight > height
@@ -925,8 +925,8 @@ iwctl station "$station" get-networks rssi-dbms 2>/dev/null \\
tooltipBackground: root.bar.background
tooltipForeground: root.bar.foreground
fontFamily: root.bar.fontFamily
horizontalPadding: 10
verticalPadding: 6
horizontalPadding: Style.spacing.controlPaddingX
verticalPadding: Style.spacing.controlPaddingY
// Map the panel's domain semantics onto Button's structural props:
// `current DNS` is the pill's `active` fill; the keyboard cursor lights
@@ -982,7 +982,7 @@ iwctl station "$station" get-networks rssi-dbms 2>/dev/null \\
return Qt.darker(root.bar.foreground, 1.5)
}
implicitHeight: rowBody.implicitHeight + (isPasswordOpen ? passwordPanel.implicitHeight + 6 : 0)
implicitHeight: rowBody.implicitHeight + (isPasswordOpen ? passwordPanel.implicitHeight + Style.spacing.md : 0)
MouseArea {
id: rowMouse
@@ -1040,9 +1040,9 @@ iwctl known-networks list 2>/dev/null \\
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
anchors.leftMargin: 10
anchors.rightMargin: 10
implicitHeight: Math.max(networkIcon.implicitHeight, networkInfo.implicitHeight, forgetBtn.implicitHeight) + 12
anchors.leftMargin: Style.space(10)
anchors.rightMargin: Style.space(10)
implicitHeight: Math.max(networkIcon.implicitHeight, networkInfo.implicitHeight, forgetBtn.implicitHeight) + Style.spacing.rowPaddingX
Text {
id: networkIcon
@@ -1072,12 +1072,12 @@ iwctl known-networks list 2>/dev/null \\
// Shows a lock glyph on the right for protected networks that
// aren't currently connected. Once connected, the forget X takes
// its place (and 'protected' is implied by the fact we're on it).
// Same 22-wide right-anchored centered geometry as forgetBtn so the
// glyph centers line up across rows.
// Same action-sized right-anchored centered geometry as forgetBtn so
// the glyph centers line up across rows.
Text {
id: lockIndicator
visible: row.isProtected && !row.isConnected
width: 22
width: Style.space(22)
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
horizontalAlignment: Text.AlignHCenter
@@ -1089,13 +1089,13 @@ iwctl known-networks list 2>/dev/null \\
Column {
id: networkInfo
spacing: 1
spacing: Style.space(1)
anchors.left: networkIcon.right
anchors.leftMargin: 10
anchors.leftMargin: Style.space(10)
anchors.right: forgetBtn.visible ? forgetBtn.left
: lockIndicator.visible ? lockIndicator.left
: parent.right
anchors.rightMargin: (forgetBtn.visible || lockIndicator.visible) ? 8 : 0
anchors.rightMargin: (forgetBtn.visible || lockIndicator.visible) ? Style.space(8) : 0
anchors.verticalCenter: parent.verticalCenter
Text {
@@ -1133,24 +1133,24 @@ iwctl known-networks list 2>/dev/null \\
anchors.left: parent.left
anchors.right: parent.right
anchors.top: rowMouse.bottom
anchors.leftMargin: 10
anchors.rightMargin: 10
anchors.topMargin: 4
implicitHeight: pwField.implicitHeight + 8
anchors.leftMargin: Style.space(10)
anchors.rightMargin: Style.space(10)
anchors.topMargin: Style.space(4)
implicitHeight: pwField.implicitHeight + Style.spacing.rowGap
TextField {
id: pwField
anchors.left: parent.left
anchors.right: connectPwBtn.left
anchors.verticalCenter: parent.verticalCenter
anchors.rightMargin: 6
anchors.rightMargin: Style.space(6)
password: true
placeholderText: "Passphrase"
font.family: root.bar.fontFamily
font.pixelSize: Style.font.body
foreground: root.bar.foreground
horizontalPadding: 8
verticalPadding: 6
horizontalPadding: Style.spacing.controlGap
verticalPadding: Style.spacing.controlPaddingY
enabled: !row.isBusy
onAccepted: {
shell/plugins/bar/widgets/notificationCenter.qml
+34 -37
View File
@@ -64,8 +64,8 @@ Item {
// rest of the notification stack).
readonly property color colForeground: Color.foreground
readonly property color colDim: Qt.darker(Color.foreground, 1.4)
readonly property color colBorder: Qt.rgba(Color.foreground.r, Color.foreground.g, Color.foreground.b, 0.18)
readonly property color colSurface: Qt.rgba(Color.foreground.r, Color.foreground.g, Color.foreground.b, 0.06)
readonly property color colBorder: Style.normalBorderFor(Color.foreground, Color.accent)
readonly property color colSurface: Style.normalFillFor(Color.foreground, Color.accent)
readonly property color colAccent: Color.accent
readonly property int cardRadius: notificationService ? notificationService.cornerRadius : 0
@@ -109,17 +109,17 @@ Item {
bar: root.bar
owner: root
open: root.popupOpen
contentWidth: 440
contentHeight: 540
contentWidth: popup.fittedContentWidth(Style.space(440))
contentHeight: popup.cappedContentHeight(Style.space(540))
ColumnLayout {
anchors.fill: parent
spacing: 10
spacing: Style.space(10)
// ----------------------------------------- header
RowLayout {
Layout.fillWidth: true
spacing: 8
spacing: Style.space(8)
Text {
text: "Notifications"
@@ -133,18 +133,18 @@ Item {
Rectangle {
id: dndPill
Layout.preferredHeight: 24
Layout.preferredWidth: dndLabel.implicitWidth + dndGlyph.implicitWidth + 18
radius: Math.min(12, root.cardRadius + 6)
Layout.preferredHeight: Math.max(Style.space(24), Style.font.bodySmall + Style.spacing.controlPaddingY * 2)
Layout.preferredWidth: dndLabel.implicitWidth + dndGlyph.implicitWidth + Style.space(18)
radius: Math.min(Style.space(12), root.cardRadius + Style.space(6))
color: dndOn ? root.colAccent : root.colSurface
border.color: dndOn ? root.colAccent : root.colBorder
border.width: 1
border.width: Style.normalBorderWidth
readonly property bool dndOn: !!root.notificationService && root.notificationService.doNotDisturb
Row {
anchors.centerIn: parent
spacing: 4
spacing: Style.space(4)
Text {
id: dndGlyph
@@ -190,7 +190,7 @@ Item {
readonly property bool isActive: root.activeTab === modelData.key
Layout.fillWidth: true
Layout.preferredHeight: 30
Layout.preferredHeight: Math.max(Style.space(30), Style.font.body + Style.spacing.controlPaddingY * 2)
color: "transparent"
Text {
@@ -206,7 +206,7 @@ Item {
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
height: 2
height: Math.max(1, Style.space(2))
color: parent.isActive ? root.colAccent : root.colBorder
opacity: parent.isActive ? 1 : 0.4
}
@@ -225,17 +225,17 @@ Item {
Layout.fillWidth: true
visible: (root.activeTab === "pending" && root.pendingCount > 0)
|| (root.activeTab === "past" && root.pastCount > 0)
spacing: 8
spacing: Style.space(8)
Item { Layout.fillWidth: true }
Rectangle {
Layout.preferredWidth: actionLabel.implicitWidth + 16
Layout.preferredHeight: 22
radius: Math.min(6, root.cardRadius)
Layout.preferredWidth: actionLabel.implicitWidth + Style.space(16)
Layout.preferredHeight: Math.max(Style.space(22), Style.font.bodySmall + Style.spacing.controlPaddingY * 2)
radius: Math.min(Style.space(6), root.cardRadius)
color: actionArea.containsMouse ? root.colBorder : "transparent"
border.color: root.colBorder
border.width: 1
border.width: Style.normalBorderWidth
Text {
id: actionLabel
@@ -266,7 +266,7 @@ Item {
Layout.fillWidth: true
Layout.fillHeight: true
clip: true
spacing: 8
spacing: Style.space(8)
readonly property bool onPending: root.activeTab === "pending"
model: !root.notificationService ? null
@@ -291,11 +291,11 @@ Item {
readonly property string sanitizedBody: root.sanitizeBody(body, app, appIcon)
width: listView.width
implicitHeight: rowContent.implicitHeight + 20
implicitHeight: rowContent.implicitHeight + Style.spacing.panelGap
radius: root.cardRadius
color: "transparent"
border.color: root.colBorder
border.width: 1
border.width: Style.normalBorderWidth
MouseArea {
anchors.fill: parent
@@ -308,13 +308,14 @@ Item {
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
anchors.leftMargin: 12
anchors.rightMargin: 12
spacing: 10
anchors.leftMargin: Style.space(12)
anchors.rightMargin: Style.space(12)
spacing: Style.space(10)
Item {
Layout.preferredWidth: 32
Layout.preferredHeight: 32
id: imageSlot
Layout.preferredWidth: Style.space(32)
Layout.preferredHeight: Style.space(32)
Layout.alignment: Qt.AlignVCenter
// Hide on icon load failure so unresolved themed-icon names
// don't render Qt's broken-image placeholder.
@@ -325,8 +326,8 @@ Item {
anchors.fill: parent
source: rowCard.hasMedia ? rowCard.image : rowCard.smallIconSource
fillMode: rowCard.hasMedia ? Image.PreserveAspectCrop : Image.PreserveAspectFit
sourceSize.width: 32 * Screen.devicePixelRatio
sourceSize.height: 32 * Screen.devicePixelRatio
sourceSize.width: imageSlot.width * Screen.devicePixelRatio
sourceSize.height: imageSlot.height * Screen.devicePixelRatio
asynchronous: true
smooth: true
}
@@ -334,7 +335,7 @@ Item {
ColumnLayout {
Layout.fillWidth: true
spacing: 2
spacing: Style.space(2)
Text {
Layout.fillWidth: true
@@ -364,8 +365,8 @@ Item {
}
Rectangle {
Layout.preferredWidth: 18
Layout.preferredHeight: 18
Layout.preferredWidth: Style.space(18)
Layout.preferredHeight: Style.space(18)
Layout.alignment: Qt.AlignVCenter
radius: Math.min(4, root.cardRadius)
color: rowCloseArea.containsMouse ? root.colBorder : "transparent"
@@ -402,16 +403,14 @@ Item {
ColumnLayout {
anchors.centerIn: parent
spacing: 6
spacing: Style.space(6)
Text {
Layout.alignment: Qt.AlignHCenter
text: "󰂚"
font.family: root.bar ? root.bar.fontFamily : ""
color: root.colBorder
// Deliberately oversized empty-state glyph; doesn't follow the
// Style.font.* scale because it's a one-off decorative element.
font.pixelSize: 36
font.pixelSize: Style.font.displayLarge
}
Text {
@@ -420,8 +419,6 @@ Item {
? "Nothing waiting for you"
: "Nothing recent"
font.family: root.bar ? root.bar.fontFamily : ""
? "Nothing waiting for you"
: "No past notifications"
color: root.colDim
font.pixelSize: Style.font.body
}
shell/plugins/bar/widgets/systemStats.qml
+6 -6
View File
@@ -177,13 +177,13 @@ Item {
bar: root.bar
open: root.popupOpen
triggerMode: "hover"
contentWidth: 320
contentHeight: detailColumn.implicitHeight + 28
contentWidth: popup.fittedContentWidth(Style.space(320))
contentHeight: popup.fittedContentHeight(detailColumn.implicitHeight)
Column {
id: detailColumn
anchors.fill: parent
spacing: 10
spacing: Style.space(10)
Text {
text: "System"
@@ -213,7 +213,7 @@ Item {
Row {
width: parent.width
spacing: 6
spacing: Style.space(6)
Text {
text: "Load"
color: Qt.darker(root.bar.foreground, 1.5)
@@ -239,7 +239,7 @@ Item {
property color barFg: "#cacccc"
property string fontFamily: "JetBrainsMono Nerd Font"
spacing: 4
spacing: Style.space(4)
Row {
width: parent.width
@@ -261,7 +261,7 @@ Item {
Canvas {
id: detailCanvas
width: parent.width
height: 40
height: Style.space(40)
property var history: detail.history
onHistoryChanged: requestPaint()
shell/plugins/bar/widgets/weatherFlyout.qml
+31 -23
View File
@@ -67,7 +67,7 @@ Item {
readonly property string reportHumidity: current ? (current.humidity + "%") : ""
visible: label !== ""
implicitWidth: button.implicitWidth + 8
implicitWidth: button.implicitWidth + Style.spacing.controlGap
implicitHeight: button.implicitHeight
function setting(name, fallback) {
@@ -322,15 +322,22 @@ Item {
open: root.popupOpen
centerOnBar: true
triggerMode: "click"
contentWidth: 480
contentHeight: card.implicitHeight + 28
margin: 24
contentWidth: popup.fittedContentWidth(Style.space(480))
contentHeight: popup.fittedContentHeight(weatherColumn.implicitHeight)
borderColor: Color.notifications.border
Column {
id: card
Flickable {
id: weatherScroll
anchors.fill: parent
spacing: 14
contentWidth: width
contentHeight: weatherColumn.implicitHeight
clip: true
boundsBehavior: Flickable.StopAtBounds
Column {
id: weatherColumn
width: weatherScroll.width
spacing: Style.space(14)
// ---- Hero row: big icon + temp on the left; location and stats stacked on the right.
Item {
@@ -340,9 +347,9 @@ Item {
Row {
id: heroLeft
anchors.left: parent.left
anchors.leftMargin: 16
anchors.leftMargin: Style.space(16)
anchors.verticalCenter: parent.verticalCenter
spacing: 16
spacing: Style.space(16)
Text {
id: heroIcon
@@ -358,7 +365,7 @@ Item {
Row {
anchors.verticalCenter: parent.verticalCenter
spacing: 2
spacing: Style.space(2)
Text {
id: tempBig
@@ -376,7 +383,7 @@ Item {
font.family: root.bar.fontFamily
font.pixelSize: Style.font.display
anchors.top: tempBig.top
anchors.topMargin: 10
anchors.topMargin: Style.space(10)
}
}
}
@@ -384,13 +391,13 @@ Item {
Column {
id: heroRight
anchors.right: parent.right
anchors.rightMargin: 20
anchors.rightMargin: Style.space(20)
anchors.verticalCenter: parent.verticalCenter
spacing: 12
spacing: Style.space(12)
Row {
visible: root.reportLocation !== ""
spacing: 6
spacing: Style.space(6)
Text {
text: "" // nf-fa-map_marker
@@ -411,10 +418,10 @@ Item {
Row {
visible: !!root.current
spacing: 36
spacing: Style.space(36)
Column {
spacing: 5
spacing: Style.space(5)
Text {
text: "FEELS"
color: Qt.darker(root.bar.foreground, 1.5)
@@ -431,7 +438,7 @@ Item {
}
Column {
spacing: 5
spacing: Style.space(5)
Text {
text: "WIND"
color: Qt.darker(root.bar.foreground, 1.5)
@@ -448,7 +455,7 @@ Item {
}
Column {
spacing: 5
spacing: Style.space(5)
Text {
text: "HUMID"
color: Qt.darker(root.bar.foreground, 1.5)
@@ -480,7 +487,7 @@ Item {
Rectangle {
visible: root.forecastDays.length > 0
width: parent.width
height: 1
height: Style.spacing.hairline
color: root.bar.foreground
opacity: 0.12
}
@@ -495,7 +502,7 @@ Item {
Row {
id: forecastRow
anchors.horizontalCenter: parent.horizontalCenter
spacing: 44
spacing: Style.space(44)
Repeater {
model: root.forecastDays
@@ -503,7 +510,7 @@ Item {
Row {
required property var modelData
required property int index
spacing: 10
spacing: Style.space(10)
Text {
anchors.verticalCenter: parent.verticalCenter
@@ -515,7 +522,7 @@ Item {
Column {
anchors.verticalCenter: parent.verticalCenter
spacing: 2
spacing: Style.space(2)
Text {
text: root.dayName(modelData.date).toUpperCase()
@@ -526,7 +533,7 @@ Item {
}
Row {
spacing: 6
spacing: Style.space(6)
Text {
text: root.bareTempForDay(modelData, "max")
@@ -548,6 +555,7 @@ Item {
}
}
}
}
// Poll the weather pill text/class every minute. Local to this widget.
Process {