status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: introduce StatusWalletColorSelect component 

This is a new form control component to select colors for wallet
accounts. It will replace the currently used `ColorSelect` in the
Status Desktop application so it aligns with the new designs.

Closes #1497
This commit is contained in:
Pascal Precht 2021-01-20 17:24:21 +01:00 committed by Iuri Matias
parent 7d8d69f746
commit 3a538acb1e
6 changed files with 57 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
ui/app/AppLayouts/Wallet/AccountSettingsModal.qml
View File

@ -4,6 +4,7 @@ import QtQuick.Layouts 1.13
import QtQuick.Dialogs 1.3
import "../../../imports"
import "../../../shared"
import "../../../shared/status"
ModalPopup {
property var currentAccount: walletModel.currentAccount
@ -42,9 +43,9 @@ ModalPopup {
validationError: popup.accountNameValidationError
}
ColorSelector {
StatusWalletColorSelect {
id: accountColorInput
selectedColor: currentAccount.iconColor
selectedColor: currentAccount.iconColor.toUpperCase()
model: Constants.accountColors
anchors.top: accountNameInput.bottom
anchors.topMargin: marginBetweenInputs

2
ui/app/AppLayouts/Wallet/components/AddAccountWithPrivateKey.qml
View File

@ -92,7 +92,7 @@ ModalPopup {
validationError: popup.accountNameValidationError
}
ColorSelector {
StatusWalletColorSelect {
id: accountColorInput
model: Constants.accountColors
anchors.top: accountNameInput.bottom

2
ui/app/AppLayouts/Wallet/components/AddAccountWithSeed.qml
View File

@ -105,7 +105,7 @@ ModalPopup {
validationError: popup.accountNameValidationError
}
ColorSelector {
StatusWalletColorSelect {
id: accountColorInput
model: Constants.accountColors
anchors.top: accountNameInput.bottom

2
ui/app/AppLayouts/Wallet/components/AddWatchOnlyAccount.qml
View File

@ -66,7 +66,7 @@ ModalPopup {
validationError: popup.accountNameValidationError
}
ColorSelector {
StatusWalletColorSelect {
id: accountColorInput
model: Constants.accountColors
anchors.top: accountNameInput.bottom

3
ui/app/AppLayouts/Wallet/components/GenerateAccountModal.qml
View File

@ -65,8 +65,9 @@ ModalPopup {
validationError: popup.accountNameValidationError
}
ColorSelector {
StatusWalletColorSelect {
id: accountColorInput
selectedColor: Constants.accountColors[0]
model: Constants.accountColors
anchors.top: accountNameInput.bottom
anchors.topMargin: marginBetweenInputs

49
ui/shared/status/StatusWalletColorSelect.qml Normal file
View File

@ -0,0 +1,49 @@
import QtQuick 2.13
import QtQuick.Controls 2.13
import QtQuick.Layouts 1.13
import "../../imports"
import "../../shared"
import "../../shared/status"
Item {
id: control
property string selectedColor
property string label: qsTr("Account color")
property var model
height: chilrenRect.height
StyledText {
id: label
text: control.label
font.weight: Font.Medium
anchors.left: parent.left
anchors.top: parent.top
font.pixelSize: 13
height: 18
}
RowLayout {
id: colors
spacing: 6
anchors.top: label.bottom
anchors.topMargin: Style.current.halfPadding
anchors.left: parent.left
anchors.right: parent.right
Repeater {
model: control.model
Item {
height: colorBtn.height
width: colorBtn.width
StatusWalletColorButton {
id: colorBtn
icon.color: modelData
selected: control.selectedColor.toUpperCase() == modelData.toUpperCase()
onClicked: {
control.selectedColor = modelData.toUpperCase()
}
}
}
}
}
}