From afb52ec506247c2d538262d5bbfcede6d6a28036 Mon Sep 17 00:00:00 2001 From: 2 * r + 2 * t <61896496+soramanew@users.noreply.github.com> Date: Tue, 2 Jun 2026 21:36:29 +1000 Subject: [PATCH] feat: improve lock fetch Also lock fetch is static height, media fills height instead --- modules/lock/Content.qml | 10 +- modules/lock/Fetch.qml | 202 +++++++++++++++++++-------------------- modules/lock/Media.qml | 4 +- 3 files changed, 107 insertions(+), 109 deletions(-) diff --git a/modules/lock/Content.qml b/modules/lock/Content.qml index 50dd0027..0d47502a 100644 --- a/modules/lock/Content.qml +++ b/modules/lock/Content.qml @@ -20,18 +20,14 @@ RowLayout { rootHeight: root.height } - StyledRect { + Fetch { Layout.fillWidth: true - Layout.fillHeight: true - - radius: Tokens.rounding.medium - color: Colours.tPalette.m3surfaceContainer - - Fetch {} + rootHeight: root.height } Media { Layout.fillWidth: true + Layout.fillHeight: true lock: root.lock } } diff --git a/modules/lock/Fetch.qml b/modules/lock/Fetch.qml index 085dc2c8..36430d45 100644 --- a/modules/lock/Fetch.qml +++ b/modules/lock/Fetch.qml @@ -3,140 +3,146 @@ pragma ComponentBehavior: Bound import QtQuick import QtQuick.Layouts import Quickshell.Services.UPower +import Caelestia import Caelestia.Config import qs.components import qs.components.effects import qs.services import qs.utils -ColumnLayout { +StyledRect { id: root - anchors.fill: parent - anchors.margins: Tokens.padding.extraLargeIncreased - anchors.topMargin: Tokens.padding.large + required property real rootHeight + readonly property int cBoxSize: Tokens.font.body.medium.pointSize * 2 - spacing: Tokens.spacing.small + implicitHeight: layout.implicitHeight + layout.anchors.topMargin + layout.anchors.margins + radius: Tokens.rounding.medium + color: Colours.tPalette.m3surfaceContainer - RowLayout { - Layout.fillWidth: true - Layout.fillHeight: false - spacing: Tokens.spacing.medium + ColumnLayout { + id: layout - StyledRect { - implicitWidth: prompt.implicitWidth + Tokens.padding.medium * 2 - implicitHeight: prompt.implicitHeight + Tokens.padding.medium * 2 + anchors.fill: parent + anchors.margins: Tokens.padding.extraLarge + anchors.topMargin: Tokens.padding.extraLarge + anchors.bottomMargin: Tokens.padding.extraLarge - color: Colours.palette.m3primary - radius: Tokens.rounding.medium + spacing: Tokens.spacing.small - MonoText { - id: prompt - - anchors.centerIn: parent - text: ">" - font: root.width > 400 ? Tokens.font.mono.large : Tokens.font.mono.medium - color: Colours.palette.m3onPrimary - } - } - - MonoText { + RowLayout { Layout.fillWidth: true - text: "caelestiafetch.sh" - font: root.width > 400 ? Tokens.font.mono.large : Tokens.font.mono.medium - elide: Text.ElideRight - } - - WrappedLoader { - Layout.fillHeight: true - active: !iconLoader.active - - sourceComponent: SysInfo.isDefaultLogo ? caelestiaLogo : distroIcon - } - } - - RowLayout { - Layout.fillWidth: true - Layout.fillHeight: false - spacing: height * 0.15 - - WrappedLoader { - id: iconLoader - - Layout.fillHeight: true - active: root.width > 320 - - sourceComponent: SysInfo.isDefaultLogo ? caelestiaLogo : distroIcon - } - - ColumnLayout { - Layout.fillWidth: true - Layout.topMargin: Tokens.padding.medium - Layout.bottomMargin: Tokens.padding.medium - Layout.leftMargin: iconLoader.active ? 0 : width * 0.1 + Layout.fillHeight: false spacing: Tokens.spacing.medium - WrappedLoader { - Layout.fillWidth: true - active: !batLoader.active && root.height > 200 + StyledRect { + implicitWidth: prompt.implicitWidth + Tokens.padding.medium * 2 + implicitHeight: prompt.implicitHeight + Tokens.padding.small * 2 - sourceComponent: FetchText { - text: `OS : ${SysInfo.osPrettyName || SysInfo.osName}` + color: Colours.palette.m3primary + radius: Tokens.rounding.medium + + MonoText { + id: prompt + + anchors.centerIn: parent + text: ">" + color: Colours.palette.m3onPrimary } } - WrappedLoader { + MonoText { Layout.fillWidth: true - active: root.height > (batLoader.active ? 200 : 110) - - sourceComponent: FetchText { - text: `WM : ${SysInfo.wm}` - } + text: "caelestiafetch.sh" + elide: Text.ElideRight } WrappedLoader { - Layout.fillWidth: true - active: !batLoader.active || root.height > 110 + Layout.fillHeight: true + Layout.preferredWidth: height + Layout.preferredHeight: 0 + active: !iconLoader.active - sourceComponent: FetchText { - text: `USER: ${SysInfo.user}` - } + sourceComponent: SysInfo.isDefaultLogo ? caelestiaLogo : distroIcon } + } - FetchText { - text: `UP : ${SysInfo.uptime}` - } + RowLayout { + Layout.topMargin: -Tokens.spacing.extraSmall + Layout.bottomMargin: Tokens.spacing.small + Layout.fillWidth: true + Layout.fillHeight: true + spacing: Tokens.spacing.extraLarge WrappedLoader { - id: batLoader + id: iconLoader + Layout.fillHeight: true + active: root.width > 320 + + sourceComponent: SysInfo.isDefaultLogo ? caelestiaLogo : distroIcon + } + + ColumnLayout { Layout.fillWidth: true - active: UPower.displayDevice.isLaptopBattery + Layout.topMargin: Tokens.padding.medium + Layout.bottomMargin: Tokens.padding.medium + spacing: Tokens.spacing.medium - sourceComponent: FetchText { - text: `BATT: ${[UPowerDeviceState.Charging, UPowerDeviceState.FullyCharged, UPowerDeviceState.PendingCharge].includes(UPower.displayDevice.state) ? "(+) " : ""}${Math.round(UPower.displayDevice.percentage * 100)}%` + Repeater { + model: { + const items = []; + const hasBatt = UPower.displayDevice.isLaptopBattery; + const rHeight = root.rootHeight; + + if (!hasBatt && rHeight > 200) + items.push(`OS : ${SysInfo.osPrettyName || SysInfo.osName}`); + + if (rHeight > (hasBatt ? 200 : 110)) + items.push(`WM : ${SysInfo.wm}`); + + if (!hasBatt || rHeight > 110) + items.push(`USER: ${SysInfo.user}`); + + items.push(`UP : ${SysInfo.uptime}`); + + if (hasBatt) + items.push(`BATT: ${[UPowerDeviceState.Charging, UPowerDeviceState.FullyCharged, UPowerDeviceState.PendingCharge].includes(UPower.displayDevice.state) ? "(+) " : ""}${Math.round(UPower.displayDevice.percentage * 100)}%`); + + return items; + } + + MonoText { + required property string modelData + + Layout.fillWidth: true + text: modelData + elide: Text.ElideRight + } } } } - } - WrappedLoader { - Layout.alignment: Qt.AlignHCenter - active: root.height > 180 + WrappedLoader { + Layout.alignment: Qt.AlignHCenter + active: root.rootHeight > 180 - sourceComponent: RowLayout { - spacing: Tokens.spacing.largeIncreased + sourceComponent: RowLayout { + id: coloursRow - Repeater { - model: Math.max(0, Math.min(8, root.width / (Tokens.font.body.large.pointSize * 2 + Tokens.spacing.large))) + spacing: Tokens.spacing.largeIncreased - StyledRect { - required property int index + Repeater { + model: CUtils.clamp(Math.floor((layout.width + coloursRow.spacing) / (root.cBoxSize + coloursRow.spacing)), 0, 8) - implicitWidth: implicitHeight - implicitHeight: Tokens.font.body.large.pointSize * 2 - color: Colours.palette[`term${index}`] - radius: Tokens.rounding.medium + StyledRect { + required property int index + + implicitWidth: implicitHeight + implicitHeight: root.cBoxSize + color: Colours.palette[`term${index}`] + radius: Tokens.rounding.medium + } } } } @@ -166,13 +172,7 @@ ColumnLayout { visible: active } - component FetchText: MonoText { - Layout.fillWidth: true - font: root.width > 400 ? Tokens.font.mono.large : Tokens.font.mono.medium - elide: Text.ElideRight - } - component MonoText: StyledText { - font: Tokens.font.mono.small + font: root.width > 400 ? Tokens.font.mono.medium : Tokens.font.mono.small } } diff --git a/modules/lock/Media.qml b/modules/lock/Media.qml index 649032e3..3a8dc794 100644 --- a/modules/lock/Media.qml +++ b/modules/lock/Media.qml @@ -47,7 +47,9 @@ StyledClippingRect { ColumnLayout { id: layout - anchors.fill: parent + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter anchors.margins: Tokens.padding.extraLarge spacing: Tokens.spacing.extraSmall