refractor some animations

.config/quickshell/modules/bar/Battery.qml

@@ -31,11 +31,7 @@ Rectangle {
             implicitWidth: (isCharging ? (boltIconLoader?.item?.width ?? 0) : 0)
 
             Behavior on implicitWidth {
-                NumberAnimation {
+                animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                    duration: Appearance.animation.elementMove.duration
-                    easing.type: Appearance.animation.elementMove.type
-                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                }
             }
         }
 
@@ -91,12 +87,7 @@ Rectangle {
             }
 
             Behavior on opacity {
-                NumberAnimation {
+                animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                    duration: Appearance.animation.elementMove.duration
-                    easing.type: Appearance.animation.elementMove.type
-                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                }
-
             }
 
         }

.config/quickshell/modules/bar/Resource.qml

@@ -42,11 +42,7 @@ Item {
         }
 
         Behavior on x {
-            NumberAnimation {
+            animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
         }
 
     }

.config/quickshell/modules/bar/Workspaces.qml

@@ -119,26 +119,14 @@ Item {
                 opacity: (workspaceOccupied[index] && !(!activeWindow?.activated && monitor.activeWorkspace?.id === index+1)) ? 1 : 0
 
                 Behavior on opacity {
-                    NumberAnimation {
+                    animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                        duration: Appearance.animation.elementMove.duration
-                        easing.type: Appearance.animation.elementMove.type
-                        easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                    }
                 }
                 Behavior on radiusLeft {
-                    NumberAnimation {
+                    animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                        duration: Appearance.animation.elementMove.duration
-                        easing.type: Appearance.animation.elementMove.type
-                        easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                    }
                 }
 
                 Behavior on radiusRight {
-                    NumberAnimation {
+                    animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                        duration: Appearance.animation.elementMove.duration
-                        easing.type: Appearance.animation.elementMove.type
-                        easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                    }
                 }
 
             }
