Merge branch 'master' into CURA-9005_restyle_print_setting_category

plugins/ImageReader/ConfigUI.qml

@@ -51,7 +51,7 @@ UM.Dialog
             onTextChanged: manager.onPeakHeightChanged(text)
         }
 
-        Cura.ToolTip
+        UM.ToolTip
         {
             text: catalog.i18nc("@info:tooltip", "The maximum distance of each pixel from \"Base.\"")
             visible: peak_height.hovered || peak_height_label.containsMouse
@@ -85,7 +85,7 @@ UM.Dialog
             onTextChanged: manager.onBaseHeightChanged(text)
         }
 
-        Cura.ToolTip
+        UM.ToolTip
         {
             text: catalog.i18nc("@info:tooltip", "The base height from the build plate in millimeters.")
             visible: base_height.hovered || base_height_label.containsMouse
@@ -119,7 +119,7 @@ UM.Dialog
             onTextChanged: manager.onWidthChanged(text)
         }
 
-        Cura.ToolTip
+        UM.ToolTip
         {
             text: catalog.i18nc("@info:tooltip", "The width in millimeters on the build plate")
             visible: width.hovered || width_label.containsMouse
@@ -153,7 +153,7 @@ UM.Dialog
             onTextChanged: manager.onDepthChanged(text)
         }
 
-        Cura.ToolTip
+        UM.ToolTip
         {
             text: catalog.i18nc("@info:tooltip", "The depth in millimeters on the build plate")
             visible: depth.hovered || depth_label.containsMouse
@@ -190,7 +190,7 @@ UM.Dialog
             onCurrentIndexChanged: { manager.onImageColorInvertChanged(currentIndex) }
         }
 
-        Cura.ToolTip
+        UM.ToolTip
         {
             text: catalog.i18nc("@info:tooltip", "For lithophanes dark pixels should correspond to thicker locations in order to block more light coming through. For height maps lighter pixels signify higher terrain, so lighter pixels should correspond to thicker locations in the generated 3D model.")
             visible: lighter_is_higher.hovered || lighter_is_higher_label.containsMouse
@@ -227,7 +227,7 @@ UM.Dialog
             onCurrentIndexChanged: { manager.onColorModelChanged(currentIndex) }
         }
 
-        Cura.ToolTip
+        UM.ToolTip
         {
             text: catalog.i18nc("@info:tooltip", "For lithophanes a simple logarithmic model for translucency is available. For height maps the pixel values correspond to heights linearly.")
             visible: color_model.hovered || color_model_label.containsMouse
@@ -258,7 +258,7 @@ UM.Dialog
             validator: RegExpValidator { regExp: /^[1-9]\d{0,2}([\,|\.]\d*)?$/ }
             onTextChanged: manager.onTransmittanceChanged(text)
 
-            Cura.ToolTip
+            UM.ToolTip
             {
                 text: catalog.i18nc("@info:tooltip", "The percentage of light penetrating a print with a thickness of 1 millimeter. Lowering this value increases the contrast in dark regions and decreases the contrast in light regions of the image.")
                 visible: parent.hovered || transmittance_label.containsMouse
@@ -293,7 +293,7 @@ UM.Dialog
             onValueChanged: manager.onSmoothingChanged(value)
         }
 
-        Cura.ToolTip
+        UM.ToolTip
         {
             text: catalog.i18nc("@info:tooltip", "The amount of smoothing to apply to the image.")
             visible: smoothing.hovered || smoothing_label.containsMouse

plugins/Marketplace/resources/qml/ManagePackagesButton.qml

@@ -1,7 +1,7 @@
 // Copyright (c) 2021 Ultimaker B.V.
 // Cura is released under the terms of the LGPLv3 or higher.
 
-import UM 1.2 as UM
+import UM 1.5 as UM
 import Cura 1.6 as Cura
 
 import QtQuick 2.15
@@ -25,7 +25,7 @@ TabButton
         radius: Math.round(width * 0.5)
     }
 
-    Cura.ToolTip
+    UM.ToolTip
     {
         id: tooltip
 

plugins/Marketplace/resources/qml/PackageDetails.qml

@@ -6,7 +6,7 @@ import QtQuick.Controls 2.15
 import QtQuick.Layouts 1.3
 
 import Cura 1.0 as Cura
-import UM 1.0 as UM
+import UM 1.5 as UM
 
 Item
 {
@@ -38,7 +38,7 @@ Item
             onClicked: contextStack.pop() //Remove this page, returning to the main package list or whichever thing is beneath it.
 
             tooltip: catalog.i18nc("@button:tooltip", "Back")
-            toolTipContentAlignment: Cura.ToolTip.ContentAlignment.AlignRight
+            toolTipContentAlignment: UM.Enums.ContentAlignment.AlignRight
             leftPadding: UM.Theme.getSize("narrow_margin").width
             rightPadding: leftPadding
             iconSource: UM.Theme.getIcon("ArrowLeft")

plugins/Marketplace/resources/qml/VerifiedIcon.qml

@@ -12,7 +12,7 @@ Control
     implicitWidth: UM.Theme.getSize("card_tiny_icon").width
     implicitHeight: UM.Theme.getSize("card_tiny_icon").height
 
-    Cura.ToolTip
+    UM.ToolTip
     {
         tooltipText:
         {

plugins/PerObjectSettingsTool/PerObjectSettingsPanel.qml

@@ -75,7 +75,7 @@ Item
             id: meshTypeButtons
             spacing: UM.Theme.getSize("default_margin").width
 
-            Cura.ToolbarButton
+            UM.ToolbarButton
             {
                 id: normalButton
                 text: catalog.i18nc("@label", "Normal model")
@@ -90,7 +90,7 @@ Item
                 z: 4
             }
 
-            Cura.ToolbarButton
+            UM.ToolbarButton
             {
                 id: supportMeshButton
                 text: catalog.i18nc("@label", "Print as support")
@@ -105,7 +105,7 @@ Item
                 z: 3
             }
 
-            Cura.ToolbarButton
+            UM.ToolbarButton
             {
                 id: overlapMeshButton
                 text: catalog.i18nc("@label", "Modify settings for overlaps")
@@ -120,7 +120,7 @@ Item
                 z: 2
             }
 
-            Cura.ToolbarButton
+            UM.ToolbarButton
             {
                 id: antiOverhangMeshButton
                 text:  catalog.i18nc("@label", "Don't support overlaps")

plugins/PostProcessingPlugin/PostProcessingPlugin.qml

@@ -479,7 +479,7 @@ UM.Dialog
                 }
                 return tipText
             }
-            toolTipContentAlignment: Cura.ToolTip.ContentAlignment.AlignLeft
+            toolTipContentAlignment: UM.Enums.ContentAlignment.AlignLeft
             onClicked: dialog.show()
             iconSource: "Script.svg"
             fixedWidthMode: false

resources/definitions/fdmprinter.def.json

@@ -6963,7 +6963,6 @@
                     "type": "bool",
                     "default_value": false,
                     "limit_to_extruder": "wall_0_extruder_nr",
-                    "enabled": false,
                     "settable_per_mesh": true
                 },
                 "magic_fuzzy_skin_outside_only":
@@ -6972,7 +6971,7 @@
                     "description": "Jitter only the parts' outlines and not the parts' holes.",
                     "type": "bool",
                     "default_value": false,
-                    "enabled": "magic_fuzzy_skin_enabled and False" ,
+                    "enabled": "magic_fuzzy_skin_enabled",
                     "limit_to_extruder": "wall_0_extruder_nr",
                     "settable_per_mesh": true
                 },
@@ -6985,7 +6984,7 @@
                     "default_value": 0.3,
                     "minimum_value": "0.001",
                     "maximum_value_warning": "wall_line_width_0",
-                    "enabled": "magic_fuzzy_skin_enabled and False",
+                    "enabled": "magic_fuzzy_skin_enabled",
                     "limit_to_extruder": "wall_0_extruder_nr",
                     "settable_per_mesh": true
                 },
@@ -7000,7 +6999,7 @@
                     "minimum_value_warning": "0.1",
                     "maximum_value_warning": "10",
                     "maximum_value": "2 / magic_fuzzy_skin_thickness",
-                    "enabled": "magic_fuzzy_skin_enabled and False",
+                    "enabled": "magic_fuzzy_skin_enabled",
                     "limit_to_extruder": "wall_0_extruder_nr",
                     "settable_per_mesh": true,
                     "children":
@@ -7016,7 +7015,7 @@
                             "minimum_value_warning": "0.1",
                             "maximum_value_warning": "10",
                             "value": "10000 if magic_fuzzy_skin_point_density == 0 else 1 / magic_fuzzy_skin_point_density",
-                            "enabled": "magic_fuzzy_skin_enabled and False",
+                            "enabled": "magic_fuzzy_skin_enabled",
                             "limit_to_extruder": "wall_0_extruder_nr",
                             "settable_per_mesh": true
                         }

