development/vscode
development/vscode
1
0
Fork 0
mirror of https://github.com/Microsoft/vscode synced 2024-09-13 21:55:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fixes border color. Renames to ghostTextBorder/Foreground.

Browse source
This commit is contained in:
Henning Dieterichs 2021-05-30 23:29:42 +02:00
parent 85f9447b72
commit d776f0c1eb
No known key found for this signature in database
GPG key ID: 771381EFFDB9EC06
2 changed files with 23 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/vs/editor/common/view/editorColorRegistry.ts
View file

@ -43,8 +43,8 @@ export const editorGutter = registerColor('editorGutter.background', { dark: edi
export const editorUnnecessaryCodeBorder = registerColor('editorUnnecessaryCode.border', { dark: null, light: null, hc: Color.fromHex('#fff').transparent(0.8) }, nls.localize('unnecessaryCodeBorder', 'Border color of unnecessary (unused) source code in the editor.'));
export const editorUnnecessaryCodeOpacity = registerColor('editorUnnecessaryCode.opacity', { dark: Color.fromHex('#000a'), light: Color.fromHex('#0007'), hc: null }, nls.localize('unnecessaryCodeOpacity', 'Opacity of unnecessary (unused) source code in the editor. For example, "#000000c0" will render the code with 75% opacity. For high contrast themes, use the \'editorUnnecessaryCode.border\' theme color to underline unnecessary code instead of fading it out.'));
export const editorSuggestPreviewBorder = registerColor('editorSuggestPreview.border', { dark: null, light: null, hc: Color.fromHex('#fff').transparent(0.8) }, nls.localize('editorSuggestPreviewBorder', 'Border color of inline suggestion preview in the editor.'));
export const editorSuggestPreviewOpacity = registerColor('editorSuggestPreview.opacity', { dark: Color.fromHex('#FFFa'), light: Color.fromHex('#0007'), hc: null }, nls.localize('editorSuggestPreviewOpacity', 'Opacity of inline suggestion preview in the editor. For example, "#000000c0" will render the code with 75% opacity. For high contrast themes, use the \'editorSuggestPreview.border\' theme color instead of fading it out.'));
export const ghostTextBorder = registerColor('editorGhostText.border', { dark: null, light: null, hc: Color.fromHex('#fff').transparent(0.8) }, nls.localize('editorGhostTextBorder', 'Border color of ghost text in the editor.'));
export const ghostTextForeground = registerColor('editorGhostText.foreground', { dark: Color.fromHex('#FFFa'), light: Color.fromHex('#0007'), hc: null }, nls.localize('editorGhostTextForeground', 'Foreground color of the ghost text in the editor.'));
const rulerRangeDefault = new Color(new RGBA(0, 122, 204, 0.6));
export const overviewRulerRangeHighlight = registerColor('editorOverviewRuler.rangeHighlightForeground', { dark: rulerRangeDefault, light: rulerRangeDefault, hc: rulerRangeDefault }, nls.localize('overviewRulerRangeHighlight', 'Overview ruler marker color for range highlights. The color must not be opaque so as not to hide underlying decorations.'), true);

34
src/vs/editor/contrib/inlineCompletions/ghostTextWidget.ts
View file

@ -19,7 +19,7 @@ import { Position } from 'vs/editor/common/core/position';
import { Emitter, Event } from 'vs/base/common/event';
import { IModelDeltaDecoration } from 'vs/editor/common/model';
import { IThemeService, registerThemingParticipant } from 'vs/platform/theme/common/themeService';
import { editorSuggestPreviewBorder, editorSuggestPreviewOpacity } from 'vs/editor/common/view/editorColorRegistry';
import { ghostTextBorder, ghostTextForeground } from 'vs/editor/common/view/editorColorRegistry';
import { RGBA, Color } from 'vs/base/common/color';
import { CursorColumns } from 'vs/editor/common/controller/cursorCommon';
@ -152,19 +152,26 @@ export class GhostTextWidget extends Disposable {
this.codeEditorDecorationTypeKey = null;
}
if (renderData) {
const suggestPreviewForeground = this._themeService.getColorTheme().getColor(editorSuggestPreviewOpacity);
if (renderData && renderData.lines.length > 0) {
const foreground = this._themeService.getColorTheme().getColor(ghostTextForeground);
let opacity: string | undefined = undefined;
let color: string | undefined = undefined;
if (suggestPreviewForeground) {
if (foreground) {
function opaque(color: Color): Color {
const { r, b, g } = color.rgba;
return new Color(new RGBA(r, g, b, 255));
}
opacity = String(suggestPreviewForeground.rgba.a);
color = Color.Format.CSS.format(opaque(suggestPreviewForeground))!;
opacity = String(foreground.rgba.a);
color = Color.Format.CSS.format(opaque(foreground))!;
}
const borderColor = this._themeService.getColorTheme().getColor(ghostTextBorder);
let border: string | undefined = undefined;
if (borderColor) {
border = `2px dashed ${borderColor}`;
}
// We add 0 to bring it before any other decoration.
this.codeEditorDecorationTypeKey = `0-ghost-text-${++GhostTextWidget.decorationTypeCount}`;
@ -181,6 +188,7 @@ export class GhostTextWidget extends Disposable {
contentText,
opacity,
color,
border,
},
});
}
@ -388,24 +396,24 @@ class ViewMoreLinesContentWidget extends Disposable implements IContentWidget {
}
registerThemingParticipant((theme, collector) => {
const suggestPreviewForeground = theme.getColor(editorSuggestPreviewOpacity);
const foreground = theme.getColor(ghostTextForeground);
if (suggestPreviewForeground) {
if (foreground) {
function opaque(color: Color): Color {
const { r, b, g } = color.rgba;
return new Color(new RGBA(r, g, b, 255));
}
const opacity = String(suggestPreviewForeground.rgba.a);
const color = Color.Format.CSS.format(opaque(suggestPreviewForeground))!;
const opacity = String(foreground.rgba.a);
const color = Color.Format.CSS.format(opaque(foreground))!;
// We need to override the only used token type .mtk1
collector.addRule(`.monaco-editor .suggest-preview-text .mtk1 { opacity: ${opacity}; color: ${color}; }`);
}
const suggestPreviewBorder = theme.getColor(editorSuggestPreviewBorder);
if (suggestPreviewBorder) {
collector.addRule(`.monaco-editor .suggest-preview-text { border-bottom: 2px dashed ${suggestPreviewBorder}; }`);
const border = theme.getColor(ghostTextBorder);
if (border) {
collector.addRule(`.monaco-editor .suggest-preview-text .mtk1 { border: 2px dashed ${border}; }`);
}
});