summaryrefslogtreecommitdiff
path: root/modules
diff options
context:
space:
mode:
Diffstat (limited to 'modules')
-rw-r--r--modules/lock/Content.qml105
-rw-r--r--modules/lock/Input.qml60
-rw-r--r--modules/lock/LockSurface.qml55
3 files changed, 171 insertions, 49 deletions
diff --git a/modules/lock/Content.qml b/modules/lock/Content.qml
new file mode 100644
index 0000000..15e1425
--- /dev/null
+++ b/modules/lock/Content.qml
@@ -0,0 +1,105 @@
+pragma ComponentBehavior: Bound
+
+import qs.components
+import qs.components.images
+import qs.services
+import qs.config
+import qs.utils
+import QtQuick
+import QtQuick.Layouts
+
+GridLayout {
+ id: root
+
+ required property var lock
+
+ anchors.fill: parent
+ anchors.margins: Appearance.padding.large
+
+ rowSpacing: Appearance.spacing.large
+ columnSpacing: Appearance.spacing.large
+
+ rows: 2
+ columns: 3
+
+ StyledRect {
+ Layout.row: 0
+ Layout.column: 0
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+
+ radius: Appearance.rounding.small
+ color: Colours.tPalette.m3surfaceContainer
+ }
+
+ StyledRect {
+ Layout.row: 1
+ Layout.column: 0
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+
+ radius: Appearance.rounding.small
+ color: Colours.tPalette.m3surfaceContainer
+ }
+
+ StyledClippingRect {
+ Layout.row: 0
+ Layout.column: 1
+ Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
+
+ implicitWidth: Config.lock.sizes.faceSize
+ implicitHeight: Config.lock.sizes.faceSize
+
+ radius: Appearance.rounding.large
+ color: Colours.tPalette.m3surfaceContainer
+
+ MaterialIcon {
+ anchors.centerIn: parent
+
+ text: "person"
+ fill: 1
+ grade: 200
+ font.pointSize: Math.floor(Config.lock.sizes.faceSize / 2)
+ }
+
+ CachingImage {
+ id: pfp
+
+ anchors.fill: parent
+ path: `${Paths.stringify(Paths.home)}/.face`
+ }
+ }
+
+ Input {
+ Layout.row: 1
+ Layout.column: 1
+
+ lock: root.lock
+ }
+
+ StyledRect {
+ Layout.row: 0
+ Layout.column: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+
+ radius: Appearance.rounding.small
+ color: Colours.tPalette.m3surfaceContainer
+ }
+
+ StyledRect {
+ Layout.row: 1
+ Layout.column: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+
+ radius: Appearance.rounding.small
+ color: Colours.tPalette.m3surfaceContainer
+ }
+
+ component Anim: NumberAnimation {
+ duration: Appearance.anim.durations.normal
+ easing.type: Easing.BezierSpline
+ easing.bezierCurve: Appearance.anim.curves.standard
+ }
+}
diff --git a/modules/lock/Input.qml b/modules/lock/Input.qml
index b989bb9..1e164b8 100644
--- a/modules/lock/Input.qml
+++ b/modules/lock/Input.qml
@@ -12,60 +12,40 @@ import QtQuick.Layouts
ColumnLayout {
id: root
- required property WlSessionLockSurface lock
+ required property var lock
property string passwordBuffer
+ Layout.preferredWidth: Config.lock.sizes.faceSize * 2
+ Layout.fillWidth: false
spacing: Appearance.spacing.large * 2
- RowLayout {
- Layout.alignment: Qt.AlignHCenter
- Layout.topMargin: Appearance.padding.large * 3
- Layout.maximumWidth: Config.lock.sizes.inputWidth - Appearance.rounding.large * 2
-
- spacing: Appearance.spacing.large
-
- StyledClippingRect {
- Layout.alignment: Qt.AlignVCenter
- implicitWidth: Config.lock.sizes.faceSize
- implicitHeight: Config.lock.sizes.faceSize
-
- radius: Appearance.rounding.large
- color: Colours.tPalette.m3surfaceContainer
+ StyledRect {
+ Layout.fillWidth: true
+ implicitHeight: user.implicitHeight + Appearance.padding.small * 2
- MaterialIcon {
- anchors.centerIn: parent
+ color: Colours.tPalette.m3surfaceContainer
+ radius: Appearance.rounding.small
- text: "person"
- fill: 1
- grade: 200
- font.pointSize: Config.lock.sizes.faceSize / 2
- }
+ RowLayout {
+ id: user
- CachingImage {
- anchors.fill: parent
- path: `${Paths.stringify(Paths.home)}/.face`
- }
- }
+ anchors.centerIn: parent
- ColumnLayout {
- Layout.fillWidth: true
- Layout.alignment: Qt.AlignVCenter
- spacing: Appearance.spacing.small
+ spacing: Appearance.spacing.normal
- StyledText {
- Layout.fillWidth: true
- text: qsTr("Welcome back, %1").arg(Quickshell.env("USER"))
- font.pointSize: Appearance.font.size.extraLarge
+ MaterialIcon {
+ text: "account_circle"
+ font.pointSize: Appearance.font.size.large * 1.4
font.weight: 500
- elide: Text.ElideRight
}
StyledText {
- Layout.fillWidth: true
- text: qsTr("Logging in to %1").arg(Quickshell.env("XDG_CURRENT_DESKTOP") || Quickshell.env("XDG_SESSION_DESKTOP"))
- color: Colours.palette.m3tertiary
+ // Layout.fillWidth: true
+ text: Quickshell.env("USER")
font.pointSize: Appearance.font.size.large
+ // font.capitalization: Font.Capitalize
+ font.weight: 500
elide: Text.ElideRight
}
}
@@ -121,7 +101,7 @@ ColumnLayout {
onCompleted: res => {
if (res === PamResult.Success)
- return root.lock.unlock();
+ return root.lock.lock.unlock();
if (res === PamResult.Error)
placeholder.pamState = "error";
diff --git a/modules/lock/LockSurface.qml b/modules/lock/LockSurface.qml
index 7e3f593..3b6b86c 100644
--- a/modules/lock/LockSurface.qml
+++ b/modules/lock/LockSurface.qml
@@ -15,10 +15,6 @@ WlSessionLockSurface {
property bool locked
- function unlock(): void {
- lock.unlocked = true;
- }
-
Component.onCompleted: locked = true
color: "transparent"
@@ -40,8 +36,8 @@ WlSessionLockSurface {
target: lockBg
properties: "implicitWidth,implicitHeight"
to: lockBg.size
- duration: Appearance.anim.durations.expressiveFastSpatial
- easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
+ duration: Appearance.anim.durations.expressiveDefaultSpatial
+ easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
}
Anim {
target: lockBg
@@ -49,9 +45,31 @@ WlSessionLockSurface {
to: lockBg.size / 4
}
Anim {
- targets: [background, lockBg]
+ target: content
+ property: "opacity"
+ to: 0
+ duration: Appearance.anim.durations.small
+ }
+ Anim {
+ target: lockIcon
+ property: "opacity"
+ to: 1
+ }
+ Anim {
+ target: background
property: "opacity"
to: 0
+ duration: Appearance.anim.durations.large
+ }
+ SequentialAnimation {
+ PauseAnimation {
+ duration: Appearance.anim.durations.small
+ }
+ Anim {
+ target: lockBg
+ property: "opacity"
+ to: 0
+ }
}
}
PropertyAction {
@@ -82,7 +100,7 @@ WlSessionLockSurface {
Anim {
target: lockBg
property: "rotation"
- to: 180
+ to: 360
duration: Appearance.anim.durations.expressiveFastSpatial
easing.bezierCurve: Appearance.anim.curves.standardAccel
}
@@ -91,10 +109,20 @@ WlSessionLockSurface {
Anim {
target: lockIcon
property: "rotation"
- to: 180
+ to: 360
easing.bezierCurve: Appearance.anim.curves.standardDecel
}
Anim {
+ target: lockIcon
+ property: "opacity"
+ to: 0
+ }
+ Anim {
+ target: content
+ property: "opacity"
+ to: 1
+ }
+ Anim {
target: lockBg
property: "radius"
to: Appearance.rounding.large
@@ -147,6 +175,7 @@ WlSessionLockSurface {
color: Colours.tPalette.m3surface
radius: size / 4
+ rotation: 180
scale: 0
Elevation {
@@ -164,6 +193,14 @@ WlSessionLockSurface {
text: "lock"
font.pointSize: Appearance.font.size.extraLarge * 4
font.bold: true
+ rotation: 180
+ }
+
+ Content {
+ id: content
+
+ lock: root
+ opacity: 0
}
}