sidebar/notifs: better count anim
This commit is contained in:
parent
852e6cb699
commit
1a1145f2f4
2 changed files with 42 additions and 7 deletions
|
|
@ -22,7 +22,7 @@ Item {
|
||||||
|
|
||||||
Component.onCompleted: Notifs.list.forEach(n => n.popup = false)
|
Component.onCompleted: Notifs.list.forEach(n => n.popup = false)
|
||||||
|
|
||||||
StyledText {
|
Item {
|
||||||
id: title
|
id: title
|
||||||
|
|
||||||
anchors.top: parent.top
|
anchors.top: parent.top
|
||||||
|
|
@ -30,12 +30,46 @@ Item {
|
||||||
anchors.right: parent.right
|
anchors.right: parent.right
|
||||||
anchors.margins: Appearance.padding.small
|
anchors.margins: Appearance.padding.small
|
||||||
|
|
||||||
text: root.notifCount > 0 ? qsTr("%1 notification%2").arg(root.notifCount).arg(root.notifCount === 1 ? "" : "s") : qsTr("Notifications")
|
implicitHeight: Math.max(count.implicitHeight, titleText.implicitHeight)
|
||||||
color: Colours.palette.m3outline
|
|
||||||
font.pointSize: Appearance.font.size.normal
|
StyledText {
|
||||||
font.family: Appearance.font.family.mono
|
id: count
|
||||||
font.weight: 500
|
|
||||||
elide: Text.ElideRight
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.leftMargin: root.notifCount > 0 ? 0 : -width - titleText.anchors.leftMargin
|
||||||
|
opacity: root.notifCount > 0 ? 1 : 0
|
||||||
|
|
||||||
|
text: root.notifCount
|
||||||
|
color: Colours.palette.m3outline
|
||||||
|
font.pointSize: Appearance.font.size.normal
|
||||||
|
font.family: Appearance.font.family.mono
|
||||||
|
font.weight: 500
|
||||||
|
|
||||||
|
Behavior on anchors.leftMargin {
|
||||||
|
Anim {}
|
||||||
|
}
|
||||||
|
|
||||||
|
Behavior on opacity {
|
||||||
|
Anim {}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
StyledText {
|
||||||
|
id: titleText
|
||||||
|
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.left: count.right
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.leftMargin: Appearance.spacing.small
|
||||||
|
|
||||||
|
text: root.notifCount > 0 ? qsTr("notification%1").arg(root.notifCount === 1 ? "" : "s") : qsTr("Notifications")
|
||||||
|
color: Colours.palette.m3outline
|
||||||
|
font.pointSize: Appearance.font.size.normal
|
||||||
|
font.family: Appearance.font.family.mono
|
||||||
|
font.weight: 500
|
||||||
|
elide: Text.ElideRight
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
ClippingRectangle {
|
ClippingRectangle {
|
||||||
|
|
|
||||||
|
|
@ -48,6 +48,7 @@ StyledRect {
|
||||||
anchors.right: parent?.right
|
anchors.right: parent?.right
|
||||||
implicitHeight: content.implicitHeight + Appearance.padding.normal * 2
|
implicitHeight: content.implicitHeight + Appearance.padding.normal * 2
|
||||||
|
|
||||||
|
clip: true
|
||||||
radius: Appearance.rounding.normal
|
radius: Appearance.rounding.normal
|
||||||
color: Colours.layer(Colours.palette.m3surfaceContainer, 2)
|
color: Colours.layer(Colours.palette.m3surfaceContainer, 2)
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue