From 067b6f6fb0ef5ac6d3a0f15a7bcfb4e884efba1a Mon Sep 17 00:00:00 2001
From: Jonathan Rainville <rainville.jonathan@gmail.com>
Date: Wed, 13 May 2020 14:17:18 -0400
Subject: [PATCH] feat: add basic WalletLayout

---
 ui/app/AppLayouts/WalletLayout.qml | 111 +++++++++++++++++++++++++++++
 ui/app/AppLayouts/qmldir           |   3 +-
 ui/app/AppMain.qml                 |   7 ++
 ui/imports/Theme.qml               |   1 +
 ui/nim-status-client.pro           |   1 +
 5 files changed, 122 insertions(+), 1 deletion(-)
 create mode 100644 ui/app/AppLayouts/WalletLayout.qml

diff --git a/ui/app/AppLayouts/WalletLayout.qml b/ui/app/AppLayouts/WalletLayout.qml
new file mode 100644
index 0000000000..4cca7ec019
--- /dev/null
+++ b/ui/app/AppLayouts/WalletLayout.qml
@@ -0,0 +1,111 @@
+import QtQuick 2.3
+import QtQuick.Controls 1.3
+import QtQuick.Controls 2.3
+import QtQuick.Layouts 1.3
+import Qt.labs.platform 1.1
+import "../../imports"
+
+SplitView {
+    id: walletView
+    x: 0
+    y: 0
+    Layout.fillHeight: true
+    Layout.fillWidth: true
+    // Those anchors show a warning too, but whithout them, there is a gap on the right
+    anchors.right: parent.right
+    anchors.rightMargin: 0
+    anchors.left: parent.left
+    anchors.leftMargin: 0
+
+    ColumnLayout {
+        id: walletInfoContainer
+        width: 340
+        spacing: 0
+        anchors.left: parent.left
+        anchors.leftMargin: 0
+        anchors.top: parent.top
+        anchors.topMargin: 0
+        anchors.bottom: parent.bottom
+        anchors.bottomMargin: 0
+
+        RowLayout {
+            id: walletHeader
+            height: 300
+            Layout.fillWidth: true
+
+            Rectangle {
+                id: walletHeaderContent
+                width: 200
+                height: 200
+                color: Theme.blue
+                Layout.fillHeight: true
+                Layout.fillWidth: true
+
+                Item {
+                    id: walletValueTextContainer
+                    x: 140
+                    width: 175
+                    height: 40
+                    anchors.horizontalCenter: parent.horizontalCenter
+                    anchors.top: parent.top
+                    anchors.topMargin: 110
+
+                    Text {
+                        id: tild
+                        color: Theme.lightBlueText
+                        text: qsTr("~")
+                        font.weight: Font.Medium
+                        font.pixelSize: 30
+                    }
+
+                    TextEdit {
+                        id: walletAmountValue
+                        color: "#ffffff"
+                        text: qsTr("408.30")
+                        selectByMouse: true
+                        cursorVisible: true
+                        readOnly: true
+                        anchors.left: tild.right
+                        anchors.leftMargin: 1
+                        font.weight: Font.Medium
+                        font.pixelSize: 30
+                    }
+
+                    Text {
+                        id: currencyText
+                        color: Theme.lightBlueText
+                        text: qsTr("USD")
+                        anchors.left: walletAmountValue.right
+                        anchors.leftMargin: 5
+                        font.weight: Font.Medium
+                        font.pixelSize: 30
+                    }
+                }
+            }
+        }
+
+        RowLayout {
+            id: assetInfoContainer
+            width: 100
+            height: 100
+
+            Rectangle {
+                id: walletSendBg
+                width: 200
+                height: 200
+                color: "#ffffff"
+                Layout.fillHeight: true
+                Layout.fillWidth: true
+            }
+        }
+    }
+
+    ColumnLayout {
+        id: walletSendContainer
+    }
+}
+/*##^##
+Designer {
+    D{i:0;autoSize:true;height:770;width:1152}D{i:4;anchors_x:140;anchors_y:93}
+}
+##^##*/
diff --git a/ui/app/AppLayouts/qmldir b/ui/app/AppLayouts/qmldir
index 8bb6e67278..4413a4e619 100644
--- a/ui/app/AppLayouts/qmldir
+++ b/ui/app/AppLayouts/qmldir
@@ -1 +1,2 @@
-ChatLayout 1.0 ChatLayout.qml
\ No newline at end of file
+ChatLayout 1.0 ChatLayout.qml
+WalletLayout 1.0 WalletLayout.qml
diff --git a/ui/app/AppMain.qml b/ui/app/AppMain.qml
index 7e425a94c7..722d08c22a 100644
--- a/ui/app/AppMain.qml
+++ b/ui/app/AppMain.qml
@@ -141,6 +141,13 @@ RowLayout {
             Layout.alignment: Qt.AlignLeft | Qt.AlignTop
             Layout.fillHeight: true
         }
+
+        WalletLayout {
+            id: walletLayoutContainer
+            Layout.fillWidth: true
+            Layout.alignment: Qt.AlignLeft | Qt.AlignTop
+            Layout.fillHeight: true
+        }
     }
 }
 
diff --git a/ui/imports/Theme.qml b/ui/imports/Theme.qml
index 1b974eecec..e53e259014 100644
--- a/ui/imports/Theme.qml
+++ b/ui/imports/Theme.qml
@@ -8,6 +8,7 @@ QtObject {
     readonly property color blue: "#4360DF"
     readonly property color transparent: "#ffffff"
     readonly property color darkGrey: "#939BA1"
+    readonly property color lightBlueText: "#8f9fec"
 
     readonly property int padding: 16
     readonly property int smallPadding: 10
diff --git a/ui/nim-status-client.pro b/ui/nim-status-client.pro
index a6387c715e..1fbed30500 100644
--- a/ui/nim-status-client.pro
+++ b/ui/nim-status-client.pro
@@ -50,6 +50,7 @@ DISTFILES += \
     Inter-V.otf \
     Theme.qml \
     app/AppLayouts/ChatLayout.qml \
+    app/AppLayouts/WalletLayout.qml \
     app/AppLayouts/qmldir \
     app/AppMain.qml \
     app/img/compass.svg \