Files
quickshell-config/osd/NotificationItem.qml

111 lines
3.4 KiB
QML

import QtQuick
import QtQuick.Layouts
import QtQuick.Controls
import Quickshell
import Quickshell.Widgets
import Quickshell.Services.Notifications
import qs.common
import qs.common.widgets
Item {
id: root
required property Notification notif
required property real textWidth
required property real notificationRounding
property real spacing: 8
Layout.fillWidth: true
implicitHeight: content.implicitHeight
ColumnLayout {
id: content
Layout.fillWidth: true
spacing: 0
Rectangle {
implicitHeight: appTitle.implicitHeight
implicitWidth: root.width
anchors.margins: Config.options.bar.cornerStyle === 1 ? (Appearance.sizes.hyprlandGapsOut) : 0
color: Appearance.m3colors.m3primaryContainer
topLeftRadius: root.notificationRounding
topRightRadius: root.notificationRounding
RowLayout {
spacing: 0 // For some reason, adding a spacing of just the value will not work properly
IconImage {
visible: root.notif.appIcon.length > 0
id: appIcon
source: Quickshell.iconPath(root.notif.appIcon)
width: appTitle.height - root.spacing
height: appTitle.height - root.spacing
Layout.leftMargin: root.spacing / 2
}
Text {
// app title
id: appTitle
text: root.notif.appName
color: Appearance.m3colors.m3onPrimaryContainer
Layout.leftMargin: root.spacing / 2
}
}
}
Rectangle {
visible: notifSummary.visible || notifBody.visible
implicitHeight: body.implicitHeight
implicitWidth: root.width
anchors.margins: Config.options.bar.cornerStyle === 1 ? (Appearance.sizes.hyprlandGapsOut) : 0
color: Appearance.colors.colLayer2
bottomLeftRadius: root.notificationRounding
bottomRightRadius: root.notificationRounding
ColumnLayout {
id: body
spacing: root.spacing
Text {
visible: root.notif.summary.length > 0
Layout.leftMargin: root.spacing
Layout.rightMargin: root.spacing
id: notifSummary
text: root.notif.summary
color: Appearance.colors.colOnLayer2
wrapMode: Text.WordWrap
}
Text {
visible: root.notif.body.length > 0
Layout.leftMargin: root.spacing
Layout.rightMargin: root.spacing
Layout.preferredWidth: textWidth
id: notifBody
text: root.notif.body
color: Appearance.colors.colOnLayer2
wrapMode: Text.WordWrap
maximumLineCount: 4
}
RowLayout {
id: actionLayer
Layout.fillWidth: true
Layout.leftMargin: root.spacing
Layout.rightMargin: root.spacing
Layout.bottomMargin: root.spacing
spacing: root.spacing
RippleButton {
buttonText: "Dismiss"
colBackground: Appearance.m3colors.m3primaryContainer
releaseAction: root.notif.dismiss
buttonRadius: root.notificationRounding
}
Repeater {
model: root.notif.actions
RippleButton {
buttonText: modelData.text
buttonTextColor: Appearance.m3colors.m3onTertiaryContainer
colBackground: Appearance.m3colors.m3tertiaryContainer
releaseAction: modelData.invoke
buttonRadius: root.notificationRounding
}
}
}
}
}
}
}