Adjusted badge positions as designs. Fixes #1619

This commit is contained in:
staked-smart-ace 2021-01-15 23:21:19 +04:00 committed by Jonathan Rainville
parent 05f38fa966
commit c84806aa4e
3 changed files with 71 additions and 58 deletions

View File

@ -32,42 +32,12 @@ Item {
text: qsTrId("security")
}
Item {
id: backupSeedPhrase
height: backupText.height
width: parent.width
StyledText {
id: backupText
//% "Backup Seed Phrase"
text: qsTrId("backup-seed-phrase")
font.pixelSize: 15
color: !badge.visible ? Style.current.darkGrey : Style.current.textColor
}
Rectangle {
id: badge
visible: !profileModel.mnemonic.isBackedUp
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
anchors.rightMargin: 0
radius: 9
color: Style.current.blue
width: 18
height: 18
Text {
font.pixelSize: 12
color: Style.current.white
anchors.centerIn: parent
text: "1"
}
}
MouseArea {
enabled: !profileModel.mnemonic.isBackedUp
anchors.fill: parent
onClicked: backupSeedModal.open()
cursorShape: enabled ? Qt.PointingHandCursor : Qt.ArrowCursor
StatusSettingsLineButton {
text: qsTrId("backup-seed-phrase")
isBadge: !profileModel.mnemonic.isBackedUp
isEnabled: !profileModel.mnemonic.isBackedUp
onClicked: {
backupSeedModal.open()
}
}

View File

@ -202,21 +202,31 @@ RowLayout {
anchors.topMargin: 0
Rectangle {
id: chatBadge
visible: chatsModel.unreadMessagesCount > 0
anchors.top: parent.top
anchors.left: parent.right
anchors.leftMargin: -10
anchors.topMargin: -5
radius: width / 2
color: Style.current.blue
width: chatsModel.unreadMessagesCount < 10 ? 18 : messageCount.width + 10
height: 18
Text {
id: messageCount
font.pixelSize: chatsModel.unreadMessagesCount > 99 ? 10 : 12
color: Style.current.white
anchors.centerIn: parent
text: chatsModel.unreadMessagesCount > 99 ? "99+" : chatsModel.unreadMessagesCount
anchors.leftMargin: -16
anchors.topMargin: 1
radius: height / 2
color: Style.current.white
width: chatsModel.unreadMessagesCount < 10 ? 22 : messageCount.width + 14
height: 22
Rectangle {
anchors.centerIn: parent
width: parent.width - 4
height: parent.height - 4
radius: height / 2
color: Style.current.blue
Text {
id: messageCount
font.pixelSize: chatsModel.unreadMessagesCount > 99 ? 10 : 12
color: Style.current.white
anchors.centerIn: parent
text: chatsModel.unreadMessagesCount > 99 ? "99+" : chatsModel.unreadMessagesCount
}
}
}
}
@ -252,17 +262,26 @@ RowLayout {
visible: !profileModel.mnemonic.isBackedUp && sLayout.children[sLayout.currentIndex] !== profileLayoutContainer
anchors.top: parent.top
anchors.left: parent.right
anchors.leftMargin: -10
anchors.topMargin: -5
radius: width / 2
color: Style.current.blue
width: 18
height: 18
Text {
font.pixelSize: 12
color: Style.current.white
anchors.leftMargin: -17
anchors.topMargin: -2
radius: height / 2
color: Style.current.white
width: 22
height: 22
Rectangle {
anchors.centerIn: parent
text: "1"
width: parent.width - 4
height: parent.height - 4
radius: height / 2
color: Style.current.blue
Text {
font.pixelSize: 12
color: Style.current.white
anchors.centerIn: parent
text: "1"
}
}
}
}

View File

@ -8,6 +8,9 @@ Item {
property bool isSwitch: false
property bool switchChecked: false
property string currentValue
property bool isBadge: false
property string badgeText: "1"
property bool isEnabled: true
signal clicked(bool checked)
id: root
@ -18,6 +21,7 @@ Item {
id: textItem
text: root.text
font.pixelSize: 15
color: !root.isEnabled ? Style.current.darkGrey : Style.current.textColor
}
StyledText {
@ -37,12 +41,31 @@ Item {
StatusSwitch {
id: switchItem
enabled: root.isEnabled
visible: root.isSwitch
checked: root.switchChecked
anchors.right: parent.right
anchors.verticalCenter: textItem.verticalCenter
}
Rectangle {
id: badge
visible: root.isBadge & !root.isSwitch
anchors.right: root.isSwitch ? switchItem.left : caret.left
anchors.rightMargin: Style.current.padding
anchors.verticalCenter: textItem.verticalCenter
radius: 9
color: Style.current.blue
width: 18
height: 18
Text {
font.pixelSize: 12
color: Style.current.white
anchors.centerIn: parent
text: root.badgeText
}
}
SVGImage {
id: caret
visible: !root.isSwitch
@ -61,6 +84,7 @@ Item {
MouseArea {
anchors.fill: parent
enabled: root.isEnabled
onClicked: {
root.clicked(!root.switchChecked)
}