added 'warningAlt' accent color config

Config/AccentColor.qml

@@ -5,7 +5,8 @@ JsonObject {
 
     component Accents: JsonObject {
         property string primary: "#4080ff"
-        property string warning: "#ff6b6b"
         property string primaryAlt: "#60a0ff"
+        property string warning: "#ff6b6b"
+        property string warningAlt: "#ff8787"
     }
 }

Helpers/SearchWallpapers.qml

@@ -16,15 +16,6 @@ Searcher {
             forward: false
         })
 
-    // FileView {
-    //     path: root.currentNamePath
-    //     watchChanges: true
-    //     onFileChanged: reload()
-    //     onLoaded: {
-    //         root.actualCurrent = text().trim();
-    //     }
-    // }
-
     FileSystemModel {
         id: wallpapers
 

Modules/NotificationCenter.qml

@@ -22,6 +22,7 @@ PanelWindow {
     }
 
     WlrLayershell.layer: WlrLayer.Overlay
+    WlrLayershell.keyboardFocus: WlrKeyboardFocus.OnDemand
     required property PanelWindow bar
     property bool centerShown: false
     property alias posX: backgroundRect.x
@@ -51,6 +52,13 @@ PanelWindow {
         }
     }
 
+    Keys.onPressed: {
+        if ( event.key === Qt.Key_Escape ) {
+            root.centerShown = false;
+            event.accepted = true;
+        }
+    }
+
     Timer {
         id: closeTimer
         interval: 300

Modules/Resource.qml

@@ -1,6 +1,7 @@
 import qs.Modules
 import QtQuick
 import QtQuick.Layouts
+import QtQuick.Shapes
 import Quickshell
 import qs.Config
 
@@ -46,36 +47,51 @@ Item {
                 border.width: 1
             }
 
-            Canvas {
+            Shape {
-                id: progressCanvas
                 anchors.fill: backgroundCircle
 
-                Connections {
+                smooth: true
-                    target: root
+                preferredRendererType: Shape.CurveRenderer
-                    function onPercentageChanged() {
+
-                        progressCanvas.requestPaint()
+                ShapePath {
+                    strokeWidth: 0
+                    fillColor: root.warning ? Config.accentColor.accents.warning : Config.accentColor.accents.primary
+                    startX: backgroundCircle.width / 2
+                    startY: backgroundCircle.height / 2
+                    PathLine {
+                        x: backgroundCircle.width / 2
+                        y: 0 + ( 1 / 2 )
                     }
-                    function onWarningChanged() {
+
-                        progressCanvas.requestPaint()
+                    PathAngleArc {
+                        centerX: backgroundCircle.width / 2
+                        centerY: backgroundCircle.height / 2
+                        radiusX: backgroundCircle.width / 2 - ( 1 / 2 )
+                        radiusY: backgroundCircle.height / 2 - ( 1 / 2 )
+                        startAngle: -90
+                        sweepAngle: 360 * root.percentage
+                    }
+
+                    PathLine {
+                        x: backgroundCircle.width / 2
+                        y: backgroundCircle.height / 2
                     }
                 }
 
-                onPaint: {
+                ShapePath {
-                    var ctx = getContext("2d");
+                    strokeWidth: 1
-                    ctx.reset();
+                    strokeColor: root.warning ? Config.accentColor.accents.warningAlt : Config.accentColor.accents.primaryAlt
-                    
+                    fillColor: "transparent"
-                    var centerX = width / 2;
+                    capStyle: ShapePath.FlatCap
-                    var centerY = height / 2;
-                    var radius = width / 2;
-                    var startAngle = -Math.PI / 2; // Start at top
-                    var endAngle = startAngle + (2 * Math.PI * percentage);
 
-                    ctx.fillStyle = warning ? Config.accentColor.accents.warning : Config.accentColor.accents.primary;
+                    PathAngleArc {
-                    ctx.beginPath();
+                        centerX: backgroundCircle.width / 2
-                    ctx.moveTo(centerX, centerY);
+                        centerY: backgroundCircle.height / 2
-                    ctx.arc(centerX, centerY, radius, startAngle, endAngle);
+                        radiusX: backgroundCircle.width / 2 - ( 1 / 2 )
-                    ctx.lineTo(centerX, centerY);
+                        radiusY: backgroundCircle.height / 2 - ( 1 / 2 )
-                    ctx.fill();
+                        startAngle: -90
+                        sweepAngle: 360 * root.percentage
+                    }
                 }
             }
         }

Modules/Resources.qml

@@ -81,6 +81,7 @@ Item {
     }
 
     MouseArea {
+        id: widgetMouseArea
         anchors.fill: parent
         hoverEnabled: true
         onEntered: {
@@ -97,9 +98,7 @@ Item {
 
     component ResourcePopout: PanelWindow {
         id: popoutWindow
-        property alias containsMouse: popoutWindow.mouseAreaContainsMouse
         property int rectHeight: contentRect.implicitHeight
-        property bool mouseAreaContainsMouse: mouseArea.containsMouse
         WlrLayershell.exclusionMode: ExclusionMode.Ignore
 
         anchors {
@@ -127,10 +126,6 @@ Item {
                 duration: MaterialEasing.expressiveEffectsTime
                 easing.bezierCurve: MaterialEasing.expressiveEffects
             }
-            onFinished: {
-                if ( !mouseArea.containsMouse )
-                    closeAnim.start();
-            }
         }
 
         ParallelAnimation {
@@ -171,40 +166,40 @@ Item {
                 spacing: 10
 
                 ResourceDetail {
-                    resourceName: qsTr("Memory Usage")
+                    resourceName: qsTr( "Memory Usage" )
                     iconString: "\uf7a3"
                     percentage: ResourceUsage.memoryUsedPercentage
                     warningThreshold: 95
-                    details: qsTr("%1 of %2 MB used")
+                    details: qsTr( "%1 of %2 MB used" )
-                        .arg(Math.round(ResourceUsage.memoryUsed * 0.001))
+                        .arg( Math.round( ResourceUsage.memoryUsed * 0.001 ))
-                        .arg(Math.round(ResourceUsage.memoryTotal * 0.001))
+                        .arg( Math.round( ResourceUsage.memoryTotal * 0.001 ))
                 }
 
                 ResourceDetail {
-                    resourceName: qsTr("CPU Usage")
+                    resourceName: qsTr( "CPU Usage" )
                     iconString: "\ue322"
                     percentage: ResourceUsage.cpuUsage
                     warningThreshold: 95
-                    details: qsTr("%1% used")
+                    details: qsTr( "%1% used" )
-                        .arg(Math.round(ResourceUsage.cpuUsage * 100))
+                        .arg( Math.round( ResourceUsage.cpuUsage * 100 ))
                 }
 
                 ResourceDetail {
-                    resourceName: qsTr("GPU Usage")
+                    resourceName: qsTr( "GPU Usage" )
                     iconString: "\ue30f"
                     percentage: ResourceUsage.gpuUsage
                     warningThreshold: 95
-                    details: qsTr("%1% used")
+                    details: qsTr( "%1% used" )
-                        .arg(Math.round(ResourceUsage.gpuUsage * 100))
+                        .arg( Math.round( ResourceUsage.gpuUsage * 100 ))
                 }
 
                 ResourceDetail {
-                    resourceName: qsTr("VRAM Usage")
+                    resourceName: qsTr( "VRAM Usage" )
                     iconString: "\ue30d"
                     percentage: ResourceUsage.gpuMemUsage
                     warningThreshold: 95
-                    details: qsTr("%1% used")
+                    details: qsTr( "%1% used" )
-                        .arg(Math.round(ResourceUsage.gpuMemUsage * 100))
+                        .arg( Math.round( ResourceUsage.gpuMemUsage * 100 ))
                 }
             }
             MouseArea {

Modules/TrackedNotification.qml

@@ -131,26 +131,13 @@ PanelWindow {
                 border.color: "#555555"
                 radius: 8
 
-                // Rectangle {
-                //     anchors.bottom: parent.bottom
-                //     anchors.left: parent.left
-                //     anchors.right: parent.right
-                //     height: 4
-                //     bottomLeftRadius: parent.radius
-                //     bottomRightRadius: parent.radius
-                //     color: "#40000000"
-                //     Rectangle {
-                //         anchors.fill: parent
-                //         width: parent.width * ( Math.max(0, Math.min( rootItem.modelData.timer ) ) )
-                //     }
-                // }
-
                 Component.onCompleted: {
                     root.notifRegions.push( notifRegion.createObject(root, { item: backgroundRect }));
                 }
 
                 Column {
                     id: contentLayout
+                    z: 0
                     anchors.left: parent.left
                     anchors.right: parent.right
                     anchors.verticalCenter: parent.verticalCenter
@@ -238,11 +225,10 @@ PanelWindow {
 
             }
             MouseArea {
-                property int timePassed
+                z: 1
                 anchors.fill: parent
                 hoverEnabled: true
                 onEntered: {
-                    // rootItem.modelData.timer.interval = 5000 - timer.restartMs();
                     rootItem.modelData.timer.stop();
                 }
                 onExited: {