From f40d603e6404c3df8d8daef2f15d77286d5c842b Mon Sep 17 00:00:00 2001
From: Sander van Grieken <sander@outrightsolutions.nl>
Date: Wed, 10 May 2023 17:16:35 +0200
Subject: [PATCH] qml: styling bip39 refine and recovery

---
 .../qml/components/BIP39RecoveryDialog.qml    | 15 +++-
 .../qml/components/wizard/WCBIP39Refine.qml   | 74 ++++++++++---------
 2 files changed, 53 insertions(+), 36 deletions(-)

diff --git a/electrum/gui/qml/components/BIP39RecoveryDialog.qml b/electrum/gui/qml/components/BIP39RecoveryDialog.qml
index 8585a0f04..89b23061d 100644
--- a/electrum/gui/qml/components/BIP39RecoveryDialog.qml
+++ b/electrum/gui/qml/components/BIP39RecoveryDialog.qml
@@ -88,7 +88,7 @@ ElDialog {
 
                         GridLayout {
                             id: itemLayout
-                            columns: 2
+                            columns: 3
                             rowSpacing: 0
 
                             anchors {
@@ -98,9 +98,20 @@ ElDialog {
                                 rightMargin: constants.paddingMedium
                             }
 
+                            Item {
+                                Layout.columnSpan: 3
+                                Layout.preferredHeight: constants.paddingLarge
+                                Layout.preferredWidth: 1
+                            }
+                            Image {
+                                Layout.rowSpan: 3
+                                source: Qt.resolvedUrl('../../icons/wallet.png')
+                            }
                             Label {
                                 Layout.columnSpan: 2
+                                Layout.fillWidth: true
                                 text: model.description
+                                wrapMode: Text.Wrap
                             }
                             Label {
                                 text: qsTr('script type')
@@ -119,7 +130,7 @@ ElDialog {
                                 text: model.derivation_path
                             }
                             Item {
-                                Layout.columnSpan: 2
+                                Layout.columnSpan: 3
                                 Layout.preferredHeight: constants.paddingLarge
                                 Layout.preferredWidth: 1
                             }
diff --git a/electrum/gui/qml/components/wizard/WCBIP39Refine.qml b/electrum/gui/qml/components/wizard/WCBIP39Refine.qml
index a55a89328..20d7c4b14 100644
--- a/electrum/gui/qml/components/wizard/WCBIP39Refine.qml
+++ b/electrum/gui/qml/components/wizard/WCBIP39Refine.qml
@@ -85,38 +85,6 @@ WizardComponent {
             id: mainLayout
             width: parent.width
 
-            Label {
-                text: qsTr('Script type and Derivation path')
-            }
-            Pane {
-                Layout.alignment: Qt.AlignHCenter
-                padding: 0
-                visible: !isMultisig
-
-                FlatButton {
-                    text: qsTr('Detect Existing Accounts')
-                    onClicked: {
-                        var dialog = bip39recoveryDialog.createObject(mainLayout, {
-                            walletType: wizard_data['wallet_type'],
-                            seed: wizard_data['seed'],
-                            seedExtraWords: wizard_data['seed_extra_words']
-                        })
-                        dialog.accepted.connect(function () {
-                            // select matching script type button and set derivation path
-                            for (var i = 0; i < scripttypegroup.buttons.length; i++) {
-                                var btn = scripttypegroup.buttons[i]
-                                if (btn.visible && btn.scripttype == dialog.scriptType) {
-                                    btn.checked = true
-                                    derivationpathtext.text = dialog.derivationPath
-                                    return
-                                }
-                            }
-                        })
-                        dialog.open()
-                    }
-                }
-            }
-
             Label {
                 text: qsTr('Choose the type of addresses in your wallet.')
             }
@@ -164,17 +132,55 @@ WizardComponent {
             }
 
             InfoTextArea {
-                Layout.preferredWidth: parent.width
+                Layout.fillWidth: true
                 text: qsTr('You can override the suggested derivation path.') + ' ' +
                     qsTr('If you are not sure what this is, leave this field unchanged.')
             }
 
+            Label {
+                text: qsTr('Derivation path')
+            }
+
             TextField {
                 id: derivationpathtext
                 Layout.fillWidth: true
-                placeholderText: qsTr('Derivation path')
+                Layout.leftMargin: constants.paddingMedium
                 onTextChanged: validate()
             }
+
+            Pane {
+                Layout.alignment: Qt.AlignHCenter
+                Layout.topMargin: constants.paddingLarge
+                padding: 0
+                visible: !isMultisig
+                background: Rectangle {
+                    color: Qt.lighter(Material.dialogColor, 1.5)
+                }
+
+                FlatButton {
+                    text: qsTr('Detect Existing Accounts')
+                    onClicked: {
+                        var dialog = bip39recoveryDialog.createObject(mainLayout, {
+                            walletType: wizard_data['wallet_type'],
+                            seed: wizard_data['seed'],
+                            seedExtraWords: wizard_data['seed_extra_words']
+                        })
+                        dialog.accepted.connect(function () {
+                            // select matching script type button and set derivation path
+                            for (var i = 0; i < scripttypegroup.buttons.length; i++) {
+                                var btn = scripttypegroup.buttons[i]
+                                if (btn.visible && btn.scripttype == dialog.scriptType) {
+                                    btn.checked = true
+                                    derivationpathtext.text = dialog.derivationPath
+                                    return
+                                }
+                            }
+                        })
+                        dialog.open()
+                    }
+                }
+            }
+
         }
     }