Initial Commit

.config/sddm-custom-theme/Components/LoginPanel.qml

@@ -0,0 +1,132 @@
+import QtQuick 2.15
+import QtQuick.Window 2.15
+import QtQuick.Controls 2.15
+
+Item {
+  property var user: userField.text
+  property var password: passwordField.text
+  property var session: sessionPanel.session
+  property var inputHeight: Screen.height * 0.032
+  property var inputWidth: Screen.width * 0.16
+  Rectangle {
+    id: loginBackground
+    anchors {
+      verticalCenter: parent.verticalCenter 
+      horizontalCenter: parent.horizontalCeneter
+    }
+    height: inputHeight * 5.3
+    width: inputWidth * 1.2
+    radius: 5
+    visible: config.LoginBackground == "true" ? true : false
+    color: config.mantle
+  }
+  Column {
+    spacing: 8
+    z:5
+    width: inputWidth
+    anchors {
+      verticalCenter: parent.verticalCenter 
+      horizontalCenter: parent.horizontalCenter 
+    } 
+    UserField {
+      id: userField 
+      height: inputHeight
+      width: parent.width
+    }
+    PasswordField {
+      id: passwordField
+      height: inputHeight
+      width: parent.width
+      onAccepted: loginButton.clicked()
+    }
+    Button { id: loginButton
+      height: inputHeight
+      width: parent.width
+      enabled: user != "" && password != "" ? true : false
+      hoverEnabled: true
+      contentItem: Text {
+	id: buttonText
+	renderType: Text.NativeRendering
+	font {
+	  family: config.Font
+	  pointSize: config.FontSize 
+	  bold: true
+	}	  
+	horizontalAlignment: Text.AlignHCenter
+	verticalAlignment: Text.AlignVCenter
+	color: config.crust
+	text: "Login"
+      }
+      background: Rectangle {
+	id: buttonBackground
+	color: config.sapphire 
+	radius: 3
+      }
+      states: [
+	State {
+	  name: "pressed"
+	  when: loginButton.down
+	  PropertyChanges {
+	    target: buttonBackground
+	    color: config.teal
+	  }
+	  PropertyChanges {
+	    target: buttonText
+	  }
+	}, 
+	State {
+	  name: "hovered"
+	  when: loginButton.hovered
+	  PropertyChanges {
+	    target: buttonBackground
+	    color: config.teal
+	  }
+	}, 
+	State {
+	  name: "enabled"
+	  when: loginButton.enabled
+	  PropertyChanges {
+	    target: buttonBackground
+	  }
+	  PropertyChanges {
+	    target: buttonText
+	  }
+	} 
+      ]
+      transitions: Transition {
+	PropertyAnimation {
+	  properties: "color"
+	  duration: 300
+	} 
+      }
+      onClicked: {
+	sddm.login(user, password, session) 
+      }
+    }	
+    Row {
+      width: parent.width
+      spacing: (parent.width - 4 * inputHeight)/3
+      SessionPanel {
+	id: sessionPanel 
+      }
+      PowerButton {
+	id: powerButton
+      }
+      RebootButton {
+	id: rebootButton
+      }
+      SleepButton {
+	id: sleepButton
+      }
+    }
+  }
+  Connections {
+    target: sddm
+
+    function onLoginFailed() {
+      passwordField.text = ""	
+      passwordField.focus = true
+    }
+  }
+}
+

.config/sddm-custom-theme/Components/PasswordField.qml

@@ -0,0 +1,48 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+TextField {
+  id: passwordField
+  focus: true
+  selectByMouse: true
+  placeholderText: "Password"
+  echoMode: TextInput.Password
+  passwordCharacter: ""
+  passwordMaskDelay: 0
+  selectionColor: config.overlay0
+  renderType: Text.NativeRendering
+  font.family: config.Font
+  font.pointSize: config.FontSize
+  font.bold: true
+  color: config.text
+  horizontalAlignment: TextInput.AlignHCenter
+  background: Rectangle {
+    id: passFieldBackground 
+    radius: 3
+    color: config.surface0
+  }
+  states: [
+    State {
+      name: "focused"
+      when: passwordField.activeFocus
+      PropertyChanges {
+	target: passFieldBackground
+	color: config.surface1
+      }
+    },
+    State {
+      name: "hovered"
+      when: passwordField.hovered
+      PropertyChanges {
+	target: passFieldBackground
+	color: config.surface1
+      }
+    }
+  ]
+  transitions: Transition {
+    PropertyAnimation {
+      properties: "color"
+      duration: 300
+    }
+  }
+}

