microsoft/vscode
1
0
Fork 0
mirror of https://github.com/microsoft/vscode.git synced 2026-07-10 15:40:41 -05:00
Code Issues Packages Projects Releases 177 Wiki Activity

[theme] clean up css rules for colors in editorColorRegistry

Browse Source
This commit is contained in:
Martin Aeschlimann
2017-03-21 12:16:56 +01:00
parent b9189cadc1
commit ca84943ba2
2 changed files with 17 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/vs/editor/browser/widget/media/editor.css
View File

@@ -71,9 +71,6 @@
*/
background: #fffffe;
}
.monaco-editor-background {
background: #fffffe;
}
.monaco-editor.ime-input .inputarea {
background: rgba(255, 255, 255, 0.85);
}
@@ -84,9 +81,6 @@
color: #BBB;
background: #1E1E1E;
}
.monaco-editor.vs-dark .monaco-editor-background {
background: #1E1E1E;
}
.monaco-editor.vs-dark.ime-input .inputarea {
background: rgba(0, 0, 0, 0.65);
}
@@ -97,9 +91,6 @@
color: #fff;
background: #000;
}
.monaco-editor.hc-black .monaco-editor-background {
background: #000;
}
/* -------------------- Misc -------------------- */
@@ -114,12 +105,6 @@
top: 0;
}
/* -------------------- Highlight a range -------------------- */
.monaco-editor.vs .rangeHighlight { background: rgba(253, 255, 0, 0.2); }
.monaco-editor.vs-dark .rangeHighlight { background: rgba(255, 255, 255, 0.044); }
.monaco-editor.hc-black .rangeHighlight { border: 1px dotted #f38518; }
/* -------------------- Squigglies -------------------- */
.monaco-editor.vs .redsquiggly,

52
src/vs/editor/common/view/editorColorRegistry.ts
View File

@@ -3,25 +3,14 @@
* Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
import nls = require('vs/nls');
import { registerColor, editorBackground, highContrastOutline } from 'vs/platform/theme/common/colorRegistry';
import { registerThemingParticipant } from 'vs/platform/theme/common/themeService';
import { Color } from 'vs/base/common/color';
/**
* Definition of the editor colors
*/
import nls = require('vs/nls');
import * as colorRegistry from 'vs/platform/theme/common/colorRegistry';
import { Registry } from 'vs/platform/platform';
import { ITheme, ICssStyleCollector, Extensions as ThemingExtensions, IThemingRegistry } from 'vs/platform/theme/common/themeService';
import { Color } from 'vs/base/common/color';
let colorReg = <colorRegistry.IColorRegistry>Registry.as(colorRegistry.Extensions.ColorContribution);
let themingReg = <IThemingRegistry>Registry.as(ThemingExtensions.ThemingContribution);
themingReg.onThemeChange(applyEditorStyles);
function registerColor(id: string, defaults: colorRegistry.ColorDefaults, description: string): colorRegistry.ColorIdentifier {
return colorReg.registerColor(id, defaults, description);
}
export const editorLineHighlight = registerColor('editorLineHighlight', { dark: null, light: null, hc: null }, nls.localize('lineHighlight', 'Editor line highlight color'));
export const editorLineHighlightBorder = registerColor('editorLineHighlightBorderCox', { dark: '#282828', light: '#eeeeee', hc: '#f38518' }, nls.localize('lineHighlightBorderBox', 'Editor line highlight border box color'));
export const editorRangeHighlight = registerColor('editorRangeHighlight', { dark: '#ffffff0b', light: '#fdff0033', hc: null }, nls.localize('rangeHighlight', 'Background color of range highlighted, like by Quick open and Find features'));
@@ -29,34 +18,27 @@ export const editorCursor = registerColor('editorCursor', { dark: '#AEAFAD', lig
export const editorInvisibles = registerColor('editorInvisibles', { dark: '#e3e4e229', light: '#33333333', hc: '#e3e4e229' }, nls.localize('invisibles', 'Editor invisibles color'));
export const editorGuide = registerColor('editorGuide', { dark: editorInvisibles, light: editorInvisibles, hc: editorInvisibles }, nls.localize('guide', 'Editor guide color'));
// TBD: split up and place each rule in the owning part
function applyEditorStyles(theme: ITheme, collector: ICssStyleCollector) {
// contains all color rules that used to defined in editor/browser/widget/editor.css
registerThemingParticipant((theme, collector) => {
let background = theme.getColor(colorRegistry.editorBackground);
let background = theme.getColor(editorBackground);
if (background) {
addBackgroundColorRule(theme, '.monaco-editor-background', background, collector);
collector.addRule(`.${theme.selector} .monaco-workbench .monaco-editor-background { background-color: ${background}; }`);
collector.addRule(`.monaco-editor.${theme.selector} .monaco-editor-background { background-color: ${background}; }`);
}
let lineHighlight = theme.getColor(editorLineHighlight);
if (lineHighlight) {
collector.addRule(`.monaco-editor.${theme.selector} .view-overlays .current-line { background-color: ${lineHighlight}; border: none; }`);
collector.addRule(`.monaco-editor.${theme.selector} .margin-view-overlays .current-line-margin { background-color: ${lineHighlight}; border: none; }`);
} else {
// to do editor line border
let rangeHighlight = theme.getColor(editorRangeHighlight);
if (rangeHighlight) {
collector.addRule(`.monaco-editor.${theme.selector} .rangeHighlight { background-color: ${rangeHighlight}; }`);
}
let outline = theme.getColor(highContrastOutline);
if (outline) {
collector.addRule(`.monaco-editor.${theme.selector} .rangeHighlight { border: 1px dotted ${outline}; }; }`);
}
addBackgroundColorRule(theme, '.rangeHighlight', theme.getColor(editorRangeHighlight), collector);
let invisibles = theme.getColor(editorInvisibles);
if (invisibles) {
collector.addRule(`.vs-whitespace { color: ${invisibles} !important; }`);
}
}
function addBackgroundColorRule(theme: ITheme, selector: string, color: Color, collector: ICssStyleCollector): void {
if (color) {
collector.addRule(`.monaco-editor.${theme.selector} ${selector} { background-color: ${color}; }`);
}
}
});