diff --git a/ui/app/AppLayouts/WalletLayout.qml b/ui/app/AppLayouts/WalletLayout.qml
index 2483a8bd93..0827e9eec2 100644
--- a/ui/app/AppLayouts/WalletLayout.qml
+++ b/ui/app/AppLayouts/WalletLayout.qml
@@ -218,6 +218,89 @@ SplitView {
color: "#ffffff"
Layout.fillHeight: true
Layout.fillWidth: true
+
+ Text {
+ id: assetsTitle
+ color: Theme.darkGrey
+ text: qsTr("Assets")
+ anchors.left: parent.left
+ anchors.leftMargin: Theme.padding
+ anchors.top: parent.top
+ anchors.topMargin: Theme.smallPadding
+ font.pixelSize: 14
+ }
+
+ Component {
+ id: assetViewDelegate
+
+ Item {
+ id: element6
+ height: 56
+ anchors.right: parent.right
+ anchors.rightMargin: 0
+ anchors.left: parent.left
+ anchors.leftMargin: 0
+
+ Rectangle {
+ width: 36
+ height: 36
+ color: Theme.blue
+ radius: 50
+ anchors.left: parent.left
+ anchors.leftMargin: Theme.padding
+ anchors.verticalCenter: parent.verticalCenter
+ }
+
+ Text {
+ id: assetValue
+ text: value
+ anchors.verticalCenter: parent.verticalCenter
+ font.pixelSize: 14
+ font.strikeout: false
+ anchors.left: parent.left
+ anchors.leftMargin: 72
+ }
+ Text {
+ id: assetSymbol
+ text: symbol
+ anchors.verticalCenter: parent.verticalCenter
+ color: Theme.darkGrey
+ font.pixelSize: 14
+ anchors.right: assetFiatValue.left
+ anchors.rightMargin: 10
+ }
+ Text {
+ id: assetFiatValue
+ color: Theme.darkGrey
+ text: fiatValue
+ anchors.verticalCenter: parent.verticalCenter
+ font.pixelSize: 14
+ anchors.right: parent.right
+ anchors.rightMargin: Theme.padding
+ }
+ }
+ }
+
+ // Delete this when we have a real model
+ ListModel {
+ id: exampleAssets
+ ListElement {
+ name: "Ethereum"
+ symbol: "ETH"
+ value: "0.4564234124124..."
+ fiatValue: "$268.30"
+ image: ""
+ }
+ }
+
+ ListView {
+ id: listView
+ anchors.topMargin: 36
+ anchors.fill: parent
+ // Change this to the real model
+ model: exampleAssets
+ delegate: assetViewDelegate
+ }
}
}
}
@@ -281,12 +364,10 @@ SplitView {
anchors.top: parent.top
}
}
-
}
}
/*##^##
Designer {
- D{i:0;autoSize:true;formeditorZoom:0.75;height:770;width:1152}D{i:4;anchors_x:140;anchors_y:93}
-D{i:8;anchors_width:240}
+ D{i:0;autoSize:true;height:770;width:1152}D{i:4;anchors_x:140;anchors_y:93}D{i:8;anchors_width:240}
}
##^##*/
diff --git a/ui/app/img/token-icons/eth.svg b/ui/app/img/token-icons/eth.svg
new file mode 100644
index 0000000000..dcbba16b1c
--- /dev/null
+++ b/ui/app/img/token-icons/eth.svg
@@ -0,0 +1,9 @@
+
diff --git a/ui/app/img/token-icons/snt.svg b/ui/app/img/token-icons/snt.svg
new file mode 100644
index 0000000000..6a7b5d8f38
--- /dev/null
+++ b/ui/app/img/token-icons/snt.svg
@@ -0,0 +1,4 @@
+
diff --git a/ui/shared/RoundedIcon.qml b/ui/shared/RoundedIcon.qml
index 5005572716..6e8d23691e 100644
--- a/ui/shared/RoundedIcon.qml
+++ b/ui/shared/RoundedIcon.qml
@@ -12,6 +12,7 @@ Rectangle {
radius: 50
Image {
+ id: roundedIconImage
width: 12
height: 12
anchors.horizontalCenter: parent.horizontalCenter