Merge branch 'ui_rework_4_0' into CURA-5876-Configuration_dropdown

Conflicts:
	plugins/PrepareStage/PrepareMenu.qml: Git was wrong, this was not really a conflict.
	resources/qml/ActionButton.qml: With iconSource being modified on ui_rework_4_0 and me modifying the icon to be able to display it on the left hand side.
	resources/qml/ActionPanel/OutputProcessWidget.qml: Git was wrong, not really a conflict.
	resources/qml/ActionPanel/SliceProcessWidget.qml: Git was wrong, not really a conflict.
	resources/qml/ExpandableComponent.qml: Both ui_rework_4_0 and me implemented a border around popups.
	resources/qml/MainWindow/MainWindowHeader.qml: Git was wrong, not really a conflict.
	resources/themes/cura-light/theme.json: Theme item was added in a place where I added whitespace.

3 files changed, 52 insertions, 36 deletions

diff --git a/resources/qml/ActionPanel/OutputDevicesActionButton.qml b/resources/qml/ActionPanel/OutputDevicesActionButton.qml
index a2a69ed526..12e4ac42fd 100644
--- a/resources/qml/ActionPanel/OutputDevicesActionButton.qml
+++ b/resources/qml/ActionPanel/OutputDevicesActionButton.qml
@@ -12,7 +12,7 @@ Item
 {
     id: widget
 
-    Cura.ActionButton
+    Cura.PrimaryButton
     {
         id: saveToButton
         height: parent.height
@@ -42,6 +42,9 @@ Item
         id: deviceSelectionMenu
         height: parent.height
 
+        shadowEnabled: true
+        shadowColor: UM.Theme.getColor("primary_shadow")
+
         anchors
         {
             top: parent.top
@@ -67,7 +70,7 @@ Item
 
             closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent
 
-            contentItem: Column
+            contentItem: ColumnLayout
             {
                 Repeater
                 {
@@ -79,7 +82,7 @@ Item
                         color: "transparent"
                         cornerRadius: 0
                         hoverColor: UM.Theme.getColor("primary")
-
+                        Layout.fillWidth: true
                         onClicked:
                         {
                             UM.OutputDeviceManager.setActiveDevice(model.id)
@@ -93,10 +96,7 @@ Item
             {
                 opacity: visible ? 1 : 0
                 Behavior on opacity { NumberAnimation { duration: 100 } }
-                radius: UM.Theme.getSize("default_radius").width
                 color: UM.Theme.getColor("action_panel_secondary")
-                border.color: UM.Theme.getColor("lining")
-                border.width: UM.Theme.getSize("default_lining").width
             }
         }
     }
diff --git a/resources/qml/ActionPanel/OutputProcessWidget.qml b/resources/qml/ActionPanel/OutputProcessWidget.qml
index 296ee2fc16..92f2bfab30 100644
--- a/resources/qml/ActionPanel/OutputProcessWidget.qml
+++ b/resources/qml/ActionPanel/OutputProcessWidget.qml
@@ -101,17 +101,18 @@ Column
         spacing: UM.Theme.getSize("default_margin").width
         width: parent.width
 
-        Cura.ActionButton
+        Cura.SecondaryButton
         {
             id: previewStageShortcut
 
+            height: UM.Theme.getSize("action_panel_button").height
             text: catalog.i18nc("@button", "Preview")
-            color: UM.Theme.getColor("secondary")
-            hoverColor: UM.Theme.getColor("secondary")
-            textColor: UM.Theme.getColor("primary")
-            textHoverColor: UM.Theme.getColor("text")
+
             onClicked: UM.Controller.setActiveStage("PreviewStage")
             visible: UM.Controller.activeStage != null && UM.Controller.activeStage.stageId != "PreviewStage"
+
+            shadowEnabled: true
+            shadowColor: UM.Theme.getColor("action_button_disabled_shadow")
         }
 
         Cura.OutputDevicesActionButton
diff --git a/resources/qml/ActionPanel/SliceProcessWidget.qml b/resources/qml/ActionPanel/SliceProcessWidget.qml
index 9ce86463f8..cae598fea6 100644
--- a/resources/qml/ActionPanel/SliceProcessWidget.qml
+++ b/resources/qml/ActionPanel/SliceProcessWidget.qml
@@ -40,9 +40,21 @@ Column
         }
     }
 
+    Label
+    {
+        id: autoSlicingLabel
+        width: parent.width
+        visible: prepareButtons.autoSlice && widget.backendState == UM.Backend.Processing
+
+        text: catalog.i18nc("@label:PrintjobStatus", "Auto slicing...")
+        color: UM.Theme.getColor("text")
+        font: UM.Theme.getFont("very_small")
+        renderType: Text.NativeRendering
+    }
+
     Cura.IconLabel
     {
-        id: message
+        id: unableToSliceMessage
         width: parent.width
         visible: widget.backendState == UM.Backend.Error
 
@@ -81,37 +93,40 @@ Column
         }
     }
 
-    Cura.ActionButton
+    Item
     {
-        id: prepareButton
-        width: parent.width
-        fixedWidthMode: true
-        text:
-        {
-            if ([UM.Backend.NotStarted, UM.Backend.Error].indexOf(widget.backendState) != -1)
-            {
-                return catalog.i18nc("@button", "Slice")
-            }
-            if (autoSlice)
-            {
-                return catalog.i18nc("@button", "Auto slicing...")
-            }
-            return catalog.i18nc("@button", "Cancel")
-        }
-        enabled: !autoSlice && !disabledSlice
-
+        id: prepareButtons
         // Get the current value from the preferences
         property bool autoSlice: UM.Preferences.getValue("general/auto_slice")
         // Disable the slice process when
-        property bool disabledSlice: [UM.Backend.Done, UM.Backend.Error].indexOf(widget.backendState) != -1
 
-        disabledColor: disabledSlice ? UM.Theme.getColor("action_button_disabled") : "transparent"
-        textDisabledColor: disabledSlice ?  UM.Theme.getColor("action_button_disabled_text") : UM.Theme.getColor("primary")
-        outlineDisabledColor: disabledSlice ? UM.Theme.getColor("action_button_disabled_border") : "transparent"
+        width: parent.width
+        height: UM.Theme.getSize("action_panel_button").height
+        visible: !autoSlice
+        Cura.PrimaryButton
+        {
+            id: sliceButton
+            fixedWidthMode: true
+            anchors.fill: parent
+            text: catalog.i18nc("@button", "Slice")
+            enabled: widget.backendState != UM.Backend.Error
+            visible: widget.backendState == UM.Backend.NotStarted || widget.backendState == UM.Backend.Error
+            onClicked: sliceOrStopSlicing()
+        }
 
-        onClicked: sliceOrStopSlicing()
+        Cura.SecondaryButton
+        {
+            id: cancelButton
+            fixedWidthMode: true
+            anchors.fill: parent
+            text: catalog.i18nc("@button", "Cancel")
+            enabled: sliceButton.enabled
+            visible: !sliceButton.visible
+            onClicked: sliceOrStopSlicing()
+        }
     }
 
+
     // React when the user changes the preference of having the auto slice enabled
     Connections
     {
@@ -119,7 +134,7 @@ Column
         onPreferenceChanged:
         {
             var autoSlice = UM.Preferences.getValue("general/auto_slice")
-            prepareButton.autoSlice = autoSlice
+            prepareButtons.autoSlice = autoSlice
         }
     }