Make textfield use states

CURA-6435

resources/qml/WelcomePages/AddLocalPrinterScrollView.qml

@@ -141,7 +141,7 @@ Item
                             anchors.leftMargin: UM.Theme.getSize("default_margin").width
                             verticalAlignment: Text.AlignVCenter
                             text: button.text
-                            font.bold: true
+                            font: UM.Theme.getFont("default_bold")
                             renderType: Text.NativeRendering
                         }
                     }

resources/qml/Widgets/TextField.qml

@@ -17,48 +17,43 @@ TextField
 
     UM.I18nCatalog { id: catalog; name: "cura" }
 
-    property int controlWidth: UM.Theme.getSize("setting_control").width
-    property int controlHeight: UM.Theme.getSize("setting_control").height
-
     hoverEnabled: true
     selectByMouse: true
     font: UM.Theme.getFont("default")
     renderType: Text.NativeRendering
 
+    states: [
+        State
+        {
+            name: "disabled"
+            when: !textField.enabled
+            PropertyChanges { target: backgroundRectangle.border; color: UM.Theme.getColor("setting_control_disabled_border")}
+            PropertyChanges { target: backgroundRectangle; color: UM.Theme.getColor("setting_control_disabled")}
+        },
+        State
+        {
+            name: "invalid"
+            when: !textField.acceptableInput
+            PropertyChanges { target: backgroundRectangle.border; color: UM.Theme.getColor("setting_validation_error")}
+            PropertyChanges { target: backgroundRectangle; color: UM.Theme.getColor("setting_validation_error_background")}
+        },
+        State
+        {
+            name: "hovered"
+            when: textField.hovered || textField.activeFocus
+            PropertyChanges { target: backgroundRectangle.border; color: UM.Theme.getColor("setting_control_border_highlight") }
+        }
+    ]
+
     background: Rectangle
     {
+        id: backgroundRectangle
         anchors.fill: parent
         anchors.margins: Math.round(UM.Theme.getSize("default_lining").width)
         radius: UM.Theme.getSize("setting_control_radius").width
 
-        border.color:
-        {
-            if (!textField.enabled)
-            {
-                return UM.Theme.getColor("setting_control_disabled_border")
-            }
-            if (!textField.acceptableInput)
-            {
-                return UM.Theme.getColor("setting_validation_error")
-            }
-            if (textField.hovered || textField.activeFocus)
-            {
-                return UM.Theme.getColor("setting_control_border_highlight")
-            }
-            return UM.Theme.getColor("setting_control_border")
-        }
+        border.color: UM.Theme.getColor("setting_control_border")
 
-        color:
-        {
-            if (!textField.enabled)
-            {
-                return UM.Theme.getColor("setting_control_disabled")
-            }
-            if (!textField.acceptableInput)
-            {
-                return UM.Theme.getColor("setting_validation_error_background")
-            }
-            return UM.Theme.getColor("setting_control")
-        }
+        color: UM.Theme.getColor("setting_control")
     }
 }