qml: add Hover,Filled, and Active color interaction states to ValueInput

Author: jarolrod

src/qml/components/DeveloperOptions.qml

@@ -23,17 +23,21 @@ ColumnLayout {
         onClicked: loadedItem.clicked()
     }
     Setting {
+        id: dbcacheSetting
         Layout.fillWidth: true
         header: qsTr("Database cache size")
         actionItem: ValueInput {
+            parentState: dbcacheSetting.state
             description: ("450 MiB")
         }
         onClicked: loadedItem.forceActiveFocus()
     }
     Setting {
+        id: parSetting
         Layout.fillWidth: true
         header: qsTr("Script verification threads")
         actionItem: ValueInput {
+            parentState: parSetting.state
             description: ("0")
         }
         onClicked: loadedItem.forceActiveFocus()

src/qml/components/StorageSettings.qml

@@ -22,9 +22,11 @@ ColumnLayout {
         }
     }
     Setting {
+        id: pruneTargetSetting
         Layout.fillWidth: true
         header: qsTr("Storage limit (GB)")
         actionItem: ValueInput {
+            parentState: pruneTargetSetting.state
             description: optionsModel.pruneSizeGB
             onEditingFinished: optionsModel.pruneSizeGB = parseInt(text)
         }

src/qml/controls/ValueInput.qml

@@ -7,14 +7,36 @@ import QtQuick.Controls 2.15
 
 TextEdit {
     id: root
+    required property string parentState
     property string description: ""
     property int descriptionSize: 18
+    property color textColor
+    state: root.parentState
+
+    states: [
+        State {
+            name: "FILLED"
+            PropertyChanges { target: root; textColor: Theme.color.neutral9 }
+        },
+        State {
+            name: "HOVER"
+            PropertyChanges { target: root; textColor: Theme.color.orangeLight1 }
+        },
+        State {
+            name: "ACTIVE"
+            PropertyChanges { target: root; textColor: Theme.color.orange }
+        }
+    ]
 
     font.family: "Inter"
     font.styleName: "Regular"
     font.pixelSize: root.descriptionSize
-    color: Theme.color.neutral8
+    color: root.textColor
     text: description
     horizontalAlignment: Text.AlignRight
     wrapMode: Text.WordWrap
+
+    Behavior on color {
+        ColorAnimation { duration: 150 }
+    }
 }