.config/sddm-custom-theme/Components/PowerButton.qml

@@ -0,0 +1,41 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Item {
+  implicitHeight: powerButton.height
+  implicitWidth: powerButton.width
+  Button {
+    id: powerButton
+    height: inputHeight
+    width: inputHeight
+    hoverEnabled: true
+    icon {
+      source: Qt.resolvedUrl("../icons/power.svg")
+      height: height
+      width: width
+      color: config.crust
+    }
+    background: Rectangle {
+      id: powerButtonBackground
+      radius: 3
+      color: config.red
+    }
+    states: [
+      State {
+        name: "hovered"
+        when: powerButton.hovered
+        PropertyChanges {
+          target: powerButtonBackground
+          color: config.rosewater
+        }
+      }
+    ]
+    transitions: Transition {
+      PropertyAnimation {
+        properties: "color"
+        duration: 300
+      }
+    }
+    onClicked: sddm.powerOff()
+  }
+}

.config/sddm-custom-theme/Components/RebootButton.qml

@@ -0,0 +1,41 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Item {
+  implicitHeight: rebootButton.height
+  implicitWidth: rebootButton.width
+  Button {
+    id: rebootButton
+    height: inputHeight
+    width: inputHeight
+    hoverEnabled: true
+    icon {
+      source: Qt.resolvedUrl("../icons/reboot.svg")
+      height: height
+      width: width
+      color: config.crust
+    }
+    background: Rectangle {
+      id: rebootButtonBackground
+      radius: 3
+      color: config.red
+    }
+    states: [
+      State {
+        name: "hovered"
+        when: rebootButton.hovered
+        PropertyChanges {
+          target: rebootButtonBackground
+          color: config.rosewater
+        }
+      }
+    ]
+    transitions: Transition {
+      PropertyAnimation {
+        properties: "color"
+        duration: 300
+      }
+    }
+    onClicked: sddm.reboot()
+  }
+}

.config/sddm-custom-theme/Components/SessionPanel.qml

@@ -0,0 +1,156 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQml.Models 2.15
+
+Item {
+  property var session: sessionList.currentIndex
+  implicitHeight: sessionButton.height
+  implicitWidth: sessionButton.width
+  DelegateModel {
+    id: sessionWrapper
+    model: sessionModel
+    delegate: ItemDelegate {
+      id: sessionEntry
+      height: inputHeight
+      width: parent.width
+      highlighted: sessionList.currentIndex == index
+      contentItem: Text {
+        renderType: Text.NativeRendering
+        font.family: config.Font
+        font.pointSize: config.FontSize
+        font.bold: true
+        horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
+        color: config.text
+        text: name
+      }
+      background: Rectangle {
+        id: sessionEntryBackground
+        color: config.surface1
+        radius: 3
+      }
+      states: [
+        State {
+          name: "hovered"
+          when: sessionEntry.hovered
+          PropertyChanges {
+            target: sessionEntryBackground
+            color: config.surface2
+          }
+        }
+      ]
+      transitions: Transition {
+        PropertyAnimation {
+          property: "color"
+          duration: 300
+        }
+      }
+      MouseArea {
+        anchors.fill: parent
+        onClicked: {
+          sessionList.currentIndex = index
+          sessionPopup.close()
+        }
+      }
+    }
+  }
+  Button {
+    id: sessionButton
+    height: inputHeight
+    width: inputHeight
+    hoverEnabled: true
+    icon {
+      source: Qt.resolvedUrl("../icons/settings.svg")
+      height: height
+      width: width
+      color: config.crust
+    }
+    background: Rectangle {
+      id: sessionButtonBackground
+      color: config.red
+      radius: 3
+    }
+    states: [
+      State {
+        name: "pressed"
+        when: sessionButton.down
+        PropertyChanges {
+          target: sessionButtonBackground
+          color: config.rosewater
+        }
+      },
+      State {
+        name: "hovered"
+        when: sessionButton.hovered
+        PropertyChanges {
+          target: sessionButtonBackground
+          color: config.rosewater
+        }
+      },
+      State {
+        name: "selection"
+        when: sessionPopup.visible
+        PropertyChanges {
+          target: sessionButtonBackground
+          color: config.rosewater
+        }
+      }
+    ]
+    transitions: Transition {
+      PropertyAnimation {
+        properties: "color"
+        duration: 150
+      }
+    }
+    onClicked: {
+      sessionPopup.visible ? sessionPopup.close() : sessionPopup.open()
+      sessionButton.state = "pressed"
+    }
+  }
+  Popup {
+    id: sessionPopup
+    width: inputWidth + padding * 2
+    x: (sessionButton.width + sessionList.spacing) * -7.6
+    y: -(contentHeight + padding * 2) + sessionButton.height
+    padding: inputHeight / 10
+    background: Rectangle {
+      radius: 5.4
+      color: config.surface0
+    }
+    contentItem: ListView {
+      id: sessionList
+      implicitHeight: contentHeight
+      spacing: 8
+      model: sessionWrapper
+      currentIndex: sessionModel.lastIndex
+      clip: true
+    }
+    enter: Transition {
+      ParallelAnimation {
+        NumberAnimation {
+          property: "opacity"
+          from: 0
+          to: 1
+          duration: 400
+          easing.type: Easing.OutExpo
+        }
+        NumberAnimation {
+          property: "x"
+          from: sessionPopup.x + (inputWidth * 0.1)
+          to: sessionPopup.x
+          duration: 500
+          easing.type: Easing.OutExpo
+        }
+      }
+    }
+    exit: Transition {
+      NumberAnimation {
+        property: "opacity"
+        from: 1
+        to: 0
+        duration: 300
+        easing.type: Easing.OutExpo
+      }
+    }
+  }
+}