resources/qml/ActionButton.qml

@@ -179,7 +179,7 @@ Button
         cornerSide: Cura.RoundedRectangle.Direction.None
     }
 
-    Cura.ToolTip
+    UM.ToolTip
     {
         id: tooltip
         visible:

resources/qml/ActionPanel/OutputProcessWidget.qml

@@ -5,7 +5,7 @@ import QtQuick 2.7
 import QtQuick.Controls 2.1
 import QtQuick.Layouts 1.3
 
-import UM 1.1 as UM
+import UM 1.5 as UM
 import Cura 1.0 as Cura
 
 
@@ -128,7 +128,7 @@ Column
             tooltip: text
             fixedWidthMode: true
 
-            toolTipContentAlignment: Cura.ToolTip.ContentAlignment.AlignLeft
+            toolTipContentAlignment: UM.Enums.ContentAlignment.AlignLeft
 
             onClicked: UM.Controller.setActiveStage("PreviewStage")
         }

resources/qml/Actions.qml

@@ -222,7 +222,7 @@ Item
         id: updateProfileAction
         enabled: !Cura.MachineManager.stacksHaveErrors && Cura.MachineManager.hasUserSettings && Cura.MachineManager.activeQualityChangesGroup != null
         text: catalog.i18nc("@action:inmenu menubar:profile", "&Update profile with current settings/overrides");
-        onTriggered: Cura.ContainerManager.updateQualityChanges();
+        onTriggered: Cura.ContainerManager.updateQualityChanges()
     }
 
     Action

resources/qml/ApplicationSwitcher/ApplicationButton.qml

@@ -31,7 +31,7 @@ Button
         border.width: UM.Theme.getSize("default_lining").width
     }
 
-    Cura.ToolTip
+    UM.ToolTip
     {
         id: tooltip
         tooltipText: base.text

resources/qml/ExtruderButton.qml

@@ -4,10 +4,10 @@
 import QtQuick 2.2
 import QtQuick.Controls 2.0
 
-import UM 1.2 as UM
+import UM 1.5 as UM
 import Cura 1.0 as Cura
 
-Cura.ToolbarButton
+UM.ToolbarButton
 {
     id: base
 

resources/qml/MachineSettings/GcodeTextArea.qml

@@ -91,7 +91,7 @@ UM.TooltipArea
                     }
                     if (gcodeTextArea.hovered || gcodeTextArea.activeFocus)
                     {
-                        return UM.Theme.getColor("border_main_light")
+                        return UM.Theme.getColor("border_main")
                     }
                     return UM.Theme.getColor("border_field_light")
                 }

resources/qml/MachineSettings/NumericTextFieldWithUnit.qml

@@ -77,6 +77,8 @@ UM.TooltipArea
         anchors.left: fieldLabel.right
         anchors.leftMargin: UM.Theme.getSize("default_margin").width
         verticalAlignment: Text.AlignVCenter
