From 47a8149968a42b5ca5e0ca1a041a4d62df258aa6 Mon Sep 17 00:00:00 2001
From: end-4 <97237370+end-4@users.noreply.github.com>
Date: Wed, 7 May 2025 19:13:44 +0200
Subject: [PATCH] ai chat: animated button color

---
 .../aiChat/AiMessageControlButton.qml         | 25 ++++++++++++++++---
 1 file changed, 21 insertions(+), 4 deletions(-)

diff --git a/.config/quickshell/modules/sidebarLeft/aiChat/AiMessageControlButton.qml b/.config/quickshell/modules/sidebarLeft/aiChat/AiMessageControlButton.qml
index c36406a7..56de474d 100644
--- a/.config/quickshell/modules/sidebarLeft/aiChat/AiMessageControlButton.qml
+++ b/.config/quickshell/modules/sidebarLeft/aiChat/AiMessageControlButton.qml
@@ -18,20 +18,37 @@ Button {
 
     background: Rectangle {
         radius: Appearance.rounding.small
-        color: button.activated ? 
-            (button.down ? Appearance.colors.colPrimaryActive : 
+        color: !button.enabled ? Appearance.transparentize(Appearance.m3colors.m3surfaceContainerHighest, 1) : 
+            button.activated ? (button.down ? Appearance.colors.colPrimaryActive : 
             button.hovered ? Appearance.colors.colPrimaryHover :
             Appearance.m3colors.m3primary) :
             (button.down ? Appearance.colors.colSurfaceContainerHighestActive : 
             button.hovered ? Appearance.colors.colSurfaceContainerHighestHover :
             Appearance.transparentize(Appearance.m3colors.m3surfaceContainerHighest, 1))
+
+        Behavior on color {
+            ColorAnimation {
+                duration: Appearance.animation.elementMoveFast.duration
+                easing.type: Appearance.animation.elementMoveFast.type
+                easing.bezierCurve: Appearance.animation.elementMoveFast.bezierCurve
+            }
+        }
     }
 
     contentItem: MaterialSymbol {
         horizontalAlignment: Text.AlignHCenter
         font.pixelSize: Appearance.font.pixelSize.large
-        color: button.activated ? Appearance.m3colors.m3onPrimary :
-            Appearance.m3colors.m3onSurface
         text: buttonIcon
+        color: button.activated ? Appearance.m3colors.m3onPrimary :
+            button.enabled ? Appearance.m3colors.m3onSurface :
+            Appearance.colors.colOnLayer1Inactive
+
+        Behavior on color {
+            ColorAnimation {
+                duration: Appearance.animation.elementMoveFast.duration
+                easing.type: Appearance.animation.elementMoveFast.type
+                easing.bezierCurve: Appearance.animation.elementMoveFast.bezierCurve
+            }
+        }
     }
 }