Fix weather symbol after load, fix Power Menu centering
This commit is contained in:
parent
d275efae04
commit
a22d7d75cc
2 changed files with 379 additions and 302 deletions
|
|
@ -44,8 +44,10 @@ Rectangle {
|
||||||
uptimeProcess.running = true;
|
uptimeProcess.running = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
width: 440 * Theme.scale(Screen)
|
||||||
|
height: 80 * Theme.scale(Screen)
|
||||||
color: "transparent"
|
color: "transparent"
|
||||||
// anchors.horizontalCenterOffset: -2
|
anchors.horizontalCenterOffset: -2
|
||||||
onPanelVisibleChanged: {
|
onPanelVisibleChanged: {
|
||||||
if (panelVisible)
|
if (panelVisible)
|
||||||
updateSystemInfo();
|
updateSystemInfo();
|
||||||
|
|
@ -60,29 +62,29 @@ Rectangle {
|
||||||
|
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
color: Theme.surface
|
color: Theme.surface
|
||||||
radius: 18
|
radius: 18 * Theme.scale(Screen)
|
||||||
|
|
||||||
ColumnLayout {
|
ColumnLayout {
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
anchors.margins: 18 * Theme.scale(screen)
|
anchors.margins: 18 * Theme.scale(Screen)
|
||||||
spacing: 12 * Theme.scale(screen)
|
spacing: 12 * Theme.scale(Screen)
|
||||||
|
|
||||||
RowLayout {
|
RowLayout {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
spacing: 12 * Theme.scale(screen)
|
spacing: 12 * Theme.scale(Screen)
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
width: 48 * Theme.scale(screen)
|
width: 48 * Theme.scale(Screen)
|
||||||
height: 48 * Theme.scale(screen)
|
height: 48 * Theme.scale(Screen)
|
||||||
radius: 24
|
radius: 24 * Theme.scale(Screen)
|
||||||
color: Theme.accentPrimary
|
color: Theme.accentPrimary
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
color: "transparent"
|
color: "transparent"
|
||||||
radius: 24
|
radius: 24 * Theme.scale(Screen)
|
||||||
border.color: Theme.accentPrimary
|
border.color: Theme.accentPrimary
|
||||||
border.width: 2 * Theme.scale(screen)
|
border.width: 2 * Theme.scale(Screen)
|
||||||
z: 2
|
z: 2
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -92,13 +94,13 @@ Rectangle {
|
||||||
}
|
}
|
||||||
|
|
||||||
ColumnLayout {
|
ColumnLayout {
|
||||||
spacing: 4 * Theme.scale(screen)
|
spacing: 4 * Theme.scale(Screen)
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
text: Quickshell.env("USER")
|
text: Quickshell.env("USER")
|
||||||
font.family: Theme.fontFamily
|
font.family: Theme.fontFamily
|
||||||
font.pixelSize: 16 * Theme.scale(screen)
|
font.pixelSize: 16 * Theme.scale(Screen)
|
||||||
font.bold: true
|
font.bold: true
|
||||||
color: Theme.textPrimary
|
color: Theme.textPrimary
|
||||||
}
|
}
|
||||||
|
|
@ -106,7 +108,7 @@ Rectangle {
|
||||||
Text {
|
Text {
|
||||||
text: "System Uptime: " + uptimeText
|
text: "System Uptime: " + uptimeText
|
||||||
font.family: Theme.fontFamily
|
font.family: Theme.fontFamily
|
||||||
font.pixelSize: 12 * Theme.scale(screen)
|
font.pixelSize: 12 * Theme.scale(Screen)
|
||||||
color: Theme.textSecondary
|
color: Theme.textSecondary
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -119,23 +121,21 @@ Rectangle {
|
||||||
Rectangle {
|
Rectangle {
|
||||||
id: settingsButton
|
id: settingsButton
|
||||||
|
|
||||||
width: 32 * Theme.scale(screen)
|
width: 32 * Theme.scale(Screen)
|
||||||
height: 32 * Theme.scale(screen)
|
height: 32 * Theme.scale(Screen)
|
||||||
radius: 16
|
radius: 16 * Theme.scale(Screen)
|
||||||
color: settingsButtonArea.containsMouse || settingsButtonArea.pressed ? Theme.accentPrimary : "transparent"
|
color: settingsButtonArea.containsMouse || settingsButtonArea.pressed ? Theme.accentPrimary : "transparent"
|
||||||
border.color: Theme.accentPrimary
|
border.color: Theme.accentPrimary
|
||||||
border.width: 1 * Theme.scale(screen)
|
border.width: 1 * Theme.scale(Screen)
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
anchors.centerIn: parent
|
anchors.fill: parent
|
||||||
anchors.horizontalCenterOffset: -0.5 * Theme.scale(screen)
|
|
||||||
text: "settings"
|
text: "settings"
|
||||||
font.family: "Material Symbols Outlined"
|
font.family: "Material Symbols Outlined"
|
||||||
font.pixelSize: 16 * Theme.scale(screen)
|
font.pixelSize: 16 * Theme.scale(Screen)
|
||||||
color: settingsButtonArea.containsMouse || settingsButtonArea.pressed ? Theme.backgroundPrimary : Theme.accentPrimary
|
color: settingsButtonArea.containsMouse || settingsButtonArea.pressed ? Theme.backgroundPrimary : Theme.accentPrimary
|
||||||
font.variableAxes: {
|
horizontalAlignment: Text.AlignHCenter
|
||||||
"wght": (Font.Normal + Font.Bold) / 2
|
verticalAlignment: Text.AlignVCenter
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
MouseArea {
|
MouseArea {
|
||||||
|
|
@ -164,23 +164,21 @@ Rectangle {
|
||||||
Rectangle {
|
Rectangle {
|
||||||
id: systemButton
|
id: systemButton
|
||||||
|
|
||||||
width: 32 * Theme.scale(screen)
|
width: 32 * Theme.scale(Screen)
|
||||||
height: 32 * Theme.scale(screen)
|
height: 32 * Theme.scale(Screen)
|
||||||
radius: 16
|
radius: width / 2
|
||||||
color: systemButtonArea.containsMouse || systemButtonArea.pressed ? Theme.accentPrimary : "transparent"
|
color: systemButtonArea.containsMouse || systemButtonArea.pressed ? Theme.accentPrimary : "transparent"
|
||||||
border.color: Theme.accentPrimary
|
border.color: Theme.accentPrimary
|
||||||
border.width: 1 * Theme.scale(screen)
|
border.width: 1 * Theme.scale(Screen)
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
anchors.centerIn: parent
|
anchors.fill: parent
|
||||||
anchors.horizontalCenterOffset: -0.5 * Theme.scale(screen)
|
|
||||||
text: "power_settings_new"
|
text: "power_settings_new"
|
||||||
font.family: "Material Symbols Outlined"
|
font.family: "Material Symbols Outlined"
|
||||||
font.pixelSize: 16 * Theme.scale(screen)
|
font.pixelSize: 16 * Theme.scale(Screen)
|
||||||
color: systemButtonArea.containsMouse || systemButtonArea.pressed ? Theme.backgroundPrimary : Theme.accentPrimary
|
color: systemButtonArea.containsMouse || systemButtonArea.pressed ? Theme.backgroundPrimary : Theme.accentPrimary
|
||||||
font.variableAxes: {
|
horizontalAlignment: Text.AlignHCenter
|
||||||
"wght": (Font.Normal + Font.Bold) / 2
|
verticalAlignment: Text.AlignVCenter
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
MouseArea {
|
MouseArea {
|
||||||
|
|
@ -217,18 +215,18 @@ Rectangle {
|
||||||
anchors.right: systemButton.right
|
anchors.right: systemButton.right
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
width: 160 * Theme.scale(screen)
|
width: 160 * Theme.scale(Screen)
|
||||||
height: 220 * Theme.scale(screen)
|
height: 220 * Theme.scale(Screen)
|
||||||
color: Theme.surface
|
color: Theme.surface
|
||||||
radius: 8
|
radius: 8 * Theme.scale(Screen)
|
||||||
border.color: Theme.outline
|
border.color: Theme.outline
|
||||||
border.width: 1 * Theme.scale(screen)
|
border.width: 1 * Theme.scale(Screen)
|
||||||
visible: true
|
visible: true
|
||||||
z: 9999
|
z: 9999
|
||||||
anchors.top: parent.top
|
anchors.top: parent.top
|
||||||
anchors.right: parent.right
|
anchors.right: parent.right
|
||||||
anchors.rightMargin: 32 * Theme.scale(screen)
|
anchors.rightMargin: 32 * Theme.scale(Screen)
|
||||||
anchors.topMargin: systemButton.y + systemButton.height + 48 * Theme.scale(screen)
|
anchors.topMargin: systemButton.y + systemButton.height + 48 * Theme.scale(Screen)
|
||||||
|
|
||||||
// Prevent closing when clicking in the panel bg
|
// Prevent closing when clicking in the panel bg
|
||||||
MouseArea {
|
MouseArea {
|
||||||
|
|
@ -237,35 +235,49 @@ Rectangle {
|
||||||
|
|
||||||
ColumnLayout {
|
ColumnLayout {
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
anchors.margins: 8 * Theme.scale(screen)
|
anchors.margins: 8 * Theme.scale(Screen)
|
||||||
spacing: 4 * Theme.scale(screen)
|
spacing: 4 * Theme.scale(Screen)
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.preferredHeight: 36 * Theme.scale(screen)
|
Layout.preferredHeight: 36 * Theme.scale(Screen)
|
||||||
radius: 6
|
radius: 6 * Theme.scale(Screen)
|
||||||
color: lockButtonArea.containsMouse ? Theme.accentPrimary : "transparent"
|
color: lockButtonArea.containsMouse ? Theme.accentPrimary : "transparent"
|
||||||
|
|
||||||
RowLayout {
|
Item {
|
||||||
anchors.fill: parent
|
anchors.left: parent.left
|
||||||
anchors.margins: 12 * Theme.scale(screen)
|
anchors.right: parent.right
|
||||||
spacing: 8 * Theme.scale(screen)
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.leftMargin: 12 * Theme.scale(Screen)
|
||||||
|
anchors.rightMargin: 12 * Theme.scale(Screen)
|
||||||
|
|
||||||
|
Row {
|
||||||
|
id: lockRow
|
||||||
|
spacing: 8 * Theme.scale(Screen)
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
text: "lock_outline"
|
text: "lock_outline"
|
||||||
font.family: "Material Symbols Outlined"
|
font.family: "Material Symbols Outlined"
|
||||||
font.pixelSize: 16 * Theme.scale(screen)
|
font.pixelSize: 16 * Theme.scale(Screen)
|
||||||
color: lockButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
color: lockButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
||||||
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.verticalCenterOffset: 1 * Theme.scale(Screen)
|
||||||
}
|
}
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
text: "Lock Screen"
|
text: "Lock Screen"
|
||||||
font.family: Theme.fontFamily
|
font.family: Theme.fontFamily
|
||||||
font.pixelSize: 14 * Theme.scale(screen)
|
font.pixelSize: 14 * Theme.scale(Screen)
|
||||||
color: lockButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
color: lockButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
||||||
Layout.fillWidth: true
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.verticalCenterOffset: 1 * Theme.scale(Screen)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
MouseArea {
|
MouseArea {
|
||||||
|
|
@ -284,29 +296,43 @@ Rectangle {
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.preferredHeight: 36 * Theme.scale(screen)
|
Layout.preferredHeight: 36 * Theme.scale(Screen)
|
||||||
radius: 6
|
radius: 6 * Theme.scale(Screen)
|
||||||
color: suspendButtonArea.containsMouse ? Theme.accentPrimary : "transparent"
|
color: suspendButtonArea.containsMouse ? Theme.accentPrimary : "transparent"
|
||||||
|
|
||||||
RowLayout {
|
Item {
|
||||||
anchors.fill: parent
|
anchors.left: parent.left
|
||||||
anchors.margins: 12 * Theme.scale(screen)
|
anchors.right: parent.right
|
||||||
spacing: 8 * Theme.scale(screen)
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.leftMargin: 12 * Theme.scale(Screen)
|
||||||
|
anchors.rightMargin: 12 * Theme.scale(Screen)
|
||||||
|
|
||||||
|
Row {
|
||||||
|
id: suspendRow
|
||||||
|
spacing: 8 * Theme.scale(Screen)
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
text: "bedtime"
|
text: "bedtime"
|
||||||
font.family: "Material Symbols Outlined"
|
font.family: "Material Symbols Outlined"
|
||||||
font.pixelSize: 16 * Theme.scale(screen)
|
font.pixelSize: 16 * Theme.scale(Screen)
|
||||||
color: suspendButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
color: suspendButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
||||||
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.verticalCenterOffset: 1 * Theme.scale(Screen)
|
||||||
}
|
}
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
text: "Suspend"
|
text: "Suspend"
|
||||||
font.pixelSize: 14 * Theme.scale(screen)
|
font.pixelSize: 14 * Theme.scale(Screen)
|
||||||
color: suspendButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
color: suspendButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
||||||
Layout.fillWidth: true
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.verticalCenterOffset: 1 * Theme.scale(Screen)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
MouseArea {
|
MouseArea {
|
||||||
|
|
@ -325,30 +351,44 @@ Rectangle {
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.preferredHeight: 36 * Theme.scale(screen)
|
Layout.preferredHeight: 36 * Theme.scale(Screen)
|
||||||
radius: 6
|
radius: 6 * Theme.scale(Screen)
|
||||||
color: rebootButtonArea.containsMouse ? Theme.accentPrimary : "transparent"
|
color: rebootButtonArea.containsMouse ? Theme.accentPrimary : "transparent"
|
||||||
|
|
||||||
RowLayout {
|
Item {
|
||||||
anchors.fill: parent
|
anchors.left: parent.left
|
||||||
anchors.margins: 12 * Theme.scale(screen)
|
anchors.right: parent.right
|
||||||
spacing: 8 * Theme.scale(screen)
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.leftMargin: 12 * Theme.scale(Screen)
|
||||||
|
anchors.rightMargin: 12 * Theme.scale(Screen)
|
||||||
|
|
||||||
|
Row {
|
||||||
|
id: rebootRow
|
||||||
|
spacing: 8 * Theme.scale(Screen)
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
text: "refresh"
|
text: "refresh"
|
||||||
font.family: "Material Symbols Outlined"
|
font.family: "Material Symbols Outlined"
|
||||||
font.pixelSize: 16 * Theme.scale(screen)
|
font.pixelSize: 16 * Theme.scale(Screen)
|
||||||
color: rebootButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
color: rebootButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
||||||
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.verticalCenterOffset: 1 * Theme.scale(Screen)
|
||||||
}
|
}
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
text: "Reboot"
|
text: "Reboot"
|
||||||
font.family: Theme.fontFamily
|
font.family: Theme.fontFamily
|
||||||
font.pixelSize: 14 * Theme.scale(screen)
|
font.pixelSize: 14 * Theme.scale(Screen)
|
||||||
color: rebootButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
color: rebootButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
||||||
Layout.fillWidth: true
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.verticalCenterOffset: 1 * Theme.scale(Screen)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
MouseArea {
|
MouseArea {
|
||||||
|
|
@ -367,29 +407,43 @@ Rectangle {
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.preferredHeight: 36 * Theme.scale(screen)
|
Layout.preferredHeight: 36 * Theme.scale(Screen)
|
||||||
radius: 6
|
radius: 6 * Theme.scale(Screen)
|
||||||
color: logoutButtonArea.containsMouse ? Theme.accentPrimary : "transparent"
|
color: logoutButtonArea.containsMouse ? Theme.accentPrimary : "transparent"
|
||||||
|
|
||||||
RowLayout {
|
Item {
|
||||||
anchors.fill: parent
|
anchors.left: parent.left
|
||||||
anchors.margins: 12 * Theme.scale(screen)
|
anchors.right: parent.right
|
||||||
spacing: 8 * Theme.scale(screen)
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.leftMargin: 12 * Theme.scale(Screen)
|
||||||
|
anchors.rightMargin: 12 * Theme.scale(Screen)
|
||||||
|
|
||||||
|
Row {
|
||||||
|
id: logoutRow
|
||||||
|
spacing: 8 * Theme.scale(Screen)
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
text: "exit_to_app"
|
text: "exit_to_app"
|
||||||
font.family: "Material Symbols Outlined"
|
font.family: "Material Symbols Outlined"
|
||||||
font.pixelSize: 16 * Theme.scale(screen)
|
font.pixelSize: 16 * Theme.scale(Screen)
|
||||||
color: logoutButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
color: logoutButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
||||||
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.verticalCenterOffset: 1 * Theme.scale(Screen)
|
||||||
}
|
}
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
text: "Logout"
|
text: "Logout"
|
||||||
font.pixelSize: 14 * Theme.scale(screen)
|
font.pixelSize: 14 * Theme.scale(Screen)
|
||||||
color: logoutButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
color: logoutButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
||||||
Layout.fillWidth: true
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.verticalCenterOffset: 1 * Theme.scale(Screen)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
MouseArea {
|
MouseArea {
|
||||||
|
|
@ -408,29 +462,43 @@ Rectangle {
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.preferredHeight: 36 * Theme.scale(screen)
|
Layout.preferredHeight: 36 * Theme.scale(Screen)
|
||||||
radius: 6
|
radius: 6 * Theme.scale(Screen)
|
||||||
color: shutdownButtonArea.containsMouse ? Theme.accentPrimary : "transparent"
|
color: shutdownButtonArea.containsMouse ? Theme.accentPrimary : "transparent"
|
||||||
|
|
||||||
RowLayout {
|
Item {
|
||||||
anchors.fill: parent
|
anchors.left: parent.left
|
||||||
anchors.margins: 12 * Theme.scale(screen)
|
anchors.right: parent.right
|
||||||
spacing: 8 * Theme.scale(screen)
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.leftMargin: 12 * Theme.scale(Screen)
|
||||||
|
anchors.rightMargin: 12 * Theme.scale(Screen)
|
||||||
|
|
||||||
|
Row {
|
||||||
|
id: shutdownRow
|
||||||
|
spacing: 8 * Theme.scale(Screen)
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
text: "power_settings_new"
|
text: "power_settings_new"
|
||||||
font.family: "Material Symbols Outlined"
|
font.family: "Material Symbols Outlined"
|
||||||
font.pixelSize: 16 * Theme.scale(screen)
|
font.pixelSize: 16 * Theme.scale(Screen)
|
||||||
color: shutdownButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
color: shutdownButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
||||||
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.verticalCenterOffset: 1 * Theme.scale(Screen)
|
||||||
}
|
}
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
text: "Shutdown"
|
text: "Shutdown"
|
||||||
font.pixelSize: 14 * Theme.scale(screen)
|
font.pixelSize: 14 * Theme.scale(Screen)
|
||||||
color: shutdownButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
color: shutdownButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
|
||||||
Layout.fillWidth: true
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.verticalCenterOffset: 1 * Theme.scale(Screen)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
MouseArea {
|
MouseArea {
|
||||||
|
|
@ -517,4 +585,8 @@ Rectangle {
|
||||||
onTriggered: updateSystemInfo()
|
onTriggered: updateSystemInfo()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
LockScreen {
|
||||||
|
id: lockScreen
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
@ -2,11 +2,15 @@ import QtQuick
|
||||||
import QtQuick.Layouts
|
import QtQuick.Layouts
|
||||||
import QtQuick.Controls
|
import QtQuick.Controls
|
||||||
import qs.Settings
|
import qs.Settings
|
||||||
|
import qs.Components
|
||||||
import "../../Helpers/Weather.js" as WeatherHelper
|
import "../../Helpers/Weather.js" as WeatherHelper
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
id: weatherRoot
|
id: weatherRoot
|
||||||
|
width: 440 * Theme.scale(Screen)
|
||||||
|
height: 180 * Theme.scale(Screen)
|
||||||
color: "transparent"
|
color: "transparent"
|
||||||
|
anchors.horizontalCenterOffset: -2
|
||||||
|
|
||||||
property string city: Settings.settings.weatherCity !== undefined ? Settings.settings.weatherCity : ""
|
property string city: Settings.settings.weatherCity !== undefined ? Settings.settings.weatherCity : ""
|
||||||
property var weatherData: null
|
property var weatherData: null
|
||||||
|
|
@ -80,66 +84,67 @@ Rectangle {
|
||||||
id: card
|
id: card
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
color: Theme.surface
|
color: Theme.surface
|
||||||
radius: 18
|
radius: 18 * Theme.scale(Screen)
|
||||||
|
|
||||||
ColumnLayout {
|
ColumnLayout {
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
anchors.margins: 18 * Theme.scale(screen)
|
anchors.margins: 18 * Theme.scale(Screen)
|
||||||
spacing: 12 * Theme.scale(screen)
|
spacing: 12 * Theme.scale(Screen)
|
||||||
|
|
||||||
|
|
||||||
RowLayout {
|
RowLayout {
|
||||||
spacing: 12 * Theme.scale(screen)
|
spacing: 12 * Theme.scale(Screen)
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
|
|
||||||
|
|
||||||
RowLayout {
|
RowLayout {
|
||||||
spacing: 12 * Theme.scale(screen)
|
spacing: 12 * Theme.scale(Screen)
|
||||||
Layout.preferredWidth: 140 * Theme.scale(screen)
|
Layout.preferredWidth: 140 * Theme.scale(Screen)
|
||||||
|
|
||||||
|
|
||||||
|
Spinner {
|
||||||
|
id: loadingSpinner
|
||||||
|
running: isLoading
|
||||||
|
color: Theme.accentPrimary
|
||||||
|
size: 28 * Theme.scale(Screen)
|
||||||
|
Layout.alignment: Qt.AlignVCenter
|
||||||
|
visible: isLoading
|
||||||
|
}
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
id: weatherIcon
|
id: weatherIcon
|
||||||
text: isLoading ? "sync" : (weatherData && weatherData.current_weather ? materialSymbolForCode(weatherData.current_weather.weathercode) : "cloud")
|
visible: !isLoading
|
||||||
|
text: weatherData && weatherData.current_weather ? materialSymbolForCode(weatherData.current_weather.weathercode) : "cloud"
|
||||||
font.family: "Material Symbols Outlined"
|
font.family: "Material Symbols Outlined"
|
||||||
font.pixelSize: 28 * Theme.scale(screen)
|
font.pixelSize: 28 * Theme.scale(Screen)
|
||||||
verticalAlignment: Text.AlignVCenter
|
verticalAlignment: Text.AlignVCenter
|
||||||
color: isLoading ? Theme.accentPrimary : Theme.accentPrimary
|
color: Theme.accentPrimary
|
||||||
Layout.alignment: Qt.AlignVCenter
|
Layout.alignment: Qt.AlignVCenter
|
||||||
|
|
||||||
// Add rotation animation for loading state
|
|
||||||
RotationAnimation on rotation {
|
|
||||||
running: isLoading
|
|
||||||
from: 0
|
|
||||||
to: 360
|
|
||||||
duration: 1000
|
|
||||||
loops: Animation.Infinite
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
ColumnLayout {
|
ColumnLayout {
|
||||||
spacing: 2 * Theme.scale(screen)
|
spacing: 2 * Theme.scale(Screen)
|
||||||
RowLayout {
|
RowLayout {
|
||||||
spacing: 4 * Theme.scale(screen)
|
spacing: 4 * Theme.scale(Screen)
|
||||||
Text {
|
Text {
|
||||||
text: city
|
text: city
|
||||||
font.family: Theme.fontFamily
|
font.family: Theme.fontFamily
|
||||||
font.pixelSize: 14 * Theme.scale(screen)
|
font.pixelSize: 14 * Theme.scale(Screen)
|
||||||
font.bold: true
|
font.bold: true
|
||||||
color: Theme.textPrimary
|
color: Theme.textPrimary
|
||||||
}
|
}
|
||||||
Text {
|
Text {
|
||||||
text: weatherData && weatherData.timezone_abbreviation ? `(${weatherData.timezone_abbreviation})` : ""
|
text: weatherData && weatherData.timezone_abbreviation ? `(${weatherData.timezone_abbreviation})` : ""
|
||||||
font.family: Theme.fontFamily
|
font.family: Theme.fontFamily
|
||||||
font.pixelSize: 10 * Theme.scale(screen)
|
font.pixelSize: 10 * Theme.scale(Screen)
|
||||||
color: Theme.textSecondary
|
color: Theme.textSecondary
|
||||||
leftPadding: 2 * Theme.scale(screen)
|
leftPadding: 2 * Theme.scale(Screen)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Text {
|
Text {
|
||||||
text: weatherData && weatherData.current_weather ? ((Settings.settings.useFahrenheit !== undefined ? Settings.settings.useFahrenheit : false) ? `${Math.round(weatherData.current_weather.temperature * 9/5 + 32)}°F` : `${Math.round(weatherData.current_weather.temperature)}°C`) : ((Settings.settings.useFahrenheit !== undefined ? Settings.settings.useFahrenheit : false) ? "--°F" : "--°C")
|
text: weatherData && weatherData.current_weather ? ((Settings.settings.useFahrenheit !== undefined ? Settings.settings.useFahrenheit : false) ? `${Math.round(weatherData.current_weather.temperature * 9/5 + 32)}°F` : `${Math.round(weatherData.current_weather.temperature)}°C`) : ((Settings.settings.useFahrenheit !== undefined ? Settings.settings.useFahrenheit : false) ? "--°F" : "--°C")
|
||||||
font.family: Theme.fontFamily
|
font.family: Theme.fontFamily
|
||||||
font.pixelSize: 24 * Theme.scale(screen)
|
font.pixelSize: 24 * Theme.scale(Screen)
|
||||||
font.bold: true
|
font.bold: true
|
||||||
color: Theme.textPrimary
|
color: Theme.textPrimary
|
||||||
}
|
}
|
||||||
|
|
@ -154,16 +159,16 @@ Rectangle {
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
width: parent.width
|
width: parent.width
|
||||||
height: 1 // Don't scale divider
|
height: 1 * Theme.scale(Screen)
|
||||||
color: Qt.rgba(Theme.textSecondary.g, Theme.textSecondary.g, Theme.textSecondary.b, 0.12)
|
color: Qt.rgba(Theme.textSecondary.g, Theme.textSecondary.g, Theme.textSecondary.b, 0.12)
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.topMargin: 2 * Theme.scale(screen)
|
Layout.topMargin: 2 * Theme.scale(Screen)
|
||||||
Layout.bottomMargin: 2 * Theme.scale(screen)
|
Layout.bottomMargin: 2 * Theme.scale(Screen)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
RowLayout {
|
RowLayout {
|
||||||
spacing: 12 * Theme.scale(screen)
|
spacing: 12 * Theme.scale(Screen)
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.alignment: Qt.AlignHCenter
|
Layout.alignment: Qt.AlignHCenter
|
||||||
visible: weatherData && weatherData.daily && weatherData.daily.time
|
visible: weatherData && weatherData.daily && weatherData.daily.time
|
||||||
|
|
@ -171,13 +176,13 @@ Rectangle {
|
||||||
Repeater {
|
Repeater {
|
||||||
model: weatherData && weatherData.daily && weatherData.daily.time ? 5 : 0
|
model: weatherData && weatherData.daily && weatherData.daily.time ? 5 : 0
|
||||||
delegate: ColumnLayout {
|
delegate: ColumnLayout {
|
||||||
spacing: 2 * Theme.scale(screen)
|
spacing: 2 * Theme.scale(Screen)
|
||||||
Layout.alignment: Qt.AlignHCenter
|
Layout.alignment: Qt.AlignHCenter
|
||||||
Text {
|
Text {
|
||||||
|
|
||||||
text: Qt.formatDateTime(new Date(weatherData.daily.time[index]), "ddd")
|
text: Qt.formatDateTime(new Date(weatherData.daily.time[index]), "ddd")
|
||||||
font.family: Theme.fontFamily
|
font.family: Theme.fontFamily
|
||||||
font.pixelSize: 12 * Theme.scale(screen)
|
font.pixelSize: 12 * Theme.scale(Screen)
|
||||||
color: Theme.textSecondary
|
color: Theme.textSecondary
|
||||||
horizontalAlignment: Text.AlignHCenter
|
horizontalAlignment: Text.AlignHCenter
|
||||||
Layout.alignment: Qt.AlignHCenter
|
Layout.alignment: Qt.AlignHCenter
|
||||||
|
|
@ -186,7 +191,7 @@ Rectangle {
|
||||||
|
|
||||||
text: materialSymbolForCode(weatherData.daily.weathercode[index])
|
text: materialSymbolForCode(weatherData.daily.weathercode[index])
|
||||||
font.family: "Material Symbols Outlined"
|
font.family: "Material Symbols Outlined"
|
||||||
font.pixelSize: 22 * Theme.scale(screen)
|
font.pixelSize: 22 * Theme.scale(Screen)
|
||||||
color: Theme.accentPrimary
|
color: Theme.accentPrimary
|
||||||
horizontalAlignment: Text.AlignHCenter
|
horizontalAlignment: Text.AlignHCenter
|
||||||
Layout.alignment: Qt.AlignHCenter
|
Layout.alignment: Qt.AlignHCenter
|
||||||
|
|
@ -195,7 +200,7 @@ Rectangle {
|
||||||
|
|
||||||
text: weatherData && weatherData.daily ? ((Settings.settings.useFahrenheit !== undefined ? Settings.settings.useFahrenheit : false) ? `${Math.round(weatherData.daily.temperature_2m_max[index] * 9/5 + 32)}° / ${Math.round(weatherData.daily.temperature_2m_min[index] * 9/5 + 32)}°` : `${Math.round(weatherData.daily.temperature_2m_max[index])}° / ${Math.round(weatherData.daily.temperature_2m_min[index])}°`) : ((Settings.settings.useFahrenheit !== undefined ? Settings.settings.useFahrenheit : false) ? "--° / --°" : "--° / --°")
|
text: weatherData && weatherData.daily ? ((Settings.settings.useFahrenheit !== undefined ? Settings.settings.useFahrenheit : false) ? `${Math.round(weatherData.daily.temperature_2m_max[index] * 9/5 + 32)}° / ${Math.round(weatherData.daily.temperature_2m_min[index] * 9/5 + 32)}°` : `${Math.round(weatherData.daily.temperature_2m_max[index])}° / ${Math.round(weatherData.daily.temperature_2m_min[index])}°`) : ((Settings.settings.useFahrenheit !== undefined ? Settings.settings.useFahrenheit : false) ? "--° / --°" : "--° / --°")
|
||||||
font.family: Theme.fontFamily
|
font.family: Theme.fontFamily
|
||||||
font.pixelSize: 12 * Theme.scale(screen)
|
font.pixelSize: 12 * Theme.scale(Screen)
|
||||||
color: Theme.textPrimary
|
color: Theme.textPrimary
|
||||||
horizontalAlignment: Text.AlignHCenter
|
horizontalAlignment: Text.AlignHCenter
|
||||||
Layout.alignment: Qt.AlignHCenter
|
Layout.alignment: Qt.AlignHCenter
|
||||||
|
|
@ -210,7 +215,7 @@ Rectangle {
|
||||||
color: Theme.error
|
color: Theme.error
|
||||||
visible: errorString !== ""
|
visible: errorString !== ""
|
||||||
font.family: Theme.fontFamily
|
font.family: Theme.fontFamily
|
||||||
font.pixelSize: 10 * Theme.scale(screen)
|
font.pixelSize: 10 * Theme.scale(Screen)
|
||||||
horizontalAlignment: Text.AlignHCenter
|
horizontalAlignment: Text.AlignHCenter
|
||||||
Layout.alignment: Qt.AlignHCenter
|
Layout.alignment: Qt.AlignHCenter
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue