Lockscreen buttons, HoverIconButton component added

Components/HoverIconButton.qml

@@ -0,0 +1,33 @@
+import QtQuick
+import QtQuick.Controls
+import qs.Config
+
+IconButton {
+	id: root
+
+	required property bool shouldBeVisible
+
+	opacity: 0
+	scale: 0
+	visible: root.scale > 0
+
+	Behavior on opacity {
+		Anim {
+			duration: Appearance.anim.durations.small
+		}
+	}
+	Behavior on scale {
+		Anim {
+		}
+	}
+
+	onShouldBeVisibleChanged: {
+		if (root.shouldBeVisible) {
+			root.opacity = 1;
+			root.scale = 1;
+		} else {
+			root.opacity = 0;
+			root.scale = 0;
+		}
+	}
+}

Modules/Settings/Categories/Lockscreen/Idle.qml

@@ -22,6 +22,13 @@ ColumnLayout {
 		Config.save();
 	}
 
+	function deleteTimeoutEntry(index) {
+		let list = [...Config.general.idle.timeouts];
+		list.splice(index, 1);
+		Config.general.idle.timeouts = list;
+		Config.save();
+	}
+
 	function updateTimeoutEntry(i, key, value) {
 		const list = [...Config.general.idle.timeouts];
 		let entry = list[i];
@@ -49,6 +56,9 @@ ColumnLayout {
 			onAddActiveActionRequested: {
 				root.updateTimeoutEntry(index, "activeAction", "");
 			}
+			onDeleteRequested: function (index) {
+				root.deleteTimeoutEntry(index);
+			}
 			onFieldEdited: function (key, value) {
 				root.updateTimeoutEntry(index, key, value);
 			}

Modules/Settings/Controls/SettingList.qml

@@ -10,6 +10,7 @@ Item {
 	required property var modelData
 
 	signal addActiveActionRequested
+	signal deleteRequested(int index)
 	signal fieldEdited(string key, var value)
 
 	Layout.fillWidth: true
@@ -65,42 +66,64 @@ Item {
 
 			HoverHandler {
 				id: nameHover
+			}
 
+			HoverIconButton {
+				id: editButton
+
+				anchors.left: parent.left
+				anchors.verticalCenter: parent.verticalCenter
+				font.pointSize: Appearance.font.size.large
+				icon: "edit"
+				shouldBeVisible: nameHover.hovered && !nameCell.editing
+
+				onClicked: nameCell.beginEdit()
 			}
 
 			CustomText {
 				anchors.left: parent.left
-				anchors.right: editButton.left
+				anchors.leftMargin: nameHover.hovered ? editButton.width + Appearance.spacing.smaller * 2 : 0
+				anchors.right: deleteButton.left
 				anchors.rightMargin: Appearance.spacing.small
 				anchors.verticalCenter: parent.verticalCenter
 				elide: Text.ElideRight    // enable if CustomText supports it
 				font.pointSize: Appearance.font.size.larger
 				text: root.modelData.name
 				visible: !nameCell.editing
+
+				Behavior on anchors.leftMargin {
+					Anim {
+					}
+				}
 			}
 
-			IconButton {
+			HoverIconButton {
-				id: editButton
+				id: deleteButton
 
 				anchors.right: parent.right
 				anchors.verticalCenter: parent.verticalCenter
 				font.pointSize: Appearance.font.size.large
-				icon: "edit"
+				icon: "delete"
-				visible: nameHover.hovered && !nameCell.editing
+				shouldBeVisible: nameHover.hovered && !nameCell.editing
 
-				onClicked: nameCell.beginEdit()
+				onClicked: root.deleteRequested(root.index)
 			}
 
 			CustomRect {
-				anchors.fill: parent
+				anchors.left: parent.left
+				anchors.verticalCenter: parent.verticalCenter
 				color: DynamicColors.tPalette.m3surface
+				implicitHeight: nameEditor.implicitHeight + (Appearance.padding.normal * 2)
+				implicitWidth: Math.min(nameEditor.contentWidth + (Appearance.padding.normal * 2), parent.width - Appearance.padding.normal)
 				radius: Appearance.rounding.small
 				visible: nameCell.editing
 
 				CustomTextField {
 					id: nameEditor
 
-					anchors.fill: parent
+					anchors.centerIn: parent
+					horizontalAlignment: Text.AlignHCenter
+					implicitWidth: Math.min(contentWidth + Appearance.padding.normal * 2, nameCell.width - Appearance.padding.normal)
 					text: nameCell.draftName
 
 					Keys.onEscapePressed: {