Salastil/DankMaterialShell
1
0
Fork 0
mirror of https://github.com/AvengeMedia/DankMaterialShell.git synced 2026-01-24 21:42:51 -05:00
Code Packages Releases Activity

notifications: add compact mode, expansion in history, expansion in

Browse Source 
popup
fixes #1282
This commit is contained in:
bbedward
2026-01-11 12:11:44 -05:00
parent 510ea5d2e4
commit 3c38e17472
7 changed files with 359 additions and 283 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
quickshell/Common/SettingsData.qml
View File

@@ -404,6 +404,7 @@ Singleton {
property int notificationTimeoutLow: 5000
property int notificationTimeoutNormal: 5000
property int notificationTimeoutCritical: 0
property bool notificationCompactMode: false
property int notificationPopupPosition: SettingsData.Position.Top
property bool notificationHistoryEnabled: true
property int notificationHistoryMaxCount: 50
@@ -1845,7 +1846,11 @@ Singleton {
function addAppIdSubstitution(pattern, replacement, type) {
var subs = JSON.parse(JSON.stringify(appIdSubstitutions));
subs.push({ pattern: pattern, replacement: replacement, type: type });
subs.push({
pattern: pattern,
replacement: replacement,
type: type
});
appIdSubstitutions = subs;
saveSettings();
}
@@ -1854,7 +1859,11 @@ Singleton {
var subs = JSON.parse(JSON.stringify(appIdSubstitutions));
if (index < 0 || index >= subs.length)
return;
subs[index] = { pattern: pattern, replacement: replacement, type: type };
subs[index] = {
pattern: pattern,
replacement: replacement,
type: type
};
appIdSubstitutions = subs;
saveSettings();
}

1
quickshell/Common/settings/SettingsSpec.js
View File

@@ -268,6 +268,7 @@ var SPEC = {
notificationTimeoutLow: { def: 5000 },
notificationTimeoutNormal: { def: 5000 },
notificationTimeoutCritical: { def: 0 },
notificationCompactMode: { def: false },
notificationPopupPosition: { def: 0 },
notificationHistoryEnabled: { def: true },
notificationHistoryMaxCount: { def: 50 },

79
quickshell/Modules/Notifications/Center/HistoryNotificationCard.qml
View File

@@ -10,9 +10,17 @@ Rectangle {
required property var historyItem
property bool isSelected: false
property bool keyboardNavigationActive: false
property bool descriptionExpanded: NotificationService.expandedMessages[historyItem?.id ? (historyItem.id + "_hist") : ""] || false
readonly property bool compactMode: SettingsData.notificationCompactMode
readonly property real cardPadding: compactMode ? Theme.spacingS : Theme.spacingM
readonly property real iconSize: compactMode ? 48 : 63
readonly property real contentSpacing: compactMode ? Theme.spacingXS : Theme.spacingS
readonly property real collapsedContentHeight: iconSize + cardPadding
readonly property real baseCardHeight: cardPadding * 2 + collapsedContentHeight
width: parent ? parent.width : 400
height: 116
height: baseCardHeight + contentItem.extraHeight
radius: Theme.cornerRadius
clip: true
@@ -65,23 +73,28 @@ Rectangle {
}
Item {
id: contentItem
readonly property real expandedTextHeight: descriptionText.contentHeight
readonly property real twoLineHeight: descriptionText.font.pixelSize * 1.2 * 2
readonly property real extraHeight: (descriptionExpanded && expandedTextHeight > twoLineHeight + 2) ? (expandedTextHeight - twoLineHeight) : 0
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.topMargin: 12
anchors.leftMargin: 16
anchors.rightMargin: 56
height: 92
anchors.topMargin: cardPadding
anchors.leftMargin: Theme.spacingL
anchors.rightMargin: Theme.spacingL + (compactMode ? 32 : 40)
height: collapsedContentHeight + extraHeight
DankCircularImage {
id: iconContainer
readonly property bool hasNotificationImage: historyItem.image && historyItem.image !== ""
width: 63
height: 63
width: iconSize
height: iconSize
anchors.left: parent.left
anchors.top: parent.top
anchors.topMargin: 14
anchors.verticalCenter: parent.verticalCenter
imageSource: {
if (hasNotificationImage)
@@ -116,22 +129,17 @@ Rectangle {
Rectangle {
anchors.left: iconContainer.right
anchors.leftMargin: 12
anchors.leftMargin: Theme.spacingM
anchors.right: parent.right
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.bottomMargin: 8
anchors.bottomMargin: contentSpacing
color: "transparent"
Item {
width: parent.width
height: parent.height
anchors.top: parent.top
anchors.topMargin: -2
Column {
width: parent.width
spacing: 2
anchors.verticalCenter: parent.verticalCenter
spacing: compactMode ? 1 : 2
StyledText {
width: parent.width
@@ -160,16 +168,39 @@ Rectangle {
StyledText {
id: descriptionText
property bool hasMoreText: truncated
text: historyItem.htmlBody || historyItem.body || ""
color: Theme.surfaceVariantText
font.pixelSize: Theme.fontSizeSmall
width: parent.width
elide: Text.ElideRight
maximumLineCount: 2
elide: descriptionExpanded ? Text.ElideNone : Text.ElideRight
maximumLineCount: descriptionExpanded ? -1 : (compactMode ? 1 : 2)
wrapMode: Text.WordWrap
visible: text.length > 0
linkColor: Theme.primary
onLinkActivated: link => Qt.openUrlExternally(link)
MouseArea {
anchors.fill: parent
cursorShape: parent.hoveredLink ? Qt.PointingHandCursor : (parent.hasMoreText || descriptionExpanded) ? Qt.PointingHandCursor : Qt.ArrowCursor
onClicked: mouse => {
if (!parent.hoveredLink && (parent.hasMoreText || descriptionExpanded)) {
const messageId = historyItem?.id ? (historyItem.id + "_hist") : "";
NotificationService.toggleMessageExpansion(messageId);
}
}
propagateComposedEvents: true
onPressed: mouse => {
if (parent.hoveredLink)
mouse.accepted = false;
}
onReleased: mouse => {
if (parent.hoveredLink)
mouse.accepted = false;
}
}
}
}
@@ -179,11 +210,11 @@ Rectangle {
DankActionButton {
anchors.top: parent.top
anchors.right: parent.right
anchors.topMargin: 12
anchors.rightMargin: 16
anchors.topMargin: cardPadding
anchors.rightMargin: Theme.spacingL
iconName: "close"
iconSize: 18
buttonSize: 28
iconSize: compactMode ? 16 : 18
buttonSize: compactMode ? 24 : 28
onClicked: NotificationService.removeFromHistory(historyItem.id)
}
}

186
quickshell/Modules/Notifications/Center/NotificationCard.qml
View File

@@ -18,17 +18,17 @@ Rectangle {
property int selectedNotificationIndex: -1
property bool keyboardNavigationActive: false
readonly property bool compactMode: SettingsData.notificationCompactMode
readonly property real cardPadding: compactMode ? Theme.spacingS : Theme.spacingM
readonly property real iconSize: compactMode ? 48 : 63
readonly property real contentSpacing: compactMode ? Theme.spacingXS : Theme.spacingS
readonly property real badgeSize: compactMode ? 16 : 18
readonly property real actionButtonHeight: compactMode ? 20 : 24
readonly property real baseCardHeight: cardPadding * 2 + collapsedContentHeight
readonly property real collapsedContentHeight: iconSize + cardPadding
width: parent ? parent.width : 400
height: {
if (expanded) {
return expandedContent.height + 28;
}
const baseHeight = 116;
if (descriptionExpanded) {
return baseHeight + descriptionText.contentHeight - (descriptionText.font.pixelSize * 1.2 * 2);
}
return baseHeight;
}
height: expanded ? (expandedContent.height + cardPadding * 2) : (baseCardHeight + collapsedContent.extraHeight)
radius: Theme.cornerRadius
Behavior on border.color {
@@ -97,24 +97,28 @@ Rectangle {
Item {
id: collapsedContent
readonly property real expandedTextHeight: descriptionText.contentHeight
readonly property real twoLineHeight: descriptionText.font.pixelSize * 1.2 * 2
readonly property real extraHeight: (descriptionExpanded && expandedTextHeight > twoLineHeight + 2) ? (expandedTextHeight - twoLineHeight) : 0
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.topMargin: 12
anchors.leftMargin: 16
anchors.rightMargin: 56
height: 92
anchors.topMargin: cardPadding
anchors.leftMargin: Theme.spacingL
anchors.rightMargin: Theme.spacingL + (compactMode ? 32 : 40)
height: collapsedContentHeight + extraHeight
visible: !expanded
DankCircularImage {
id: iconContainer
readonly property bool hasNotificationImage: notificationGroup?.latestNotification?.image && notificationGroup.latestNotification.image !== ""
width: 63
height: 63
width: iconSize
height: iconSize
anchors.left: parent.left
anchors.top: parent.top
anchors.topMargin: 14
anchors.verticalCenter: parent.verticalCenter
imageSource: {
if (hasNotificationImage)
@@ -147,9 +151,9 @@ Rectangle {
}
Rectangle {
width: 18
height: 18
radius: 9
width: badgeSize
height: badgeSize
radius: badgeSize / 2
color: Theme.primary
anchors.top: parent.top
anchors.right: parent.right
@@ -161,7 +165,7 @@ Rectangle {
anchors.centerIn: parent
text: (notificationGroup?.count || 0) > 99 ? "99+" : (notificationGroup?.count || 0).toString()
color: Theme.primaryText
font.pixelSize: 9
font.pixelSize: compactMode ? 8 : 9
font.weight: Font.Bold
}
}
@@ -171,23 +175,17 @@ Rectangle {
id: textContainer
anchors.left: iconContainer.right
anchors.leftMargin: 12
anchors.leftMargin: Theme.spacingM
anchors.right: parent.right
anchors.rightMargin: 0
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.bottomMargin: 8
anchors.bottomMargin: contentSpacing
color: "transparent"
Item {
width: parent.width
height: parent.height
anchors.top: parent.top
anchors.topMargin: -2
Column {
width: parent.width
spacing: 2
anchors.verticalCenter: parent.verticalCenter
spacing: compactMode ? 1 : 2
StyledText {
width: parent.width
@@ -224,7 +222,7 @@ Rectangle {
font.pixelSize: Theme.fontSizeSmall
width: parent.width
elide: Text.ElideRight
maximumLineCount: descriptionExpanded ? -1 : 2
maximumLineCount: descriptionExpanded ? -1 : (compactMode ? 1 : 2)
wrapMode: Text.WordWrap
visible: text.length > 0
linkColor: Theme.primary
@@ -243,12 +241,11 @@ Rectangle {
propagateComposedEvents: true
onPressed: mouse => {
if (parent.hoveredLink) {
if (parent.hoveredLink)
mouse.accepted = false;
}
}
onReleased: mouse => {
if (parent.hoveredLink) {
if (parent.hoveredLink)
mouse.accepted = false;
}
}
@@ -256,8 +253,6 @@ Rectangle {
}
}
}
}
}
Column {
id: expandedContent
@@ -265,21 +260,20 @@ Rectangle {
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.topMargin: 14
anchors.bottomMargin: 14
anchors.topMargin: cardPadding
anchors.leftMargin: Theme.spacingL
anchors.rightMargin: Theme.spacingL
spacing: -1
spacing: compactMode ? Theme.spacingXS : Theme.spacingS
visible: expanded
Item {
width: parent.width
height: 40
height: compactMode ? 32 : 40
Row {
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: 56
anchors.rightMargin: Theme.spacingL + (compactMode ? 32 : 40)
anchors.verticalCenter: parent.verticalCenter
spacing: Theme.spacingS
@@ -294,9 +288,9 @@ Rectangle {
}
Rectangle {
width: 18
height: 18
radius: 9
width: badgeSize
height: badgeSize
radius: badgeSize / 2
color: Theme.primary
visible: (notificationGroup?.count || 0) > 1
anchors.verticalCenter: parent.verticalCenter
@@ -305,7 +299,7 @@ Rectangle {
anchors.centerIn: parent
text: (notificationGroup?.count || 0) > 99 ? "99+" : (notificationGroup?.count || 0).toString()
color: Theme.primaryText
font.pixelSize: 9
font.pixelSize: compactMode ? 8 : 9
font.weight: Font.Bold
}
}
@@ -314,7 +308,7 @@ Rectangle {
Column {
width: parent.width
spacing: 16
spacing: compactMode ? Theme.spacingS : Theme.spacingL
Repeater {
id: notificationRepeater
@@ -328,23 +322,23 @@ Rectangle {
required property int index
readonly property bool messageExpanded: NotificationService.expandedMessages[modelData?.notification?.id] || false
readonly property bool isSelected: root.selectedNotificationIndex === index
readonly property real expandedIconSize: compactMode ? 40 : 48
readonly property real expandedItemPadding: compactMode ? Theme.spacingS : Theme.spacingM
readonly property real expandedBaseHeight: expandedItemPadding * 2 + expandedIconSize + actionButtonHeight + contentSpacing * 2
width: parent.width
height: {
const baseHeight = 120;
if (messageExpanded) {
if (!messageExpanded)
return expandedBaseHeight;
const twoLineHeight = bodyText.font.pixelSize * 1.2 * 2;
if (bodyText.implicitHeight > twoLineHeight + 2) {
const extraHeight = bodyText.implicitHeight - twoLineHeight;
return baseHeight + extraHeight;
}
}
return baseHeight;
if (bodyText.implicitHeight > twoLineHeight + 2)
return expandedBaseHeight + bodyText.implicitHeight - twoLineHeight;
return expandedBaseHeight;
}
radius: Theme.cornerRadius
color: isSelected ? Theme.primaryPressed : Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
border.color: isSelected ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.4) : Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.05)
border.width: isSelected ? 1 : 1
border.width: 1
Behavior on border.color {
ColorAnimation {
@@ -359,19 +353,19 @@ Rectangle {
Item {
anchors.fill: parent
anchors.margins: 12
anchors.bottomMargin: 8
anchors.margins: compactMode ? Theme.spacingS : Theme.spacingM
anchors.bottomMargin: contentSpacing
DankCircularImage {
id: messageIcon
readonly property bool hasNotificationImage: modelData?.image && modelData.image !== ""
width: 48
height: 48
width: expandedIconSize
height: expandedIconSize
anchors.left: parent.left
anchors.top: parent.top
anchors.topMargin: 32
anchors.topMargin: compactMode ? Theme.spacingM : Theme.spacingXL
imageSource: {
if (hasNotificationImage)
@@ -397,9 +391,9 @@ Rectangle {
Item {
anchors.left: messageIcon.right
anchors.leftMargin: 12
anchors.leftMargin: Theme.spacingM
anchors.right: parent.right
anchors.rightMargin: 12
anchors.rightMargin: Theme.spacingM
anchors.top: parent.top
anchors.bottom: parent.bottom
@@ -408,8 +402,8 @@ Rectangle {
anchors.right: parent.right
anchors.top: parent.top
anchors.bottom: buttonArea.top
anchors.bottomMargin: 4
spacing: 2
anchors.bottomMargin: contentSpacing
spacing: compactMode ? 1 : 2
StyledText {
width: parent.width
@@ -477,12 +471,12 @@ Rectangle {
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
height: 30
height: actionButtonHeight + contentSpacing
Row {
anchors.right: parent.right
anchors.bottom: parent.bottom
spacing: 8
spacing: contentSpacing
Repeater {
model: modelData?.actions || []
@@ -490,18 +484,17 @@ Rectangle {
Rectangle {
property bool isHovered: false
width: Math.max(actionText.implicitWidth + 12, 50)
height: 24
radius: 4
width: Math.max(actionText.implicitWidth + Theme.spacingM, compactMode ? 40 : 50)
height: actionButtonHeight
radius: Theme.spacingXS
color: isHovered ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.1) : "transparent"
StyledText {
id: actionText
text: {
const baseText = modelData.text || "View";
if (keyboardNavigationActive && (isGroupSelected || selectedNotificationIndex >= 0)) {
if (keyboardNavigationActive && (isGroupSelected || selectedNotificationIndex >= 0))
return `${baseText} (${index + 1})`;
}
return baseText;
}
color: parent.isHovered ? Theme.primary : Theme.surfaceVariantText
@@ -518,20 +511,19 @@ Rectangle {
onEntered: parent.isHovered = true
onExited: parent.isHovered = false
onClicked: {
if (modelData && modelData.invoke) {
if (modelData && modelData.invoke)
modelData.invoke();
}
}
}
}
}
Rectangle {
property bool isHovered: false
width: Math.max(clearText.implicitWidth + 12, 50)
height: 24
radius: 4
width: Math.max(clearText.implicitWidth + Theme.spacingM, compactMode ? 40 : 50)
height: actionButtonHeight
radius: Theme.spacingXS
color: isHovered ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.1) : "transparent"
StyledText {
@@ -564,10 +556,10 @@ Rectangle {
Row {
visible: !expanded
anchors.right: clearButton.left
anchors.rightMargin: 8
anchors.rightMargin: contentSpacing
anchors.bottom: parent.bottom
anchors.bottomMargin: 8
spacing: 8
anchors.bottomMargin: contentSpacing
spacing: contentSpacing
Repeater {
model: notificationGroup?.latestNotification?.actions || []
@@ -575,9 +567,9 @@ Rectangle {
Rectangle {
property bool isHovered: false
width: Math.max(actionText.implicitWidth + 12, 50)
height: 24
radius: 4
width: Math.max(actionText.implicitWidth + Theme.spacingM, compactMode ? 40 : 50)
height: actionButtonHeight
radius: Theme.spacingXS
color: isHovered ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.1) : "transparent"
StyledText {
@@ -619,12 +611,12 @@ Rectangle {
visible: !expanded
anchors.right: parent.right
anchors.rightMargin: 16
anchors.rightMargin: Theme.spacingL
anchors.bottom: parent.bottom
anchors.bottomMargin: 8
width: Math.max(clearText.implicitWidth + 12, 50)
height: 24
radius: 4
anchors.bottomMargin: contentSpacing
width: Math.max(clearText.implicitWidth + Theme.spacingM, compactMode ? 40 : 50)
height: actionButtonHeight
radius: Theme.spacingXS
color: isHovered ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.1) : "transparent"
StyledText {
@@ -660,18 +652,18 @@ Rectangle {
id: fixedControls
anchors.top: parent.top
anchors.right: parent.right
anchors.topMargin: 12
anchors.rightMargin: 16
width: 60
height: 28
anchors.topMargin: cardPadding
anchors.rightMargin: Theme.spacingL
width: compactMode ? 52 : 60
height: compactMode ? 24 : 28
DankActionButton {
anchors.left: parent.left
anchors.top: parent.top
visible: (notificationGroup?.count || 0) > 1
iconName: expanded ? "expand_less" : "expand_more"
iconSize: 18
buttonSize: 28
iconSize: compactMode ? 16 : 18
buttonSize: compactMode ? 24 : 28
onClicked: {
root.userInitiatedExpansion = true;
NotificationService.toggleGroupExpansion(notificationGroup?.key || "");
@@ -682,8 +674,8 @@ Rectangle {
anchors.right: parent.right
anchors.top: parent.top
iconName: "close"
iconSize: 18
buttonSize: 28
iconSize: compactMode ? 16 : 18
buttonSize: compactMode ? 24 : 28
onClicked: NotificationService.dismissGroup(notificationGroup?.key || "")
}
}

123
quickshell/Modules/Notifications/Popup/NotificationPopup.qml
View File

@@ -22,6 +22,15 @@ PanelWindow {
property bool _isDestroying: false
property bool _finalized: false
readonly property string clearText: I18n.tr("Dismiss")
property bool descriptionExpanded: false
readonly property bool compactMode: SettingsData.notificationCompactMode
readonly property real cardPadding: compactMode ? Theme.spacingS : Theme.spacingM
readonly property real popupIconSize: compactMode ? 48 : 63
readonly property real contentSpacing: compactMode ? Theme.spacingXS : Theme.spacingS
readonly property real actionButtonHeight: compactMode ? 20 : 24
readonly property real collapsedContentHeight: popupIconSize + cardPadding
readonly property real basePopupHeight: cardPadding * 2 + collapsedContentHeight + Theme.spacingS
signal entered
signal exitStarted
@@ -92,7 +101,15 @@ PanelWindow {
WlrLayershell.keyboardFocus: WlrKeyboardFocus.None
color: "transparent"
implicitWidth: 400
implicitHeight: 122
implicitHeight: {
if (!descriptionExpanded)
return basePopupHeight;
const bodyTextHeight = bodyTextLoader.item?.contentHeight || 0;
const twoLineHeight = Theme.fontSizeSmall * 1.2 * 2;
if (bodyTextHeight > twoLineHeight + 2)
return basePopupHeight + bodyTextHeight - twoLineHeight;
return basePopupHeight;
}
onHasValidDataChanged: {
if (!hasValidData && !exiting && !_isDestroying) {
forceExit();
@@ -352,13 +369,17 @@ PanelWindow {
Item {
id: notificationContent
readonly property real expandedTextHeight: bodyTextLoader.item?.contentHeight || 0
readonly property real twoLineHeight: Theme.fontSizeSmall * 1.2 * 2
readonly property real extraHeight: (descriptionExpanded && expandedTextHeight > twoLineHeight + 2) ? (expandedTextHeight - twoLineHeight) : 0
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.topMargin: 12
anchors.leftMargin: 16
anchors.rightMargin: 56
height: 98
anchors.topMargin: cardPadding
anchors.leftMargin: Theme.spacingL
anchors.rightMargin: Theme.spacingL + (compactMode ? 32 : 40)
height: collapsedContentHeight + extraHeight
DankCircularImage {
id: iconContainer
@@ -366,8 +387,8 @@ PanelWindow {
readonly property bool hasNotificationImage: notificationData && notificationData.image && notificationData.image !== ""
readonly property bool needsImagePersist: hasNotificationImage && notificationData.image.startsWith("image://qsimage/") && !notificationData.persistedImagePath
width: 63
height: 63
width: popupIconSize
height: popupIconSize
anchors.left: parent.left
anchors.verticalCenter: parent.verticalCenter
@@ -416,36 +437,26 @@ PanelWindow {
id: textContainer
anchors.left: iconContainer.right
anchors.leftMargin: 12
anchors.leftMargin: Theme.spacingM
anchors.right: parent.right
anchors.rightMargin: 0
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.bottomMargin: 8
anchors.bottomMargin: contentSpacing
color: "transparent"
Item {
width: parent.width
height: parent.height
anchors.top: parent.top
anchors.topMargin: -2
Column {
width: parent.width
spacing: 2
anchors.verticalCenter: parent.verticalCenter
spacing: compactMode ? 1 : 2
StyledText {
width: parent.width
text: {
if (!notificationData)
return "";
const appName = notificationData.appName || "";
const timeStr = notificationData.timeStr || "";
if (timeStr.length > 0)
return appName + " • " + timeStr;
else
return appName;
return timeStr.length > 0 ? appName + " • " + timeStr : appName;
}
color: Theme.surfaceVariantText
font.pixelSize: Theme.fontSizeSmall
@@ -467,25 +478,44 @@ PanelWindow {
visible: text.length > 0
}
StyledText {
Loader {
id: bodyTextLoader
width: parent.width
active: notificationData && (notificationData.htmlBody || "").length > 0
sourceComponent: StyledText {
id: bodyText
property bool hasMoreText: truncated
text: notificationData ? (notificationData.htmlBody || "") : ""
color: Theme.surfaceVariantText
font.pixelSize: Theme.fontSizeSmall
width: parent.width
elide: Text.ElideRight
elide: descriptionExpanded ? Text.ElideNone : Text.ElideRight
horizontalAlignment: Text.AlignLeft
maximumLineCount: 2
maximumLineCount: descriptionExpanded ? -1 : (compactMode ? 1 : 2)
wrapMode: Text.WordWrap
visible: text.length > 0
linkColor: Theme.primary
onLinkActivated: link => {
return Qt.openUrlExternally(link);
}
onLinkActivated: link => Qt.openUrlExternally(link)
MouseArea {
anchors.fill: parent
acceptedButtons: Qt.NoButton
cursorShape: parent.hoveredLink ? Qt.PointingHandCursor : Qt.ArrowCursor
cursorShape: parent.hoveredLink ? Qt.PointingHandCursor : (parent.hasMoreText || descriptionExpanded) ? Qt.PointingHandCursor : Qt.ArrowCursor
onClicked: mouse => {
if (!parent.hoveredLink && (parent.hasMoreText || descriptionExpanded))
win.descriptionExpanded = !win.descriptionExpanded;
}
propagateComposedEvents: true
onPressed: mouse => {
if (parent.hoveredLink)
mouse.accepted = false;
}
onReleased: mouse => {
if (parent.hoveredLink)
mouse.accepted = false;
}
}
}
}
@@ -498,11 +528,11 @@ PanelWindow {
anchors.right: parent.right
anchors.top: parent.top
anchors.topMargin: 12
anchors.rightMargin: 16
anchors.topMargin: cardPadding
anchors.rightMargin: Theme.spacingL
iconName: "close"
iconSize: 18
buttonSize: 28
iconSize: compactMode ? 16 : 18
buttonSize: compactMode ? 24 : 28
z: 15
onClicked: {
if (notificationData && !win.exiting)
@@ -512,10 +542,10 @@ PanelWindow {
Row {
anchors.right: clearButton.left
anchors.rightMargin: 8
anchors.rightMargin: contentSpacing
anchors.bottom: parent.bottom
anchors.bottomMargin: 8
spacing: 8
anchors.bottomMargin: contentSpacing
spacing: contentSpacing
z: 20
Repeater {
@@ -524,9 +554,9 @@ PanelWindow {
Rectangle {
property bool isHovered: false
width: Math.max(actionText.implicitWidth + 12, 50)
height: 24
radius: 4
width: Math.max(actionText.implicitWidth + Theme.spacingM, compactMode ? 40 : 50)
height: actionButtonHeight
radius: Theme.spacingXS
color: isHovered ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.1) : "transparent"
StyledText {
@@ -550,7 +580,6 @@ PanelWindow {
onClicked: {
if (modelData && modelData.invoke)
modelData.invoke();
if (notificationData && !win.exiting)
notificationData.popup = false;
}
@@ -565,12 +594,12 @@ PanelWindow {
property bool isHovered: false
anchors.right: parent.right
anchors.rightMargin: 16
anchors.rightMargin: Theme.spacingL
anchors.bottom: parent.bottom
anchors.bottomMargin: 8
width: Math.max(clearTextLabel.implicitWidth + 12, 50)
height: 24
radius: 4
anchors.bottomMargin: contentSpacing
width: Math.max(clearTextLabel.implicitWidth + Theme.spacingM, compactMode ? 40 : 50)
height: actionButtonHeight
radius: Theme.spacingXS
color: isHovered ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.1) : "transparent"
z: 20

7
quickshell/Modules/Notifications/Popup/NotificationPopupManager.qml
View File

@@ -1,4 +1,5 @@
import QtQuick
import qs.Common
import qs.Services
QtObject {
@@ -6,7 +7,11 @@ QtObject {
property var modelData
property int topMargin: 0
property int baseNotificationHeight: 120
readonly property bool compactMode: SettingsData.notificationCompactMode
readonly property real cardPadding: compactMode ? Theme.spacingS : Theme.spacingM
readonly property real popupIconSize: compactMode ? 48 : 63
readonly property real popupSpacing: Theme.spacingS
readonly property int baseNotificationHeight: cardPadding * 3 + popupIconSize + popupSpacing
property int maxTargetNotifications: 4
property var popupWindows: [] // strong refs to windows (live until exitFinished)
property var destroyingWindows: new Set()

9
quickshell/Modules/Settings/NotificationsTab.qml
View File

@@ -144,6 +144,15 @@ Item {
checked: SettingsData.notificationOverlayEnabled
onToggled: checked => SettingsData.set("notificationOverlayEnabled", checked)
}
SettingsToggleRow {
settingKey: "notificationCompactMode"
tags: ["notification", "compact", "size", "display", "mode"]
text: I18n.tr("Compact")
description: I18n.tr("Use smaller notification cards")
checked: SettingsData.notificationCompactMode
onToggled: checked => SettingsData.set("notificationCompactMode", checked)
}
}
SettingsCard {