status-im
/
status-qml
mirror of
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat(StatusChatListItem): introduce muted badge visuals 

Also ensure title font weight stays `normal` when item is `muted`.

Closes #258, #259
This commit is contained in:
Pascal Precht 2021-07-15 14:22:26 +02:00 committed by Pascal Precht
parent b5a922c0d8
commit a404ba0782
2 changed files with 47 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
sandbox/ListItems.qml
View File

@ -95,11 +95,20 @@ GridLayout {
onUnmute: muted = false
}
StatusChatListItem {
name: "muted-with-mentions"
type: StatusChatListItem.Type.PublicChat
muted: true
hasUnreadMessages: true
badge.value: 1
}
StatusChatListItem {
name: "selected-channel"
type: StatusChatListItem.Type.PublicChat
selected: true
}
StatusChatListItem {
name: "selected-muted-channel"
type: StatusChatListItem.Type.PublicChat
@ -107,6 +116,24 @@ GridLayout {
muted: true
}
StatusChatListItem {
name: "selected-muted-channel-with-unread-messages"
type: StatusChatListItem.Type.PublicChat
selected: true
muted: true
hasUnreadMessages: true
}
StatusChatListItem {
name: "selected-muted-with-mentions"
type: StatusChatListItem.Type.PublicChat
selected: true
muted: true
hasUnreadMessages: true
badge.value: 1
}
StatusListItem {
title: "Title"
}

37
src/StatusQ/Components/StatusChatListItem.qml
View File

@ -143,8 +143,8 @@ Rectangle {
id: chatName
anchors.left: statusIcon.visible ? statusIcon.right : identicon.right
anchors.leftMargin: statusIcon.visible ? 1 : 8
anchors.right: statusBadge.visible ? statusBadge.left :
mutedIcon.visible ? mutedIcon.left : parent.right
anchors.right: mutedIcon.visible ? mutedIcon.left :
statusBadge.visible ? statusBadge.left : parent.right
anchors.rightMargin: 6
anchors.verticalCenter: parent.verticalCenter
@ -164,27 +164,16 @@ Rectangle {
sensor.containsMouse ||
statusBadge.visible ? Theme.palette.directColor1 : Theme.palette.directColor4
}
font.weight: statusChatListItem.hasMention ||
font.weight: !statusChatListItem.muted &&
(statusChatListItem.hasMention ||
statusChatListItem.hasUnreadMessages ||
statusBadge.visible ? Font.Bold : Font.Medium
statusBadge.visible) ? Font.Bold : Font.Medium
font.pixelSize: 15
}
StatusBadge {
id: statusBadge
anchors.right: mutedIcon.visible ? mutedIcon.left : parent.right
anchors.rightMargin: 8
anchors.verticalCenter: parent.verticalCenter
border.width: 4
border.color: color
visible: statusBadge.value > 0
}
StatusIcon {
id: mutedIcon
anchors.right: parent.right
anchors.right: statusBadge.visible ? statusBadge.left : parent.right
anchors.rightMargin: 8
anchors.verticalCenter: parent.verticalCenter
width: 14
@ -205,5 +194,19 @@ Rectangle {
visible: mutedIconSensor.containsMouse
}
}
StatusBadge {
id: statusBadge
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
anchors.rightMargin: 8
color: statusChatListItem.muted ? Theme.palette.primaryColor2 : Theme.palette.primaryColor1
border.width: 4
border.color: color
visible: statusBadge.value > 0
}
}
}