.config/sddm-custom-theme/Components/SleepButton.qml

@@ -0,0 +1,41 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Item {
+  implicitHeight: sleepButton.height
+  implicitWidth: sleepButton.width
+  Button {
+    id: sleepButton
+    height: inputHeight
+    width: inputHeight
+    hoverEnabled: true
+    icon {
+      source: Qt.resolvedUrl("../icons/sleep.svg")
+      height: height
+      width: width
+      color: config.crust
+    }
+    background: Rectangle {
+      id: sleepButtonBg
+      color: config.red
+      radius: 3
+    }
+    states: [
+      State {
+        name: "hovered"
+        when: sleepButton.hovered
+        PropertyChanges {
+          target: sleepButtonBg
+          color: config.rosewater
+        }
+      }
+    ]
+    transitions: Transition {
+      PropertyAnimation {
+        properties: "color"
+        duration: 300
+      }
+    }
+    onClicked: sddm.suspend()
+  }
+}

.config/sddm-custom-theme/Components/UserField.qml

@@ -0,0 +1,50 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+TextField {
+  id: userField
+  height: inputHeight
+  width: inputWidth
+  selectByMouse: true
+  echoMode: TextInput.Normal
+  selectionColor:config.overlay0
+  renderType: Text.NativeRendering
+  font {
+    family: config.Font
+    pointSize: config.FontSize
+    bold: true
+  }
+  color: config.text
+  horizontalAlignment: Text.AlignHCenter
+  placeholderText: "Username"
+  text: userModel.lastUser
+  background: Rectangle {
+    id: userFieldBackground
+    color: config.surface0
+    radius: 3
+  }
+  states: [
+    State {
+      name: "focused"
+      when: userField.activeFocus
+      PropertyChanges {
+        target: UserFieldBackground 
+	color: config.surface1
+      }
+    }, 
+    State {
+      name: "hovered"
+      when: userField.activeFocus
+      PropertyChanges {
+        target: UserFieldBackground 
+	color: config.surface1
+      }
+    } 
+  ]
+  transitions: Transition {
+    PropertyAnimation {
+      properties: "color"
+      duration: 300
+    }
+  }
+}

.config/sddm-custom-theme/Main.qml

@@ -0,0 +1,30 @@
+import QtQuick 2.15
+import QtQuick.Window 2.15
+import QtQuick.Controls 2.15
+import "Components"
+
+Item {
+  id: root
+  height: Screen.height
+  width: Screen.width
+  Rectangle {
+    id: backgound
+    anchors.fill: parent
+    height: parent.height
+    width: parent.width
+    z: 0
+    color: config.backgroundColor
+  }
+  Item {
+    id: mainPanel
+    z: 3
+    anchors {
+      fill: parent 
+      margins: 50
+    }
+    LoginPanel {
+      id: loginPanel
+      anchors.fill: parent
+    }
+  }
+}

