From c56bdd5f09f540bfeab00b040f9e85b744aae9bd Mon Sep 17 00:00:00 2001
From: Marco Beretta <81851188+berry-13@users.noreply.github.com>
Date: Sun, 26 Jul 2026 18:49:48 +0200
Subject: [PATCH] fix: fade the dictation timer in and out

---
 client/src/components/Chat/Input/Composer/Bar.tsx | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/client/src/components/Chat/Input/Composer/Bar.tsx b/client/src/components/Chat/Input/Composer/Bar.tsx
index e06324fdda..586dad99e0 100644
--- a/client/src/components/Chat/Input/Composer/Bar.tsx
+++ b/client/src/components/Chat/Input/Composer/Bar.tsx
@@ -378,14 +378,15 @@ function Bar({
               <Thinking />
               <TokenUsage index={index} conversation={conversation} isSubmitting={isSubmitting} />
             </div>
-            {/* Fades in place. The elapsed time is not one of the things that
-                stepped aside, so it has nowhere to travel from. */}
+            {/* Arrives and leaves in depth. The elapsed time is not one of the
+                things that stepped aside, so it has nowhere to travel from:
+                it comes forward into the row and recedes back out of it. */}
             <div
               aria-hidden={!dictating}
               className={cn(
-                'col-start-1 row-start-1 flex items-center justify-end px-1',
-                'transition-opacity duration-200 ease-out',
-                dictating ? 'opacity-100' : 'pointer-events-none opacity-0',
+                'col-start-1 row-start-1 flex origin-center items-center justify-end px-1',
+                'transition-[opacity,transform] duration-200 ease-out',
+                dictating ? 'scale-100 opacity-100' : 'pointer-events-none scale-90 opacity-0',
               )}
             >
               <span className="text-xs tabular-nums text-text-secondary">