@@ -206,15 +194,6 @@ Item {
                             (workspaceOccupied[index] ? Appearance.colors.colOnLayer1 : 
                                 Appearance.colors.colOnLayer1Inactive)
 
-                        Behavior on color {
-                            ColorAnimation {
-                                duration: Appearance.animation.elementMove.duration
-                                easing.type: Appearance.animation.elementMove.type
-                                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                            }
-
-                        }
-
                         Behavior on opacity {
                             NumberAnimation {
                                 duration: Appearance.animation.elementMoveFast.duration

.config/quickshell/modules/cheatsheet/Cheatsheet.qml

@@ -113,11 +113,7 @@ Scope { // Scope
                             Appearance.transparentize(Appearance.colors.colLayer0, 1)
                         
                         Behavior on color {
-                            ColorAnimation {
+                            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                                duration: Appearance.animation.elementMoveFast.duration
-                                easing.type: Appearance.animation.elementMoveFast.type
-                                easing.bezierCurve: Appearance.animation.elementMoveFast.bezierCurve
-                            }
                         }
 
                         MaterialSymbol {

.config/quickshell/modules/common/Appearance.qml

@@ -4,6 +4,7 @@ pragma Singleton
 pragma ComponentBehavior: Bound
 
 Singleton {
+    id: root
     property QtObject m3colors
     property QtObject animation
     property QtObject animationCurves
@@ -189,12 +190,33 @@ Singleton {
             property int type: Easing.BezierSpline
             property list<real> bezierCurve: animationCurves.emphasized
             property int velocity: 650
+            property Component numberAnimation: Component {
+                NumberAnimation {
+                    duration: root.animation.elementMove.duration
+                    easing.type: root.animation.elementMove.type
+                    easing.bezierCurve: root.animation.elementMove.bezierCurve
+                }
+            }
+            property Component colorAnimation: Component {
+                ColorAnimation {
+                    duration: root.animation.elementMove.duration
+                    easing.type: root.animation.elementMove.type
+                    easing.bezierCurve: root.animation.elementMove.bezierCurve
+                }
+            }
         }
         property QtObject elementMoveEnter: QtObject {
             property int duration: 400
             property int type: Easing.BezierSpline
             property list<real> bezierCurve: animationCurves.emphasizedDecel
             property int velocity: 650
+            property Component numberAnimation: Component {
+                NumberAnimation {
+                    duration: root.animation.elementMoveEnter.duration
+                    easing.type: root.animation.elementMoveEnter.type
+                    easing.bezierCurve: root.animation.elementMoveEnter.bezierCurve
+                }
+            }
         }
         property QtObject elementMoveExit: QtObject {
             property int duration: 200
@@ -207,6 +229,11 @@ Singleton {
             property int type: Easing.BezierSpline
             property list<real> bezierCurve: animationCurves.standardDecel
             property int velocity: 850
+            property Component colorAnimation: Component {ColorAnimation {
+                duration: root.animation.elementMoveFast.duration
+                easing.type: root.animation.elementMoveFast.type
+                easing.bezierCurve: root.animation.elementMoveFast.bezierCurve
+            }}
         }
         property QtObject scroll: QtObject {
             property int duration: 400

.config/quickshell/modules/common/widgets/DialogButton.qml

@@ -20,11 +20,7 @@ Button {
         color: (button.down && button.enabled) ? Appearance.colors.colLayer1Active : ((button.hovered && button.enabled) ? Appearance.colors.colLayer1Hover : Appearance.transparentize(Appearance.m3colors.m3surfaceContainerHigh, 1))
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
 
         }
 
@@ -41,11 +37,7 @@ Button {
         color: button.enabled ? Appearance.m3colors.m3primary : Appearance.m3colors.m3outline
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
         }
     }
 

.config/quickshell/modules/common/widgets/MenuButton.qml

@@ -21,12 +21,7 @@ Button {
             Appearance.transparentize(Appearance.m3colors.m3onSurface, 1))
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
-
         }
 
     }
@@ -42,11 +37,7 @@ Button {
         color: button.enabled ? Appearance.m3colors.m3onSurface : Appearance.m3colors.m3outline
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
         }
     }
 

.config/quickshell/modules/common/widgets/NavRailButton.qml

@@ -33,11 +33,7 @@ Button {
                 (button.down ? Appearance.colors.colLayer1Active : button.hovered ? Appearance.colors.colLayer1Hover : Appearance.transparentize(Appearance.colors.colLayer1Hover, 1))
 
             Behavior on color {
-                ColorAnimation {
+                animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                    duration: Appearance.animation.elementMove.duration
-                    easing.type: Appearance.animation.elementMove.type
-                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                }
             }
             MaterialSymbol {
                 id: navRailButtonIcon
@@ -48,11 +44,7 @@ Button {
                 color: toggled ? Appearance.m3colors.m3onSecondaryContainer : Appearance.colors.colOnLayer1
 
                 Behavior on color {
-                    ColorAnimation {
+                    animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                        duration: Appearance.animation.elementMove.duration
-                        easing.type: Appearance.animation.elementMove.type
-                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                    }
                 }
             }
         }

.config/quickshell/modules/common/widgets/NotificationWidget.qml

@@ -425,14 +425,8 @@ Item {
                                     color: (expandButton.down) ? Appearance.colors.colLayer2Active : (expandButton.hovered ? Appearance.colors.colLayer2Hover : Appearance.transparentize(Appearance.colors.colLayer2, 1))
 
                                     Behavior on color {
-                                        ColorAnimation {
+                                        animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                                            duration: Appearance.animation.elementMoveFast.duration
-                                            easing.type: Appearance.animation.elementMoveFast.type
-                                            easing.bezierCurve: Appearance.animation.elementMoveFast.bezierCurve
-                                        }
-
                                     }
-
                                 }
 
                                 contentItem: MaterialSymbol {

.config/quickshell/modules/common/widgets/PrimaryTabBar.qml

@@ -71,19 +71,11 @@ ColumnLayout {
             radius: Appearance.rounding.full
 
             Behavior on x {
-                NumberAnimation {
+                animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                    duration: Appearance.animation.elementMove.duration
-                    easing.type: Appearance.animation.elementMove.type
-                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                }
             }
 
             Behavior on implicitWidth {
-                NumberAnimation {
+                animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                    duration: Appearance.animation.elementMove.duration
-                    easing.type: Appearance.animation.elementMove.type
-                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                }
             }
         }
     }

.config/quickshell/modules/common/widgets/PrimaryTabButton.qml

@@ -98,11 +98,7 @@ TabButton {
         }
         
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                        easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
         }
 
         Rectangle {
@@ -133,11 +129,7 @@ TabButton {
                 fill: selected ? 1 : 0
                 color: selected ? Appearance.m3colors.m3primary : Appearance.colors.colOnLayer1
                 Behavior on color {
-                    ColorAnimation {
+                    animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                        duration: Appearance.animation.elementMove.duration
-                        easing.type: Appearance.animation.elementMove.type
-                        easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                    }
                 }
             }
             StyledText {
@@ -148,11 +140,7 @@ TabButton {
                 color: selected ? Appearance.m3colors.m3primary : Appearance.colors.colOnLayer1
                 text: buttonText
                 Behavior on color {
-                    ColorAnimation {
+                    animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                        duration: Appearance.animation.elementMove.duration
-                        easing.type: Appearance.animation.elementMove.type
-                        easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                    }
                 }
             }
         }

.config/quickshell/modules/common/widgets/Revealer.qml

@@ -16,18 +16,10 @@ Item {
 
     Behavior on implicitWidth {
         enabled: !vertical
-        NumberAnimation {
+        animation: Appearance.animation.elementMoveEnter.numberAnimation
-            duration: Appearance.animation.elementMoveEnter.duration
-            easing.type: Appearance.animation.elementMoveEnter.type
-            easing.bezierCurve: Appearance.animation.elementMoveEnter.bezierCurve
-        }
     }
     Behavior on implicitHeight {
         enabled: vertical
-        NumberAnimation {
+        animation: Appearance.animation.elementMoveEnter.numberAnimation
-            duration: Appearance.animation.elementMoveEnter.duration
-            easing.type: Appearance.animation.elementMoveEnter.type
-            easing.bezierCurve: Appearance.animation.elementMoveEnter.bezierCurve
-        }
     }
 }

.config/quickshell/modules/common/widgets/SecondaryTabButton.qml

@@ -100,11 +100,7 @@ TabButton {
         }
         
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                        easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
         }
 
         Rectangle {
@@ -143,11 +139,7 @@ TabButton {
                     fill: selected ? 1 : 0
                     color: selected ? Appearance.m3colors.m3primary : Appearance.colors.colOnLayer1
                     Behavior on color {
-                        ColorAnimation {
+                        animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                            duration: Appearance.animation.elementMove.duration
-                            easing.type: Appearance.animation.elementMove.type
-                            easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                        }
                     }
                 }
             }
@@ -158,11 +150,7 @@ TabButton {
                 color: selected ? Appearance.m3colors.m3primary : Appearance.colors.colOnLayer1
                 text: buttonText
                 Behavior on color {
-                    ColorAnimation {
+                    animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                        duration: Appearance.animation.elementMove.duration
-                        easing.type: Appearance.animation.elementMove.type
-                        easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                    }
                 }
             }
         }

.config/quickshell/modules/common/widgets/StyledSwitch.qml

@@ -22,18 +22,10 @@ Switch {
         border.color: root.checked ? Appearance.m3colors.m3primary : Appearance.m3colors.m3outline
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMove.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
         }
         Behavior on border.color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMove.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
         }
     }
 
@@ -48,32 +40,16 @@ Switch {
         anchors.leftMargin: root.checked ? (root.pressed ? (22 * root.scale) : 24 * root.scale) : (root.pressed ? (2 * root.scale) : 8 * root.scale)
 
         Behavior on anchors.leftMargin {
-            NumberAnimation {
+            animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
         }
         Behavior on width {
-            NumberAnimation {
+            animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
         }
         Behavior on height {
-            NumberAnimation {
+            animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
         }
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMove.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
         }
     }
 }

.config/quickshell/modules/session/Session.qml

@@ -175,9 +175,7 @@ Scope {
                     clip: true
 
                     Behavior on implicitWidth {
-                        SmoothedAnimation {
+                        animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                            velocity: Appearance.animation.elementMoveFast.velocity
-                        }
                     }
 
                     StyledText {

.config/quickshell/modules/session/SessionActionButton.qml

@@ -37,12 +37,7 @@ Button {
         color: (button.down || button.keyboardDown) ? Appearance.colors.colLayer2Active : ((button.hovered || button.focus) ? Appearance.colors.colLayer2Hover : Appearance.colors.colLayer2)
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMove.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
-
         }
 
     }

.config/quickshell/modules/sidebarLeft/AiChat.qml

@@ -215,9 +215,9 @@ int main(int argc, char* argv[]) {
 
                 Behavior on opacity {
                     NumberAnimation {
-                        duration: Appearance.animation.elementMove.duration
+                        duration: Appearance.animation.elementMoveEnter.duration
-                        easing.type: Appearance.animation.elementMove.type
+                        easing.type: Appearance.animation.elementMoveEnter.type
-                        easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
+                        easing.bezierCurve: Appearance.animation.elementMoveEnter.bezierCurve
                     }
                 }
 
@@ -356,11 +356,7 @@ int main(int argc, char* argv[]) {
             border.width: 1
 
             Behavior on implicitHeight {
-                NumberAnimation {
+                animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                    duration: Appearance.animation.elementMove.duration
-                    easing.type: Appearance.animation.elementMove.type
-                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                }
             }
 
             RowLayout { // Input field and send button
@@ -474,11 +470,7 @@ int main(int argc, char* argv[]) {
                             Appearance.m3colors.m3primary) : Appearance.colors.colLayer2Disabled
                             
                         Behavior on color {
-                            ColorAnimation {
+                            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                                duration: Appearance.animation.elementMove.duration
-                                easing.type: Appearance.animation.elementMove.type
-                                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                            }
                         }
                     }
 
@@ -566,11 +558,7 @@ int main(int argc, char* argv[]) {
                                 Appearance.colors.colLayer2
                                 
                             Behavior on color {
-                                ColorAnimation {
+                                animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                                    duration: Appearance.animation.elementMove.duration
-                                    easing.type: Appearance.animation.elementMove.type
-                                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                                }
                             }
                         }
                         onClicked: {

.config/quickshell/modules/sidebarLeft/Anime.qml

@@ -209,9 +209,9 @@ Item {
 
                 Behavior on opacity {
                     NumberAnimation {
-                        duration: Appearance.animation.elementMove.duration
+                        duration: Appearance.animation.elementMoveEnter.duration
-                        easing.type: Appearance.animation.elementMove.type
+                        easing.type: Appearance.animation.elementMoveEnter.type
-                        easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
+                        easing.bezierCurve: Appearance.animation.elementMoveEnter.bezierCurve
                     }
                 }
 
@@ -247,9 +247,9 @@ Item {
 
                 Behavior on opacity {
                     NumberAnimation {
-                        duration: Appearance.animation.elementMove.duration
+                        duration: Appearance.animation.elementMoveEnter.duration
-                        easing.type: Appearance.animation.elementMove.type
+                        easing.type: Appearance.animation.elementMoveEnter.type
-                        easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
+                        easing.bezierCurve: Appearance.animation.elementMoveEnter.bezierCurve
                     }
                 }
 
@@ -392,11 +392,7 @@ Item {
             border.width: 1
 
             Behavior on implicitHeight {
-                NumberAnimation {
+                animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                    duration: Appearance.animation.elementMove.duration
-                    easing.type: Appearance.animation.elementMove.type
-                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                }
             }
 
             RowLayout { // Input field and send button
@@ -530,11 +526,7 @@ Item {
                             Appearance.m3colors.m3primary) : Appearance.colors.colLayer2Disabled
                             
                         Behavior on color {
-                            ColorAnimation {
+                            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                                duration: Appearance.animation.elementMove.duration
-                                easing.type: Appearance.animation.elementMove.type
-                                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                            }
                         }
                     }
 
@@ -666,11 +658,7 @@ Item {
                                 Appearance.colors.colLayer2
                                 
                             Behavior on color {
-                                ColorAnimation {
+                                animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                                    duration: Appearance.animation.elementMove.duration
-                                    easing.type: Appearance.animation.elementMove.type
-                                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                                }
                             }
                         }
                         onClicked: {

.config/quickshell/modules/sidebarLeft/SidebarLeft.qml

@@ -98,11 +98,7 @@ Scope { // Scope
                 focus: sidebarRoot.visible
 
                 Behavior on width {
-                    NumberAnimation {
+                    animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                        duration: Appearance.animation.elementMove.duration
-                        easing.type: Appearance.animation.elementMove.type
-                        easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                    }
                 }
 
                 Keys.onPressed: (event) => {

.config/quickshell/modules/sidebarLeft/aiChat/AiMessageControlButton.qml

@@ -27,11 +27,7 @@ Button {
             Appearance.transparentize(Appearance.m3colors.m3surfaceContainerHighest, 1))
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMoveFast.duration
-                easing.type: Appearance.animation.elementMoveFast.type
-                easing.bezierCurve: Appearance.animation.elementMoveFast.bezierCurve
-            }
         }
     }
 
@@ -44,11 +40,7 @@ Button {
             Appearance.colors.colOnLayer1Inactive
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMoveFast.duration
-                easing.type: Appearance.animation.elementMoveFast.type
-                easing.bezierCurve: Appearance.animation.elementMoveFast.bezierCurve
-            }
         }
     }
 }

.config/quickshell/modules/sidebarLeft/anime/BooruResponse.qml

@@ -120,18 +120,10 @@ Rectangle {
             }
 
             Behavior on height {
-                NumberAnimation {
+                animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                    duration: Appearance.animation.elementMove.duration
-                    easing.type: Appearance.animation.elementMove.type
-                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                }
             }
             Behavior on implicitHeight {
-                NumberAnimation {
+                animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                    duration: Appearance.animation.elementMove.duration
-                    easing.type: Appearance.animation.elementMove.type
-                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                }
             }
 
             RowLayout {

.config/quickshell/modules/sidebarRight/calendar/CalendarDayButton.qml

@@ -27,12 +27,7 @@ Button {
             Appearance.transparentize(Appearance.colors.colLayer1, 1)
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
-
         }
     }
     
@@ -46,12 +41,7 @@ Button {
             Appearance.m3colors.m3outlineVariant
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
-
         }
     }
 }

.config/quickshell/modules/sidebarRight/calendar/CalendarHeaderButton.qml

@@ -26,12 +26,7 @@ Button {
         color: (button.down) ? Appearance.colors.colLayer2Active : (button.hovered ? Appearance.colors.colLayer2Hover : Appearance.colors.colLayer2)
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
-
         }
 
     }

.config/quickshell/modules/sidebarRight/notifications/NotificationList.qml

@@ -142,11 +142,7 @@ Item {
             opacity: notificationWidgetList.length > 0 ? 1 : 0
             visible: opacity > 0
             Behavior on opacity {
-                NumberAnimation {
+                animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                    duration: Appearance.animation.elementMove.duration
-                    easing.type: Appearance.animation.elementMove.type
-                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                }
             }
         }
 

.config/quickshell/modules/sidebarRight/notifications/NotificationStatusButton.qml

@@ -9,7 +9,7 @@ Button {
     property string buttonText: ""
     property string buttonIcon: ""
 
-    implicitHeight: 30
+    // implicitHeight: 30
     implicitWidth: contentRowLayout.implicitWidth + 10 * 2
     Behavior on implicitWidth {
         SmoothedAnimation {
@@ -25,19 +25,13 @@ Button {
         color: (button.down) ? Appearance.colors.colLayer2Active : (button.hovered ? Appearance.colors.colLayer2Hover : Appearance.colors.colLayer2)
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
-
         }
 
     }
     contentItem: RowLayout {
         id: contentRowLayout
-        // anchors.centerIn: parent
+        anchors.centerIn: parent
-        anchors.right: parent.right
         spacing: 0
         MaterialSymbol {
             text: buttonIcon

.config/quickshell/modules/sidebarRight/quickToggles/QuickToggleButton.qml

@@ -23,11 +23,7 @@ Button {
             (button.down ? Appearance.colors.colLayer1Active : button.hovered ? Appearance.colors.colLayer1Hover : Appearance.transparentize(Appearance.colors.colLayer1Hover, 1))
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
 
         }
         
@@ -39,11 +35,7 @@ Button {
             color: toggled ? Appearance.m3colors.m3onPrimary : Appearance.colors.colOnLayer1
 
             Behavior on color {
-                ColorAnimation {
+                animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                    duration: Appearance.animation.elementMove.duration
-                    easing.type: Appearance.animation.elementMove.type
-                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                }
             }
         }
 

.config/quickshell/modules/sidebarRight/todo/TaskList.qml

@@ -155,11 +155,7 @@ Item {
         anchors.fill: parent
 
         Behavior on opacity {
-            NumberAnimation {
+            animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
         }
 
         ColumnLayout {

.config/quickshell/modules/sidebarRight/todo/TodoItemActionButton.qml

@@ -26,12 +26,7 @@ Button {
         color: (button.down) ? Appearance.colors.colLayer2Active : (button.hovered ? Appearance.colors.colLayer2Hover : Appearance.transparentize(Appearance.colors.colLayer2, 1))
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
-
         }
 
     }

.config/quickshell/modules/sidebarRight/todo/TodoWidget.qml

@@ -99,20 +99,12 @@ Item {
 
                 Behavior on x {
                     enabled: tabIndicator.enableIndicatorAnimation
-                    NumberAnimation {
+                    animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                        duration: Appearance.animation.elementMove.duration
-                        easing.type: Appearance.animation.elementMove.type
-                        easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                    }
                 }
 
                 Behavior on implicitWidth {
                     enabled: tabIndicator.enableIndicatorAnimation
-                    NumberAnimation {
+                    animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
-                        duration: Appearance.animation.elementMove.duration
-                        easing.type: Appearance.animation.elementMove.type
-                        easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                    }
                 }
             }
         }
@@ -178,11 +170,7 @@ Item {
             color: (fabButton.down) ? Appearance.colors.colPrimaryContainerActive : (fabButton.hovered ? Appearance.colors.colPrimaryContainerHover : Appearance.m3colors.m3primaryContainer)
 
             Behavior on color {
-                ColorAnimation {
+                animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                    duration: Appearance.animation.elementMove.duration
-                    easing.type: Appearance.animation.elementMove.type
-                    easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-                }
             }
         }
 

.config/quickshell/modules/sidebarRight/volumeMixer/AudioDeviceSelectorButton.qml

@@ -18,12 +18,7 @@ Button {
         color: (button.down) ? Appearance.colors.colLayer2Active : (button.hovered ? Appearance.colors.colLayer2Hover : Appearance.colors.colLayer2)
 
         Behavior on color {
-            ColorAnimation {
+            animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
-                duration: Appearance.animation.elementMove.duration
-                easing.type: Appearance.animation.elementMove.type
-                easing.bezierCurve: Appearance.animation.elementMove.bezierCurve
-            }
-
         }
     }