diff --git a/ui/app/AppLayouts/Wallet/CollectiblesTab.qml b/ui/app/AppLayouts/Wallet/CollectiblesTab.qml index 6860f6ba11..a0804f4491 100644 --- a/ui/app/AppLayouts/Wallet/CollectiblesTab.qml +++ b/ui/app/AppLayouts/Wallet/CollectiblesTab.qml @@ -36,14 +36,41 @@ Item { Component { id: collectiblesListComponent - CollectiblesContainer { - collectibleName: "CryptoKitties" - collectibleIconSource: "../../img/collectibles/CryptoKitties.png" - isLoading: root.isLoading - collectiblesModal: collectiblesModalComponent - buttonText: qsTr("View in Cryptokitties") - getLink: function (id) { - return `https://www.cryptokitties.co/kitty/${id}` + Column { + spacing: Style.current.halfPadding + anchors.fill: parent + + CollectiblesContainer { + collectibleName: "CryptoKitties" + collectibleIconSource: "../../img/collectibles/CryptoKitties.png" + isLoading: root.isLoading + collectiblesModal: collectiblesModalComponent + buttonText: qsTr("View in Cryptokitties") + getLink: function (id) { + return `https://www.cryptokitties.co/kitty/${id}` + } + } + + CollectiblesContainer { + collectibleName: "Ethermons" + collectibleIconSource: "../../img/collectibles/ethermons.png" + isLoading: root.isLoading + collectiblesModal: collectiblesModalComponent + buttonText: qsTr("View in Ethermon") + getLink: function (id) { + return `https://www.etheremon.com/#/mons/${id}` + } + } + + CollectiblesContainer { + collectibleName: "Kudos" + collectibleIconSource: "../../img/collectibles/kudos.png" + isLoading: root.isLoading + collectiblesModal: collectiblesModalComponent + buttonText: qsTr("View in Gitcoin") + getLink: function (id) { + return "" + } } } } diff --git a/ui/app/AppLayouts/Wallet/components/collectiblesComponents/CollectiblesContainer.qml b/ui/app/AppLayouts/Wallet/components/collectiblesComponents/CollectiblesContainer.qml index b9bb9f1155..4c8f5e62bc 100644 --- a/ui/app/AppLayouts/Wallet/components/collectiblesComponents/CollectiblesContainer.qml +++ b/ui/app/AppLayouts/Wallet/components/collectiblesComponents/CollectiblesContainer.qml @@ -13,6 +13,8 @@ Item { property var getLink: function () {} id: root + width: parent.width + height: childrenRect.height CollectiblesHeader { id: collectiblesHeader diff --git a/ui/app/AppLayouts/Wallet/components/collectiblesComponents/CollectiblesModal.qml b/ui/app/AppLayouts/Wallet/components/collectiblesComponents/CollectiblesModal.qml index e2ffd14a22..4ac0d9ce52 100644 --- a/ui/app/AppLayouts/Wallet/components/collectiblesComponents/CollectiblesModal.qml +++ b/ui/app/AppLayouts/Wallet/components/collectiblesComponents/CollectiblesModal.qml @@ -37,7 +37,7 @@ ModalPopup { label: popup.buttonText anchors.top: parent.top onClicked: { - console.log('Go to', popup.buttonLink) + Qt.openUrlExternally(popup.buttonLink) } } } diff --git a/ui/app/img/collectibles/ethermons.png b/ui/app/img/collectibles/ethermons.png new file mode 100644 index 0000000000..8fc72f1d4b Binary files /dev/null and b/ui/app/img/collectibles/ethermons.png differ diff --git a/ui/app/img/collectibles/kudos.png b/ui/app/img/collectibles/kudos.png new file mode 100644 index 0000000000..b5d43e0824 Binary files /dev/null and b/ui/app/img/collectibles/kudos.png differ diff --git a/ui/shared/TextWithLabel.qml b/ui/shared/TextWithLabel.qml index 0f695eb664..0928d63b92 100644 --- a/ui/shared/TextWithLabel.qml +++ b/ui/shared/TextWithLabel.qml @@ -40,14 +40,14 @@ Item { Loader { active: !!infoText.textToCopy sourceComponent: copyComponent + anchors.verticalCenter: textItem.verticalCenter + anchors.left: textItem.right + anchors.leftMargin: Style.current.smallPadding } Component { id: copyComponent CopyToClipBoardButton { - anchors.verticalCenter: textItem.verticalCenter - anchors.left: textItem.right - anchors.leftMargin: Style.current.smallPadding textToCopy: infoText.textToCopy } }