207 lines
6.0 KiB
QML
207 lines
6.0 KiB
QML
import QtQuick
|
|
|
|
Window {
|
|
id: root
|
|
visible: true
|
|
visibility: Window.FullScreen
|
|
color: "#0a0506"
|
|
title: "Red Bear Greeter"
|
|
|
|
function submitLogin() {
|
|
greeterBackend.submitLogin(usernameInput.text, passwordInput.text)
|
|
}
|
|
|
|
Rectangle {
|
|
anchors.fill: parent
|
|
color: "#160608"
|
|
|
|
Image {
|
|
anchors.fill: parent
|
|
source: greeterBackend.backgroundUrl
|
|
fillMode: Image.PreserveAspectCrop
|
|
opacity: 0.72
|
|
asynchronous: true
|
|
}
|
|
|
|
Rectangle {
|
|
anchors.fill: parent
|
|
color: "#88000000"
|
|
}
|
|
|
|
Rectangle {
|
|
x: -parent.width * 0.18
|
|
y: -parent.height * 0.12
|
|
width: parent.width * 0.7
|
|
height: width
|
|
radius: width / 2
|
|
color: "#44ff2a2a"
|
|
opacity: 0.22
|
|
}
|
|
|
|
Rectangle {
|
|
x: parent.width * 0.58
|
|
y: parent.height * 0.46
|
|
width: parent.width * 0.52
|
|
height: width
|
|
radius: width / 2
|
|
color: "#33ff4444"
|
|
opacity: 0.18
|
|
}
|
|
}
|
|
|
|
Item {
|
|
id: card
|
|
width: Math.min(root.width * 0.42, 560)
|
|
height: 520
|
|
anchors.centerIn: parent
|
|
|
|
Rectangle {
|
|
anchors.fill: parent
|
|
radius: 22
|
|
color: "#dd150c0f"
|
|
border.color: "#44ffffff"
|
|
border.width: 1
|
|
}
|
|
|
|
Rectangle {
|
|
anchors.top: parent.top
|
|
anchors.left: parent.left
|
|
anchors.right: parent.right
|
|
height: 2
|
|
radius: 2
|
|
color: "#ff5555"
|
|
opacity: 0.65
|
|
}
|
|
|
|
Column {
|
|
anchors.fill: parent
|
|
anchors.margins: 34
|
|
spacing: 18
|
|
|
|
Image {
|
|
anchors.horizontalCenter: parent.horizontalCenter
|
|
source: greeterBackend.iconUrl
|
|
width: 96
|
|
height: 96
|
|
fillMode: Image.PreserveAspectFit
|
|
asynchronous: true
|
|
}
|
|
|
|
Text {
|
|
anchors.horizontalCenter: parent.horizontalCenter
|
|
text: "Red Bear OS"
|
|
color: "#fff4f4"
|
|
font.pixelSize: 30
|
|
font.bold: true
|
|
}
|
|
|
|
Text {
|
|
anchors.horizontalCenter: parent.horizontalCenter
|
|
text: greeterBackend.sessionName
|
|
color: "#e8a0a0"
|
|
font.pixelSize: 14
|
|
}
|
|
|
|
Item { width: 1; height: 8 }
|
|
|
|
Rectangle {
|
|
width: parent.width
|
|
height: 52
|
|
radius: 10
|
|
color: usernameInput.activeFocus ? "#28ffffff" : "#18ffffff"
|
|
border.color: usernameInput.activeFocus ? "#70ff7777" : "#20ffffff"
|
|
border.width: 1
|
|
|
|
TextInput {
|
|
id: usernameInput
|
|
anchors.fill: parent
|
|
anchors.leftMargin: 16
|
|
anchors.rightMargin: 16
|
|
verticalAlignment: TextInput.AlignVCenter
|
|
color: "#fff8f8"
|
|
font.pixelSize: 16
|
|
enabled: !greeterBackend.busy
|
|
clip: true
|
|
focus: true
|
|
onAccepted: passwordInput.forceActiveFocus()
|
|
}
|
|
|
|
Text {
|
|
anchors.left: parent.left
|
|
anchors.leftMargin: 16
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
text: "Username"
|
|
color: "#88ffffff"
|
|
font.pixelSize: 16
|
|
visible: usernameInput.text.length === 0
|
|
}
|
|
}
|
|
|
|
Rectangle {
|
|
width: parent.width
|
|
height: 52
|
|
radius: 10
|
|
color: passwordInput.activeFocus ? "#28ffffff" : "#18ffffff"
|
|
border.color: passwordInput.activeFocus ? "#70ff7777" : "#20ffffff"
|
|
border.width: 1
|
|
|
|
TextInput {
|
|
id: passwordInput
|
|
anchors.fill: parent
|
|
anchors.leftMargin: 16
|
|
anchors.rightMargin: 16
|
|
verticalAlignment: TextInput.AlignVCenter
|
|
color: "#fff8f8"
|
|
font.pixelSize: 16
|
|
echoMode: TextInput.Password
|
|
enabled: !greeterBackend.busy
|
|
clip: true
|
|
onAccepted: root.submitLogin()
|
|
}
|
|
|
|
Text {
|
|
anchors.left: parent.left
|
|
anchors.leftMargin: 16
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
text: "Password"
|
|
color: "#88ffffff"
|
|
font.pixelSize: 16
|
|
visible: passwordInput.text.length === 0
|
|
}
|
|
}
|
|
|
|
Rectangle {
|
|
width: parent.width
|
|
height: 52
|
|
radius: 12
|
|
color: greeterBackend.busy ? "#66444444" : "#ffb72020"
|
|
border.color: "#66ffffff"
|
|
border.width: 1
|
|
|
|
Text {
|
|
anchors.centerIn: parent
|
|
text: greeterBackend.busy ? "Please wait..." : "Log in"
|
|
color: "white"
|
|
font.pixelSize: 16
|
|
font.bold: true
|
|
}
|
|
|
|
MouseArea {
|
|
anchors.fill: parent
|
|
enabled: !greeterBackend.busy
|
|
onClicked: root.submitLogin()
|
|
}
|
|
}
|
|
|
|
Text {
|
|
width: parent.width
|
|
text: greeterBackend.message
|
|
color: greeterBackend.state === "greeter_ready" ? "#e8b8b8" : "#ffdddd"
|
|
font.pixelSize: 13
|
|
wrapMode: Text.WordWrap
|
|
horizontalAlignment: Text.AlignHCenter
|
|
}
|
|
}
|
|
}
|
|
}
|