.config/sddm-custom-theme/icons/power.svg

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<svg fill="#000000" height="800px" width="800px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
+	 viewBox="0 0 198.715 198.715" xml:space="preserve">
+<g>
+	<path d="M161.463,48.763c-2.929-2.929-7.677-2.929-10.607,0c-2.929,2.929-2.929,7.677,0,10.606
+		c13.763,13.763,21.342,32.062,21.342,51.526c0,19.463-7.579,37.761-21.342,51.523c-14.203,14.204-32.857,21.305-51.516,21.303
+		c-18.659-0.001-37.322-7.104-51.527-21.309c-28.405-28.405-28.402-74.625,0.005-103.032c2.929-2.929,2.929-7.678,0-10.606
+		c-2.929-2.929-7.677-2.929-10.607,0C2.956,83.029,2.953,138.766,37.206,173.019c17.132,17.132,39.632,25.697,62.135,25.696
+		c22.497-0.001,44.997-8.564,62.123-25.69c16.595-16.594,25.734-38.659,25.734-62.129C187.199,87.425,178.059,65.359,161.463,48.763
+		z"/>
+	<path d="M99.332,97.164c4.143,0,7.5-3.358,7.5-7.5V7.5c0-4.142-3.357-7.5-7.5-7.5s-7.5,3.358-7.5,7.5v82.164
+		C91.832,93.807,95.189,97.164,99.332,97.164z"/>
+</g>
+</svg>

.config/sddm-custom-theme/icons/reboot.svg

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no" ?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="1080" height="1080" viewBox="0 0 1080 1080" xml:space="preserve">
+<defs>
+</defs>
+<g transform="matrix(1 0 0 1 540 540)" id="2a220bb6-5b48-475d-961e-cf61e288ad30"  >
+<rect style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,255,255); fill-rule: nonzero; opacity: 1; visibility: hidden;" vector-effect="non-scaling-stroke"  x="-540" y="-540" rx="0" ry="0" width="1080" height="1080" />
+</g>
+<g transform="matrix(1 0 0 1 540 540)" id="fd45914b-ae78-4c99-8f0c-f2807b2dc79c"  >
+</g>
+<g transform="matrix(45.29 0 0 45.29 556.31 508.95)" id="95767c2e-b581-4faa-9009-e8003f7e8866"  >
+<path style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke"  transform=" translate(-8.36, -16)" d="M 15.88 13.84 C 14.200000000000001 10.36 10.440000000000001 8.6 6.840000000000002 9.24 L 7.800000000000002 7.44 C 8.040000000000001 7.04 7.880000000000002 6.5200000000000005 7.480000000000001 6.32 C 7.080000000000001 6.08 6.560000000000001 6.24 6.360000000000001 6.640000000000001 L 4.400000000000001 10.280000000000001 C 4.400000000000001 10.280000000000001 3.9600000000000013 11.000000000000002 4.6400000000000015 11.32 L 8.280000000000001 13.280000000000001 C 8.4 13.360000000000001 8.56 13.4 8.680000000000001 13.4 C 8.96 13.4 9.280000000000001 13.24 9.400000000000002 12.96 C 9.640000000000002 12.56 9.480000000000002 12.040000000000001 9.080000000000002 11.84 L 7.200000000000002 10.8 C 10.040000000000003 10.32 13.000000000000002 11.760000000000002 14.320000000000002 14.48 C 15.920000000000002 17.8 14.520000000000001 21.8 11.200000000000003 23.36 C 9.600000000000003 24.12 7.8000000000000025 24.24 6.120000000000003 23.64 C 4.440000000000003 23.040000000000003 3.0800000000000027 21.84 2.320000000000003 20.240000000000002 C 1.560000000000003 18.64 1.440000000000003 16.840000000000003 2.0400000000000027 15.160000000000002 C 2.200000000000003 14.720000000000002 1.9600000000000026 14.240000000000002 1.5200000000000027 14.080000000000002 C 1.1200000000000028 14.000000000000002 0.6400000000000027 14.240000000000002 0.48000000000000265 14.680000000000001 C -0.23999999999999733 16.8 -0.11999999999999733 19.040000000000003 0.8400000000000026 21.040000000000003 C 1.8000000000000025 23.040000000000003 3.4800000000000026 24.560000000000002 5.600000000000002 25.320000000000004 C 6.520000000000002 25.640000000000004 7.440000000000002 25.800000000000004 8.360000000000003 25.800000000000004 C 9.600000000000003 25.800000000000004 10.840000000000003 25.520000000000003 11.960000000000003 24.960000000000004 C 16.120000000000005 22.960000000000004 17.880000000000003 17.960000000000004 15.880000000000003 13.840000000000005 z" stroke-linecap="round" />
+</g>
+</svg>

