52 lines
1.5 KiB
QML
52 lines
1.5 KiB
QML
import QtQuick
|
|
|
|
Item {
|
|
id: root
|
|
|
|
width: pill.width
|
|
height: pill.height
|
|
|
|
BarPill {
|
|
id: pill
|
|
|
|
Text {
|
|
text: NotificationsState.unreadCount > 0 ? "" : ""
|
|
color: NotificationsState.unreadCount > 0 ? Theme.yellow : Theme.subtle
|
|
font.pixelSize: Theme.fontSize
|
|
font.family: Theme.font
|
|
|
|
Behavior on color { ColorAnimation { duration: 150 } }
|
|
}
|
|
}
|
|
|
|
// Overlaps the pill corner, so z and sibling anchors are used
|
|
Rectangle {
|
|
visible: NotificationsState.unreadCount > 0
|
|
width: Math.max(15, badgeLabel.implicitWidth + 5)
|
|
height: 13
|
|
radius: 7
|
|
color: Theme.red
|
|
z: 10
|
|
anchors.top: pill.top
|
|
anchors.right: pill.right
|
|
anchors.topMargin: -3
|
|
anchors.rightMargin: -3
|
|
|
|
Text {
|
|
id: badgeLabel
|
|
anchors.centerIn: parent
|
|
text: NotificationsState.unreadCount > 9
|
|
? "9+" : NotificationsState.unreadCount.toString()
|
|
color: "white"
|
|
font.pixelSize: 8
|
|
font.family: Theme.font
|
|
font.bold: true
|
|
}
|
|
}
|
|
|
|
MouseArea {
|
|
anchors.fill: pill
|
|
cursorShape: Qt.PointingHandCursor
|
|
onClicked: NotificationsState.togglePanel()
|
|
}
|
|
}
|