+        selectionColor: UM.Theme.getColor("text_selection")
+        selectedTextColor: UM.Theme.getColor("setting_control_text")
         padding: 0
         leftPadding: UM.Theme.getSize("narrow_margin").width
         width: numericTextFieldWithUnit.controlWidth
@@ -107,7 +109,7 @@ UM.TooltipArea
                 // Validation is OK.
                 if (textFieldWithUnit.hovered || textFieldWithUnit.activeFocus)
                 {
-                    return UM.Theme.getColor("border_main_light")
+                    return UM.Theme.getColor("border_main")
                 }
                 return UM.Theme.getColor("border_field_light")
             }

resources/qml/Menus/ConfigurationMenu/ConfigurationMenu.qml

@@ -83,7 +83,7 @@ Cura.ExpandablePopup
                         onExited: { tooltip.hide() }
                     }
 
-                    Cura.ToolTip
+                    UM.ToolTip
                     {
                         id: tooltip
                         x: 0

resources/qml/ObjectItemButton.qml

@@ -188,7 +188,7 @@ Button
         elideWidth: buttonText.width
     }
 
-    Cura.ToolTip
+    UM.ToolTip
     {
         id: tooltip
         tooltipText: objectItemButton.text + perObjectSettingsInfo.tooltipText

resources/qml/Preferences/ProfilesPage.qml

@@ -16,25 +16,14 @@ UM.ManagementPage
 
     property var extrudersModel: CuraApplication.getExtrudersModel()
     property var qualityManagementModel: CuraApplication.getQualityManagementModel()
+    property bool hasCurrentItem: base.currentItem != null
 
-    scrollviewCaption: catalog.i18nc("@label", "Profiles compatible with active printer:") + "<b>" + Cura.MachineManager.activeMachine.name + "</b>"
+    property var currentItem: objectList.currentIndex == -1 ? null : base.qualityManagementModel.getItem(objectList.currentIndex)
 
-    onHamburgeButtonClicked: menu.popup(content_item, content_item.width - menu.width, hamburger_button.height)
+    property string currentItemName: hasCurrentItem ? base.currentItem.name : ""
+    property string currentItemDisplayName: hasCurrentItem ? base.qualityManagementModel.getQualityItemDisplayName(base.currentItem) : ""
 
-
+    property bool isCurrentItemActivated:
-    property var hasCurrentItem: base.currentItem != null
-    sectionRole: "section_name"
-
-    property var currentItem:
-    {
-        var current_index = objectList.currentIndex;
-        return (current_index == -1) ? null : base.qualityManagementModel.getItem(current_index);
-    }
-
-    property var currentItemName: hasCurrentItem ? base.currentItem.name : ""
-    property var currentItemDisplayName: hasCurrentItem ? base.qualityManagementModel.getQualityItemDisplayName(base.currentItem) : ""
-
-    property var isCurrentItemActivated:
     {
         if (!base.currentItem)
         {
@@ -50,11 +39,29 @@ UM.ManagementPage
         }
     }
 
-    property var canCreateProfile:
+    property bool canCreateProfile:  Cura.MachineManager.hasUserSettings
+
+    signal createProfile() // Click create profile from ... in Profile context menu
+
+    property string newQualityNameToSelect: ""
+    property bool toActivateNewQuality: false
+
+    onHamburgeButtonClicked: menu.popup(content_item, content_item.width - menu.width, hamburger_button.height)
+
+    onCreateProfile:
     {
-        return isCurrentItemActivated && Cura.MachineManager.hasUserSettings;
+        createQualityDialog.object = Cura.ContainerManager.makeUniqueName(Cura.MachineManager.activeQualityOrQualityChangesName);
+        createQualityDialog.open();
+        createQualityDialog.selectText();
     }
 
+    title: catalog.i18nc("@title:tab", "Profiles")
+    scrollviewCaption: catalog.i18nc("@label", "Profiles compatible with active printer:") + "<br><b>" + Cura.MachineManager.activeMachine.name + "</b>"
+
+    hamburgerButtonVisible: hasCurrentItem
+
+    sectionRole: "section_name"
+
     model: qualityManagementModel
     buttons: [
         Cura.SecondaryButton
@@ -79,18 +86,6 @@ UM.ManagementPage
         }
     ]
 
-    // Click create profile from ... in Profile context menu
-    signal createProfile()
-    onCreateProfile:
-    {
-        createQualityDialog.object = Cura.ContainerManager.makeUniqueName(Cura.MachineManager.activeQualityOrQualityChangesName);
-        createQualityDialog.open();
-        createQualityDialog.selectText();
-    }
-
-    property string newQualityNameToSelect: ""
-    property bool toActivateNewQuality: false
-
     Item
     {
         id: content_item
@@ -179,6 +174,16 @@ UM.ManagementPage
                 }
             }
             Cura.MenuItem
+            {
+                text: catalog.i18nc("@action:button", "Duplicate")
+                enabled: base.hasCurrentItem
+                onTriggered:
+                {
+                    forceActiveFocus()
+                    duplicateQualityDialog.open()
+                }
+            }
+            Cura.MenuItem
             {
                 text: catalog.i18nc("@action:button", "Remove")
                 enabled: base.hasCurrentItem && !base.currentItem.is_read_only && !base.isCurrentItemActivated
@@ -238,10 +243,7 @@ UM.ManagementPage
             id: duplicateQualityDialog
             title: catalog.i18nc("@title:window", "Duplicate Profile")
             object: "<new name>"
-            onAccepted:
+            onAccepted: base.qualityManagementModel.duplicateQualityChanges(newName, base.currentItem)
-            {
-                base.qualityManagementModel.duplicateQualityChanges(newName, base.currentItem);
-            }
         }
 
         // Confirmation dialog for removing a profile
@@ -330,9 +332,9 @@ UM.ManagementPage
 
                 Cura.SecondaryButton
                 {
-                    text: catalog.i18nc("@action:button", "Discard current changes");
+                    text: catalog.i18nc("@action:button", "Discard current changes")
                     enabled: Cura.MachineManager.hasUserSettings
-                    onClicked: Cura.ContainerManager.clearUserContainers();
+                    onClicked: Cura.ContainerManager.clearUserContainers()
                 }
             }
 
@@ -354,7 +356,7 @@ UM.ManagementPage
             UM.TabRow
             {
                 id: profileExtruderTabs
-                UM.TabRowButton //One extra tab for the global settings.
+                UM.TabRowButton // One extra tab for the global settings.
                 {
                     text: catalog.i18nc("@title:tab", "Global Settings")
                 }

resources/qml/PrintSetupHeaderButton.qml

@@ -19,7 +19,7 @@ ToolButton
     property bool valueError: false;
     property bool valueWarning: false;
 
-    Cura.ToolTip
+    UM.ToolTip
     {
         id: tooltip
         visible: base.hovered
@@ -69,7 +69,7 @@ ToolButton
             {
                 target: background
                 color: UM.Theme.getColor("setting_control")
-                liningColor: UM.Theme.getColor("border_main_light")
+                liningColor: UM.Theme.getColor("border_main")
             }
         },
         State

resources/qml/PrintSetupSelector/Custom/CustomPrintSetup.qml

@@ -129,7 +129,7 @@ Item
             background: UM.UnderlineBackground
             {
                 id: backgroundItem
-                liningColor: intentSelection.hovered ? UM.Theme.getColor("border_main_light") : UM.Theme.getColor("border_field_light")
+                liningColor: intentSelection.hovered ? UM.Theme.getColor("border_main") : UM.Theme.getColor("border_field_light")
             }
 
             UM.SimpleButton

resources/qml/PrintSetupSelector/Custom/MenuButton.qml

@@ -18,15 +18,15 @@ Button
     property string labelText: ""
     id: button
     hoverEnabled: true
-    leftPadding:UM.Theme.getSize("wide_margin").width
+    leftPadding: UM.Theme.getSize("default_margin").width
+    implicitWidth: UM.Theme.getSize("menu").width
+    implicitHeight: UM.Theme.getSize("menu").height + UM.Theme.getSize("narrow_margin").height
 
     background: Rectangle
     {
-        id: backgroundRectangle
+        height: button.height
-        border.width: UM.Theme.getSize("default_lining").width
+        width: button.width
-        border.color: button.checked ? UM.Theme.getColor("setting_control_border_highlight") : "transparent"
+        color: button.hovered ? UM.Theme.getColor("background_2") : UM.Theme.getColor("background_1")
-        color: button.hovered ? UM.Theme.getColor("action_button_hovered") : "transparent"
-        radius: UM.Theme.getSize("action_button_radius").width
     }
 
     // Workaround to ensure that the mnemonic highlighting happens correctly
@@ -40,11 +40,29 @@ Button
         return txt
     }
 
-    contentItem: UM.Label
+    contentItem: Item
     {
-        id: textLabel
+        height: button.height
-        text: button.text != "" ? replaceText(button.text) : replaceText(button.labelText)
+        width: button.width
-        height: contentHeight
+        UM.RecolorImage
-        color: button.enabled ? UM.Theme.getColor("text") :UM.Theme.getColor("text_inactive")
+        {
+            id: check
+            height: UM.Theme.getSize("default_arrow").height
+            width: height
+            source: UM.Theme.getIcon("Check", "low")
+            color: UM.Theme.getColor("setting_control_text")
+            anchors.verticalCenter: parent.verticalCenter
+            visible: button.checked
+        }
+        UM.Label
+        {
+            id: textLabel
+            text: button.text != "" ? replaceText(button.text) : replaceText(button.labelText)
+            height: contentHeight
+            color: button.enabled ? UM.Theme.getColor("text") :UM.Theme.getColor("text_inactive")
+            anchors.left: check.right
+            anchors.leftMargin: UM.Theme.getSize("narrow_margin").width
+            anchors.verticalCenter: parent.verticalCenter
+        }
     }
 }

resources/qml/PrintSetupSelector/Custom/QualitiesWithIntentMenu.qml

@@ -130,6 +130,7 @@ Popup
                                     checkable: true
                                     visible: model.available
                                     text: model.name + " - " + model.layer_height + " mm"
