status-im/status-desktop
2
0
Fork 0
mirror of https://github.com/status-im/status-desktop.git synced 2025-02-17 00:56:39 +00:00
Code Issues Projects Releases Wiki Activity

ens section fixes

Browse Source 
use the available dark image for ens section

add the image, ensure 624 widths and fix button

move common strings to constants and use number consts
This commit is contained in:
rinzlxr 2021-03-23 18:34:52 +02:00 committed by Iuri Matias
parent 5091e258d3
commit 47ae3a4c16
7 changed files with 185 additions and 170 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

112
ui/app/AppLayouts/Profile/Sections/Ens/Search.qml
View File

@ -3,6 +3,7 @@ import QtQuick.Layouts 1.3
import QtQuick.Controls 2.14
import "../../../../../imports"
import "../../../../../shared"
import "../../../../../shared/status"
Item {
id: searchENS
@ -65,14 +66,19 @@ Item {
}
}
Item {
id: ensContainer
anchors.top: parent.top
width: 624
anchors.horizontalCenter: parent.horizontalCenter
StyledText {
id: sectionTitle
//% "Your username"
text: qsTrId("ens-your-username")
text: ""
anchors.left: parent.left
anchors.leftMargin: 24
anchors.leftMargin: Style.current.bigPadding
anchors.top: parent.top
anchors.topMargin: 24
anchors.topMargin: Style.current.bigPadding
font.weight: Font.Bold
font.pixelSize: 20
}
@ -80,7 +86,7 @@ Item {
Rectangle {
id: circleAt
anchors.top: sectionTitle.bottom
anchors.topMargin: 24
anchors.topMargin: Style.current.bigPadding
anchors.horizontalCenter: parent.horizontalCenter
width: 60
height: 60
@ -89,7 +95,7 @@ Item {
SVGImage {
id: imgIcon
visible: ensStatus === "taken"
visible: ensStatus === Constants.ens_taken
fillMode: Image.PreserveAspectFit
source: "../../../../img/block-icon-white.svg"
width: 20
@ -99,9 +105,11 @@ Item {
}
StyledText {
visible: ensStatus !== "taken"
visible: ensStatus !== Constants.ens_taken
text: {
if((ensStatus === "available" || ensStatus === "connected" || ensStatus === "connected-different-key")){
if((ensStatus === Constants.ens_available ||
ensStatus === Constants.ens_connected ||
ensStatus === Constants.ens_connected_dkey)) {
return "✓"
} else {
return "@"
@ -120,9 +128,9 @@ Item {
id: ensUsername
placeholderText: !isStatus ? "vitalik94.domain.eth" : "vitalik94"
anchors.top: circleAt.bottom
anchors.topMargin: 24
anchors.topMargin: Style.current.bigPadding
anchors.right: btnContinue.left
anchors.rightMargin: 24
anchors.rightMargin: Style.current.bigPadding
Keys.onReleased: {
onKeyReleased(ensUsername.text);
}
@ -135,95 +143,77 @@ Item {
loading = false;
ensStatus = ensResult;
switch(ensResult){
case "available":
case Constants.ens_available:
case Constants.ens_owned:
case Constants.ens_connected:
case Constants.ens_connected_dkey:
valid = true;
//% "✓ Username available!"
validationMessage = qsTrId("ens-username-available");
validationMessage = Constants.ensState[ensResult]
break;
case "owned":
valid = true;
//% "Continuing will connect this username with your chat key."
validationMessage = qsTrId("ens-username-owned-continue");
case Constants.ens_taken:
validationMessage = !isStatus ? Constants.ensState['taken_custom'] : Constants.ensState['taken'];
break;
case "taken":
validationMessage = !isStatus ?
//% "Username doesn’t belong to you :("
qsTrId("ens-custom-username-taken")
:
//% "Username already taken :("
qsTrId("ens-username-taken");
break;
case "already-connected":
//% "Username is already connected with your chat key and can be used inside Status."
validationMessage = qsTrId("ens-username-already-added");
break;
case "connected":
valid = true;
//% "This user name is owned by you and connected with your chat key. Continue to set `Show my ENS username in chats`."
validationMessage = qsTrId("this-user-name-is-owned-by-you-and-connected-with-your-chat-key--continue-to-set--show-my-ens-username-in-chats--");
break;
case "connected-different-key":
valid = true;
//% "Continuing will require a transaction to connect the username with your current chat key."
validationMessage = qsTrId("ens-username-connected-with-different-key");
case Constants.already_connected:
validationMessage = Constants.ensState[ensResult]
break;
}
}
}
}
Button {
StatusRoundButton {
id: btnContinue
width: 44
height: 44
anchors.top: circleAt.bottom
anchors.topMargin: 24
anchors.topMargin: Style.current.bigPadding
anchors.right: parent.right
SVGImage {
source: !valid ? "../../../../img/arrow-button-inactive.svg" : "../../../../img/arrow-btn-active.svg"
width: 50
height: 50
}
background: Rectangle {
color: "transparent"
}
MouseArea {
cursorShape: Qt.PointingHandCursor
anchors.fill: parent
onClicked : {
size: "medium"
type: "secondary"
icon.name: "arrow-right"
icon.width: 18
icon.height: 14
visible: valid
onClicked: {
if(!valid) return;
if(ensStatus === "connected"){
if(ensStatus === Constants.ens_connected){
profileModel.ens.connectOwnedUsername(ensUsername.text, isStatus);
continueClicked(ensStatus, ensUsername.text)
return;
}
if(ensStatus === "available"){
if(ensStatus === Constants.ens_available){
continueClicked(ensStatus, ensUsername.text);
return;
}
if(ensStatus === "connected-different-key" || ensStatus === "owned"){
if(ensStatus === Constants.ens_connected_dkey || ensStatus === Constants.ens_owned){
transactionDialog.open();
return;
}
}
}
}
Rectangle {
id: ensTypeRect
anchors.top: ensUsername.bottom
anchors.topMargin: 24
anchors.topMargin: Style.current.bigPadding
border.width: 1
border.color: Style.current.border
color: Style.current.background
radius: 50
height: 20
height: 30
width: 350
Item {
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
anchors.topMargin: Style.current.halfPadding
anchors.leftMargin: Style.current.padding
height: 20
StyledText {
text: !isStatus ?
//% "Custom domain"
@ -260,12 +250,14 @@ Item {
}
}
}
}
StyledText {
id: validationResult
text: validationMessage
anchors.horizontalCenter: parent.horizontalCenter
anchors.top: ensTypeRect.bottom
anchors.topMargin: 24
anchors.topMargin: Style.current.bigPadding
}
}
}

9
ui/app/AppLayouts/Profile/Sections/Ens/Welcome.qml
View File

@ -10,8 +10,7 @@ Item {
StyledText {
id: sectionTitle
//% "ENS usernames"
text: qsTrId("ens-usernames")
text: ""
anchors.left: parent.left
anchors.leftMargin: 24
anchors.top: parent.top
@ -34,15 +33,15 @@ Item {
Item {
id: contentItem
anchors.right: parent.right;
anchors.left: parent.left;
width: 624
anchors.horizontalCenter: parent.horizontalCenter
Image {
id: image
anchors.top: parent.top
anchors.horizontalCenter: parent.horizontalCenter
fillMode: Image.PreserveAspectFit
source: "../../../../img/ens-header@2x.png"
source: `../../../../img/ens-header-${Style.current.name}@2x.png`
}
StyledText {

BIN
ui/app/img/ens-header-dark.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 30 KiB

BIN
ui/app/img/ens-header-dark@2x.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 53 KiB

After

Width:  |  Height:  |  Size: 82 KiB

BIN
ui/app/img/ens-header-dark@3x.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 90 KiB

After

Width:  |  Height:  |  Size: 147 KiB

0
ui/app/img/ens-header@2x.png → ui/app/img/ens-header-light@2x.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 48 KiB

After

Width:  |  Height:  |  Size: 48 KiB

26
ui/imports/Constants.qml
View File

@ -126,6 +126,30 @@ QtObject {
readonly property var acceptedImageExtensions: [".png", ".jpg", ".jpeg", ".svg", ".gif"]
readonly property var acceptedDragNDropImageExtensions: [".png", ".jpg", ".jpeg", ".heif", "tif", ".tiff"]
readonly property string mentionSpanTag: `<span style="color:${Style.current.mentionColor}; background-color: ${Style.current.mentionBgColor};">`
readonly property string ens_taken: "taken"
readonly property string ens_taken_custom: "taken-custom"
readonly property string ens_owned: "owned"
readonly property string ens_availabe: "available"
readonly property string ens_already_connected: "already-connected"
readonly property string ens_connected: "connected"
readonly property string ens_connected_dkey: "connected-different-key"
readonly property var ensState: {
//% "Username already taken :("
"taken": qsTrId("ens-username-taken"),
//% "Username doesn’t belong to you :("
"taken-custom": qsTrId("ens-custom-username-taken"),
//% "Continuing will connect this username with your chat key."
"owned": qsTrId("ens-username-owned-continue"),
//% "✓ Username available!"
"availabe": qsTrId("ens-username-available"),
//% "Username is already connected with your chat key and can be used inside Status."
"already-connected": qsTrId("ens-username-already-added"),
//% "This user name is owned by you and connected with your chat key. Continue to set `Show my ENS username in chats`."
"connected": qsTrId("this-user-name-is-owned-by-you-and-connected-with-your-chat-key--continue-to-set--show-my-ens-username-in-chats--"),
//% "Continuing will require a transaction to connect the username with your current chat key."
"connected-different-key": qsTrId("ens-username-connected-with-different-key"),
}
}