Match sddm to decrypt style (#5645)

* Make SDDM screen match the normal decrypt screen as close as possible

* Try with a different error style on wrong pw

* Do red lock on failure too

bin/omarchy-plymouth-set

@@ -68,10 +68,16 @@ sddm_dir="/usr/share/sddm/themes/omarchy"
 sddm_template="$HOME/.local/share/omarchy/default/sddm/omarchy/Main.qml"
 
 sed \
-  -e "s/#000000/#$bg_hex/g" \
+  -e "s/#1a1b26/#$bg_hex/g" \
   -e "s/#ffffff/#$text_hex/g" \
-  -e 's|source: "logo.svg"|source: "logo.png"|' \
   "$sddm_template" | sudo tee "$sddm_dir/Main.qml" >/dev/null
 
 sudo cp "$logo_path" "$sddm_dir/logo.png"
+for asset in bullet.png entry.png lock.png; do
+  sudo cp "$staging_dir/$asset" "$sddm_dir/$asset"
+done
+for asset in entry lock; do
+  magick "$staging_dir/$asset.png" -channel RGB +level-colors "#f7768e","#f7768e" "$staging_dir/$asset-failed.png"
+  sudo cp "$staging_dir/$asset-failed.png" "$sddm_dir/$asset-failed.png"
+done
 sudo rm -f "$sddm_dir/logo.svg"

default/sddm/omarchy/Main.qml

@@ -2,98 +2,115 @@ import QtQuick 2.0
 import SddmComponents 2.0
 
 Rectangle {
-    id: root
-    width: 640
-    height: 480
-    color: "#000000"
+  id: root
+  width: 640
+  height: 480
+  color: "#1a1b26"
 
-    property string currentUser: userModel.lastUser
-    property int sessionIndex: {
-        for (var i = 0; i < sessionModel.rowCount(); i++) {
-            var name = (sessionModel.data(sessionModel.index(i, 0), Qt.DisplayRole) || "").toString()
-            if (name.indexOf("uwsm") !== -1)
-                return i
-        }
-        return sessionModel.lastIndex
+  property string currentUser: userModel.lastUser
+  property bool loginFailed: false
+  property int sessionIndex: {
+    for (var i = 0; i < sessionModel.rowCount(); i++) {
+      var name = (sessionModel.data(sessionModel.index(i, 0), Qt.DisplayRole) || "").toString()
+      if (name.indexOf("uwsm") !== -1)
+        return i
+    }
+    return sessionModel.lastIndex
+  }
+
+  Connections {
+    target: sddm
+    function onLoginFailed() {
+      root.loginFailed = true
+      password.text = ""
+      password.focus = true
+    }
+    function onLoginSucceeded() {
+      root.loginFailed = false
+    }
+  }
+
+  Column {
+    anchors.centerIn: parent
+    spacing: 40
+
+    Image {
+      id: logo
+      source: "logo.png"
+      width: Math.min(sourceSize.width, root.width * 0.8)
+      height: sourceSize.width > 0 ? Math.round(width * sourceSize.height / sourceSize.width) : 0
+      fillMode: Image.PreserveAspectFit
+      anchors.horizontalCenter: parent.horizontalCenter
     }
 
-    Connections {
-        target: sddm
-        function onLoginFailed() {
-            errorMessage.text = "Login failed"
-            password.text = ""
-            password.focus = true
-        }
-        function onLoginSucceeded() {
-            errorMessage.text = ""
-        }
-    }
+    Row {
+      anchors.horizontalCenter: parent.horizontalCenter
+      spacing: 15
 
-    Column {
-        anchors.centerIn: parent
-        spacing: root.height * 0.04
-        width: parent.width
+      Image {
+        source: root.loginFailed ? "lock-failed.png" : "lock.png"
+        width: 34
+        height: 38
+        fillMode: Image.PreserveAspectFit
+        anchors.verticalCenter: parent.verticalCenter
+      }
+
+      Item {
+        width: entry.width
+        height: entry.height
 
         Image {
-            source: "logo.svg"
-            width: root.width * 0.35
-            height: Math.round(width * sourceSize.height / sourceSize.width)
-            fillMode: Image.PreserveAspectFit
-            anchors.horizontalCenter: parent.horizontalCenter
+          id: entry
+          source: root.loginFailed ? "entry-failed.png" : "entry.png"
+          anchors.centerIn: parent
         }
 
         Row {
-            anchors.horizontalCenter: parent.horizontalCenter
-            spacing: root.width * 0.007
+          anchors.left: parent.left
+          anchors.leftMargin: 20
+          anchors.verticalCenter: parent.verticalCenter
+          spacing: 5
 
-            Text {
-                text: "\uf023"
-                color: "#ffffff"
-                font.family: "JetBrainsMono Nerd Font"
-                font.pixelSize: root.height * 0.025
-                anchors.verticalCenter: parent.verticalCenter
-            }
-
-            Rectangle {
-                width: root.width * 0.17
-                height: root.height * 0.04
-                color: "#000000"
-                border.color: "#ffffff"
-                border.width: 1
-                clip: true
-
-                TextInput {
-                    id: password
-                    anchors.fill: parent
-                    anchors.margins: root.height * 0.008
-                    verticalAlignment: TextInput.AlignVCenter
-                    echoMode: TextInput.Password
-                    font.family: "JetBrainsMono Nerd Font"
-                    font.pixelSize: root.height * 0.02
-                    font.letterSpacing: root.height * 0.004
-                    passwordCharacter: "\u2022"
-                    color: "#ffffff"
-                    focus: true
-
-                    Keys.onPressed: {
-                        if (event.key === Qt.Key_Return || event.key === Qt.Key_Enter) {
-                            sddm.login(root.currentUser, password.text, root.sessionIndex)
-                            event.accepted = true
-                        }
-                    }
-                }
+          Repeater {
+            model: Math.min(password.text.length, 21)
+
+            Image {
+              source: "bullet.png"
+              width: 7
+              height: 7
             }
+          }
         }
 
-        Text {
-            id: errorMessage
-            text: ""
-            color: "#f7768e"
-            font.family: "JetBrainsMono Nerd Font"
-            font.pixelSize: root.height * 0.018
-            anchors.horizontalCenter: parent.horizontalCenter
+        TextInput {
+          id: password
+          anchors.fill: parent
+          anchors.leftMargin: 20
+          anchors.rightMargin: 20
+          verticalAlignment: TextInput.AlignVCenter
+          echoMode: TextInput.Password
+          font.family: "JetBrainsMono Nerd Font"
+          font.pixelSize: 24
+          font.letterSpacing: 5
+          passwordCharacter: "\u2022"
+          color: "transparent"
+          selectionColor: "transparent"
+          selectedTextColor: "transparent"
+          focus: true
+
+          onTextChanged: root.loginFailed = false
+
+          Keys.onPressed: {
+            if (event.key === Qt.Key_Return || event.key === Qt.Key_Enter) {
+              sddm.login(root.currentUser, password.text, root.sessionIndex)
+              event.accepted = true
+            }
+          }
         }
+      }
     }
 
-    Component.onCompleted: password.forceActiveFocus()
+  }
+
+  Component.onCompleted: password.forceActiveFocus()
 }

default/sddm/omarchy/logo.svg

@@ -1 +0,0 @@
-<svg fill="none" height="285" viewBox="0 0 1215 285" width="1215" xmlns="http://www.w3.org/2000/svg"><g fill="#9ece6a"><path clip-rule="evenodd" d="m720 120h-15v15h-14.998v14.999l-60.002.001v15.002l90-.002v.002h.002l-.002 89.998h-15v15h-13v15h-17v-89.998h-45v90l-45-.002v-89.998h-14.998v-30h14.998v-15.002h-14.998v-30.001h14.998v-75h15v-14.997h15v-15.002h105.002zm-90-.001h45v-74.997h-45z" fill-rule="evenodd"/><path clip-rule="evenodd" d="m105 30.002h15v14.997h15v180.001h-15v15h-15v15.002h-75v-15.002h-15v-15h-15v-180.001h15v-14.997h15v-15.002h75zm-60 194.998h45v-179.998h-45z" fill-rule="evenodd"/><path d="m300 15h60v15h15v14.999h15v180.001h-15v15h-15v15h-15l-.004-209.998h-44.994v-.002h-.002v210.002h-45v-210h-44.998v179.997h-.002v30.003h-15v-15.002h-15v-15h-14.998v-180.001h14.998v-14.999h15v-15h60v-15h45z"/><path clip-rule="evenodd" d="m555 225h-15v15h-15v15h-15v-105.001l-44.998.001v105.002h-45.002v-105.002h-15v-30.001h15v-75h15.002v-14.997h15v-15.002h105zm-89.998-105.001h44.998v-74.997h-44.998z" fill-rule="evenodd"/><path d="m885 75h-15v15h-15v15h-15v-59.998h-45v179.998h45v-59.998h15v14.997h15v15.001h15v30h-15v15h-15v15.002l-105-.002v-210.001h14.998v-14.997h15.002v-15.002h105z"/><path d="m960 119.999h45v-104.999h15v15h15v14.999h15v75.001h15v15h-15v90h-15v15h-15v15h-15v-105h-45v105.002l-45-.002v-105h-30v-15h15v-15.001h15v-75h15v-14.997h15v-15.002h15z"/><path d="m1125 119.999h45v-104.999h15v15h15v15h15v180h-15v15h-15v15.002l-75-.002v-15h-15v-15h-15v-45.001h15v-14.997-.002h30v60h45v-75h-90v-105.001h15v-14.997h15v-15.002h15z"/></g></svg>