mirror of
https://github.com/Microsoft/vscode
synced 2024-10-05 19:02:54 +00:00
themes - get rid of tab.activeWithInactiveEditorGroupForeground and inactiveWithInactiveEditorGroupForeground
This commit is contained in:
parent
6ee1fb1f78
commit
830b94b2c1
|
@ -359,9 +359,7 @@
|
||||||
// "tab.activeBackground": "",
|
// "tab.activeBackground": "",
|
||||||
"tab.inactiveBackground": "#10192c",
|
"tab.inactiveBackground": "#10192c",
|
||||||
// "tab.activeForeground": "",
|
// "tab.activeForeground": "",
|
||||||
// "tab.activeWithInactiveEditorGroupForeground": "",
|
|
||||||
// "tab.inactiveForeground": "",
|
// "tab.inactiveForeground": "",
|
||||||
// "tab.inactiveWithInactiveEditorGroupForeground": "",
|
|
||||||
|
|
||||||
// Workbench: Activity Bar
|
// Workbench: Activity Bar
|
||||||
"activityBar.background": "#051336",
|
"activityBar.background": "#051336",
|
||||||
|
|
|
@ -398,8 +398,6 @@
|
||||||
"tab.inactiveBackground": "#004052",
|
"tab.inactiveBackground": "#004052",
|
||||||
"editorGroupHeader.tabsBackground": "#004052",
|
"editorGroupHeader.tabsBackground": "#004052",
|
||||||
"tab.border": "#003847",
|
"tab.border": "#003847",
|
||||||
"tab.activeWithInactiveEditorGroupForeground": "#93A1A1",
|
|
||||||
"tab.inactiveWithInactiveEditorGroupForeground": "#93A1A1",
|
|
||||||
|
|
||||||
// Workbench: Activity Bar
|
// Workbench: Activity Bar
|
||||||
"activityBar.background": "#003847",
|
"activityBar.background": "#003847",
|
||||||
|
|
|
@ -321,8 +321,6 @@
|
||||||
"tab.inactiveBackground": "#CCC4B0",
|
"tab.inactiveBackground": "#CCC4B0",
|
||||||
"editorGroupHeader.tabsBackground": "#CCC4B0",
|
"editorGroupHeader.tabsBackground": "#CCC4B0",
|
||||||
"tab.border": "#DDD6C1",
|
"tab.border": "#DDD6C1",
|
||||||
// "tab.activeWithInactiveEditorGroupForeground": "#586E75",
|
|
||||||
// "tab.inactiveWithInactiveEditorGroupForeground": "#586E75",
|
|
||||||
"debugToolBar.background": "#EEE8D5",
|
"debugToolBar.background": "#EEE8D5",
|
||||||
"dropdown.background": "#EEE8D5",
|
"dropdown.background": "#EEE8D5",
|
||||||
"dropdown.border": "#2AA19899",
|
"dropdown.border": "#2AA19899",
|
||||||
|
|
|
@ -12,7 +12,7 @@ import DOM = require('vs/base/browser/dom');
|
||||||
import { TitleControl } from 'vs/workbench/browser/parts/editor/titleControl';
|
import { TitleControl } from 'vs/workbench/browser/parts/editor/titleControl';
|
||||||
import { EditorLabel } from 'vs/workbench/browser/labels';
|
import { EditorLabel } from 'vs/workbench/browser/labels';
|
||||||
import { Verbosity } from 'vs/platform/editor/common/editor';
|
import { Verbosity } from 'vs/platform/editor/common/editor';
|
||||||
import { TAB_ACTIVE_GROUP_INACTIVE_FOREGROUND, TAB_ACTIVE_GROUP_ACTIVE_FOREGROUND } from 'vs/workbench/common/theme';
|
import { TAB_ACTIVE_FOREGROUND } from 'vs/workbench/common/theme';
|
||||||
|
|
||||||
export class NoTabsTitleControl extends TitleControl {
|
export class NoTabsTitleControl extends TitleControl {
|
||||||
private titleContainer: HTMLElement;
|
private titleContainer: HTMLElement;
|
||||||
|
@ -126,11 +126,19 @@ export class NoTabsTitleControl extends TitleControl {
|
||||||
}
|
}
|
||||||
|
|
||||||
this.editorLabel.setLabel({ name, description, resource }, { title, italic: !isPinned, extraClasses: ['title-label'] });
|
this.editorLabel.setLabel({ name, description, resource }, { title, italic: !isPinned, extraClasses: ['title-label'] });
|
||||||
if (isActive) {
|
this.editorLabel.element.style.color = this.getColor(TAB_ACTIVE_FOREGROUND, (color, theme) => {
|
||||||
this.editorLabel.element.style.color = this.getColor(TAB_ACTIVE_GROUP_ACTIVE_FOREGROUND);
|
if (!isActive) {
|
||||||
} else {
|
if (theme.type === 'dark') {
|
||||||
this.editorLabel.element.style.color = this.getColor(TAB_ACTIVE_GROUP_INACTIVE_FOREGROUND);
|
return color.transparent(0.5);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (theme.type === 'light') {
|
||||||
|
return color.transparent(0.7);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return color;
|
||||||
|
});
|
||||||
|
|
||||||
// Update Editor Actions Toolbar
|
// Update Editor Actions Toolbar
|
||||||
this.updateEditorActionsToolbar();
|
this.updateEditorActionsToolbar();
|
||||||
|
|
|
@ -40,7 +40,7 @@ import { LinkedMap } from 'vs/base/common/map';
|
||||||
import { DelegatingWorkbenchEditorService } from 'vs/workbench/services/editor/browser/editorService';
|
import { DelegatingWorkbenchEditorService } from 'vs/workbench/services/editor/browser/editorService';
|
||||||
import { ServiceCollection } from 'vs/platform/instantiation/common/serviceCollection';
|
import { ServiceCollection } from 'vs/platform/instantiation/common/serviceCollection';
|
||||||
import { IThemeService, registerThemingParticipant, ITheme, ICssStyleCollector } from 'vs/platform/theme/common/themeService';
|
import { IThemeService, registerThemingParticipant, ITheme, ICssStyleCollector } from 'vs/platform/theme/common/themeService';
|
||||||
import { TAB_INACTIVE_BACKGROUND, TAB_ACTIVE_BACKGROUND, TAB_ACTIVE_GROUP_ACTIVE_FOREGROUND, TAB_ACTIVE_GROUP_INACTIVE_FOREGROUND, TAB_INACTIVE_GROUP_ACTIVE_FOREGROUND, TAB_INACTIVE_GROUP_INACTIVE_FOREGROUND, TAB_BORDER, EDITOR_DRAG_AND_DROP_BACKGROUND } from 'vs/workbench/common/theme';
|
import { TAB_INACTIVE_BACKGROUND, TAB_ACTIVE_BACKGROUND, TAB_ACTIVE_FOREGROUND, TAB_INACTIVE_FOREGROUND, TAB_BORDER, EDITOR_DRAG_AND_DROP_BACKGROUND } from 'vs/workbench/common/theme';
|
||||||
import { activeContrastBorder, contrastBorder } from 'vs/platform/theme/common/colorRegistry';
|
import { activeContrastBorder, contrastBorder } from 'vs/platform/theme/common/colorRegistry';
|
||||||
|
|
||||||
interface IEditorInputLabel {
|
interface IEditorInputLabel {
|
||||||
|
@ -291,14 +291,38 @@ export class TabsTitleControl extends TitleControl {
|
||||||
DOM.addClass(tabContainer, 'active');
|
DOM.addClass(tabContainer, 'active');
|
||||||
tabContainer.setAttribute('aria-selected', 'true');
|
tabContainer.setAttribute('aria-selected', 'true');
|
||||||
tabContainer.style.backgroundColor = this.getColor(TAB_ACTIVE_BACKGROUND);
|
tabContainer.style.backgroundColor = this.getColor(TAB_ACTIVE_BACKGROUND);
|
||||||
tabLabel.element.style.color = this.getColor(isGroupActive ? TAB_ACTIVE_GROUP_ACTIVE_FOREGROUND : TAB_ACTIVE_GROUP_INACTIVE_FOREGROUND);
|
tabLabel.element.style.color = this.getColor(TAB_ACTIVE_FOREGROUND, (color, theme) => {
|
||||||
|
if (!isGroupActive) {
|
||||||
|
if (theme.type === 'dark') {
|
||||||
|
return color.transparent(0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (theme.type === 'light') {
|
||||||
|
return color.transparent(0.7);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return color;
|
||||||
|
});
|
||||||
|
|
||||||
this.activeTab = tabContainer;
|
this.activeTab = tabContainer;
|
||||||
} else {
|
} else {
|
||||||
DOM.removeClass(tabContainer, 'active');
|
DOM.removeClass(tabContainer, 'active');
|
||||||
tabContainer.setAttribute('aria-selected', 'false');
|
tabContainer.setAttribute('aria-selected', 'false');
|
||||||
tabContainer.style.backgroundColor = this.getColor(TAB_INACTIVE_BACKGROUND);
|
tabContainer.style.backgroundColor = this.getColor(TAB_INACTIVE_BACKGROUND);
|
||||||
tabLabel.element.style.color = this.getColor(isGroupActive ? TAB_INACTIVE_GROUP_ACTIVE_FOREGROUND : TAB_INACTIVE_GROUP_INACTIVE_FOREGROUND);
|
tabLabel.element.style.color = this.getColor(TAB_INACTIVE_FOREGROUND, (color, theme) => {
|
||||||
|
if (!isGroupActive) {
|
||||||
|
if (theme.type === 'dark') {
|
||||||
|
return color.transparent(0.5).transparent(0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (theme.type === 'light') {
|
||||||
|
return color.transparent(0.7).transparent(0.5);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return color;
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// Dirty State
|
// Dirty State
|
||||||
|
|
|
@ -35,31 +35,18 @@ export const TAB_BORDER = registerColor('tab.border', {
|
||||||
hc: contrastBorder
|
hc: contrastBorder
|
||||||
}, nls.localize('tabBorder', "Border to separate tabs from each other. 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."));
|
}, nls.localize('tabBorder', "Border to separate tabs from each other. 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 TAB_ACTIVE_GROUP_ACTIVE_FOREGROUND = registerColor('tab.activeForeground', {
|
export const TAB_ACTIVE_FOREGROUND = registerColor('tab.activeForeground', {
|
||||||
dark: Color.white,
|
dark: Color.white,
|
||||||
light: Color.fromRGBA(new RGBA(51, 51, 51)),
|
light: Color.fromRGBA(new RGBA(51, 51, 51)),
|
||||||
hc: Color.white
|
hc: Color.white
|
||||||
}, nls.localize('tabActiveEditorGroupActiveForeground', "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."));
|
}, nls.localize('tabActiveEditorGroupActiveForeground', "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 TAB_ACTIVE_GROUP_INACTIVE_FOREGROUND = registerColor('tab.activeWithInactiveEditorGroupForeground', {
|
export const TAB_INACTIVE_FOREGROUND = registerColor('tab.inactiveForeground', {
|
||||||
dark: Color.white.transparent(0.5),
|
|
||||||
light: Color.fromRGBA(new RGBA(51, 51, 51)).transparent(0.7),
|
|
||||||
hc: Color.white
|
|
||||||
}, nls.localize('tabActiveEditorGroupInactiveForeground', "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 TAB_INACTIVE_GROUP_ACTIVE_FOREGROUND = registerColor('tab.inactiveForeground', {
|
|
||||||
dark: Color.white.transparent(0.5),
|
dark: Color.white.transparent(0.5),
|
||||||
light: Color.fromRGBA(new RGBA(51, 51, 51)).transparent(0.5),
|
light: Color.fromRGBA(new RGBA(51, 51, 51)).transparent(0.5),
|
||||||
hc: Color.white
|
hc: Color.white
|
||||||
}, nls.localize('tabInactiveEditorGroupActiveForeground', "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."));
|
}, nls.localize('tabInactiveEditorGroupActiveForeground', "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 TAB_INACTIVE_GROUP_INACTIVE_FOREGROUND = registerColor('tab.inactiveWithInactiveEditorGroupForeground', {
|
|
||||||
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('tabInactiveEditorGroupInactiveForeground', "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."));
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// < --- Editors --- >
|
// < --- Editors --- >
|
||||||
|
|
||||||
|
@ -298,8 +285,12 @@ export class Themable extends Disposable {
|
||||||
// Subclasses to override
|
// Subclasses to override
|
||||||
}
|
}
|
||||||
|
|
||||||
protected getColor(id: string): string {
|
protected getColor(id: string, modify?: (color: Color, theme: ITheme) => Color): string {
|
||||||
const color = this.theme.getColor(id);
|
let color = this.theme.getColor(id);
|
||||||
|
|
||||||
|
if (color && modify) {
|
||||||
|
color = modify(color, this.theme);
|
||||||
|
}
|
||||||
|
|
||||||
return color ? color.toString() : null;
|
return color ? color.toString() : null;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue