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

fix(Profile showcase): Update showcase visibility button UI 

- correct width and radius
- correct padding
- remove border
- use a regular `StatusButton` instead of `DisabledTooltipButton` +
`StatusRoundButton`
- add the missing dropdown indicator

Fixes #13941
This commit is contained in:
Lukáš Tinkl 2024-03-12 16:52:02 +01:00 committed by Lukáš Tinkl
parent 2487963323
commit e5567d06f4
1 changed files with 61 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

116
ui/app/AppLayouts/Profile/controls/ShowcaseDelegate.qml
View File

@ -62,67 +62,73 @@ StatusDraggableListItem {
Layout.maximumWidth: root.width *.4 Layout.maximumWidth: root.width *.4
}, },
DisabledTooltipButton { StatusButton {
interactive: root.contextMenuEnabled interactive: root.contextMenuEnabled
tooltipText: root.tooltipTextWhenContextMenuDisabled tooltip.text: root.tooltipTextWhenContextMenuDisabled
buttonComponent: StatusRoundButton { icon.name: ProfileUtils.visibilityIcon(root.showcaseVisibility)
enabled: root.contextMenuEnabled horizontalPadding: Style.current.halfPadding
icon.name: ProfileUtils.visibilityIcon(root.showcaseVisibility) verticalPadding: 3
width: 58 Layout.preferredWidth: 72
height: 30 Layout.preferredHeight: root.height/2
border.width: 1 radius: height/2
border.color: Theme.palette.directColor7 highlighted: menuLoader.item && menuLoader.item.opened
radius: 14 onClicked: {
highlighted: menuLoader.item && menuLoader.item.opened menuLoader.active = true
onClicked: { menuLoader.item.popup(width - menuLoader.item.width, height)
menuLoader.active = true }
menuLoader.item.popup(width - menuLoader.item.width, height) text: " " // NB to give the icon and indicator some even space
}
ButtonGroup { indicator: StatusIcon {
id: showcaseVisibilityGroup anchors.right: parent.right
exclusive: true anchors.rightMargin: parent.horizontalPadding
onClicked: function(button) { anchors.verticalCenter: parent.verticalCenter
const newVisibility = (button as ShowcaseVisibilityAction).showcaseVisibility icon: "chevron-down"
if (newVisibility !== root.showcaseVisibility) color: parent.interactive ? Theme.palette.primaryColor1 : Theme.palette.baseColor1
root.showcaseVisibilityRequested(newVisibility) }
ButtonGroup {
id: showcaseVisibilityGroup
exclusive: true
onClicked: function(button) {
const newVisibility = (button as ShowcaseVisibilityAction).showcaseVisibility
if (newVisibility !== root.showcaseVisibility)
root.showcaseVisibilityRequested(newVisibility)
}
}
Loader {
id: menuLoader
active: false
sourceComponent: StatusMenu {
onClosed: menuLoader.active = false
StatusMenuHeadline { text: qsTr("Show to") }
Binding on width {
value: Math.max(implicitWidth, everyoneAction.implicitWidth, contactsAction.implicitWidth, idVerifiedContactsAction.implicitWidth) + margins * 2
delayed: true
} }
}
Loader { ShowcaseVisibilityAction {
id: menuLoader id: everyoneAction
active: false showcaseVisibility: Constants.ShowcaseVisibility.Everyone
sourceComponent: StatusMenu { text: enabled ? qsTr("Everyone") : qsTr("Everyone (set account to Everyone)")
onClosed: menuLoader.active = false }
StatusMenuHeadline { text: qsTr("Show to") } ShowcaseVisibilityAction {
id: contactsAction
showcaseVisibility: Constants.ShowcaseVisibility.Contacts
text: enabled ? qsTr("Contacts") : qsTr("Contacts (set account to Contacts)")
}
ShowcaseVisibilityAction {
id: idVerifiedContactsAction
showcaseVisibility: Constants.ShowcaseVisibility.IdVerifiedContacts
text: enabled ? qsTr("ID verified contacts") : qsTr("ID verified contacts (set account to ID verified contacts)")
}
Binding on width { StatusMenuSeparator {}
value: Math.max(implicitWidth, everyoneAction.implicitWidth, contactsAction.implicitWidth, idVerifiedContactsAction.implicitWidth) + margins * 2
delayed: true
}
ShowcaseVisibilityAction { ShowcaseVisibilityAction {
id: everyoneAction showcaseVisibility: Constants.ShowcaseVisibility.NoOne
showcaseVisibility: Constants.ShowcaseVisibility.Everyone text: qsTr("No one")
text: enabled ? qsTr("Everyone") : qsTr("Everyone (set account to Everyone)")
}
ShowcaseVisibilityAction {
id: contactsAction
showcaseVisibility: Constants.ShowcaseVisibility.Contacts
text: enabled ? qsTr("Contacts") : qsTr("Contacts (set account to Contacts)")
}
ShowcaseVisibilityAction {
id: idVerifiedContactsAction
showcaseVisibility: Constants.ShowcaseVisibility.IdVerifiedContacts
text: enabled ? qsTr("ID verified contacts") : qsTr("ID verified contacts (set account to ID verified contacts)")
}
StatusMenuSeparator {}
ShowcaseVisibilityAction {
showcaseVisibility: Constants.ShowcaseVisibility.NoOne
text: qsTr("No one")
}
} }
} }
} }