rounded noti corners and flush with screen edge

This commit is contained in:
lucy 2025-12-29 23:41:32 +01:00
parent 358fc5fe89
commit c55f9b9ae0
4 changed files with 43 additions and 37 deletions

View File

@ -5,25 +5,25 @@ import Quickshell
Singleton { Singleton {
id: customColors id: customColors
// Core Backgrounds // Core Backgrounds
readonly property color background: "#1A1B26" readonly property color background: "#0E1019"
readonly property color foreground: "#C0CAF5" readonly property color foreground: "#FFFAF4"
readonly property color cursor: "#C0CAF5" readonly property color cursor: "#FFFAF4"
// The 16 Colors of the Apocalypse // The 16 Colors of the Apocalypse
readonly property color color0: "#414868" readonly property color color0: "#232323"
readonly property color color1: "#F7768E" readonly property color color1: "#FF000F"
readonly property color color2: "#9ECE6A" readonly property color color2: "#8CE10B"
readonly property color color3: "#E0AF68" readonly property color color3: "#FFB900"
readonly property color color4: "#7AA2F7" readonly property color color4: "#008DF8"
readonly property color color5: "#BB9AF7" readonly property color color5: "#6D43A6"
readonly property color color6: "#7DCFFF" readonly property color color6: "#00D8EB"
readonly property color color7: "#A9B1D6" readonly property color color7: "#FFFFFF"
readonly property color color8: "#414868" readonly property color color8: "#444444"
readonly property color color9: "#F7768E" readonly property color color9: "#FF2740"
readonly property color color10: "#9ECE6A" readonly property color color10: "#ABE15B"
readonly property color color11: "#E0AF68" readonly property color color11: "#FFD242"
readonly property color color12: "#7AA2F7" readonly property color color12: "#0092FF"
readonly property color color13: "#BB9AF7" readonly property color color13: "#9A5FEB"
readonly property color color14: "#7DCFFF" readonly property color color14: "#67FFF0"
readonly property color color15: "#C0CAF5" readonly property color color15: "#FFFFFF"
} }

View File

@ -6,7 +6,7 @@ import "../../"
PanelWindow { PanelWindow {
id: root id: root
required property var modelData required property var modelData
implicitHeight: 34 implicitHeight: 36
color: Colors.background color: Colors.background
anchors { anchors {
top: true top: true

View File

@ -31,19 +31,26 @@ WlrLayershell {
right: true right: true
} }
margins { margins {
top: 45 top: 36
right: 10 right: 00
} }
implicitWidth: 300 implicitWidth: 300
implicitHeight: notifList.contentHeight + 20 implicitHeight: notifList.contentHeight + 20
Behavior on implicitHeight {
NumberAnimation {
duration: 300
easing.type: Easing.OutQuad
}
}
// 2. Layer: Put it ABOVE normal windows // 2. Layer: Put it ABOVE normal windows
layer: WlrLayer.Overlay layer: WlrLayer.Overlay
exclusionMode: ExclusionMode.Ignore exclusionMode: ExclusionMode.Ignore
// 3. CRITICAL: Make the window itself invisible! // 3. CRITICAL: Make the window itself invisible!
// We only want to see the notifications, not the container. // We only want to see the
// notifications, not the container.
color: "transparent" color: "transparent"
// 4. Input: Let clicks pass through empty areas // 4. Input: Let clicks pass through empty areas
@ -53,39 +60,37 @@ WlrLayershell {
// THE SPAWNER // THE SPAWNER
ListView { ListView {
id: notifList id: notifList
anchors.fill: parent anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.margins: 0 anchors.margins: 0
// Use 'spacing' to put gaps between notifications // Use 'spacing' to put gaps between notifications
spacing: 10 spacing: 00
height: contentHeight
// Align to the bottom (like Windows) or Top (like GNOME)?
// verticalLayoutDirection: ListView.BottomToTop
// 🔗 CONNECT TO THE SERVER
// Assuming your NotificationServer is a singleton or globally accessible
// ... other imports
// Inside your ListView...
model: NotifServer.trackedNotifications model: NotifServer.trackedNotifications
delegate: Item { delegate: Item {
id: notifyItem id: notifyItem
required property var index
readonly property bool isLast: index === (ListView.view.count - 1)
implicitWidth: ListView.view.width implicitWidth: ListView.view.width
implicitHeight: 85 // Fixed height is usually better for icon layouts implicitHeight: 85 // Fixed height is usually better for icon layouts
height: implicitHeight
required property var modelData required property var modelData
Timer { Timer {
id: timout id: timout
interval: 3000 interval: 3000
running: true running: true
onRunningChanged: notifyItem.modelData.dismiss() onTriggered: notifyItem.modelData.dismiss()
} }
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
color: Colors.background color: Colors.background
radius: 20 bottomLeftRadius: notifyItem.isLast ? 20 : 0
border.color: Colors.color5 border.color: Colors.color5
border.width: 2 border.width: 0
// 2. Use RowLayout to put Image | Text side-by-side // 2. Use RowLayout to put Image | Text side-by-side
RowLayout { RowLayout {

View File

@ -11,13 +11,14 @@ Singleton {
watchChanges: true watchChanges: true
onAdapterChanged: writeAdapter() onAdapterChanged: writeAdapter()
onFileChanged: reload()
JsonAdapter { JsonAdapter {
id: adapter id: adapter
property string lastWallpaper property string lastWallpaper
property string wallDir property string wallDir
property string font property string font
property real fontSize: 12 property real fontSize: 14
} }
} }