summaryrefslogtreecommitdiff
path: root/modules/lock
diff options
context:
space:
mode:
Diffstat (limited to 'modules/lock')
-rw-r--r--modules/lock/Content.qml2
-rw-r--r--modules/lock/Fetch.qml75
-rw-r--r--modules/lock/WeatherInfo.qml116
3 files changed, 124 insertions, 69 deletions
diff --git a/modules/lock/Content.qml b/modules/lock/Content.qml
index 3ee9dd8..7348b10 100644
--- a/modules/lock/Content.qml
+++ b/modules/lock/Content.qml
@@ -30,6 +30,8 @@ RowLayout {
WeatherInfo {
id: weather
+
+ rootHeight: root.height
}
}
diff --git a/modules/lock/Fetch.qml b/modules/lock/Fetch.qml
index afa6950..fd954b1 100644
--- a/modules/lock/Fetch.qml
+++ b/modules/lock/Fetch.qml
@@ -1,3 +1,5 @@
+pragma ComponentBehavior: Bound
+
import qs.components
import qs.services
import qs.config
@@ -13,9 +15,11 @@ ColumnLayout {
anchors.fill: parent
anchors.margins: Appearance.padding.large * 2
- spacing: Appearance.spacing.large * 2
+ spacing: Appearance.spacing.small
RowLayout {
+ Layout.fillWidth: true
+ Layout.fillHeight: false
spacing: Appearance.spacing.normal
StyledRect {
@@ -30,29 +34,56 @@ ColumnLayout {
anchors.centerIn: parent
text: ">"
+ font.pointSize: root.width > 400 ? Appearance.font.size.larger : Appearance.font.size.normal
color: Colours.palette.m3onPrimary
}
}
MonoText {
+ Layout.fillWidth: true
text: "caelestiafetch.sh"
+ font.pointSize: root.width > 400 ? Appearance.font.size.larger : Appearance.font.size.normal
+ elide: Text.ElideRight
+ }
+
+ Loader {
+ Layout.fillHeight: true
+ asynchronous: true
+ active: !iconLoader.active
+ visible: active
+
+ sourceComponent: IconImage {
+ source: Quickshell.iconPath(SysInfo.logo)
+ implicitSize: height
+ }
}
}
RowLayout {
Layout.fillWidth: true
- Layout.fillHeight: true
- spacing: Appearance.spacing.large * 2
+ Layout.fillHeight: false
+ spacing: height * 0.15
+
+ Loader {
+ id: iconLoader
- IconImage {
Layout.fillHeight: true
- source: Quickshell.iconPath(SysInfo.logo)
- implicitSize: height
+
+ asynchronous: true
+ active: root.width > 320
+ visible: active
+
+ sourceComponent: IconImage {
+ source: Quickshell.iconPath(SysInfo.logo)
+ implicitSize: height
+ }
}
ColumnLayout {
Layout.fillWidth: true
- Layout.fillHeight: true
+ Layout.topMargin: Appearance.padding.normal
+ Layout.bottomMargin: Appearance.padding.normal
+ Layout.leftMargin: iconLoader.active ? 0 : width * 0.1
spacing: Appearance.spacing.normal
FetchText {
@@ -73,26 +104,34 @@ ColumnLayout {
}
}
- RowLayout {
+ Loader {
Layout.alignment: Qt.AlignHCenter
- spacing: Appearance.spacing.large
- Repeater {
- model: 8
+ asynchronous: true
+ active: root.height > 250
+ visible: active
+
+ sourceComponent: RowLayout {
+ spacing: Appearance.spacing.large
- StyledRect {
- required property int index
+ Repeater {
+ model: Math.min(8, root.width / (Appearance.font.size.larger * 2 + Appearance.spacing.large))
- implicitWidth: implicitHeight
- implicitHeight: Appearance.font.size.larger * 2
- color: Colours.palette[`term${index}`]
- radius: Appearance.rounding.small
+ StyledRect {
+ required property int index
+
+ implicitWidth: implicitHeight
+ implicitHeight: Appearance.font.size.larger * 2
+ color: Colours.palette[`term${index}`]
+ radius: Appearance.rounding.small
+ }
}
}
}
component FetchText: MonoText {
- font.pointSize: Appearance.font.size.larger
+ Layout.fillWidth: true
+ font.pointSize: root.width > 400 ? Appearance.font.size.larger : Appearance.font.size.normal
elide: Text.ElideRight
}
diff --git a/modules/lock/WeatherInfo.qml b/modules/lock/WeatherInfo.qml
index 5d10e7b..3695061 100644
--- a/modules/lock/WeatherInfo.qml
+++ b/modules/lock/WeatherInfo.qml
@@ -1,3 +1,5 @@
+pragma ComponentBehavior: Bound
+
import qs.components
import qs.services
import qs.config
@@ -8,6 +10,8 @@ import QtQuick.Layouts
ColumnLayout {
id: root
+ required property int rootHeight
+
anchors.left: parent.left
anchors.right: parent.right
anchors.margins: Appearance.padding.large * 2
@@ -24,6 +28,7 @@ ColumnLayout {
}
RowLayout {
+ Layout.bottomMargin: forecastLoader.active ? 0 : Appearance.padding.large
Layout.fillWidth: true
spacing: Appearance.spacing.large
@@ -94,74 +99,83 @@ ColumnLayout {
}
}
- RowLayout {
+ Loader {
+ id: forecastLoader
+
Layout.topMargin: Appearance.spacing.smaller
Layout.bottomMargin: Appearance.padding.large * 2
Layout.fillWidth: true
- spacing: Appearance.spacing.large
- Repeater {
- model: {
- const forecast = Weather.forecast;
- let count = root.width < 320 ? 3 : root.width < 400 ? 4 : 5;
- if (!forecast)
- return Array.from({
- length: count
- }, () => null);
+ asynchronous: true
+ active: root.rootHeight > 820
+ visible: active
- const hours = [];
- const hour = new Date().getHours();
+ sourceComponent: RowLayout {
+ spacing: Appearance.spacing.large
- const today = forecast[0].hourly;
- const arr = [...today, ...forecast[1].hourly];
- for (let i = 0; i < arr.length; i++) {
- const time = parseInt(arr[i].time, 10) / 100;
+ Repeater {
+ model: {
+ const forecast = Weather.forecast;
+ let count = root.width < 320 ? 3 : root.width < 400 ? 4 : 5;
+ if (!forecast)
+ return Array.from({
+ length: count
+ }, () => null);
- if (i > today.length ? time < hour : time > hour) {
- hours.push(arr[i]);
- count--;
- }
+ const hours = [];
+ const hour = new Date().getHours();
- if (count === 0)
- break;
- }
+ const today = forecast[0].hourly;
+ const arr = [...today, ...forecast[1].hourly];
+ for (let i = 0; i < arr.length; i++) {
+ const time = parseInt(arr[i].time, 10) / 100;
- return hours;
- }
+ if (i > today.length ? time < hour : time > hour) {
+ hours.push(arr[i]);
+ count--;
+ }
- ColumnLayout {
- id: forecastHour
+ if (count === 0)
+ break;
+ }
- required property var modelData
+ return hours;
+ }
- Layout.fillWidth: true
- spacing: Appearance.spacing.small
+ ColumnLayout {
+ id: forecastHour
+
+ required property var modelData
- StyledText {
Layout.fillWidth: true
- text: {
- if (!forecastHour.modelData)
- return "00 AM";
- const hour = parseInt(forecastHour.modelData.time, 10) / 100;
- return hour > 12 ? `${(hour - 12).toString().padStart(2, "0")} PM` : `${hour.toString().padStart(2, "0")} AM`;
+ spacing: Appearance.spacing.small
+
+ StyledText {
+ Layout.fillWidth: true
+ text: {
+ if (!forecastHour.modelData)
+ return "00 AM";
+ const hour = parseInt(forecastHour.modelData.time, 10) / 100;
+ return hour > 12 ? `${(hour - 12).toString().padStart(2, "0")} PM` : `${hour.toString().padStart(2, "0")} AM`;
+ }
+ color: Colours.palette.m3outline
+ horizontalAlignment: Text.AlignHCenter
+ font.pointSize: Appearance.font.size.larger
}
- color: Colours.palette.m3outline
- horizontalAlignment: Text.AlignHCenter
- font.pointSize: Appearance.font.size.larger
- }
- MaterialIcon {
- Layout.alignment: Qt.AlignHCenter
- text: forecastHour.modelData ? Icons.getWeatherIcon(forecastHour.modelData.weatherCode) : "cloud_alert"
- font.pointSize: Appearance.font.size.extraLarge * 1.5
- font.weight: 500
- }
+ MaterialIcon {
+ Layout.alignment: Qt.AlignHCenter
+ text: forecastHour.modelData ? Icons.getWeatherIcon(forecastHour.modelData.weatherCode) : "cloud_alert"
+ font.pointSize: Appearance.font.size.extraLarge * 1.5
+ font.weight: 500
+ }
- StyledText {
- Layout.alignment: Qt.AlignHCenter
- text: Config.services.useFahrenheit ? `${forecastHour.modelData?.tempF ?? 0}°F` : `${forecastHour.modelData?.tempC ?? 0}°C`
- color: Colours.palette.m3secondary
- font.pointSize: Appearance.font.size.larger
+ StyledText {
+ Layout.alignment: Qt.AlignHCenter
+ text: Config.services.useFahrenheit ? `${forecastHour.modelData?.tempF ?? 0}°F` : `${forecastHour.modelData?.tempC ?? 0}°C`
+ color: Colours.palette.m3secondary
+ font.pointSize: Appearance.font.size.larger
+ }
}
}
}