🐛 spinning sync icon

joaomoreno · joaomoreno · commit 6097966099a6 · 2017-04-21T12:40:10.000+02:00
fixes microsoft#23975
diff --git a/extensions/git/src/statusbar.ts b/extensions/git/src/statusbar.ts
@@ -126,6 +126,7 @@ class SyncStatusBar {
 		}
 
 		if (this.state.isSyncRunning) {
+			icon = '$(sync~spin)';
 			text = '';
 			command = '';
 			tooltip = localize('syncing changes', "Synchronizing changes...");
diff --git a/src/vs/base/browser/ui/octiconLabel/octiconLabel.ts b/src/vs/base/browser/ui/octiconLabel/octiconLabel.ts
@@ -4,13 +4,13 @@
  *--------------------------------------------------------------------------------------------*/
 'use strict';
 
-
 import 'vs/css!./octicons/octicons';
+import 'vs/css!./octicons/octicons-animations';
 import { escape } from 'vs/base/common/strings';
 
 export function expand(text: string): string {
-	return text.replace(/\$\(([^)]+)\)/g, (match, g1) => {
-		return `<span class="octicon octicon-${g1}"></span>`;
+	return text.replace(/\$\(((.+?)(~(.*?))?)\)/g, (match, g1, name, g3, animation) => {
+		return `<span class="octicon octicon-${name} ${animation ? `octicon-animation-${animation}` : ''}"></span>`;
 	});
 }
 
diff --git a/src/vs/base/browser/ui/octiconLabel/octicons/octicons-animations.css b/src/vs/base/browser/ui/octiconLabel/octicons/octicons-animations.css
@@ -0,0 +1,14 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+@keyframes octicon-spin {
+	100% {
+		transform:rotate(360deg);
+	}
+}
+
+.octicon-animation-spin {
+	animation: octicon-spin 2s linear infinite;
+}

Original file line number	Diff line number	Diff line change
`@@ -126,6 +126,7 @@ class SyncStatusBar {`
`126`	`126`	`}`
`127`	`127`
`128`	`128`	`if (this.state.isSyncRunning) {`
	`129`	`+ icon = '$(sync~spin)';`
`129`	`130`	`text = '';`
`130`	`131`	`command = '';`
`131`	`132`	`tooltip = localize('syncing changes', "Synchronizing changes...");`