.config/sddm-custom-theme/icons/settings.svg

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg fill="#000000" height="800px" width="800px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
+	 viewBox="0 0 489.802 489.802" xml:space="preserve">
+<g>
+	<path d="M20.701,281.901l32.1,0.2c4.8,24.7,14.3,48.7,28.7,70.5l-22.8,22.6c-8.2,8.1-8.2,21.2-0.2,29.4l24.6,24.9
+		c8.1,8.2,21.2,8.2,29.4,0.2l22.8-22.6c21.6,14.6,45.5,24.5,70.2,29.5l-0.2,32.1c-0.1,11.5,9.2,20.8,20.7,20.9l35,0.2
+		c11.5,0.1,20.8-9.2,20.9-20.7l0.2-32.1c24.7-4.8,48.7-14.3,70.5-28.7l22.6,22.8c8.1,8.2,21.2,8.2,29.4,0.2l24.9-24.6
+		c8.2-8.1,8.2-21.2,0.2-29.4l-22.6-22.8c14.6-21.6,24.5-45.5,29.5-70.2l32.1,0.2c11.5,0.1,20.8-9.2,20.9-20.7l0.2-35
+		c0.1-11.5-9.2-20.8-20.7-20.9l-32.1-0.2c-4.8-24.7-14.3-48.7-28.7-70.5l22.8-22.6c8.2-8.1,8.2-21.2,0.2-29.4l-24.6-24.9
+		c-8.1-8.2-21.2-8.2-29.4-0.2l-22.8,22.6c-21.6-14.6-45.5-24.5-70.2-29.5l0.2-32.1c0.1-11.5-9.2-20.8-20.7-20.9l-35-0.2
+		c-11.5-0.1-20.8,9.2-20.9,20.7l-0.3,32.1c-24.8,4.8-48.8,14.3-70.5,28.7l-22.6-22.8c-8.1-8.2-21.2-8.2-29.4-0.2l-24.8,24.6
+		c-8.2,8.1-8.2,21.2-0.2,29.4l22.6,22.8c-14.6,21.6-24.5,45.5-29.5,70.2l-32.1-0.2c-11.5-0.1-20.8,9.2-20.9,20.7l-0.2,35
+		C-0.099,272.401,9.201,281.801,20.701,281.901z M179.301,178.601c36.6-36.2,95.5-35.9,131.7,0.7s35.9,95.5-0.7,131.7
+		s-95.5,35.9-131.7-0.7S142.701,214.801,179.301,178.601z"/>
+</g>
+</svg>

.config/sddm-custom-theme/icons/sleep.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg fill="#000000" width="800px" height="800px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg">
+<title>moon</title>
+<path d="M10.895 7.574c0 7.55 5.179 13.67 11.567 13.67 1.588 0 3.101-0.38 4.479-1.063-1.695 4.46-5.996 7.636-11.051 7.636-6.533 0-11.83-5.297-11.83-11.83 0-4.82 2.888-8.959 7.023-10.803-0.116 0.778-0.188 1.573-0.188 2.39z"></path>
+</svg>

.config/sddm-custom-theme/metadata.desktop

@@ -0,0 +1,13 @@
+[SddmGreeterTheme]
+Name=Keyonz's custom theme
+Description=Custom theme from Keyonz's dotsfiles
+Type=sddm-theme
+Version=1.0
+Website=https://github.com/Keyonz/ #TODO#
+Screenshot=#TODO#
+MainScript=Main.qml
+ConfigFile=theme.conf
+TranslationsDirectory=translations
+Theme-Id=sddm-custom-theme
+Theme-API=2.0
+QtVersion=6

.config/sddm-custom-theme/theme.conf

@@ -0,0 +1,15 @@
+[General]
+Font="Noto Sans"
+FontSize=9
+backgroundColor="#1e1e2e"
+mantle="#181825"
+crust="#11111b"
+sapphire="#74c7ec"
+teal="#94e2d5"
+overlay0="#6c7086"
+surface0="#313244"
+surface1="#45475a"
+surface2="#585b70"
+text="#cdd6f4"
+red="#f38ba8"
+rosewater="#f5e0dc"