voice - tweak animation (microsoft#196674)

Author: bpasero

src/vs/workbench/contrib/chat/electron-sandbox/actions/voiceChatActions.ts

@@ -679,7 +679,7 @@ registerThemingParticipant((theme, collector) => {
 	let activeRecordingDimmedColor: Color | undefined;
 	if (theme.type === ColorScheme.LIGHT || theme.type === ColorScheme.DARK) {
 		activeRecordingColor = theme.getColor(ACTIVITY_BAR_BADGE_BACKGROUND) ?? theme.getColor(focusBorder);
-		activeRecordingDimmedColor = activeRecordingColor?.transparent(0.4);
+		activeRecordingDimmedColor = activeRecordingColor?.transparent(0.2);
 	} else {
 		activeRecordingColor = theme.getColor(contrastBorder);
 		activeRecordingDimmedColor = theme.getColor(contrastBorder);
@@ -696,6 +696,28 @@ registerThemingParticipant((theme, collector) => {
 			border-radius: 50%;
 		}
 
+		.monaco-workbench:not(.reduce-motion) .interactive-input-part .monaco-action-bar .action-label.codicon-loading.codicon-modifier-spin:not(.disabled)::before,
+		.monaco-workbench:not(.reduce-motion) .inline-chat .monaco-action-bar .action-label.codicon-loading.codicon-modifier-spin:not(.disabled)::before {
+			position: absolute;
+			outline: 1px solid ${activeRecordingColor};
+			outline-offset: 2px;
+			border-radius: 50%;
+			width: 16px;
+			height: 16px;
+		}
+
+		.monaco-workbench:not(.reduce-motion) .interactive-input-part .monaco-action-bar .action-label.codicon-loading.codicon-modifier-spin:not(.disabled)::after,
+		.monaco-workbench:not(.reduce-motion) .inline-chat .monaco-action-bar .action-label.codicon-loading.codicon-modifier-spin:not(.disabled)::after {
+			content: '';
+			position: absolute;
+			outline: 1px solid ${activeRecordingDimmedColor};
+			outline-offset: 3px;
+			animation: pulseAnimation 1s infinite;
+			border-radius: 50%;
+			width: 16px;
+			height: 16px;
+		}
+
 		@keyframes pulseAnimation {
 			0% {
 				outline-width: 1px;