+                                    leftPadding: UM.Theme.getSize("default_margin").width + UM.Theme.getSize("narrow_margin").width
                                     checked:
                                     {
                                         if (Cura.MachineManager.hasCustomQuality)
@@ -195,6 +196,7 @@ Popup
                                 checkable: true
                                 visible: model.available
                                 text: model.name
+                                leftPadding: UM.Theme.getSize("default_margin").width + UM.Theme.getSize("narrow_margin").width
                                 checked:
                                 {
                                     var active_quality_group = Cura.MachineManager.activeQualityChangesGroup
@@ -295,13 +297,12 @@ Popup
                     id: textLabel
                     text: manageProfilesButton.text
                     height: contentHeight
-                    anchors.left: parent.left
-                    anchors.leftMargin: UM.Theme.getSize("default_margin").width + UM.Theme.getSize("narrow_margin").width
                 }
                 UM.Label
                 {
                     id: shortcutLabel
                     text: Cura.Actions.manageProfiles.shortcut
+                    color: UM.Theme.getColor("text_lighter")
                     height: contentHeight
                     anchors.right: parent.right
                     anchors.rightMargin: UM.Theme.getSize("default_margin").width

resources/qml/PrinterSelector/MachineSelector.qml

@@ -172,7 +172,7 @@ Cura.ExpandablePopup
             onExited: { tooltip.hide() }
         }
 
-        Cura.ToolTip
+        UM.ToolTip
         {
             id: tooltip
 

resources/qml/Settings/SettingCheckBox.qml

@@ -98,7 +98,7 @@ SettingItem
             {
                 if(!enabled)
                 {
-                    return UM.Theme.getColor("checkbox_border")
+                    return UM.Theme.getColor("checkbox_border_disabled")
                 }
                 switch (propertyProvider.properties.validationState)
                 {
@@ -116,7 +116,7 @@ SettingItem
                 {
                     return UM.Theme.getColor("checkbox_border_hover")
                 }
-                return UM.Theme.getColor("setting_control_border")
+                return UM.Theme.getColor("checkbox_border")
             }
 
             color: {
@@ -138,7 +138,7 @@ SettingItem
                 // Validation is OK.
                 if (control.containsMouse || control.activeFocus)
                 {
-                    return UM.Theme.getColor("setting_control_highlight")
+                    return UM.Theme.getColor("checkbox_hover")
                 }
                 return UM.Theme.getColor("checkbox")
             }
@@ -150,7 +150,7 @@ SettingItem
                 height: UM.Theme.getSize("checkbox_mark").height
                 width: UM.Theme.getSize("checkbox_mark").width
                 sourceSize.height: width
-                color: !enabled ? UM.Theme.getColor("setting_control_disabled_text") : UM.Theme.getColor("setting_control_text");
+                color: !enabled ? UM.Theme.getColor("checkbox_mark_disabled") : UM.Theme.getColor("checkbox_mark");
                 source: UM.Theme.getIcon("Check", "low")
                 opacity: control.checked ? 1 : 0
                 Behavior on opacity { NumberAnimation { duration: 100; } }

resources/qml/Settings/SettingExtruder.qml

@@ -135,7 +135,7 @@ SettingItem
                 }
                 if (control.hovered || control.activeFocus)
                 {
-                    return UM.Theme.getColor("border_main_light")
+                    return UM.Theme.getColor("border_main")
                 }
                 return UM.Theme.getColor("border_field_light")
             }

resources/qml/Settings/SettingOptionalExtruder.qml

@@ -136,7 +136,7 @@ SettingItem
                 }
                 if (control.hovered || control.activeFocus)
                 {
-                    return UM.Theme.getColor("border_main_light")
+                    return UM.Theme.getColor("border_main")
                 }
                 return UM.Theme.getColor("border_field_light")
             }

resources/qml/Settings/SettingTextField.qml

