lil tweaks
This commit is contained in:
@@ -137,7 +137,7 @@ PanelWindow {
|
||||
gradient: Gradient {
|
||||
orientation: Gradient.Horizontal
|
||||
GradientStop {
|
||||
color: Qt.darker(button.color, 16)
|
||||
color: Qt.darker(button.color, 12)
|
||||
position: 0
|
||||
}
|
||||
GradientStop {
|
||||
@@ -167,7 +167,11 @@ PanelWindow {
|
||||
y: (y_anim + y_off) % (entry_height + y_size) - y_size
|
||||
ShapePath {
|
||||
strokeWidth: 2
|
||||
strokeColor: Qt.darker(button.color, 2.5)
|
||||
strokeColor: Qt.hsla(
|
||||
button.color.hslHue,
|
||||
button.color.hslSaturation,
|
||||
0.3, 1
|
||||
)
|
||||
fillColor: "transparent"
|
||||
|
||||
startX: tri.x_size/2
|
||||
|
||||
120
Lock.qml
120
Lock.qml
@@ -26,10 +26,6 @@ WlSessionLock {
|
||||
easing.type: Easing.OutQuint
|
||||
}
|
||||
}
|
||||
component Shear5: Shear {
|
||||
required property real height
|
||||
xFactor: height * Math.tan(5 * Math.PI/180) / -100
|
||||
}
|
||||
|
||||
surface: WlSessionLockSurface {
|
||||
id: surface
|
||||
@@ -38,7 +34,8 @@ WlSessionLock {
|
||||
id: content
|
||||
anchors.fill: parent
|
||||
layer.enabled: true
|
||||
property bool idle: !passInput.text.length
|
||||
readonly property real angle: -1 * Math.tan(10 * Math.PI/180) // 10 degrees
|
||||
property bool idle: true
|
||||
Keys.onReturnPressed: {
|
||||
idle = false
|
||||
if (!pam.active) {
|
||||
@@ -54,6 +51,13 @@ WlSessionLock {
|
||||
width: surface.width
|
||||
height: surface.height
|
||||
fillMode: Image.PreserveAspectCrop
|
||||
PropertyAnimation on opacity {
|
||||
running: exitAnimation.running
|
||||
from: 1
|
||||
to: 0
|
||||
duration: 800
|
||||
easing.type: Easing.Linear
|
||||
}
|
||||
}
|
||||
|
||||
Item {
|
||||
@@ -88,6 +92,63 @@ WlSessionLock {
|
||||
Item {
|
||||
anchors.fill: parent
|
||||
clip: true
|
||||
Rectangle {
|
||||
antialiasing: true
|
||||
anchors {
|
||||
top: inputBox.top
|
||||
left: inputBox.right
|
||||
bottom: inputBox.bottom
|
||||
}
|
||||
width: !content.idle * surface.width * 0.05
|
||||
color: "#EEAA00"
|
||||
transform: Shear { xFactor: content.angle }
|
||||
ColorAnimation on color {
|
||||
onStarted: lockIcon.source = "assets/unlocked.svg"
|
||||
running: exitAnimation.running
|
||||
from: Qt.lighter("#A5CE00", 2.5)
|
||||
to: "#A5CE00"
|
||||
duration: 400
|
||||
}
|
||||
SequentialAnimation on color {
|
||||
id: failAnimation
|
||||
running: false
|
||||
ColorAnimation {
|
||||
from: Qt.lighter("#CC3378", 2.5)
|
||||
to: "#CC3378"
|
||||
duration: 400
|
||||
}
|
||||
ColorAnimation { duration: 1500 }
|
||||
ColorAnimation {
|
||||
to: "#EEAA00"
|
||||
duration: 600
|
||||
easing.type: Easing.InOutQuint
|
||||
}
|
||||
}
|
||||
Image {
|
||||
id: lockIcon
|
||||
anchors {
|
||||
verticalCenter: parent.verticalCenter
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
horizontalCenterOffset: content.angle * height * 0.5
|
||||
}
|
||||
width: parent.width/2
|
||||
height: parent.width/2
|
||||
layer.enabled: true
|
||||
layer.effect: MultiEffect {
|
||||
blurMax: 4
|
||||
shadowEnabled: true
|
||||
shadowOpacity: 0.4
|
||||
shadowVerticalOffset: height * 0.04
|
||||
}
|
||||
source: "assets/locked.svg"
|
||||
fillMode: Image.Pad
|
||||
sourceSize {
|
||||
width: width
|
||||
height: height
|
||||
}
|
||||
transform: Shear { xFactor: content.angle * -1 }
|
||||
}
|
||||
}
|
||||
RectangularShadow {
|
||||
anchors {
|
||||
top: inputBox.top
|
||||
@@ -99,7 +160,7 @@ WlSessionLock {
|
||||
blur: 16
|
||||
width: blur
|
||||
opacity: 0.8
|
||||
transform: Shear5 {height: inputBox.height}
|
||||
transform: Shear { xFactor: content.angle }
|
||||
}
|
||||
Rectangle {
|
||||
id: inputBox
|
||||
@@ -109,15 +170,16 @@ WlSessionLock {
|
||||
}
|
||||
antialiasing: true
|
||||
x: surface.width/3 + (surface.width/4) * content.idle
|
||||
width: (surface.width/3 + shear.xFactor) * !content.idle
|
||||
width: (surface.width/3) * !content.idle
|
||||
OutQuint300 on x {}
|
||||
OutQuint300 on width {}
|
||||
color: "#5F46BB"
|
||||
transform: Shear5 {height: inputBox.height; id: shear}
|
||||
transform: Shear { xFactor: content.angle }
|
||||
}
|
||||
Column {
|
||||
anchors {
|
||||
verticalCenter: inputBox.verticalCenter
|
||||
verticalCenterOffset: pamMessage.height * 1/3
|
||||
left: inputBox.right
|
||||
leftMargin: surface.width/3 * -1 + logo.width * 0.29
|
||||
}
|
||||
@@ -143,7 +205,7 @@ WlSessionLock {
|
||||
color: Qt.darker(inputBox.color, 1.5)
|
||||
height: prompt.font.pixelSize + 20
|
||||
width: surface.width * 0.18
|
||||
transform: Shear { xFactor: -0.15 }
|
||||
transform: Shear { xFactor: content.angle }
|
||||
TextInput {
|
||||
id: passInput
|
||||
anchors.fill: passInputBg
|
||||
@@ -152,10 +214,21 @@ WlSessionLock {
|
||||
font: prompt.font
|
||||
color: "white"
|
||||
echoMode: TextInput.Password
|
||||
transform: Shear { xFactor: 0.15 }
|
||||
transform: Shear { xFactor: content.angle * -1 }
|
||||
onTextChanged: content.idle = !text.length
|
||||
}
|
||||
}
|
||||
Text {
|
||||
id: pamMessage
|
||||
text: pam.responseRequired ? "" : pam.message
|
||||
height: 20
|
||||
width: 1
|
||||
color: "white"
|
||||
font: {
|
||||
family: prompt.family
|
||||
pixelSize: 12
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -176,7 +249,7 @@ WlSessionLock {
|
||||
transform: [
|
||||
Scale {
|
||||
origin {x: logo.width/2; y: logo.height/2 }
|
||||
xScale: (content.idle ? 1.0 : 0.5) * (1 + circleHover.hovered * 0.1)
|
||||
xScale: (content.idle ? 1.0 : 0.5)
|
||||
yScale: xScale
|
||||
OutQuint300 on xScale {}
|
||||
},
|
||||
@@ -191,7 +264,6 @@ WlSessionLock {
|
||||
id: circleBg
|
||||
layer.enabled: true
|
||||
anchors.fill: parent
|
||||
containsMode: Shape.FillContains
|
||||
preferredRendererType: Shape.CurveRenderer
|
||||
ShapePath {
|
||||
fillGradient: LinearGradient {
|
||||
@@ -210,10 +282,6 @@ WlSessionLock {
|
||||
sweepAngle: 360
|
||||
}
|
||||
}
|
||||
HoverHandler { id: circleHover }
|
||||
TapHandler {
|
||||
onTapped: content.idle = !content.idle
|
||||
}
|
||||
}
|
||||
Item {
|
||||
id: triangles
|
||||
@@ -232,9 +300,11 @@ WlSessionLock {
|
||||
x: Math.random() * (logo.width + x_size*2) - x_size
|
||||
y: (y_anim + y_off) % (logo.height + y_size) - y_size
|
||||
ShapePath {
|
||||
strokeWidth: 2
|
||||
strokeWidth: content.idle ? 2 : 4
|
||||
strokeColor: "#9A4272"
|
||||
fillColor: "transparent"
|
||||
capStyle: ShapePath.FlatCap
|
||||
joinStyle: ShapePath.MiterJoin
|
||||
|
||||
startX: tri.x_size/2
|
||||
startY: 0
|
||||
@@ -345,21 +415,31 @@ WlSessionLock {
|
||||
}
|
||||
PropertyAnimation on progress {
|
||||
id: exitAnimation
|
||||
duration: 800
|
||||
running: false
|
||||
from: 1
|
||||
to: 0
|
||||
easing.type: Easing.OutQuint
|
||||
easing.type: Easing.OutQuart
|
||||
onStopped: lock.locked = false
|
||||
}
|
||||
}
|
||||
}
|
||||
PamContext {
|
||||
id: pam
|
||||
config: "system-auth"
|
||||
config: "pam.conf"
|
||||
configDirectory: "."
|
||||
onPamMessage: if (this.responseRequired) this.respond(passInput.text)
|
||||
onCompleted: result => { switch (result) {
|
||||
case PamResult.Success:
|
||||
exitAnimation.start()
|
||||
exitAnimation.start();
|
||||
break;
|
||||
case PamResult.Failed:
|
||||
case PamResult.Error:
|
||||
case PamResult.MaxTries:
|
||||
passInput.text = "";
|
||||
content.idle = false;
|
||||
failAnimation.start();
|
||||
break;
|
||||
}}
|
||||
}
|
||||
}
|
||||
|
||||
4
assets/locked.svg
Normal file
4
assets/locked.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12 14.5V16.5M7 10.0288C7.47142 10 8.05259 10 8.8 10H15.2C15.9474 10 16.5286 10 17 10.0288M7 10.0288C6.41168 10.0647 5.99429 10.1455 5.63803 10.327C5.07354 10.6146 4.6146 11.0735 4.32698 11.638C4 12.2798 4 13.1198 4 14.8V16.2C4 17.8802 4 18.7202 4.32698 19.362C4.6146 19.9265 5.07354 20.3854 5.63803 20.673C6.27976 21 7.11984 21 8.8 21H15.2C16.8802 21 17.7202 21 18.362 20.673C18.9265 20.3854 19.3854 19.9265 19.673 19.362C20 18.7202 20 17.8802 20 16.2V14.8C20 13.1198 20 12.2798 19.673 11.638C19.3854 11.0735 18.9265 10.6146 18.362 10.327C18.0057 10.1455 17.5883 10.0647 17 10.0288M7 10.0288V8C7 5.23858 9.23858 3 12 3C14.7614 3 17 5.23858 17 8V10.0288" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 979 B |
4
assets/unlocked.svg
Normal file
4
assets/unlocked.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M16.584 6C15.8124 4.2341 14.0503 3 12 3C9.23858 3 7 5.23858 7 8V10.0288M12 14.5V16.5M7 10.0288C7.47142 10 8.05259 10 8.8 10H15.2C16.8802 10 17.7202 10 18.362 10.327C18.9265 10.6146 19.3854 11.0735 19.673 11.638C20 12.2798 20 13.1198 20 14.8V16.2C20 17.8802 20 18.7202 19.673 19.362C19.3854 19.9265 18.9265 20.3854 18.362 20.673C17.7202 21 16.8802 21 15.2 21H8.8C7.11984 21 6.27976 21 5.63803 20.673C5.07354 20.3854 4.6146 19.9265 4.32698 19.362C4 18.7202 4 17.8802 4 16.2V14.8C4 13.1198 4 12.2798 4.32698 11.638C4.6146 11.0735 5.07354 10.6146 5.63803 10.327C5.99429 10.1455 6.41168 10.0647 7 10.0288Z" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 926 B |
Reference in New Issue
Block a user