themes - editor title foreground

src/vs/workbench/browser/parts/editor/media/tabstitle.css

@@ -86,23 +86,6 @@
 	height: 16px; /* tweak the icon size of the editor labels when icons are enabled */
 }
 
-.vs .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab .tab-label {
-	opacity: 0.7 !important;
-}
-
-.vs-dark .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab .tab-label {
-	opacity: 0.5 !important;
-}
-
-.vs-dark .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab.active .tab-label,
-.monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab.dropfeedback .tab-label {
-	opacity: 1 !important;
-}
-
-.hc-black .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab .tab-label {
-	opacity: 1 !important;
-}
-
 /* Tab Close */
 
 .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab > .tab-close {

src/vs/workbench/browser/parts/editor/media/titlecontrol.css

@@ -104,26 +104,4 @@
 .vs-dark .monaco-workbench .show-group-editors-action,
 .hc-black .monaco-workbench .show-group-editors-action {
 	background: url('stackview-inverse.svg') center center no-repeat;
-}
-
-/* TODO@theme */
-
-.vs .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .title-label a,
-.vs .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab .tab-label a {
-	color: rgba(51, 51, 51, 0.5);
-}
-
-.vs .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title.active .title-label a,
-.vs .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title.active .tabs-container > .tab .tab-label a {
-	color: #333333;
-}
-
-.vs-dark .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .title-label a,
-.vs-dark .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab .tab-label a {
-	color: rgba(255, 255, 255, 0.5);
-}
-
-.vs-dark .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title.active .title-label a,
-.vs-dark .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title.active .tabs-container > .tab .tab-label a {
-	color: white;
 }
\ No newline at end of file

src/vs/workbench/browser/parts/editor/noTabsTitleControl.ts

@@ -12,6 +12,7 @@ import DOM = require('vs/base/browser/dom');
 import { TitleControl } from 'vs/workbench/browser/parts/editor/titleControl';
 import { EditorLabel } from 'vs/workbench/browser/labels';
 import { Verbosity } from 'vs/platform/editor/common/editor';
+import { ACTIVE_TAB_INACTIVE_GROUP_FOREGROUND, ACTIVE_TAB_ACTIVE_GROUP_FOREGROUND } from 'vs/workbench/common/theme';
 
 export class NoTabsTitleControl extends TitleControl {
 	private titleContainer: HTMLElement;
@@ -125,6 +126,11 @@ export class NoTabsTitleControl extends TitleControl {
 		}
 
 		this.editorLabel.setLabel({ name, description, resource }, { title, italic: !isPinned, extraClasses: ['title-label'] });
+		if (isActive) {
+			this.editorLabel.element.style.color = this.getColor(ACTIVE_TAB_ACTIVE_GROUP_FOREGROUND);
+		} else {
+			this.editorLabel.element.style.color = this.getColor(ACTIVE_TAB_INACTIVE_GROUP_FOREGROUND);
+		}
 
 		// Update Editor Actions Toolbar
 		this.updateEditorActionsToolbar();

src/vs/workbench/browser/parts/editor/tabsTitleControl.ts

@@ -41,7 +41,7 @@ import { LinkedMap } from 'vs/base/common/map';
 import { DelegatingWorkbenchEditorService } from 'vs/workbench/services/editor/browser/editorService';
 import { ServiceCollection } from 'vs/platform/instantiation/common/serviceCollection';
 import { IThemeService } from 'vs/platform/theme/common/themeService';
-import { INACTIVE_TAB_BACKGROUND, ACTIVE_TAB_BACKGROUND } from 'vs/workbench/common/theme';
+import { INACTIVE_TAB_BACKGROUND, ACTIVE_TAB_BACKGROUND, ACTIVE_TAB_ACTIVE_GROUP_FOREGROUND, ACTIVE_TAB_INACTIVE_GROUP_FOREGROUND, INACTIVE_TAB_ACTIVE_GROUP_FOREGROUND, INACTIVE_TAB_INACTIVE_GROUP_FOREGROUND } from 'vs/workbench/common/theme';
 
 interface IEditorInputLabel {
 	editor: IEditorInput;
@@ -223,8 +223,8 @@ export class TabsTitleControl extends TitleControl {
 		const group = this.context;
 
 		// Tabs container activity state
-		const isActive = this.stacks.isActive(group);
-		if (isActive) {
+		const isGroupActive = this.stacks.isActive(group);
+		if (isGroupActive) {
 			DOM.addClass(this.titleContainer, 'active');
 		} else {
 			DOM.removeClass(this.titleContainer, 'active');
@@ -239,7 +239,7 @@ export class TabsTitleControl extends TitleControl {
 			const tabContainer = this.tabsContainer.children[index];
 			if (tabContainer instanceof HTMLElement) {
 				const isPinned = group.isPinned(index);
-				const isActive = group.isActive(editor);
+				const isTabActive = group.isActive(editor);
 				const isDirty = editor.isDirty();
 
 				const label = labels[index];
@@ -261,15 +261,18 @@ export class TabsTitleControl extends TitleControl {
 				tabLabel.setLabel({ name, description, resource: toResource(editor, { supportSideBySide: true }) }, { extraClasses: ['tab-label'], italic: !isPinned });
 
 				// Active state
-				if (isActive) {
+				if (isTabActive) {
 					DOM.addClass(tabContainer, 'active');
 					tabContainer.setAttribute('aria-selected', 'true');
 					tabContainer.style.backgroundColor = this.getColor(ACTIVE_TAB_BACKGROUND);
+					tabLabel.element.style.color = this.getColor(isGroupActive ? ACTIVE_TAB_ACTIVE_GROUP_FOREGROUND : ACTIVE_TAB_INACTIVE_GROUP_FOREGROUND);
+
 					this.activeTab = tabContainer;
 				} else {
 					DOM.removeClass(tabContainer, 'active');
 					tabContainer.setAttribute('aria-selected', 'false');
 					tabContainer.style.backgroundColor = this.getColor(INACTIVE_TAB_BACKGROUND);
+					tabLabel.element.style.color = this.getColor(isGroupActive ? INACTIVE_TAB_ACTIVE_GROUP_FOREGROUND : INACTIVE_TAB_INACTIVE_GROUP_FOREGROUND);
 				}
 
 				// Dirty State

src/vs/workbench/browser/parts/media/compositepart.css

@@ -14,22 +14,4 @@
 .monaco-workbench > .part > .composite.title > .title-actions {
 	flex: 1;
 	padding-left: 5px;
-}
-
-.monaco-workbench > .part > .composite.title > .title-label span {
-	text-transform: uppercase;
-}
-
-/* TODO@theme */
-
-.monaco-workbench > .part > .composite.title > .title-label span {
-	color: #6f6f6f;
-}
-
-.vs-dark .monaco-workbench > .part > .composite.title > .title-label span  {
-	color: #bbbbbb;
-}
-
-.hc-black .monaco-workbench > .part > .composite.title > .title-label span  {
-	color: #fff;
-}
+}
\ No newline at end of file

src/vs/workbench/browser/parts/sidebar/media/sidebarpart.css

@@ -20,6 +20,10 @@
 	border-left: 1px solid;
 }
 
+.monaco-workbench > .part > .sidebar.title > .title-label span {
+	text-transform: uppercase;
+}
+
 .monaco-workbench .viewlet .collapsible.header .title {
 	overflow: hidden;
 	text-overflow: ellipsis;
@@ -62,6 +66,18 @@
 
 /* TODO@theme */
 
+.vs .monaco-workbench > .part > .sidebar.title > .title-label span {
+	color: #6f6f6f;
+}
+
+.vs-dark .monaco-workbench > .part > .sidebar.title > .title-label span  {
+	color: #bbbbbb;
+}
+
+.hc-black .monaco-workbench > .part > .sidebar.title > .title-label span  {
+	color: #fff;
+}
+
 .vs .monaco-workbench > .sidebar > .title > .title-actions {
 	background-color: #f3f3f3;
 }

src/vs/workbench/common/theme.ts

@@ -15,13 +15,38 @@ export const ACTIVE_TAB_BACKGROUND = registerColor('activeTabBackground', {
 	dark: editorBackground,
 	light: editorBackground,
 	hc: editorBackground
-}, nls.localize('activeTabBackground', "Active Tab background color. Tabs are the containers for editors in the editor area. Multiple tabs can be opened in one editor group."));
+}, nls.localize('activeTabBackground', "Active tab background color. Tabs are the containers for editors in the editor area. Multiple tabs can be opened in one editor group. There can be multiple editor groups."));
 
 export const INACTIVE_TAB_BACKGROUND = registerColor('inactiveTabBackground', {
 	dark: '#2D2D2D',
 	light: '#ECECEC',
 	hc: Color.transparent
-}, nls.localize('inactiveTabBackground', "Inactive Tab background color. Tabs are the containers for editors in the editor area. Multiple tabs can be opened in one editor group."));
+}, nls.localize('inactiveTabBackground', "Inactive tab background color. Tabs are the containers for editors in the editor area. Multiple tabs can be opened in one editor group. There can be multiple editor groups."));
+
+export const ACTIVE_TAB_ACTIVE_GROUP_FOREGROUND = registerColor('activeTabActiveGroupForeground', {
+	dark: Color.white,
+	light: Color.fromRGBA(new RGBA(51, 51, 51)),
+	hc: Color.white
+}, nls.localize('activeTabActiveGroupForeground', "Active tab foreground color in an active group. Tabs are the containers for editors in the editor area. Multiple tabs can be opened in one editor group. There can be multiple editor groups."));
+
+export const ACTIVE_TAB_INACTIVE_GROUP_FOREGROUND = registerColor('activeTabInactiveGroupForeground', {
+	dark: Color.white.transparent(0.5),
+	light: Color.fromRGBA(new RGBA(51, 51, 51)).transparent(0.7),
+	hc: Color.white
+}, nls.localize('activeTabInactiveGroupForeground', "Active tab foreground color in an inactive group. Tabs are the containers for editors in the editor area. Multiple tabs can be opened in one editor group. There can be multiple editor groups."));
+
+export const INACTIVE_TAB_ACTIVE_GROUP_FOREGROUND = registerColor('inactiveTabActiveGroupForeground', {
+	dark: Color.white.transparent(0.5),
+	light: Color.fromRGBA(new RGBA(51, 51, 51)).transparent(0.5),
+	hc: Color.white
+}, nls.localize('inactiveTabActiveGroupForeground', "Inactive tab foreground color in an active group. Tabs are the containers for editors in the editor area. Multiple tabs can be opened in one editor group. There can be multiple editor groups."));
+
+export const INACTIVE_TAB_INACTIVE_GROUP_FOREGROUND = registerColor('inactiveTabInactiveGroupForeground', {
+	dark: Color.fromRGBA(new RGBA(255, 255, 255)).transparent(0.5).transparent(0.5),
+	light: Color.fromRGBA(new RGBA(51, 51, 51)).transparent(0.5).transparent(0.7),
+	hc: Color.white
+}, nls.localize('inactiveTabInactiveGroupForeground', "Inactive tab foreground color in an inactive group. Tabs are the containers for editors in the editor area. Multiple tabs can be opened in one editor group. There can be multiple editor groups."));
+
 
 
 // < --- Panels --- >
@@ -39,6 +64,7 @@ export const PANEL_BORDER_TOP_COLOR = registerColor('panelBorderTopColor', {
 }, nls.localize('panelBorderTopColor', "Panel border color on the top separating to the editor. Panels are shown below the editor area and contain views like output and integrated terminal."));
 
 
+
 // < --- Status --- >
 
 export const STATUS_BAR_FOREGROUND = registerColor('statusBarForeground', {