mirror of
https://github.com/AquaMorph/dotfiles.git
synced 2026-09-29 20:04:21 +00:00
refactor(quickshell): centralize bar theme values
This commit is contained in:
@@ -6,7 +6,7 @@ Block {
|
||||
required property var service
|
||||
|
||||
visible: service.brightness >= 0
|
||||
blockColor: "#2980b9"
|
||||
blockColor: Theme.secondary
|
||||
interactive: true
|
||||
text: "\uf185 " + service.brightness + "%"
|
||||
onWheel: wheel => {
|
||||
|
||||
@@ -26,8 +26,8 @@ PanelWindow {
|
||||
left: true
|
||||
right: true
|
||||
}
|
||||
implicitHeight: 38
|
||||
color: "#80000000"
|
||||
implicitHeight: Theme.barHeight
|
||||
color: Theme.background
|
||||
|
||||
PwObjectTracker {
|
||||
objects: [bar.sink, bar.source]
|
||||
@@ -54,7 +54,7 @@ PanelWindow {
|
||||
top: parent.top
|
||||
bottom: parent.bottom
|
||||
}
|
||||
spacing: 8
|
||||
spacing: Theme.moduleSpacing
|
||||
|
||||
Row {
|
||||
height: parent.height
|
||||
@@ -70,10 +70,10 @@ PanelWindow {
|
||||
property bool active: modelData.active
|
||||
|
||||
visible: modelData.id > 0
|
||||
width: 34
|
||||
width: Theme.blockHeight + 2
|
||||
height: parent.height
|
||||
color: modelData.urgent ? "#e91e63"
|
||||
: active ? "#0288d1" : "transparent"
|
||||
color: modelData.urgent ? Theme.urgent
|
||||
: active ? Theme.primary : "transparent"
|
||||
|
||||
Rectangle {
|
||||
anchors {
|
||||
@@ -81,17 +81,17 @@ PanelWindow {
|
||||
right: parent.right
|
||||
bottom: parent.bottom
|
||||
}
|
||||
height: 3
|
||||
color: workspaceButton.active ? "#b3e5fc" : "transparent"
|
||||
height: Theme.activeLineWidth
|
||||
color: workspaceButton.active ? Theme.accent : "transparent"
|
||||
}
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
text: modelData.id === 2 ? "\uf120"
|
||||
: modelData.id === 13 ? "\uf001" : modelData.name
|
||||
color: "#ffffff"
|
||||
font.family: "SF Pro Display, Font Awesome 6 Free"
|
||||
font.pixelSize: 18
|
||||
color: Theme.foreground
|
||||
font.family: Theme.iconFontFamily
|
||||
font.pixelSize: Theme.fontSize
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
@@ -111,13 +111,13 @@ PanelWindow {
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
width: Math.max(0, Math.min(implicitWidth,
|
||||
parent.width - leftModules.width - rightModules.width - 32))
|
||||
parent.width - leftModules.width - rightModules.width - Theme.blockHeight))
|
||||
elide: Text.ElideRight
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
text: Hyprland.activeToplevel ? Hyprland.activeToplevel.title : ""
|
||||
color: "#ffffff"
|
||||
font.family: "SF Pro Display, Helvetica, Arial, sans-serif"
|
||||
font.pixelSize: 18
|
||||
color: Theme.foreground
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontSize
|
||||
}
|
||||
|
||||
Row {
|
||||
@@ -126,16 +126,16 @@ PanelWindow {
|
||||
right: parent.right
|
||||
top: parent.top
|
||||
bottom: parent.bottom
|
||||
rightMargin: 4
|
||||
rightMargin: Theme.moduleSpacing / 2
|
||||
}
|
||||
spacing: 8
|
||||
spacing: Theme.moduleSpacing
|
||||
|
||||
Block {
|
||||
id: audioBlock
|
||||
blockColor: bar.sink && bar.sink.audio && bar.sink.audio.muted
|
||||
? "#ffffff" : "#0288d1"
|
||||
? Theme.foreground : Theme.primary
|
||||
textColor: bar.sink && bar.sink.audio && bar.sink.audio.muted
|
||||
? "#000000" : "#ffffff"
|
||||
? Theme.foregroundDark : Theme.foreground
|
||||
interactive: true
|
||||
text: {
|
||||
if (!bar.sink || !bar.sink.audio)
|
||||
@@ -182,9 +182,9 @@ PanelWindow {
|
||||
visible: bar.battery.ready && bar.battery.isLaptopBattery
|
||||
interactive: true
|
||||
blockColor: percentage <= 15 && UPower.onBattery
|
||||
? "#e91e63" : UPower.onBattery ? "#ffffff" : "#2980b9"
|
||||
? Theme.urgent : UPower.onBattery ? Theme.foreground : Theme.secondary
|
||||
textColor: UPower.onBattery && percentage > 15
|
||||
? "#000000" : "#ffffff"
|
||||
? Theme.foregroundDark : Theme.foreground
|
||||
text: {
|
||||
if (!UPower.onBattery)
|
||||
return "\uf1e6 " + percentage + "%";
|
||||
@@ -199,14 +199,14 @@ PanelWindow {
|
||||
|
||||
Rectangle {
|
||||
visible: trayRepeater.count > 0
|
||||
implicitWidth: trayItems.implicitWidth + 20
|
||||
implicitHeight: 32
|
||||
color: "#0288d1"
|
||||
implicitWidth: trayItems.implicitWidth + Theme.contentPadding * 2
|
||||
implicitHeight: Theme.blockHeight
|
||||
color: Theme.primary
|
||||
|
||||
Row {
|
||||
id: trayItems
|
||||
anchors.centerIn: parent
|
||||
spacing: 10
|
||||
spacing: Theme.contentPadding
|
||||
|
||||
Repeater {
|
||||
id: trayRepeater
|
||||
|
||||
@@ -4,19 +4,19 @@ import Quickshell.Widgets
|
||||
Rectangle {
|
||||
id: root
|
||||
|
||||
property color blockColor: "#0288d1"
|
||||
property color textColor: "#ffffff"
|
||||
property color blockColor: Theme.primary
|
||||
property color textColor: Theme.foreground
|
||||
property bool interactive: false
|
||||
property string text: ""
|
||||
property string fontFamily: "SF Pro Display, Font Awesome 6 Free"
|
||||
property string fontFamily: Theme.iconFontFamily
|
||||
property string secondaryIcon: ""
|
||||
property string secondaryText: ""
|
||||
signal clicked(var mouse)
|
||||
signal doubleClicked(var mouse)
|
||||
signal wheel(var wheel)
|
||||
|
||||
implicitWidth: content.implicitWidth + 20
|
||||
implicitHeight: 32
|
||||
implicitWidth: content.implicitWidth + Theme.contentPadding * 2
|
||||
implicitHeight: Theme.blockHeight
|
||||
color: blockColor
|
||||
|
||||
Row {
|
||||
@@ -28,7 +28,7 @@ Rectangle {
|
||||
text: root.text
|
||||
color: root.textColor
|
||||
font.family: root.fontFamily
|
||||
font.pixelSize: 18
|
||||
font.pixelSize: Theme.fontSize
|
||||
}
|
||||
|
||||
IconImage {
|
||||
@@ -45,7 +45,7 @@ Rectangle {
|
||||
text: root.secondaryText
|
||||
color: root.textColor
|
||||
font.family: root.fontFamily
|
||||
font.pixelSize: 18
|
||||
font.pixelSize: Theme.fontSize
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -47,8 +47,9 @@ PopupWindow {
|
||||
}
|
||||
|
||||
visible: false
|
||||
implicitWidth: 320
|
||||
implicitHeight: contentLoader.item ? contentLoader.item.implicitHeight + 32 : 100
|
||||
implicitWidth: Theme.popupWidth
|
||||
implicitHeight: contentLoader.item
|
||||
? contentLoader.item.implicitHeight + Theme.popupPadding * 2 : 100
|
||||
color: "transparent"
|
||||
|
||||
anchor {
|
||||
@@ -60,7 +61,7 @@ PopupWindow {
|
||||
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
color: "#e0000000"
|
||||
color: Theme.popupBackground
|
||||
|
||||
Loader {
|
||||
id: contentLoader
|
||||
@@ -68,7 +69,7 @@ PopupWindow {
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
top: parent.top
|
||||
margins: 12
|
||||
margins: Theme.popupPadding
|
||||
}
|
||||
sourceComponent: root.page === "clock" ? clockPage
|
||||
: root.page === "audio" ? audioPage
|
||||
@@ -82,8 +83,8 @@ PopupWindow {
|
||||
right: parent.right
|
||||
bottom: parent.bottom
|
||||
}
|
||||
height: 3
|
||||
color: "#b3e5fc"
|
||||
height: Theme.activeLineWidth
|
||||
color: Theme.accent
|
||||
}
|
||||
}
|
||||
|
||||
@@ -98,7 +99,7 @@ PopupWindow {
|
||||
property int firstDay: new Date(year, month, 1).getDay()
|
||||
property int days: new Date(year, month + 1, 0).getDate()
|
||||
|
||||
implicitWidth: 288
|
||||
implicitWidth: Theme.popupContentWidth
|
||||
implicitHeight: 310
|
||||
|
||||
PopupHeader {
|
||||
@@ -113,9 +114,9 @@ PopupWindow {
|
||||
topMargin: 40
|
||||
}
|
||||
text: Qt.formatDateTime(parent.now, "h:mm:ss AP")
|
||||
color: "#ffffff"
|
||||
font.family: "SF Pro Display, Helvetica, Arial, sans-serif"
|
||||
font.pixelSize: 30
|
||||
color: Theme.foreground
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontClock
|
||||
}
|
||||
|
||||
Row {
|
||||
@@ -132,8 +133,8 @@ PopupWindow {
|
||||
required property string modelData
|
||||
width: 37
|
||||
text: modelData
|
||||
color: "#7aa6da"
|
||||
font.family: "SF Pro Display, Helvetica, Arial, sans-serif"
|
||||
color: Theme.muted
|
||||
font.family: Theme.fontFamily
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
font.bold: true
|
||||
}
|
||||
@@ -160,7 +161,7 @@ PopupWindow {
|
||||
width: 37
|
||||
height: 29
|
||||
radius: 0
|
||||
color: today ? "#0288d1" : "transparent"
|
||||
color: today ? Theme.primary : "transparent"
|
||||
|
||||
Rectangle {
|
||||
anchors {
|
||||
@@ -168,18 +169,18 @@ PopupWindow {
|
||||
right: parent.right
|
||||
bottom: parent.bottom
|
||||
}
|
||||
height: 3
|
||||
height: Theme.activeLineWidth
|
||||
visible: parent.today
|
||||
color: "#b3e5fc"
|
||||
color: Theme.accent
|
||||
}
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
text: parent.day > 0 && parent.day <= clockContent.days
|
||||
? parent.day : ""
|
||||
color: parent.today ? "#ffffff" : "#cfd8dc"
|
||||
font.family: "SF Pro Display, Helvetica, Arial, sans-serif"
|
||||
font.pixelSize: 14
|
||||
color: Theme.foreground
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontSmall
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -191,7 +192,7 @@ PopupWindow {
|
||||
id: audioPage
|
||||
|
||||
Column {
|
||||
width: 288
|
||||
width: Theme.popupContentWidth
|
||||
spacing: 12
|
||||
|
||||
PopupHeader {
|
||||
@@ -235,7 +236,7 @@ PopupWindow {
|
||||
id: networkPage
|
||||
|
||||
Column {
|
||||
width: 288
|
||||
width: Theme.popupContentWidth
|
||||
spacing: 10
|
||||
|
||||
PopupHeader {
|
||||
@@ -245,9 +246,9 @@ PopupWindow {
|
||||
|
||||
Text {
|
||||
text: "Connected to " + root.hardware.connection
|
||||
color: "#ffffff"
|
||||
font.family: "SF Pro Display, Helvetica, Arial, sans-serif"
|
||||
font.pixelSize: 15
|
||||
color: Theme.foreground
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontBody
|
||||
}
|
||||
|
||||
Column {
|
||||
@@ -263,7 +264,7 @@ PopupWindow {
|
||||
width: networks.width
|
||||
height: 29
|
||||
radius: 0
|
||||
color: modelData.active ? "#0288d1" : "#80000000"
|
||||
color: modelData.active ? Theme.primary : Theme.background
|
||||
|
||||
Rectangle {
|
||||
anchors {
|
||||
@@ -271,9 +272,9 @@ PopupWindow {
|
||||
right: parent.right
|
||||
bottom: parent.bottom
|
||||
}
|
||||
height: 3
|
||||
height: Theme.activeLineWidth
|
||||
visible: parent.modelData.active
|
||||
color: "#b3e5fc"
|
||||
color: Theme.accent
|
||||
}
|
||||
|
||||
Text {
|
||||
@@ -285,9 +286,9 @@ PopupWindow {
|
||||
width: parent.width - 70
|
||||
elide: Text.ElideRight
|
||||
text: modelData.ssid
|
||||
color: "#ffffff"
|
||||
font.family: "SF Pro Display, Helvetica, Arial, sans-serif"
|
||||
font.pixelSize: 14
|
||||
color: Theme.foreground
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontSmall
|
||||
}
|
||||
|
||||
Text {
|
||||
@@ -297,9 +298,9 @@ PopupWindow {
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
text: modelData.signal + "%"
|
||||
color: "#ffffff"
|
||||
font.family: "SF Pro Display, Helvetica, Arial, sans-serif"
|
||||
font.pixelSize: 13
|
||||
color: Theme.foreground
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontCaption
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -309,14 +310,14 @@ PopupWindow {
|
||||
width: parent.width
|
||||
height: 30
|
||||
radius: 0
|
||||
color: "#0288d1"
|
||||
color: Theme.primary
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
text: "Open network settings"
|
||||
color: "#ffffff"
|
||||
font.family: "SF Pro Display, Helvetica, Arial, sans-serif"
|
||||
font.pixelSize: 13
|
||||
color: Theme.foreground
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontCaption
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
@@ -332,7 +333,7 @@ PopupWindow {
|
||||
id: batteryPage
|
||||
|
||||
Column {
|
||||
width: 288
|
||||
width: Theme.popupContentWidth
|
||||
spacing: 12
|
||||
|
||||
PopupHeader {
|
||||
@@ -343,22 +344,22 @@ PopupWindow {
|
||||
Text {
|
||||
text: Math.round(root.battery.percentage * 100) + "% "
|
||||
+ root.batteryState()
|
||||
color: "#ffffff"
|
||||
font.family: "SF Pro Display, Helvetica, Arial, sans-serif"
|
||||
font.pixelSize: 25
|
||||
color: Theme.foreground
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontDisplay
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
width: parent.width
|
||||
height: 8
|
||||
radius: 0
|
||||
color: "#40000000"
|
||||
color: Theme.track
|
||||
|
||||
Rectangle {
|
||||
width: parent.width * root.battery.percentage
|
||||
height: parent.height
|
||||
radius: 0
|
||||
color: root.battery.percentage <= 0.15 ? "#e91e63" : "#0288d1"
|
||||
color: root.battery.percentage <= 0.15 ? Theme.urgent : Theme.primary
|
||||
}
|
||||
}
|
||||
|
||||
@@ -366,9 +367,9 @@ PopupWindow {
|
||||
text: UPower.onBattery
|
||||
? "Remaining: " + root.duration(root.battery.timeToEmpty)
|
||||
: "Until full: " + root.duration(root.battery.timeToFull)
|
||||
color: "#b3e5fc"
|
||||
font.family: "SF Pro Display, Helvetica, Arial, sans-serif"
|
||||
font.pixelSize: 15
|
||||
color: Theme.accent
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontBody
|
||||
}
|
||||
|
||||
Text {
|
||||
@@ -376,9 +377,9 @@ PopupWindow {
|
||||
+ (root.battery.healthSupported
|
||||
? " Health: " + Math.round(root.battery.healthPercentage * 100) + "%"
|
||||
: "")
|
||||
color: "#ffffff"
|
||||
font.family: "SF Pro Display, Helvetica, Arial, sans-serif"
|
||||
font.pixelSize: 14
|
||||
color: Theme.foreground
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontSmall
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -8,7 +8,7 @@ Block {
|
||||
property bool connected: service.connection !== "Disconnected"
|
||||
signal detailsRequested(var anchorItem)
|
||||
|
||||
blockColor: connected ? "#2980b9" : "#e91e63"
|
||||
blockColor: connected ? Theme.secondary : Theme.urgent
|
||||
interactive: true
|
||||
text: connected ? "\uf1eb " + service.connection : "Disconnected !"
|
||||
onClicked: mouse => {
|
||||
|
||||
@@ -5,19 +5,19 @@ Rectangle {
|
||||
|
||||
property string text: ""
|
||||
|
||||
implicitHeight: 32
|
||||
color: "#0288d1"
|
||||
implicitHeight: Theme.blockHeight
|
||||
color: Theme.primary
|
||||
|
||||
Text {
|
||||
anchors {
|
||||
left: parent.left
|
||||
leftMargin: 10
|
||||
leftMargin: Theme.contentPadding
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
text: root.text
|
||||
color: "#ffffff"
|
||||
font.family: "SF Pro Display, Helvetica, Arial, sans-serif"
|
||||
font.pixelSize: 18
|
||||
color: Theme.foreground
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontSize
|
||||
font.bold: true
|
||||
}
|
||||
}
|
||||
|
||||
@@ -15,9 +15,9 @@ Item {
|
||||
Text {
|
||||
anchors.left: parent.left
|
||||
text: root.label
|
||||
color: "#ffffff"
|
||||
font.family: "SF Pro Display, Helvetica, Arial, sans-serif"
|
||||
font.pixelSize: 15
|
||||
color: Theme.foreground
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontBody
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
@@ -28,13 +28,13 @@ Item {
|
||||
width: 58
|
||||
height: 24
|
||||
radius: 0
|
||||
color: root.muted ? "#e91e63" : "#0288d1"
|
||||
color: root.muted ? Theme.urgent : Theme.primary
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
text: root.muted ? "MUTED" : Math.round(root.value * 100) + "%"
|
||||
color: "#ffffff"
|
||||
font.pixelSize: 11
|
||||
color: Theme.foreground
|
||||
font.pixelSize: Theme.fontTiny
|
||||
font.bold: true
|
||||
}
|
||||
|
||||
@@ -54,13 +54,13 @@ Item {
|
||||
}
|
||||
height: 8
|
||||
radius: 0
|
||||
color: "#40000000"
|
||||
color: Theme.track
|
||||
|
||||
Rectangle {
|
||||
width: Math.min(parent.width, parent.width * root.value / 1.5)
|
||||
height: parent.height
|
||||
radius: 0
|
||||
color: root.muted ? "#e91e63" : "#0288d1"
|
||||
color: root.muted ? Theme.urgent : Theme.primary
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
|
||||
@@ -0,0 +1,36 @@
|
||||
pragma Singleton
|
||||
|
||||
import QtQuick
|
||||
import Quickshell
|
||||
|
||||
Singleton {
|
||||
readonly property color background: "#80000000"
|
||||
readonly property color popupBackground: "#e0000000"
|
||||
readonly property color primary: "#0288d1"
|
||||
readonly property color secondary: "#2980b9"
|
||||
readonly property color accent: "#b3e5fc"
|
||||
readonly property color urgent: "#e91e63"
|
||||
readonly property color foreground: "#ffffff"
|
||||
readonly property color foregroundDark: "#000000"
|
||||
readonly property color muted: "#7aa6da"
|
||||
readonly property color track: "#40000000"
|
||||
|
||||
readonly property string fontFamily: "SF Pro Display, Helvetica, Arial, sans-serif"
|
||||
readonly property string iconFontFamily: "SF Pro Display, Font Awesome 6 Free"
|
||||
|
||||
readonly property int barHeight: 38
|
||||
readonly property int blockHeight: 32
|
||||
readonly property int fontSize: 18
|
||||
readonly property int fontTiny: 11
|
||||
readonly property int fontCaption: 13
|
||||
readonly property int fontSmall: 14
|
||||
readonly property int fontBody: 15
|
||||
readonly property int fontDisplay: 25
|
||||
readonly property int fontClock: 30
|
||||
readonly property int moduleSpacing: 8
|
||||
readonly property int contentPadding: 10
|
||||
readonly property int activeLineWidth: 3
|
||||
readonly property int popupWidth: 320
|
||||
readonly property int popupPadding: 12
|
||||
readonly property int popupContentWidth: popupWidth - popupPadding * 2
|
||||
}
|
||||
Reference in New Issue
Block a user