@@ -36,7 +36,7 @@ SettingItem
         {
             if(!enabled)
             {
-                return UM.Theme.getColor("setting_control_disabled_border")
+                return UM.Theme.getColor("text_field_border_disabled")
             }
             switch(propertyProvider.properties.validationState)
             {
@@ -52,15 +52,15 @@ SettingItem
             //Validation is OK.
             if(hovered || input.activeFocus)
             {
-                return UM.Theme.getColor("border_main_light")
+                return UM.Theme.getColor("text_field_border_hovered")
             }
-            return UM.Theme.getColor("border_field_light")
+            return UM.Theme.getColor("text_field_border")
         }
 
         color: {
             if(!enabled)
             {
-                return UM.Theme.getColor("setting_control_disabled")
+                return UM.Theme.getColor("text_field")
             }
             switch(propertyProvider.properties.validationState)
             {
@@ -76,18 +76,10 @@ SettingItem
                     return UM.Theme.getColor("setting_validation_ok")
 
                 default:
-                    return UM.Theme.getColor("setting_control")
+                    return UM.Theme.getColor("text_field")
             }
         }
 
-        Rectangle
-        {
-            anchors.fill: parent
-            anchors.margins: Math.round(UM.Theme.getSize("default_lining").width)
-            color: UM.Theme.getColor("setting_control_highlight")
-            opacity: !control.hovered ? 0 : propertyProvider.properties.validationState == "ValidatorState.Valid" ? 1.0 : 0.35
-        }
-
         UM.Label
         {
             anchors

resources/qml/ToolTip.qml

@@ -1,82 +0,0 @@
-// Copyright (c) 2018 Ultimaker B.V.
-// Cura is released under the terms of the LGPLv3 or higher.
-
-import QtQuick 2.7
-import QtQuick.Controls 2.3
-
-import UM 1.5 as UM
-import Cura 1.0 as Cura
-
-ToolTip
-{
-    enum ContentAlignment
-    {
-        AlignLeft,
-        AlignRight
-    }
-
-    // Defines the alignment of the content, by default to the left
-    property int contentAlignment: Cura.ToolTip.ContentAlignment.AlignRight
-
-    property alias tooltipText: tooltip.text
-    property alias arrowSize: backgroundRect.arrowSize
-    property var targetPoint: Qt.point(parent.x, y + Math.round(height/2))
-
-    id: tooltip
-    text: ""
-    delay: 500
-    font: UM.Theme.getFont("default")
-    visible: opacity != 0.0
-    opacity: 0.0 // initially hidden
-
-    Behavior on opacity
-    {
-        NumberAnimation { duration: 100; }
-    }
-
-    onAboutToShow: show()
-    onAboutToHide: hide()
-
-    // If the text is not set, just set the height to 0 to prevent it from showing
-    height: label.contentHeight + 2 * UM.Theme.getSize("thin_margin").width
-
-    x:
-    {
-        if (contentAlignment == Cura.ToolTip.ContentAlignment.AlignLeft)
-        {
-            return (label.width + Math.round(UM.Theme.getSize("default_arrow").width * 1.2) + padding * 2) * -1
-        }
-        return parent.width + Math.round(UM.Theme.getSize("default_arrow").width * 1.2 + padding)
-    }
-
-    y: Math.round(parent.height / 2 - label.height / 2 ) - padding
-
-    padding: UM.Theme.getSize("thin_margin").width
-
-    background: UM.PointingRectangle
-    {
-        id: backgroundRect
-        color: UM.Theme.getColor("tooltip")
-        target: Qt.point(targetPoint.x - tooltip.x, targetPoint.y - tooltip.y)
-        arrowSize: UM.Theme.getSize("default_arrow").width
-        visible: tooltip.height != 0
-    }
-
-    contentItem: UM.Label
-    {
-        id: label
-        text: tooltip.text
-        font: tooltip.font
-        wrapMode: Text.Wrap
-        textFormat: Text.RichText
-        color: UM.Theme.getColor("tooltip_text")
-    }
-
-    function show() {
-        opacity = text != "" ? 1 : 0
-    }
-
-    function hide() {
-        opacity = 0
-    }
-}

resources/qml/Toolbar.qml

@@ -4,7 +4,7 @@
 import QtQuick 2.2
 import QtQuick.Controls 2.3
 
-import UM 1.2 as UM
+import UM 1.5 as UM
 import Cura 1.0 as Cura
 
 Item
@@ -53,9 +53,9 @@ Item
                 width: childrenRect.width
                 height: childrenRect.height
 
-                delegate: ToolbarButton
+                delegate: UM.ToolbarButton
                 {
-                    text: model.name + (model.shortcut ? (" (" + model.shortcut + ")") : "")
+                    text: model.name + (model.shortcut ? ` ("${model.shortcut}")` : "")
                     checkable: true
                     checked: model.active
                     enabled: model.enabled && UM.Selection.hasSelection && UM.Controller.toolsEnabled

resources/qml/ToolbarButton.qml

@@ -1,110 +0,0 @@
-// Copyright (c) 2018 Ultimaker B.V.
-// Cura is released under the terms of the LGPLv3 or higher.
-
-import QtQuick 2.7
-import QtQuick.Controls 2.3
-
-import UM 1.2 as UM
-import Cura 1.0 as Cura
-
-Button
-{
-    id: base
-
-    property alias toolItem: contentItemLoader.sourceComponent
-
-    // These two properties indicate whether the toolbar button is at the top of the toolbar column or at the bottom.
-    // If it is somewhere in the middle, then both has to be false. If there is only one element in the column, then
-    // both properties have to be set to true. This is used to create a rounded corner.
-    property bool isTopElement: false
-    property bool isBottomElement: false
-
-    hoverEnabled: true
-
-    background: Rectangle
-    {
-        implicitWidth: UM.Theme.getSize("button").width
-        implicitHeight: UM.Theme.getSize("button").height
-        color: UM.Theme.getColor("toolbar_background")
-        radius: UM.Theme.getSize("default_radius").width
-
-        Rectangle
-        {
-            id: topSquare
-            anchors
-            {
-                left: parent.left
-                right: parent.right
-                top: parent.top
-            }
-            height: parent.radius
-            color: parent.color
-            visible: !base.isTopElement
-        }
-
-        Rectangle
-        {
-            id: bottomSquare
-            anchors
-            {
-                left: parent.left
-                right: parent.right
-                bottom: parent.bottom
-            }
-            height: parent.radius
-            color: parent.color
-            visible: !base.isBottomElement
-        }
-
-        Rectangle
-        {
-            id: leftSquare
-            anchors
-            {
-                left: parent.left
-                top: parent.top
-                bottom: parent.bottom
-            }
-            width: parent.radius
-            color: parent.color
-        }
-    }
-    contentItem: Rectangle
-    {
-        opacity: parent.enabled ? 1.0 : 0.2
-        implicitWidth: Math.round(UM.Theme.getSize("button").width * 0.75)
-        implicitHeight: Math.round(UM.Theme.getSize("button").height * 0.75)
-        radius: Math.round(width * 0.5)
-
-        color:
-        {
-            if (base.checked && base.hovered)
-            {
-                return UM.Theme.getColor("toolbar_button_active_hover")
-            }
-            else if (base.checked)
-            {
-                return UM.Theme.getColor("toolbar_button_active")
-            }
-            else if(base.hovered)
-            {
-                return UM.Theme.getColor("toolbar_button_hover")
-            }
-            return UM.Theme.getColor("toolbar_background")
-        }
-        Loader
-        {
-            id: contentItemLoader
-            anchors.centerIn: parent
-            width: Math.round(UM.Theme.getSize("button").width / 2)
-            height: Math.round(UM.Theme.getSize("button").height / 2)
-        }
-    }
-
-    Cura.ToolTip
-    {
-        id: tooltip
-        tooltipText: base.text
-        visible: base.hovered
-    }
-}

resources/qml/Widgets/ComboBox.qml

@@ -33,7 +33,7 @@ ComboBox
         {
             name: "highlighted"
             when: control.hovered || control.activeFocus
-            PropertyChanges { target: background; liningColor: UM.Theme.getColor("border_main_light")}
+            PropertyChanges { target: background; liningColor: UM.Theme.getColor("border_main")}
         }
     ]
 

resources/qml/Widgets/RadioButton.qml

@@ -1,4 +1,4 @@
-// Copyright (c) 2019 Ultimaker B.V.
+// Copyright (c) 2022 Ultimaker B.V.
 // Cura is released under the terms of the LGPLv3 or higher.
 
 import QtQuick 2.10
@@ -13,32 +13,58 @@ import Cura 1.0 as Cura
 //
 RadioButton
 {
-    id: radioButton
+    id: control
 
     font: UM.Theme.getFont("default")
 
     states: [
         State {
-            name: "checked"
+            name: "selected-hover"
-            when: radioButton.checked
+            when: control.enabled && control.checked && control.hovered
             PropertyChanges
             {
-                target: indicator
+                target: indicator_background
-                color: UM.Theme.getColor("accent_1")
+                color: UM.Theme.getColor("radio_selected")
-                border.width: 0
+                border.color: UM.Theme.getColor("radio_border_hover")
             }
         },
-        State
+        State {
-        {
+            name: "selected"
-            name: "disabled"
+            when: control.enabled && control.checked
-            when: !radioButton.enabled
+            PropertyChanges
-            PropertyChanges { target: indicator; color: UM.Theme.getColor("background_1")}
+            {
+                target: indicator_background
+                color: UM.Theme.getColor("radio_selected")
+            }
         },
-        State
+        State {
-        {
+            name: "hovered"
-            name: "highlighted"
+            when: control.enabled && control.hovered
-            when: radioButton.hovered || radioButton.activeFocus
+            PropertyChanges
-            PropertyChanges { target: indicator; border.color: UM.Theme.getColor("border_main_light")}
+            {
+                target: indicator_background
+                border.color: UM.Theme.getColor("radio_border_hover")
+            }
+        },
+        State {
+            name: "selected_disabled"
+            when: !control.enabled && control.checked
+            PropertyChanges
+            {
+                target: indicator_background
+                color: UM.Theme.getColor("radio_selected_disabled")
+                border.color: UM.Theme.getColor("radio_border_disabled")
+            }
+        },
+        State {
+            name: "disabled"
+            when: !control.enabled
+            PropertyChanges
+            {
+                target: indicator_background
+                color: UM.Theme.getColor("radio_disabled")
+                border.color: UM.Theme.getColor("radio_border_disabled")
+            }
         }
     ]
 
@@ -49,30 +75,35 @@ RadioButton
 
     indicator: Rectangle
     {
+        id: indicator_background
         implicitWidth: UM.Theme.getSize("radio_button").width
         implicitHeight: UM.Theme.getSize("radio_button").height
         anchors.verticalCenter: parent.verticalCenter
         anchors.alignWhenCentered: false
         radius: width / 2
-        color: UM.Theme.getColor("background_2")
+        color: UM.Theme.getColor("radio")
         border.width: UM.Theme.getSize("default_lining").width
-        border.color: UM.Theme.getColor("text_disabled")
+        border.color: UM.Theme.getColor("radio_border")
 
         Rectangle
         {
+            id: indicator_dot
             width: (parent.width / 2) | 0
             height: width
             anchors.centerIn: parent
             radius: width / 2
-            color: radioButton.enabled ? UM.Theme.getColor("background_2") : UM.Theme.getColor("background_1")
+            color: control.enabled ? UM.Theme.getColor("radio_dot") : UM.Theme.getColor("radio_dot_disabled")
-            visible: radioButton.checked
+            visible: control.checked
+
+
         }
     }
 
     contentItem: UM.Label
     {
-        leftPadding: radioButton.indicator.width + radioButton.spacing
+        leftPadding: control.indicator.width + control.spacing
-        text: radioButton.text
+        text: control.text
-        font: radioButton.font
+        font: control.font
+        color: control.enabled ? UM.Theme.getColor("radio_text"): UM.Theme.getColor("radio_text_disabled")
     }
 }

resources/qml/Widgets/TextField.qml

@@ -1,4 +1,4 @@
-// Copyright (c) 2021 Ultimaker B.V.
+// Copyright (c) 2022 Ultimaker B.V.
 // Cura is released under the terms of the LGPLv3 or higher.
 
 import QtQuick 2.10
@@ -13,7 +13,7 @@ import Cura 1.1 as Cura
 //
 TextField
 {
-    id: textField
+    id: control
 
     property alias leftIcon: iconLeft.source
 
@@ -22,7 +22,7 @@ TextField
     hoverEnabled: true
     selectByMouse: true
     font: UM.Theme.getFont("default")
-    color: UM.Theme.getColor("text")
+    color: UM.Theme.getColor("text_field_text")
     renderType: Text.NativeRendering
     selectionColor: UM.Theme.getColor("text_selection")
     leftPadding: iconLeft.visible ? iconLeft.width + UM.Theme.getSize("default_margin").width * 2 : UM.Theme.getSize("thin_margin").width
@@ -31,20 +31,21 @@ TextField
         State
         {
             name: "disabled"
-            when: !textField.enabled
+            when: !control.enabled
-            PropertyChanges { target: backgroundRectangle; color: UM.Theme.getColor("setting_control_disabled")}
+            PropertyChanges { target: control; color: UM.Theme.getColor("text_field_text_disabled")}
+            PropertyChanges { target: backgroundRectangle; liningColor: UM.Theme.getColor("text_field_border_disabled")}
         },
         State
         {
             name: "invalid"
-            when: !textField.acceptableInput
+            when: !control.acceptableInput
             PropertyChanges { target: backgroundRectangle; color: UM.Theme.getColor("setting_validation_error_background")}
         },
         State
         {
             name: "hovered"
-            when: textField.hovered || textField.activeFocus
+            when: control.hovered || control.activeFocus
-            PropertyChanges { target: backgroundRectangle; liningColor: UM.Theme.getColor("border_main_light")}
+            PropertyChanges { target: backgroundRectangle; liningColor: UM.Theme.getColor("text_field_border_hovered")}
         }
     ]
 
@@ -66,7 +67,7 @@ TextField
             visible: source != ""
             height: UM.Theme.getSize("small_button_icon").height
             width: visible ? height : 0
-            color: textField.color
+            color: control.color
         }
     }
 }

resources/qml/qmldir

@@ -14,10 +14,8 @@ OutputDevicesActionButton 1.0 OutputDevicesActionButton.qml
 ExpandableComponent 1.0 ExpandableComponent.qml
 PrinterTypeLabel 1.0 PrinterTypeLabel.qml
 ViewsSelector 1.0 ViewsSelector.qml
-ToolbarButton 1.0 ToolbarButton.qml
 SettingView 1.0 SettingView.qml
 ProfileMenu 1.0 ProfileMenu.qml
-ToolTip 1.0 ToolTip.qml
 
 
 # Cura/WelcomePages

resources/themes/cura-dark/theme.json

@@ -23,7 +23,20 @@
         "text_primary_button": [255, 255, 255, 255],
         "text_secondary_button": [255, 255, 255, 255],
         "text_link_hover": [156, 195, 255, 255],
-        "text_lighter": [243, 243, 243, 255]
+        "text_lighter": [243, 243, 243, 255],
+
+        "um_green_1": [233, 245, 237, 255],
+        "um_green_5": [36, 162, 73, 255],
+        "um_green_9": [31, 44, 36, 255],
+        "um_red_1": [251, 232, 233, 255],
+        "um_red_5": [218, 30, 40, 255],
+        "um_red_9": [59, 31, 33, 255],
+        "um_orange_1": [255, 235, 221, 255],
+        "um_orange_5": [252, 123, 30, 255],
+        "um_orange_9": [64, 45, 32, 255],
+        "um_yellow_1": [255, 248, 225, 255],
+        "um_yellow_5": [253, 209, 58, 255],
+        "um_yellow_9": [64, 58, 36, 255]
     },
 
     "colors": {
@@ -136,10 +149,8 @@
         "setting_control_disabled_text": [255, 255, 255, 101],
         "setting_control_disabled_border": [255, 255, 255, 101],
         "setting_unit": [255, 255, 255, 127],
-        "setting_validation_error_background": [59, 31, 53, 255],
+        "setting_validation_error_background": "um_red_9",
-        "setting_validation_error": [212, 31, 53, 255],
+        "setting_validation_warning_background": "um_yellow_9",
-        "setting_validation_warning_background": [62, 54, 46, 255],
-        "setting_validation_warning": [245, 166, 35, 255],
         "setting_validation_ok": "background_2",
 
         "progressbar_background": [255, 255, 255, 48],
@@ -151,15 +162,6 @@
         "slider_handle": [255, 255, 255, 255],
         "slider_handle_active": [68, 192, 255, 255],
 
-        "checkbox": "background_1",
-        "checkbox_hover": [43, 48, 52, 255],
-        "checkbox_border": "text_disabled",
-        "checkbox_border_hover": "border_main",
-        "checkbox_mark": "text_default",
-        "checkbox_square": "text_disabled",
-        "checkbox_text": "text_default",
-        "checkbox_disabled": "background_2",
-
         "category_background": "background_3",
 
         "tooltip": "background_2",

resources/themes/cura-light/theme.json

@@ -188,7 +188,20 @@
         "text_primary_button": [255, 255, 255, 255],
         "text_secondary_button": [25, 110, 240, 255],
         "text_link_hover": [16, 70, 156, 255],
-        "text_lighter": [108, 108, 108, 255]
+        "text_lighter": [108, 108, 108, 255],
+
+        "um_green_1": [233, 245, 237, 255],
+        "um_green_5": [36, 162, 73, 255],
+        "um_green_9": [31, 44, 36, 255],
+        "um_red_1": [251, 232, 233, 255],
+        "um_red_5": [218, 30, 40, 255],
+        "um_red_9": [59, 31, 33, 255],
+        "um_orange_1": [255, 235, 221, 255],
+        "um_orange_5": [252, 123, 30, 255],
+        "um_orange_9": [64, 45, 32, 255],
+        "um_yellow_1": [255, 248, 225, 255],
+        "um_yellow_5": [253, 209, 58, 255],
+        "um_yellow_9": [64, 58, 36, 255]
     },
 
     "colors": {
@@ -304,10 +317,10 @@
         "setting_control_disabled_text": [127, 127, 127, 255],
         "setting_control_disabled_border": [127, 127, 127, 255],
         "setting_unit": [127, 127, 127, 255],
-        "setting_validation_error_background": [255, 66, 60, 255],
+        "setting_validation_error_background": "um_red_1",
-        "setting_validation_error": [127, 127, 127, 255],
+        "setting_validation_error": "um_red_5",
-        "setting_validation_warning_background": [255, 145, 62, 255],
+        "setting_validation_warning_background": "um_yellow_1",
-        "setting_validation_warning": [127, 127, 127, 255],
+        "setting_validation_warning": "um_yellow_5",
         "setting_validation_ok": "background_2",
 
         "material_compatibility_warning": [243, 166, 59, 255],
@@ -324,13 +337,36 @@
         "quality_slider_unavailable": [179, 179, 179, 255],
         "quality_slider_available": [0, 0, 0, 255],
 
-        "checkbox": [255, 255, 255, 255],
+        "checkbox": "background_1",
-        "checkbox_hover": "border_main",
+        "checkbox_hover": "background_1",
-        "checkbox_border": [180, 180, 180, 255],
-        "checkbox_border_hover": [25, 110, 240, 255],
-        "checkbox_mark": [35, 35, 35, 255],
         "checkbox_disabled": "background_2",
-        "checkbox_text": [0, 12, 26, 255],
+        "checkbox_border": [180, 180, 180, 255],
+        "checkbox_border_hover": "border_main",
+        "checkbox_border_disabled": "text_disabled",
+        "checkbox_mark": "text_default",
+        "checkbox_mark_disabled": "text_disabled",
+        "checkbox_square": [180, 180, 180, 255],
+        "checkbox_text": "text_default",
+        "checkbox_text_disabled": "text_disabled",
+
+        "radio": "background_1",
+        "radio_disabled": "background_2",
+        "radio_selected": "accent_1",
+        "radio_selected_disabled": "text_disabled",
+        "radio_border": [180, 180, 180, 255],
+        "radio_border_hover": "border_main",
+        "radio_border_disabled": "text_disabled",
+        "radio_dot": "background_1",
+        "radio_dot_disabled": "background_2",
+        "radio_text": "text_default",
+        "radio_text_disabled": "text_disabled",
+
+        "text_field": "background_1",
+        "text_field_border": [180, 180, 180, 255],
+        "text_field_border_hovered": "border_main",
+        "text_field_border_disabled": "border_main",
+        "text_field_text": "text_default",
+        "text_field_text_disabled": "text_disabled",
 
         "category_background": "background_2",