adjust theme on components

components/LucideIcon.qml

@@ -5,7 +5,7 @@ Text {
     color: Theme.palette.basecontent
     Behavior on color {
         ColorAnimation {
-            duration: Styling.animations.speed.fast
+            duration: 100
         }
     }
     font.family: Theme.lucide.font.family

components/MprisController.qml

@@ -3,6 +3,7 @@ pragma ComponentBehavior: Bound
 import qs.components
 import qs.config
 import qs.constants
+import qs.widgets
 import QtQuick
 import QtQuick.Layouts
 import Quickshell.Services.Mpris

components/MprisPlayerSelector.qml

@@ -1,6 +1,7 @@
 import qs.components
 import qs.constants
 import qs.services
+import qs.widgets
 import QtQuick
 import QtQuick.Layouts
 
@@ -28,10 +29,10 @@ RowLayout {
             const player = Mpris.active;
             const displayName = player.identity ?? player.desktopEntry ?? player.dbusName ?? "unknown";
             if (displayName.toLowerCase().includes('tidal')) {
-                return "Tidal";
+              return "Tidal";
             }
             if (displayName.toLowerCase().includes('zen')) {
-                return "Zen";
+              return "Zen";
             }
             return displayName;
         }

components/StyledButton.qml

@@ -12,16 +12,12 @@ Button {
     horizontalPadding: 8
 
     palette.button: hovered ? Theme.palette.primary : Theme.palette.base200
-    Behavior on palette.button {
-        ColorAnimation {
-            duration: Styling.animations.speed.normal
-        }
+    ColorAnimation on palette.button {
+        duration: 100
     }
     palette.buttonText: hoverEnabled && hovered ? Theme.palette.primarycontent : Theme.palette.basecontent
-    Behavior on palette.buttonText {
-        ColorAnimation {
-            duration: Styling.animations.speed.normal
-        }
+    ColorAnimation on palette.buttonText {
+        duration: 100
     }
 
     wheelEnabled: true

components/StyledIconButton.qml

@@ -28,34 +28,26 @@ RoundButton {
         font: control.font
         text: control.text
         color: control.color
-        Behavior on color {
-            ColorAnimation {
-                duration: Styling.animations.speed.normal
-            }
+        ColorAnimation on color {
+            duration: 100
         }
         rotation: control.rotation
-        Behavior on rotation {
-            RotationAnimation {
-                duration: Styling.animations.speed.slow
-                easing.type: Easing.InOutCubic
-            }
+        RotationAnimation on rotation {
+            duration: 200
+            easing.type: Easing.InOutCubic
         }
     }
 
     background: Rectangle {
         id: rect
         border.color: control.hovered ? Theme.palette.base300 : Theme.palette.base200
-        Behavior on border.color {
-            ColorAnimation {
-                duration: Styling.animations.speed.normal
-            }
+        ColorAnimation on border.color {
+            duration: 100
         }
         border.width: 0
         color: control.hovered ? Theme.palette.primary : Theme.palette.base200
-        Behavior on color {
-            ColorAnimation {
-                duration: Styling.animations.speed.normal
-            }
+        ColorAnimation on color {
+            duration: 100
         }
         radius: control.radius
     }

components/StyledLabel.qml

@@ -7,9 +7,8 @@ WrapperRectangle {
     margin: 8
     radius: 8
     color: Theme.palette.base200
-    Behavior on color {
-        ColorAnimation {
-            duration: Styling.animations.speed.normal
-        }
+    ColorAnimation on color {
+        duration: 200
+        easing.type: Easing.InOutQuad
     }
 }

components/StyledListView.qml

@@ -1,4 +1,3 @@
-import qs.config
 import QtQuick
 import QtQuick.Controls
 
@@ -15,7 +14,7 @@ ListView {
     rebound: Transition {
         NumberAnimation {
             properties: "x,y"
-            duration: Styling.animations.speed.slow
+            duration: 400
             easing.type: Easing.BezierSpline
             easing.bezierCurve: [0.2, 0, 0, 1, 1, 1]
         }

components/StyledProgressBar.qml

@@ -40,15 +40,15 @@ ProgressBar {
 
             Row {
                 Rectangle {
-                    id: rect
-                    color: Theme.palette.primary
-                    width: 40
-                    height: control.height
-                }
+                  id: rect
+                        color: Theme.palette.primary
+                        width: 40
+                        height: control.height
+                    }
                 XAnimator on x {
                     from: control.width + rect.width
                     to: -rect.width
-                    duration: Styling.animations.speed.verySlow
+                    duration: 1000
                     loops: Animation.Infinite
                     running: control.indeterminate
                 }

components/StyledSlider.qml

@@ -19,13 +19,13 @@ Slider {
         width: control.availableWidth
         height: implicitHeight
         radius: 8
-        color: Theme.palette.base200
+        color: Theme.palette.base100
 
         Rectangle {
             width: control.visualPosition * parent.width
             Behavior on width {
                 NumberAnimation {
-                    duration: Styling.animations.speed.fast
+                    duration: 75
                 }
             }
             height: parent.height

components/StyledSwitch.qml

@@ -40,13 +40,14 @@ Switch {
             y: parent.height / 2 - height / 2
             Behavior on x {
                 NumberAnimation {
-                    duration: Styling.animations.speed.fast
+                    duration: 100
                 }
             }
             width: parent.width / 2 - indicator.padding
             height: parent.height - indicator.padding
             radius: 16
             color: control.checked ? Theme.palette.primary : Theme.palette.basecontent
+            // border.color: control.checked ? (control.down ? "#17a81a" : "#21be2b") : "#999999"
         }
     }
 

components/StyledText.qml

@@ -4,9 +4,7 @@ import QtQuick
 Text {
     font.family: Theme.fontFamily
     color: Theme.palette.basecontent
-    Behavior on color {
-        ColorAnimation {
-            duration: Styling.animations.speed.fast
-        }
+    ColorAnimation on color {
+        duration: 100
     }
 }

components/StyledToolTip.qml

@@ -14,8 +14,6 @@ ToolTip {
 
     background: Rectangle {
         radius: 8
-        color: Theme.palette.base100
-        border.color: Theme.palette.base200
-        border.width: 2
+        color: Theme.palette.base200
     }
 }

components/StyledWrapperRectangle.qml

@@ -5,9 +5,8 @@ import Quickshell.Widgets
 WrapperRectangle {
     radius: 8
     color: Theme.palette.base100
-    Behavior on color {
-        ColorAnimation {
-            duration: Styling.animations.speed.fast
-        }
+    ColorAnimation on color {
+        duration: 200
+        easing.type: Easing.InOutQuad
     }
 }

config/Styling.qml

@@ -1,21 +0,0 @@
-pragma Singleton
-
-import QtQuick
-import Quickshell
-
-Singleton {
-    id: root
-
-    readonly property Animations animations: Animations {}
-
-    component Animations: QtObject {
-        property AnimationSpeed speed: AnimationSpeed {}
-    }
-    component AnimationSpeed: QtObject {
-        property int veryFast: 50
-        property int fast: 100
-        property int normal: 200
-        property int slow: 400
-        property int verySlow: 1000
-    }
-}