summaryrefslogtreecommitdiff
path: root/raveos-calamares-module/raveusers/ui
diff options
context:
space:
mode:
Diffstat (limited to 'raveos-calamares-module/raveusers/ui')
-rw-r--r--raveos-calamares-module/raveusers/ui/PasswordField.qml34
-rw-r--r--raveos-calamares-module/raveusers/ui/Translations.qml4
-rw-r--r--raveos-calamares-module/raveusers/ui/raveusers.qml126
3 files changed, 100 insertions, 64 deletions
diff --git a/raveos-calamares-module/raveusers/ui/PasswordField.qml b/raveos-calamares-module/raveusers/ui/PasswordField.qml
index 0dffb49..7c9955b 100644
--- a/raveos-calamares-module/raveusers/ui/PasswordField.qml
+++ b/raveos-calamares-module/raveusers/ui/PasswordField.qml
@@ -10,24 +10,38 @@ TextField {
leftPadding: 14
rightPadding: 46
echoMode: reveal ? TextInput.Normal : TextInput.Password
- color: "#ffffff"
- placeholderTextColor: "#5b6270"
+ color: "#e8e8e6"
+ placeholderTextColor: "#9a9ca1"
font.pixelSize: 15
background: Rectangle {
- radius: 7
- color: "#303030"
- border.color: field.activeFocus ? "#3d7839" : "#303030"
+ color: "#232427"
+ border.color: field.activeFocus ? "#62a052" : "#44464b"
border.width: field.activeFocus ? 1.5 : 1
}
- Text {
- text: "\uD83D\uDC41"
- font.pixelSize: 16
- color: field.reveal ? "#3d7839" : "#9ca3af"
+ Canvas {
+ width: 20
+ height: 20
anchors.right: parent.right
- anchors.rightMargin: 14
+ anchors.rightMargin: 12
anchors.verticalCenter: parent.verticalCenter
+ property bool aktiv: field.reveal
+ onAktivChanged: requestPaint()
+ onPaint: {
+ var c = getContext("2d")
+ c.reset()
+ c.strokeStyle = aktiv ? "#62a052" : "#9a9ca1"
+ c.lineWidth = 1.8
+ c.beginPath()
+ c.moveTo(2, 10)
+ c.quadraticCurveTo(10, 2, 18, 10)
+ c.quadraticCurveTo(10, 18, 2, 10)
+ c.stroke()
+ c.beginPath()
+ c.arc(10, 10, 2.8, 0, 2 * Math.PI)
+ c.stroke()
+ }
}
MouseArea {
diff --git a/raveos-calamares-module/raveusers/ui/Translations.qml b/raveos-calamares-module/raveusers/ui/Translations.qml
index cb267b4..ef2bb67 100644
--- a/raveos-calamares-module/raveusers/ui/Translations.qml
+++ b/raveos-calamares-module/raveusers/ui/Translations.qml
@@ -12,6 +12,7 @@ QtObject {
property string passwordPlaceholder: "Password"
property string passwordConfirmLabel: "Confirm password"
property string reuseRootLabel: "Use the same password for the administrator (root)"
+ property string autoLoginLabel: "Log in automatically without a password"
property string rootPasswordLabel: "Root password"
property string rootPasswordPlaceholder: "Root password"
property string rootPasswordConfirmLabel: "Confirm root password"
@@ -26,6 +27,7 @@ QtObject {
passwordPlaceholder = "Jelszó"
passwordConfirmLabel = "Jelszó megerősítése"
reuseRootLabel = "Ugyanaz a jelszó az adminisztrátorhoz (root)"
+ autoLoginLabel = "Automatikus bejelentkezés jelszó nélkül"
rootPasswordLabel = "Root jelszó"
rootPasswordPlaceholder = "Root jelszó"
rootPasswordConfirmLabel = "Root jelszó megerősítése"
@@ -38,6 +40,7 @@ QtObject {
passwordPlaceholder = "Passwort"
passwordConfirmLabel = "Passwort bestätigen"
reuseRootLabel = "Dasselbe Passwort für den Administrator (root)"
+ autoLoginLabel = "Automatisch ohne Passwort anmelden"
rootPasswordLabel = "Root-Passwort"
rootPasswordPlaceholder = "Root-Passwort"
rootPasswordConfirmLabel = "Root-Passwort bestätigen"
@@ -50,6 +53,7 @@ QtObject {
passwordPlaceholder = "Password"
passwordConfirmLabel = "Confirm password"
reuseRootLabel = "Use the same password for the administrator (root)"
+ autoLoginLabel = "Log in automatically without a password"
rootPasswordLabel = "Root password"
rootPasswordPlaceholder = "Root password"
rootPasswordConfirmLabel = "Confirm root password"
diff --git a/raveos-calamares-module/raveusers/ui/raveusers.qml b/raveos-calamares-module/raveusers/ui/raveusers.qml
index 25e090f..030f3f4 100644
--- a/raveos-calamares-module/raveusers/ui/raveusers.qml
+++ b/raveos-calamares-module/raveusers/ui/raveusers.qml
@@ -5,18 +5,16 @@ import "." as RaveUsersModule
Rectangle {
id: root
- color: "#2B2B2B"
- radius: 14
+ color: "#1a1b1d"
- readonly property color cCardBg: "#20232a"
- readonly property color cCardBorder: "#333947"
- readonly property color cInputBg: "#303030"
- readonly property color cInputBorder: "#303030"
- readonly property color cAccentGreen: "#3d7839"
- readonly property color cTextWhite: "#ffffff"
- readonly property color cTextMuted: "#8b93a3"
- readonly property color cTextFaint: "#5b6270"
- readonly property color cErrorRed: "#ff6b6b"
+ readonly property color cCardBorder: "#34363a"
+ readonly property color cInputBg: "#232427"
+ readonly property color cInputBorder: "#44464b"
+ readonly property color cAccentGreen: "#62a052"
+ readonly property color cTextWhite: "#e8e8e6"
+ readonly property color cTextMuted: "#b7b9bd"
+ readonly property color cTextFaint: "#9a9ca1"
+ readonly property color cErrorRed: "#d9a441"
property bool showUserPassword: false
property bool showRootPassword: false
@@ -29,20 +27,64 @@ Rectangle {
RaveUsersModule.Translations.setLanguage(systemLocale)
}
+ component RegiJelolo: CheckBox {
+ id: jelolo
+
+ indicator: Rectangle {
+ implicitWidth: 20
+ implicitHeight: 20
+ x: jelolo.leftPadding
+ y: parent.height / 2 - height / 2
+ color: jelolo.checked ? cAccentGreen : cInputBg
+ border.color: jelolo.checked ? cAccentGreen : cInputBorder
+ border.width: 1
+
+ Canvas {
+ anchors.fill: parent
+ visible: jelolo.checked
+ onVisibleChanged: if (visible) requestPaint()
+ onPaint: {
+ var c = getContext("2d")
+ c.reset()
+ c.strokeStyle = "#1a1b1d"
+ c.lineWidth = 2.5
+ c.beginPath()
+ c.moveTo(5, 10)
+ c.lineTo(9, 14)
+ c.lineTo(15, 6)
+ c.stroke()
+ }
+ }
+ }
+
+ contentItem: Text {
+ text: jelolo.text
+ color: cTextWhite
+ font.pixelSize: 14
+ verticalAlignment: Text.AlignVCenter
+ leftPadding: jelolo.indicator.width + 12
+ }
+ }
+
ColumnLayout {
anchors.fill: parent
anchors.margins: 40
spacing: 0
- Item {
+ Flickable {
+ id: gorgeto
Layout.fillWidth: true
Layout.fillHeight: true
+ contentHeight: tartalom.implicitHeight + 20
+ clip: true
+ boundsBehavior: Flickable.StopAtBounds
+ ScrollBar.vertical: ScrollBar {}
ColumnLayout {
- anchors.horizontalCenter: parent.horizontalCenter
- anchors.top: parent.top
- anchors.topMargin: 10
- width: Math.min(parent.width - 40, 540)
+ id: tartalom
+ x: (gorgeto.width - width) / 2
+ y: 10
+ width: Math.min(gorgeto.width - 40, 540)
spacing: 16
Image {
@@ -81,7 +123,7 @@ Rectangle {
Text {
text: RaveUsersModule.Translations.usernameLabel
- color: "#c7ccd6"
+ color: cTextMuted
font.pixelSize: 14
font.weight: Font.Medium
}
@@ -95,10 +137,9 @@ Rectangle {
text: backend.username
placeholderText: "raveuser"
color: cTextWhite
- placeholderTextColor: "#5b6270"
+ placeholderTextColor: cTextFaint
font.pixelSize: 15
background: Rectangle {
- radius: 7
color: cInputBg
border.color: usernameField.activeFocus ? cAccentGreen : cInputBorder
border.width: usernameField.activeFocus ? 1.5 : 1
@@ -120,7 +161,7 @@ Rectangle {
Text {
text: RaveUsersModule.Translations.hostnameLabel
- color: "#c7ccd6"
+ color: cTextMuted
font.pixelSize: 14
font.weight: Font.Medium
}
@@ -134,10 +175,9 @@ Rectangle {
text: backend.hostname
placeholderText: "raveos-pc"
color: cTextWhite
- placeholderTextColor: "#5b6270"
+ placeholderTextColor: cTextFaint
font.pixelSize: 15
background: Rectangle {
- radius: 7
color: cInputBg
border.color: hostnameField.activeFocus ? cAccentGreen : cInputBorder
border.width: hostnameField.activeFocus ? 1.5 : 1
@@ -159,7 +199,7 @@ Rectangle {
Text {
text: RaveUsersModule.Translations.passwordLabel
- color: "#c7ccd6"
+ color: cTextMuted
font.pixelSize: 14
font.weight: Font.Medium
}
@@ -202,41 +242,19 @@ Rectangle {
opacity: 0.6
}
- CheckBox {
- id: reuseRootCheck
+ RegiJelolo {
+ Layout.fillWidth: true
+ text: RaveUsersModule.Translations.autoLoginLabel
+ checked: backend.autoLogin
+ onToggled: backend.setAutoLogin(checked)
+ }
+
+ RegiJelolo {
Layout.fillWidth: true
visible: backend.rootReuseVisible
text: RaveUsersModule.Translations.reuseRootLabel
checked: backend.reuseRootPassword
onToggled: backend.setReuseRootPassword(checked)
-
- indicator: Rectangle {
- implicitWidth: 20
- implicitHeight: 20
- x: reuseRootCheck.leftPadding
- y: parent.height / 2 - height / 2
- radius: 4
- color: reuseRootCheck.checked ? cAccentGreen : cInputBg
- border.color: reuseRootCheck.checked ? cAccentGreen : cInputBorder
- border.width: 1
-
- Text {
- anchors.centerIn: parent
- text: "\u2713"
- font.pixelSize: 14
- font.bold: true
- color: "#0f1713"
- visible: reuseRootCheck.checked
- }
- }
-
- contentItem: Text {
- text: reuseRootCheck.text
- color: "#d7dbe2"
- font.pixelSize: 14
- verticalAlignment: Text.AlignVCenter
- leftPadding: reuseRootCheck.indicator.width + 12
- }
}
ColumnLayout {
@@ -246,7 +264,7 @@ Rectangle {
Text {
text: RaveUsersModule.Translations.rootPasswordLabel
- color: "#c7ccd6"
+ color: cTextMuted
font.pixelSize: 14
font.weight: Font.Medium
Layout.topMargin: 4