qs: improve bar's animations

README.md

@@ -15,7 +15,7 @@
 
 <summary>Niri & Quickshell</summary>
 
-https://github.com/user-attachments/assets/af29bcac-7207-4f23-88bb-d8c5d447776a
+https://github.com/user-attachments/assets/1fd0f3be-e83f-4d1c-9e4f-16cc77e3981b
 
 <figure>
     <img src="https://github.com/Uyanide/backgrounds/blob/master/screenshots/desktop-alt.webp?raw=true"/>

config/quickshell/.config/quickshell/Modules/Background/ScrollBackground.qml

@@ -23,7 +23,8 @@ Item {
     readonly property real viewportHeight: outputHeight > 0 ? outputHeight : height
     readonly property real scrollProgress: {
         if (workspaceCount <= 1 || focusedIndex < 0)
-            return 0.5; // Center
+            return 0.5;
+ // Center
         return Math.max(0, Math.min(1, (focusedIndex - 1) / (workspaceCount - 1)));
     }
 
@@ -142,6 +143,7 @@ Item {
         Behavior on blur {
             NumberAnimation {
                 duration: Style.animationSlow
+                easing.type: Easing.InOutCubic
             }
 
         }
@@ -149,6 +151,7 @@ Item {
         Behavior on colorization {
             NumberAnimation {
                 duration: Style.animationSlow
+                easing.type: Easing.InOutCubic
             }
 
         }

config/quickshell/.config/quickshell/Modules/Bar/Bar.qml

@@ -31,6 +31,21 @@ Variants {
                 top: true
             }
 
+            Rectangle {
+                anchors.fill: parent
+                color: Colors.mSurface
+                opacity: BarService.focusMode ? 1 : 0
+
+                Behavior on opacity {
+                    NumberAnimation {
+                        duration: Style.animationSlow
+                        easing.type: Easing.InOutCubic
+                    }
+
+                }
+
+            }
+
             Rectangle {
                 id: barBackground
 
@@ -39,30 +54,12 @@ Variants {
                 gradient: Gradient {
                     GradientStop {
                         position: 0
-                        color: Qt.rgba(Colors.mSurface.r, Colors.mSurface.g, Colors.mSurface.b, BarService.focusMode ? 1 : 0.8)
-
-                        Behavior on color {
-                            ColorAnimation {
-                                duration: Style.animationSlowest
-                                easing.type: Easing.InOutCubic
-                            }
-
-                        }
-
+                        color: Qt.rgba(Colors.mSurface.r, Colors.mSurface.g, Colors.mSurface.b, 0.8)
                     }
 
                     GradientStop {
                         position: 1
-                        color: Qt.rgba(Colors.mSurface.r, Colors.mSurface.g, Colors.mSurface.b, BarService.focusMode ? 1 : 0)
-
-                        Behavior on color {
-                            ColorAnimation {
-                                duration: Style.animationSlowest
-                                easing.type: Easing.InOutCubic
-                            }
-
-                        }
-
+                        color: Qt.rgba(Colors.mSurface.r, Colors.mSurface.g, Colors.mSurface.b, 0)
                     }
 
                 }

config/quickshell/.config/quickshell/Modules/Misc/Corners.qml

@@ -173,7 +173,7 @@ Scope {
 
     Behavior on opacity {
         NumberAnimation {
-            duration: Style.animationSlowest
+            duration: Style.animationSlow
             easing.type: Easing.InOutCubic
         }
 

config/quickshell/.config/quickshell/Services/NotesService.qml

@@ -1,4 +1,3 @@
-import QtQml
 import QtQuick
 import Quickshell
 import Quickshell.Io