diff --git a/src/vs/workbench/browser/parts/activitybar/activitybarPart.ts b/src/vs/workbench/browser/parts/activitybar/activitybarPart.ts
index d188ce0ec9a..75a26d04003 100644
--- a/src/vs/workbench/browser/parts/activitybar/activitybarPart.ts
+++ b/src/vs/workbench/browser/parts/activitybar/activitybarPart.ts
@@ -31,7 +31,7 @@ import { dispose, IDisposable } from 'vs/base/common/lifecycle';
import { ToggleActivityBarVisibilityAction } from 'vs/workbench/browser/actions/toggleActivityBarVisibility';
import SCMPreview from 'vs/workbench/parts/scm/browser/scmPreview';
import { IThemeService, registerThemingParticipant, ITheme, ICssStyleCollector } from 'vs/platform/theme/common/themeService';
-import { ACTIVITY_BAR_BACKGROUND } from 'vs/workbench/common/theme';
+import { ACTIVITY_BAR_BACKGROUND, ACTIVITY_BAR_BACKGROUND_LIGHT_DEFAULT } from 'vs/workbench/common/theme';
import { highContrastBorder, highContrastOutline, focus } from 'vs/platform/theme/common/colorRegistry';
interface IViewletActivity {
@@ -219,7 +219,8 @@ export class ActivitybarPart extends Part implements IActivityBarService {
// Part container
const container = this.getContainer();
- container.style('background-color', this.getColor(ACTIVITY_BAR_BACKGROUND));
+ const background = this.getColor(ACTIVITY_BAR_BACKGROUND);
+ container.style('background-color', background);
const useBorder = this.isHighContrastTheme;
const isPositionLeft = this.partService.getSideBarPosition() === SideBarPosition.LEFT;
@@ -230,6 +231,15 @@ export class ActivitybarPart extends Part implements IActivityBarService {
container.style('border-left-width', useBorder && !isPositionLeft ? '1px' : null);
container.style('border-left-style', useBorder && !isPositionLeft ? 'solid' : null);
container.style('border-left-color', useBorder && !isPositionLeft ? this.getColor(highContrastBorder) : null);
+
+ // Toggle 'light' class if we are in light theme and the background color does not match our default
+ // so that viewlet icons can provide a light version of the view icon. We do this because our default
+ // light activity bar background is actually dark. If we have the default color, we do not want light icons.
+ if (this.isLightTheme && background && background.toLowerCase() !== ACTIVITY_BAR_BACKGROUND_LIGHT_DEFAULT.toLowerCase()) {
+ container.addClass('light');
+ } else {
+ container.removeClass('light');
+ }
}
private showContextMenu(e: MouseEvent): void {
diff --git a/src/vs/workbench/common/theme.ts b/src/vs/workbench/common/theme.ts
index 5eb370b286d..9b45d568e1b 100644
--- a/src/vs/workbench/common/theme.ts
+++ b/src/vs/workbench/common/theme.ts
@@ -176,9 +176,10 @@ export const STATUS_BAR_INFO_ITEM_HOVER_BACKGROUND = registerColor('statusBarInf
// < --- Activity Bar --- >
+export const ACTIVITY_BAR_BACKGROUND_LIGHT_DEFAULT = '#2C2C2C';
export const ACTIVITY_BAR_BACKGROUND = registerColor('activityBarBackground', {
dark: '#333333',
- light: '#2C2C2C',
+ light: ACTIVITY_BAR_BACKGROUND_LIGHT_DEFAULT,
hc: '#000000'
}, nls.localize('activityBarBackground', "Activity bar background color. The activity bar is showing on the far left or right and allows to switch between views of the side bar."));
@@ -267,6 +268,10 @@ export class Themable extends Disposable {
return this.theme.type === 'hc';
}
+ protected get isLightTheme(): boolean {
+ return this.theme.type === 'light';
+ }
+
protected get toUnbind() {
return this._toUnbind;
}
diff --git a/src/vs/workbench/parts/debug/browser/media/debug-dark.svg b/src/vs/workbench/parts/debug/browser/media/debug-dark.svg
new file mode 100644
index 00000000000..9a969fb3589
--- /dev/null
+++ b/src/vs/workbench/parts/debug/browser/media/debug-dark.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/vs/workbench/parts/debug/browser/media/debug-light.svg b/src/vs/workbench/parts/debug/browser/media/debug-light.svg
new file mode 100644
index 00000000000..f19d46a2517
--- /dev/null
+++ b/src/vs/workbench/parts/debug/browser/media/debug-light.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/vs/workbench/parts/debug/browser/media/debug.contribution.css b/src/vs/workbench/parts/debug/browser/media/debug.contribution.css
index f9cbd4fb7e0..91f3774f0a1 100644
--- a/src/vs/workbench/parts/debug/browser/media/debug.contribution.css
+++ b/src/vs/workbench/parts/debug/browser/media/debug.contribution.css
@@ -5,7 +5,11 @@
/* Activity Bar */
.monaco-workbench > .activitybar .monaco-action-bar .action-label.debug {
- background-image: url('debug.svg');
+ background-image: url('debug-dark.svg');
+}
+
+.monaco-workbench > .activitybar.light .monaco-action-bar .action-label.debug {
+ background-image: url('debug-light.svg');
}
.monaco-editor .debug-top-stack-frame-line,
diff --git a/src/vs/workbench/parts/debug/browser/media/debug.svg b/src/vs/workbench/parts/debug/browser/media/debug.svg
deleted file mode 100644
index 8819b24a640..00000000000
--- a/src/vs/workbench/parts/debug/browser/media/debug.svg
+++ /dev/null
@@ -1 +0,0 @@
-
\ No newline at end of file
diff --git a/src/vs/workbench/parts/extensions/electron-browser/media/extensions-status.svg b/src/vs/workbench/parts/extensions/electron-browser/media/extensions-dark.svg
similarity index 61%
rename from src/vs/workbench/parts/extensions/electron-browser/media/extensions-status.svg
rename to src/vs/workbench/parts/extensions/electron-browser/media/extensions-dark.svg
index c4b591d0d3e..d413b56be32 100644
--- a/src/vs/workbench/parts/extensions/electron-browser/media/extensions-status.svg
+++ b/src/vs/workbench/parts/extensions/electron-browser/media/extensions-dark.svg
@@ -1,12 +1,6 @@
-
diff --git a/src/vs/workbench/parts/extensions/electron-browser/media/extensions-light.svg b/src/vs/workbench/parts/extensions/electron-browser/media/extensions-light.svg
new file mode 100644
index 00000000000..77b1b585169
--- /dev/null
+++ b/src/vs/workbench/parts/extensions/electron-browser/media/extensions-light.svg
@@ -0,0 +1,6 @@
+
+
diff --git a/src/vs/workbench/parts/extensions/electron-browser/media/extensions.css b/src/vs/workbench/parts/extensions/electron-browser/media/extensions.css
index 8acfffe0567..dc552d34fa5 100644
--- a/src/vs/workbench/parts/extensions/electron-browser/media/extensions.css
+++ b/src/vs/workbench/parts/extensions/electron-browser/media/extensions.css
@@ -4,5 +4,9 @@
*--------------------------------------------------------------------------------------------*/
.monaco-workbench > .activitybar > .content .monaco-action-bar .action-label.extensions {
- background: url('extensions-status.svg') center center/22px no-repeat;
+ background: url('extensions-dark.svg') center center/22px no-repeat;
+}
+
+.monaco-workbench > .activitybar.light > .content .monaco-action-bar .action-label.extensions {
+ background: url('extensions-light.svg') center center/22px no-repeat;
}
\ No newline at end of file
diff --git a/src/vs/workbench/parts/files/browser/media/explorerviewlet.css b/src/vs/workbench/parts/files/browser/media/explorerviewlet.css
index 4c5a7e6f4c5..2a6a66b6d18 100644
--- a/src/vs/workbench/parts/files/browser/media/explorerviewlet.css
+++ b/src/vs/workbench/parts/files/browser/media/explorerviewlet.css
@@ -8,6 +8,10 @@
background-image: url('files-dark.svg');
}
+.monaco-workbench > .activitybar.light .monaco-action-bar .action-label.explore {
+ background-image: url('files-light.svg');
+}
+
/* --- Explorer viewlet --- */
.explorer-viewlet {
height: 100%;
diff --git a/src/vs/workbench/parts/files/browser/media/files-light.svg b/src/vs/workbench/parts/files/browser/media/files-light.svg
new file mode 100644
index 00000000000..19e6658a50f
--- /dev/null
+++ b/src/vs/workbench/parts/files/browser/media/files-light.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/vs/workbench/parts/git/browser/media/git-light.svg b/src/vs/workbench/parts/git/browser/media/git-light.svg
new file mode 100644
index 00000000000..96b712cb98f
--- /dev/null
+++ b/src/vs/workbench/parts/git/browser/media/git-light.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/vs/workbench/parts/git/browser/media/git.contribution.css b/src/vs/workbench/parts/git/browser/media/git.contribution.css
index 48a983ffd30..fe29fa5ef26 100644
--- a/src/vs/workbench/parts/git/browser/media/git.contribution.css
+++ b/src/vs/workbench/parts/git/browser/media/git.contribution.css
@@ -24,7 +24,15 @@
}
/* Activity Bar */
-.monaco-workbench > .activitybar .monaco-action-bar .action-label.git,
+.monaco-workbench > .activitybar .monaco-action-bar .action-label.git {
+ background-image: url('git-dark.svg');
+}
+
+.monaco-workbench > .activitybar.light .monaco-action-bar .action-label.git {
+ background-image: url('git-light.svg');
+}
+
+/* Status / Quick Open */
.monaco-shell .git-statusbar-group > .git-statusbar-branch-item,
.vs-dark .monaco-workbench .quick-open-widget .quick-open-tree .quick-open-entry .quick-open-entry-icon.git {
background-image: url('git-dark.svg');
diff --git a/src/vs/workbench/parts/scm/electron-browser/media/icon.svg b/src/vs/workbench/parts/scm/electron-browser/media/icon-dark.svg
similarity index 100%
rename from src/vs/workbench/parts/scm/electron-browser/media/icon.svg
rename to src/vs/workbench/parts/scm/electron-browser/media/icon-dark.svg
diff --git a/src/vs/workbench/parts/scm/electron-browser/media/icon-light.svg b/src/vs/workbench/parts/scm/electron-browser/media/icon-light.svg
new file mode 100644
index 00000000000..97e9f8a8936
--- /dev/null
+++ b/src/vs/workbench/parts/scm/electron-browser/media/icon-light.svg
@@ -0,0 +1,12 @@
+
+
\ No newline at end of file
diff --git a/src/vs/workbench/parts/scm/electron-browser/media/scmViewlet.css b/src/vs/workbench/parts/scm/electron-browser/media/scmViewlet.css
index 5bd6e4b1ecd..0a3edfc1ccf 100644
--- a/src/vs/workbench/parts/scm/electron-browser/media/scmViewlet.css
+++ b/src/vs/workbench/parts/scm/electron-browser/media/scmViewlet.css
@@ -4,11 +4,15 @@
*--------------------------------------------------------------------------------------------*/
.monaco-workbench > .activitybar > .content .monaco-action-bar .action-label.scm {
- background-image: url('icon.svg');
+ background-image: url('icon-dark.svg');
background-size: 19px;
background-position: center;
}
+.monaco-workbench > .activitybar.light > .content .monaco-action-bar .action-label.scm {
+ background-image: url('icon-light.svg');
+}
+
.scm-viewlet .monaco-list-row {
padding: 0 12px 0 20px;
line-height: 22px;
diff --git a/src/vs/workbench/parts/search/browser/media/search-light.svg b/src/vs/workbench/parts/search/browser/media/search-light.svg
new file mode 100644
index 00000000000..f1ed8284108
--- /dev/null
+++ b/src/vs/workbench/parts/search/browser/media/search-light.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/vs/workbench/parts/search/browser/media/search.contribution.css b/src/vs/workbench/parts/search/browser/media/search.contribution.css
index e0b787ff3ba..caa107c3a8b 100644
--- a/src/vs/workbench/parts/search/browser/media/search.contribution.css
+++ b/src/vs/workbench/parts/search/browser/media/search.contribution.css
@@ -6,4 +6,8 @@
/* Activity Bar */
.monaco-workbench > .activitybar .monaco-action-bar .action-label.search {
background-image: url('search-dark.svg');
+}
+
+.monaco-workbench > .activitybar.light .monaco-action-bar .action-label.search {
+ background-image: url('search-light.svg');
}
\ No newline at end of file