From 608d8bbfcef6aa8c9756d1eb4e1e1e084908fcd5 Mon Sep 17 00:00:00 2001 From: lucy Date: Fri, 15 May 2026 18:19:50 +0200 Subject: [PATCH] fix and style notifications --- Colors.qml | 32 ++++++++++---------- modules/notifications/NotiCard.qml | 47 ++++++++++++++++++++++++----- modules/notifications/NotiPopup.qml | 3 +- settings/settings.ini | 2 +- widgets/MaterialIcon.qml | 2 +- 5 files changed, 59 insertions(+), 27 deletions(-) diff --git a/Colors.qml b/Colors.qml index c2c3ae2..c23b961 100644 --- a/Colors.qml +++ b/Colors.qml @@ -3,24 +3,24 @@ import QtQuick QtObject { // --- The Backgrounds (Darkest to Lightest) --- - readonly property color base00: "#1e1e2e" // Default Background - readonly property color base01: "#181825" // Lighter Background (Status bars, panels) - readonly property color base02: "#313244" // Selection Background - readonly property color base03: "#45475a" // Comments, Invisibles, line highlighting + readonly property color base00: "#1d2021" // Default Background + readonly property color base01: "#3c3836" // Lighter Background (Status bars, panels) + readonly property color base02: "#504945" // Selection Background + readonly property color base03: "#665c54" // Comments, Invisibles, line highlighting // --- The Foregrounds (Darkest to Lightest) --- - readonly property color base04: "#585b70" // Dark Foreground (Used for status bars) - readonly property color base05: "#cdd6f4" // Default Foreground, Caret - readonly property color base06: "#f5e0dc" // Light Foreground (Rarely used) - readonly property color base07: "#b4befe" // Lightest Foreground + readonly property color base04: "#bdae93" // Dark Foreground (Used for status bars) + readonly property color base05: "#d5c4a1" // Default Foreground, Caret + readonly property color base06: "#ebdbb2" // Light Foreground (Rarely used) + readonly property color base07: "#fbf1c7" // Lightest Foreground // --- The Accent Colors --- - readonly property color base08: "#f38ba8" // Red (Variables, errors) - readonly property color base09: "#fab387" // Orange (Integers, booleans, constants) - readonly property color base0A: "#f9e2af" // Yellow (Classes, search text bg, warnings) - readonly property color base0B: "#a6e3a1" // Green (Strings, success states) - readonly property color base0C: "#94e2d5" // Cyan (Support, regex, escape chars) - readonly property color base0D: "#89b4fa" // Blue (Functions, methods, headings) - readonly property color base0E: "#cba6f7" // Purple/Mauve (Keywords, storage, selectors) - readonly property color base0F: "#f2cdcd" // Brown/Flamingo (Deprecated, embedded tags) + readonly property color base08: "#fb4934" // Red (Variables, errors) + readonly property color base09: "#fe8019" // Orange (Integers, booleans, constants) + readonly property color base0A: "#fabd2f" // Yellow (Classes, search text bg, warnings) + readonly property color base0B: "#b8bb26" // Green (Strings, success states) + readonly property color base0C: "#8ec07c" // Cyan (Support, regex, escape chars) + readonly property color base0D: "#83a598" // Blue (Functions, methods, headings) + readonly property color base0E: "#d3869b" // Purple/Mauve (Keywords, storage, selectors) + readonly property color base0F: "#d65d0e" // Brown/Flamingo (Deprecated, embedded tags) } diff --git a/modules/notifications/NotiCard.qml b/modules/notifications/NotiCard.qml index 07ca59c..f1be13a 100644 --- a/modules/notifications/NotiCard.qml +++ b/modules/notifications/NotiCard.qml @@ -9,34 +9,65 @@ import qs.widgets WrapperRectangle { id: root required property var notification - implicitWidth: 300 - implicitHeight: 100 + required property ShellScreen nScreen + implicitWidth: nScreen.width / 6 + implicitHeight: 80 radius: Config.rounding anchors.right: parent?.right color: Colors.base01 + clip: true child: WrapperMouseArea { - RowLayout { - anchors.fill: parent + id: mouseHandler + child: RowLayout { + spacing: 10 IconImage { id: appIcon - Layout.leftMargin: 16 - source: root.notification.image ? root.notification.image : '' - implicitSize: 48 + Layout.leftMargin: 8 + visible: root.notification?.image ? true : false + source: root.notification?.image ? root.notification.image : '' + implicitSize: 64 } ColumnLayout { Layout.alignment: Qt.AlignLeft + Layout.fillWidth: true + Layout.preferredWidth: 0 + Layout.fillHeight: true + Layout.leftMargin: appIcon.visible ? 0 : 16 + RowLayout { + MaterialIcon { + text: "\ue7f4" + font.pixelSize: 12 + } + StyledText { + id: appId + text: root.notification?.appName ? root.notification.appName : '' + opacity: 0.4 + } + } StyledText { id: title text: root.notification?.summary == null ? '' : root.notification.summary + elide: Text.ElideRight + Layout.fillWidth: true } StyledText { id: body - text: root.notification.body ? root.notification.body : '' + text: root.notification?.body ? root.notification.body : '' + elide: Text.ElideRight + Layout.fillWidth: true + opacity: 0.6 } } } acceptedButtons: Qt.LeftButton cursorShape: Qt.PointingHandCursor + hoverEnabled: true + onEntered: { + root.color = Colors.base03; + } + onExited: { + root.color = Colors.base01; + } onClicked: { root.notification.dismiss(); } diff --git a/modules/notifications/NotiPopup.qml b/modules/notifications/NotiPopup.qml index dbef813..69d1791 100644 --- a/modules/notifications/NotiPopup.qml +++ b/modules/notifications/NotiPopup.qml @@ -29,7 +29,7 @@ WlrLayershell { margins.top: Config.barHeight + 8 margins.right: 8 implicitHeight: notiList.contentHeight - implicitWidth: activeScreen.width / 8 + implicitWidth: activeScreen.width / 6 color: 'transparent' visible: NotiServer.notifications.values.length > 0 @@ -40,6 +40,7 @@ WlrLayershell { spacing: 6 delegate: NotiCard { required property var modelData + nScreen: notiPopup.activeScreen notification: modelData } } diff --git a/settings/settings.ini b/settings/settings.ini index fb7c5b4..43fdd98 100644 --- a/settings/settings.ini +++ b/settings/settings.ini @@ -3,4 +3,4 @@ barHeight=30 font=Maple Mono fontSize=12 roudning=16 -wallpaper=@Variant(\0\0\0\x11\0\0\0!file:///home/lucy/.wall/mooon.png) +wallpaper=@Variant(\0\0\0\x11\0\0\0 file:///home/lucy/.wall/Kita.png) diff --git a/widgets/MaterialIcon.qml b/widgets/MaterialIcon.qml index c654e3b..4004ef5 100644 --- a/widgets/MaterialIcon.qml +++ b/widgets/MaterialIcon.qml @@ -12,6 +12,6 @@ Text { "FILL": fill ? 1 : 0, "opsz": Config.iconSize, "wght": 400, - "GRAD": 0 + "GRAD": 24 } }