Wizard: add scaleRatio

9 files changed, 83 insertions, 84 deletions

diff --git a/wizard/WizardFinish.qml b/wizard/WizardFinish.qml
index a6999e9c..30292f08 100644
--- a/wizard/WizardFinish.qml
+++ b/wizard/WizardFinish.qml
@@ -120,7 +120,7 @@ ColumnLayout {
         Text {
             Layout.fillWidth: true
             font.family: "Arial"
-            font.pixelSize: 28
+            font.pixelSize: 28 * scaleRatio
             wrapMode: Text.Wrap
             horizontalAlignment: Text.AlignHCenter
             //renderType: Text.NativeRendering
@@ -132,7 +132,7 @@ ColumnLayout {
             Layout.fillWidth: true
             id: settingsText
             font.family: "Arial"
-            font.pixelSize: 16
+            font.pixelSize: 16 * scaleRatio
             wrapMode: Text.Wrap
             textFormat: Text.RichText
             horizontalAlignment: Text.AlignHLeft
diff --git a/wizard/WizardMain.qml b/wizard/WizardMain.qml
index 1b16acfd..0eeb4384 100644
--- a/wizard/WizardMain.qml
+++ b/wizard/WizardMain.qml
@@ -40,10 +40,10 @@ ColumnLayout {
     property alias nextButton : nextButton
     property var settings : ({})
     property int currentPage: 0
-    property int wizardLeftMargin: (!isMobile) ?  150 : 25
-    property int wizardRightMargin: (!isMobile) ? 150 : 25
-    property int wizardBottomMargin: (isMobile) ? 150 : 25
-    property int wizardTopMargin: (isMobile) ? 15 : 50
+    property int wizardLeftMargin: (!isMobile) ?  150 : 25 * scaleRatio
+    property int wizardRightMargin: (!isMobile) ? 150 : 25 * scaleRatio
+    property int wizardBottomMargin: (isMobile) ? 150 : 25 * scaleRatio
+    property int wizardTopMargin: (isMobile) ? 15 * scaleRatio : 50
 
     property var paths: {
      //   "create_wallet" : [welcomePage, optionsPage, createWalletPage, passwordPage, donationPage, finishPage ],
@@ -308,10 +308,10 @@ ColumnLayout {
         anchors.verticalCenter: wizard.verticalCenter
         anchors.left: parent.left
         anchors.leftMargin: isMobile ?  20 :  50
-        anchors.bottomMargin: isMobile ?  20 :  50
+        anchors.bottomMargin: isMobile ?  20 * scaleRatio :  50
         visible: parent.currentPage > 0
 
-        width: 50; height: 50
+        width: 50 * scaleRatio; height: 50 * scaleRatio
         radius: 25
         color: prevArea.containsMouse ? "#FF4304" : "#FF6C3C"
 
@@ -333,10 +333,10 @@ ColumnLayout {
         id: nextButton
         anchors.verticalCenter: wizard.verticalCenter
         anchors.right: parent.right
-        anchors.rightMargin: isMobile ?  20 :  50
-        anchors.bottomMargin: isMobile ?  20 :  50
+        anchors.rightMargin: isMobile ?  20 * scaleRatio :  50
+        anchors.bottomMargin: isMobile ?  20 * scaleRatio :  50
         visible: currentPage > 1 && currentPage < pages.length - 1
-        width: 50; height: 50
+        width: 50 * scaleRatio; height: 50 * scaleRatio
         radius: 25
         color: enabled ? nextArea.containsMouse ? "#FF4304" : "#FF6C3C" : "#DBDBDB"
 
@@ -359,7 +359,7 @@ ColumnLayout {
         id: sendButton
         anchors.right: parent.right
         anchors.bottom: parent.bottom
-        anchors.margins:  (isMobile) ? 20 : 50
+        anchors.margins:  (isMobile) ? 20 * scaleRatio : 50 * scaleRatio
         text: qsTr("USE MONERO") + translationManager.emptyString
         shadowReleasedColor: "#FF4304"
         shadowPressedColor: "#B32D00"
@@ -376,7 +376,7 @@ ColumnLayout {
        id: createViewOnlyWalletButton
        anchors.right: parent.right
        anchors.bottom: parent.bottom
-       anchors.margins: (isMobile) ? 20 : 50
+       anchors.margins: (isMobile) ? 20 * scaleRatio : 50
        text: qsTr("Create wallet") + translationManager.emptyString
        shadowReleasedColor: "#FF4304"
        shadowPressedColor: "#B32D00"
@@ -408,7 +408,7 @@ ColumnLayout {
        id: abortViewOnlyButton
        anchors.right: createViewOnlyWalletButton.left
        anchors.bottom: parent.bottom
-       anchors.margins:  (isMobile) ? 20 : 50
+       anchors.margins:  (isMobile) ? 20 * scaleRatio : 50
        text: qsTr("Abort") + translationManager.emptyString
        shadowReleasedColor: "#FF4304"
        shadowPressedColor: "#B32D00"
diff --git a/wizard/WizardManageWalletUI.qml b/wizard/WizardManageWalletUI.qml
index 9b3f206d..c9470a1d 100644
--- a/wizard/WizardManageWalletUI.qml
+++ b/wizard/WizardManageWalletUI.qml
@@ -118,7 +118,7 @@ ColumnLayout {
             horizontalAlignment: Text.AlignHCenter
             id: titleText
             font.family: "Arial"
-            font.pixelSize: 28
+            font.pixelSize: 28 * scaleRatio
             wrapMode: Text.Wrap
             color: "#3F3F3F"
         }
@@ -128,8 +128,8 @@ ColumnLayout {
         Layout.bottomMargin: rowSpacing
 
         Label {
-            Layout.topMargin: 20
-            fontSize: 14
+            Layout.topMargin: 20 * scaleRatio
+            fontSize: 14 * scaleRatio
             text:  qsTr("Wallet name")
                    + translationManager.emptyString
         }
@@ -137,8 +137,8 @@ ColumnLayout {
         LineEdit {
             id: accountName
             Layout.fillWidth: true
-            Layout.maximumWidth: 600
-            Layout.minimumWidth: 200
+            Layout.maximumWidth: 600 * scaleRatio
+            Layout.minimumWidth: 200 * scaleRatio
             text: defaultAccountName
             onTextUpdated: checkNextButton()
         }
@@ -183,8 +183,8 @@ ColumnLayout {
         WizardMemoTextInput {
             id : memoTextItem
             Layout.fillWidth: true
-            Layout.maximumWidth: 600
-            Layout.minimumWidth: 200
+            Layout.maximumWidth: 600 * scaleRatio
+            Layout.minimumWidth: 200 * scaleRatio
         }
     }
 
@@ -198,24 +198,24 @@ ColumnLayout {
         LineEdit {
             Layout.fillWidth: true
             id: addressLine
-            Layout.maximumWidth: 600
-            Layout.minimumWidth: 200
+            Layout.maximumWidth: 600 * scaleRatio
+            Layout.minimumWidth: 200 * scaleRatio
             placeholderText: qsTr("Account address (public)") + translationManager.emptyString
             onTextUpdated: checkNextButton()
         }
         LineEdit {
             Layout.fillWidth: true
             id: viewKeyLine
-            Layout.maximumWidth: 600
-            Layout.minimumWidth: 200
+            Layout.maximumWidth: 600 * scaleRatio
+            Layout.minimumWidth: 200 * scaleRatio
             placeholderText: qsTr("View key (private)") + translationManager.emptyString
             onTextUpdated: checkNextButton()
 
         }
         LineEdit {
             Layout.fillWidth: true
-            Layout.maximumWidth: 600
-            Layout.minimumWidth: 200
+            Layout.maximumWidth: 600 * scaleRatio
+            Layout.minimumWidth: 200 * scaleRatio
             id: spendKeyLine
             placeholderText: qsTr("Spend key (private)") + translationManager.emptyString
             onTextUpdated: checkNextButton()
@@ -227,8 +227,8 @@ ColumnLayout {
         LineEdit {
             id: restoreHeightItem
             Layout.fillWidth: true
-            Layout.maximumWidth: 600
-            Layout.minimumWidth: 200
+            Layout.maximumWidth: 600 * scaleRatio
+            Layout.minimumWidth: 200 * scaleRatio
             placeholderText: qsTr("Restore height (optional)") + translationManager.emptyString
             validator: IntValidator {
                 bottom:0
@@ -240,15 +240,15 @@ ColumnLayout {
     ColumnLayout {
         Label {
             Layout.fillWidth: true
-            Layout.topMargin: 20
+            Layout.topMargin: 20 * scaleRatio
             fontSize: 14
             text: qsTr("Your wallet is stored in") + ": " + fileUrlInput.text;
         }
 
         LineEdit {
             Layout.fillWidth: true
-            Layout.maximumWidth: 600
-            Layout.minimumWidth: 200
+            Layout.maximumWidth: 600 * scaleRatio
+            Layout.minimumWidth: 200 * scaleRatio
             id: fileUrlInput
             text: moneroAccountsDir + "/"
 
diff --git a/wizard/WizardMemoTextInput.qml b/wizard/WizardMemoTextInput.qml
index e9fbfdc9..c999f49c 100644
--- a/wizard/WizardMemoTextInput.qml
+++ b/wizard/WizardMemoTextInput.qml
@@ -25,21 +25,21 @@ Column {
         TextEdit {
             id: memoTextInput
             property alias placeholderText: memoTextPlaceholder.text
-            textMargin: 8
+            textMargin: 8 * scaleRatio
             text: ""
             font.family: "Arial"
-            font.pixelSize: 16
+            font.pixelSize: 16 * scaleRatio
             wrapMode: TextInput.Wrap
             width: parent.width
             selectByMouse: true
-            property int minimumHeight: 100
+            property int minimumHeight: 100 * scaleRatio
             height: contentHeight > minimumHeight ? contentHeight : minimumHeight
 
             Text {
                 id: memoTextPlaceholder
                 anchors.fill:parent
-                font.pixelSize: 16
-                anchors.margins: 8
+                font.pixelSize: 16 * scaleRatio
+                anchors.margins: 8 * scaleRatio
                 font.bold:true
                 text: qsTr("Enter your 25 word mnemonic seed") + translationManager.emptyString
                 color: "#BABABA"
@@ -75,14 +75,14 @@ Column {
             Text {
                 id: wordsTipText
                 anchors.fill: parent
-                anchors.topMargin : 16
-                anchors.bottomMargin: 16
-                anchors.leftMargin: 16
-                anchors.rightMargin: 16
+                anchors.topMargin : 16 * scaleRatio
+                anchors.bottomMargin: 16 * scaleRatio
+                anchors.leftMargin: 16 * scaleRatio
+                anchors.rightMargin: 16 * scaleRatio
                 verticalAlignment: Text.AlignVCenter
                 horizontalAlignment: Text.AlignHCenter
                 font.family: "Arial"
-                font.pixelSize: 15
+                font.pixelSize: 15 * scaleRatio
                 color: "#4A4646"
                 wrapMode: Text.Wrap
                 text: qsTr("This seed is <b>very</b> important to write down and keep secret. It is all you need to backup and restore your wallet.")
diff --git a/wizard/WizardOptions.qml b/wizard/WizardOptions.qml
index 0154b9ce..f46c06d7 100644
--- a/wizard/WizardOptions.qml
+++ b/wizard/WizardOptions.qml
@@ -38,8 +38,8 @@ ColumnLayout {
     signal openWalletClicked()
     opacity: 0
     visible: false
-    property int buttonSize: (isMobile) ? 80 : 190
-    property int buttonImageSize: (isMobile) ? buttonSize - 10 : buttonSize - 30
+    property int buttonSize: (isMobile) ? 80 * scaleRatio : 190 * scaleRatio
+    property int buttonImageSize: (isMobile) ? buttonSize - 10 * scaleRatio : buttonSize - 30 * scaleRatio
 
     function onPageClosed() {
         // Save settings used in open from file.
@@ -60,13 +60,13 @@ ColumnLayout {
         id: headerColumn
         Layout.leftMargin: wizardLeftMargin
         Layout.rightMargin: wizardRightMargin
-        Layout.bottomMargin: (!isMobile) ? 40 : 20
-        spacing: 30
+        Layout.bottomMargin: (!isMobile) ? 40 * scaleRatio : 20
+        spacing: 30 * scaleRatio
 
         Text {
             Layout.fillWidth: true
             font.family: "Arial"
-            font.pixelSize: 28
+            font.pixelSize: 28 * scaleRatio
             //renderType: Text.NativeRendering
             color: "#3F3F3F"
             wrapMode: Text.Wrap
@@ -77,7 +77,7 @@ ColumnLayout {
         Text {
             Layout.fillWidth: true
             font.family: "Arial"
-            font.pixelSize: 18
+            font.pixelSize: 18 * scaleRatio
             //renderType: Text.NativeRendering
             color: "#4A4646"
             wrapMode: Text.Wrap
@@ -91,8 +91,8 @@ ColumnLayout {
         Layout.rightMargin: wizardRightMargin
         Layout.alignment: Qt.AlignCenter
         id: actionButtons
-        columnSpacing: 40
-        rowSpacing: 10
+        columnSpacing: 40 * scaleRatio
+        rowSpacing: 10 * scaleRatio
         Layout.fillWidth: true
         Layout.fillHeight: true
         flow: isMobile ? GridLayout.TopToBottom : GridLayout.LeftToRight
@@ -101,8 +101,8 @@ ColumnLayout {
             Layout.fillHeight: true
             Layout.fillWidth: true
             flow: !isMobile ? GridLayout.TopToBottom : GridLayout.LeftToRight
-            rowSpacing: 20
-            columnSpacing: 10
+            rowSpacing: 20 * scaleRatio
+            columnSpacing: 10 * scaleRatio
 
             Rectangle {
                 Layout.preferredHeight: page.buttonSize
@@ -132,9 +132,9 @@ ColumnLayout {
             }
 
             Text {
-                Layout.preferredWidth: 190
+                Layout.preferredWidth: page.buttonSize
                 font.family: "Arial"
-                font.pixelSize: 16
+                font.pixelSize: 16 * scaleRatio
                 color: "#4A4949"
                 horizontalAlignment: Text.AlignHCenter
                 wrapMode: Text.WordWrap
@@ -146,8 +146,8 @@ ColumnLayout {
             Layout.fillWidth: true
             Layout.fillHeight: true
             flow: !isMobile ? GridLayout.TopToBottom : GridLayout.LeftToRight
-            rowSpacing: 20
-            columnSpacing: 10
+            rowSpacing: 20 * scaleRatio
+            columnSpacing: 10 * scaleRatio
 
             Rectangle {
                 Layout.preferredHeight: page.buttonSize
@@ -156,7 +156,7 @@ ColumnLayout {
                 color: recoverWalletArea.containsMouse ? "#DBDBDB" : "#FFFFFF"
 
                 Image {
-                    width: page.buttomImageSize
+                    width: page.buttonImageSize
                     height: page.buttonImageSize
                     fillMode: Image.PreserveAspectFit
                     anchors.centerIn: parent
@@ -174,9 +174,9 @@ ColumnLayout {
             }
 
             Text {
-                Layout.preferredWidth: 190
+                Layout.preferredWidth: page.buttonSize
                 font.family: "Arial"
-                font.pixelSize: 16
+                font.pixelSize: 16 * scaleRatio
                 color: "#4A4949"
                 horizontalAlignment: Text.AlignHCenter
                 text: qsTr("Restore wallet from keys or mnemonic seed") + translationManager.emptyString
@@ -189,8 +189,8 @@ ColumnLayout {
             Layout.fillHeight: true
             Layout.fillWidth: true
             flow: !isMobile ? GridLayout.TopToBottom : GridLayout.LeftToRight
-            rowSpacing: 20
-            columnSpacing: 10
+            rowSpacing: 20 * scaleRatio
+            columnSpacing: 10 * scaleRatio
 
             Rectangle {
                 Layout.preferredHeight: page.buttonSize
@@ -217,9 +217,9 @@ ColumnLayout {
             }
 
             Text {
-                Layout.preferredWidth: 190
+                Layout.preferredWidth: page.buttonSize
                 font.family: "Arial"
-                font.pixelSize: 16
+                font.pixelSize: 16 * scaleRatio
                 color: "#4A4949"
                 horizontalAlignment: Text.AlignHCenter
                 text: qsTr("Open a wallet from file") + translationManager.emptyString
diff --git a/wizard/WizardPassword.qml b/wizard/WizardPassword.qml
index 2444add0..0b5b4282 100644
--- a/wizard/WizardPassword.qml
+++ b/wizard/WizardPassword.qml
@@ -107,7 +107,7 @@ ColumnLayout {
             Layout.fillWidth: true
             id: titleText
             font.family: "Arial"
-            font.pixelSize: 28
+            font.pixelSize: 28 * scaleRatio
             wrapMode: Text.Wrap
             horizontalAlignment: Text.AlignHCenter
             //renderType: Text.NativeRendering
@@ -117,9 +117,9 @@ ColumnLayout {
 
         Text {
             Layout.fillWidth: true
-            Layout.bottomMargin: 30
+            Layout.bottomMargin: 30 * scaleRatio
             font.family: "Arial"
-            font.pixelSize: 18
+            font.pixelSize: 18 * scaleRatio
             wrapMode: Text.Wrap
             //renderType: Text.NativeRendering
             color: "#4A4646"
diff --git a/wizard/WizardPasswordInput.qml b/wizard/WizardPasswordInput.qml
index 6be2f618..a2651440 100644
--- a/wizard/WizardPasswordInput.qml
+++ b/wizard/WizardPasswordInput.qml
@@ -42,7 +42,7 @@ ColumnLayout {
         id : password
         focus:true
         font.family: "Arial"
-        font.pixelSize: (isMobile) ? 25 : 26
+        font.pixelSize: (isMobile) ? 25 * scaleRatio : 26 * scaleRatio
         echoMode: TextInput.Password
         style: TextFieldStyle {
             renderType: Text.NativeRendering
diff --git a/wizard/WizardPasswordUI.qml b/wizard/WizardPasswordUI.qml
index c8e98905..0239b6a6 100644
--- a/wizard/WizardPasswordUI.qml
+++ b/wizard/WizardPasswordUI.qml
@@ -64,8 +64,8 @@ ColumnLayout {
     WizardPasswordInput {
         id: passwordItem
         Layout.fillWidth: true
-        Layout.maximumWidth: 300
-        Layout.minimumWidth: 200
+        Layout.maximumWidth: 300 * scaleRatio
+        Layout.minimumWidth: 200 * scaleRatio
         Layout.alignment: Qt.AlignHCenter
         placeholderText : qsTr("Password") + translationManager.emptyString;
         KeyNavigation.tab: retypePasswordItem
@@ -76,8 +76,8 @@ ColumnLayout {
     WizardPasswordInput {
         id: retypePasswordItem
         Layout.fillWidth: true
-        Layout.maximumWidth: 300
-        Layout.minimumWidth: 200
+        Layout.maximumWidth: 300 * scaleRatio
+        Layout.minimumWidth: 200 * scaleRatio
         Layout.alignment: Qt.AlignHCenter
         placeholderText : qsTr("Confirm password") + translationManager.emptyString;
         KeyNavigation.tab: passwordItem
@@ -85,7 +85,7 @@ ColumnLayout {
     }
 
     PrivacyLevelSmall {
-        Layout.topMargin: isMobile ? 20 : 40
+        Layout.topMargin: isMobile ? 20 * scaleRatio : 40 * scaleRatio
         Layout.fillWidth: true
         id: privacyLevel
         background: "#F0EEEE"
diff --git a/wizard/WizardWelcome.qml b/wizard/WizardWelcome.qml
index 8b440092..32249cb1 100644
--- a/wizard/WizardWelcome.qml
+++ b/wizard/WizardWelcome.qml
@@ -60,13 +60,13 @@ ColumnLayout {
         id: headerColumn
         Layout.leftMargin: wizardLeftMargin
         Layout.rightMargin: wizardRightMargin
-        Layout.bottomMargin: 40
-        spacing: 20
+        Layout.bottomMargin: 40 * scaleRatio
+        spacing: 20 * scaleRatio
 
         Text {
             Layout.fillWidth: true
             font.family: "Arial"
-            font.pixelSize: 28
+            font.pixelSize: 28 * scaleRatio
             color: "#3F3F3F"
             wrapMode: Text.Wrap
             horizontalAlignment: Text.AlignHCenter
@@ -76,7 +76,7 @@ ColumnLayout {
         Text {
             Layout.fillWidth: true
             font.family: "Arial"
-            font.pixelSize: 18
+            font.pixelSize: 18 * scaleRatio
             color: "#4A4646"
             wrapMode: Text.Wrap
             horizontalAlignment: Text.AlignHCenter
@@ -116,17 +116,16 @@ ColumnLayout {
             property int margin: (isMobile) ? 0 : Math.floor(appWindow.width/12);
 
             id: gridView
-            cellWidth: 140
-            cellHeight: 120
+            cellWidth: 140 * scaleRatio
+            cellHeight: 120 * scaleRatio
             model: languagesModel
             // Hack to center the flag grid
-            property int columns: Math.floor(appWindow.width/140)
-            Layout.leftMargin: margin + (appWindow.width - cellWidth*columns) /2
+            property int columns: Math.floor(appWindow.width/cellWidth)
+            Layout.leftMargin: margin + (appWindow.width  - cellWidth*columns) /2
             Layout.rightMargin: margin
             Layout.fillWidth: true
             Layout.fillHeight: true
 
-
             clip: true
 
             delegate: ColumnLayout {
@@ -136,9 +135,9 @@ ColumnLayout {
 //                Layout.alignment: Qt.AlignHCenter
                 Rectangle {
                     id: flagRect
-                    width: 60; height: 60
+                    width: 60 * scaleRatio; height: 60 * scaleRatio
 //                    anchors.centerIn: parent
-                    radius: 30
+                    radius: 30 * scaleRatio
                     Layout.alignment: Qt.AlignHCenter
                     color: gridView.currentIndex === index ? "#DBDBDB" : "#FFFFFF"
                     Image {
@@ -149,7 +148,7 @@ ColumnLayout {
 
                 Text {
                     font.family: "Arial"
-                    font.pixelSize: 18
+                    font.pixelSize: 18 * scaleRatio
 //                    anchors.horizontalCenter: parent.horizontalCenter
                     font.bold: gridView.currentIndex === index
 //                    elide: Text.ElideRight