From bc8bf8780959db152ba572a39a4dc545d1900006 Mon Sep 17 00:00:00 2001
From: Diego Prado Gesto <d.pradogesto@ultimaker.com>
Date: Thu, 29 Nov 2018 15:54:02 +0100
Subject: [PATCH] Align the buttons at the bottom of the panel

Contributes to CURA-5941.
---
 resources/qml/ExpandableComponent.qml         |  3 +-
 .../PrintSetupSelectorContents.qml            | 71 +++++++++++--------
 2 files changed, 45 insertions(+), 29 deletions(-)

diff --git a/resources/qml/ExpandableComponent.qml b/resources/qml/ExpandableComponent.qml
index 0c3a8f80b9..47fa226e9d 100644
--- a/resources/qml/ExpandableComponent.qml
+++ b/resources/qml/ExpandableComponent.qml
@@ -163,6 +163,7 @@ Item
             onExited: background.color = headerBackgroundColor
         }
     }
+
     DropShadow
     {
         id: shadow
@@ -182,7 +183,7 @@ Item
         id: popup
 
         // Ensure that the popup is located directly below the headerItem
-        y: headerItemLoader.height + 2 * background.padding + base.shadowOffset + popupSpacingY
+        y: background.height + base.shadowOffset + popupSpacingY
 
         // Make the popup aligned with the rest, using the property popupAlignment to decide whether is right or left.
         // In case of right alignment, the 3x padding is due to left, right and padding between the button & text.
diff --git a/resources/qml/PrintSetupSelector/PrintSetupSelectorContents.qml b/resources/qml/PrintSetupSelector/PrintSetupSelectorContents.qml
index 6e71526f25..309d612fae 100644
--- a/resources/qml/PrintSetupSelector/PrintSetupSelectorContents.qml
+++ b/resources/qml/PrintSetupSelector/PrintSetupSelectorContents.qml
@@ -11,7 +11,7 @@ Item
 {
     id: popup
 
-    width: UM.Theme.getSize("print_setup_widget").width
+    width: UM.Theme.getSize("print_setup_widget").width - 2 * UM.Theme.getSize("default_margin").width
     height: childrenRect.height
 
     property int currentModeIndex: -1
@@ -87,22 +87,50 @@ Item
         color: UM.Theme.getColor("lining")
     }
 
-    Loader
+    Item
     {
-        id: loader
-        width: parent.width
+        id: contents
+        height: childrenRect.height
+
         anchors
         {
             top: header.bottom
+            left: parent.left
+            right: parent.right
+        }
+
+        RecommendedPrintSetup
+        {
+            anchors
+            {
+                left: parent.left
+                right: parent.right
+                top: parent.top
+            }
+            onShowTooltip: base.showTooltip(item, location, text)
+            onHideTooltip: base.hideTooltip()
+            visible: currentModeIndex == 0
+        }
+
+        CustomPrintSetup
+        {
+            anchors
+            {
+                left: parent.left
+                right: parent.right
+                top: parent.top
+            }
+            onShowTooltip: base.showTooltip(item, location, text)
+            onHideTooltip: base.hideTooltip()
+            visible: currentModeIndex == 1
         }
-        sourceComponent: currentModeIndex == 0 ? recommendedPrintSetup : customPrintSetup
     }
 
     Rectangle
     {
         id: buttonsSeparator
 
-        anchors.top: loader.bottom
+        anchors.top: contents.bottom
         width: parent.width
         height: UM.Theme.getSize("default_lining").height
         color: UM.Theme.getColor("lining")
@@ -111,7 +139,8 @@ Item
     Item
     {
         id: buttonRow
-        height: childrenRect.height
+        property real padding: UM.Theme.getSize("default_margin").width
+        height: childrenRect.height + 2 * padding
 
         // The buttonsSeparator is inside the buttonRow. This is to avoid some weird behaviours with the scroll bar.
         anchors
@@ -123,46 +152,32 @@ Item
 
         Cura.SecondaryButton
         {
+            anchors.top: parent.top
             anchors.left: parent.left
+            anchors.margins: parent.padding
             leftPadding: UM.Theme.getSize("default_margin").width
             rightPadding: UM.Theme.getSize("default_margin").width
             text: catalog.i18nc("@button", "Recommended")
+            iconSource: UM.Theme.getIcon("arrow_left")
             visible: currentModeIndex == 1
             onClicked: currentModeIndex = 0
         }
 
         Cura.SecondaryButton
         {
+            anchors.top: parent.top
             anchors.right: parent.right
+            anchors.margins: UM.Theme.getSize("default_margin").width
             leftPadding: UM.Theme.getSize("default_margin").width
             rightPadding: UM.Theme.getSize("default_margin").width
             text: catalog.i18nc("@button", "Custom")
+            iconSource: UM.Theme.getIcon("arrow_right")
+            iconOnRightSide: true
             visible: currentModeIndex == 0
             onClicked: currentModeIndex = 1
         }
     }
 
-    Component
-    {
-        id: recommendedPrintSetup
-        RecommendedPrintSetup
-        {
-            onShowTooltip: base.showTooltip(item, location, text)
-            onHideTooltip: base.hideTooltip()
-        }
-    }
-
-    Component
-    {
-        id: customPrintSetup
-        CustomPrintSetup
-        {
-            onShowTooltip: base.showTooltip(item, location, text)
-            onHideTooltip: base.hideTooltip()
-        }
-    }
-
-
     Component.onCompleted:
     {
         var index = Math.round(UM.Preferences.getValue("cura/active_mode"))