Skip to content

Commit e109887

Browse files
Kalmaegiaeschli
andauthored
Adapter css variables (microsoft#166279)
* move css variables from markersViewActions.ts to markersViewActions.css * move css variables from testingOutputPeek.ts to testingOutputPeek.css * move css variables from linkedEditing.ts to linkedEditing.css * move css variables from interactiveEditor.ts to interactiveEditor.css * add editor linked editing color to color registry * 💄 * add css import Co-authored-by: Martin Aeschlimann <[email protected]>
1 parent d9a70c4 commit e109887

File tree

8 files changed

+72
-81
lines changed

8 files changed

+72
-81
lines changed
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
/*---------------------------------------------------------------------------------------------
2+
* Copyright (c) Microsoft Corporation. All rights reserved.
3+
* Licensed under the MIT License. See License.txt in the project root for license information.
4+
*--------------------------------------------------------------------------------------------*/
5+
6+
.monaco-editor .linked-editing-decoration {
7+
background-color: var(--vscode-editor-linkedEditingBackground);
8+
border-left-color: var(--vscode-editor-linkedEditingBackground);
9+
}

src/vs/editor/contrib/linkedEditing/browser/linkedEditing.ts

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -28,13 +28,13 @@ import { ILanguageConfigurationService } from 'vs/editor/common/languages/langua
2828
import * as nls from 'vs/nls';
2929
import { ContextKeyExpr, IContextKey, IContextKeyService, RawContextKey } from 'vs/platform/contextkey/common/contextkey';
3030
import { KeybindingWeight } from 'vs/platform/keybinding/common/keybindingsRegistry';
31-
import { registerColor } from 'vs/platform/theme/common/colorRegistry';
32-
import { registerThemingParticipant } from 'vs/platform/theme/common/themeService';
3331
import { ILanguageFeaturesService } from 'vs/editor/common/services/languageFeatures';
32+
import { registerColor } from 'vs/platform/theme/common/colorRegistry';
3433
import { LanguageFeatureRegistry } from 'vs/editor/common/languageFeatureRegistry';
3534
import { ISingleEditOperation } from 'vs/editor/common/core/editOperation';
3635
import { IFeatureDebounceInformation, ILanguageFeatureDebounceService } from 'vs/editor/common/services/languageFeatureDebounce';
3736
import { StopWatch } from 'vs/base/common/stopwatch';
37+
import 'vs/css!./linkedEditing';
3838

3939
export const CONTEXT_ONTYPE_RENAME_INPUT_VISIBLE = new RawContextKey<boolean>('LinkedEditingInputVisible', false);
4040

@@ -461,12 +461,6 @@ function getLinkedEditingRanges(providers: LanguageFeatureRegistry<LinkedEditing
461461
}
462462

463463
export const editorLinkedEditingBackground = registerColor('editor.linkedEditingBackground', { dark: Color.fromHex('#f00').transparent(0.3), light: Color.fromHex('#f00').transparent(0.3), hcDark: Color.fromHex('#f00').transparent(0.3), hcLight: Color.white }, nls.localize('editorLinkedEditingBackground', 'Background color when the editor auto renames on type.'));
464-
registerThemingParticipant((theme, collector) => {
465-
const editorLinkedEditingBackgroundColor = theme.getColor(editorLinkedEditingBackground);
466-
if (editorLinkedEditingBackgroundColor) {
467-
collector.addRule(`.monaco-editor .${DECORATION_CLASS_NAME} { background: ${editorLinkedEditingBackgroundColor}; border-left-color: ${editorLinkedEditingBackgroundColor}; }`);
468-
}
469-
});
470464

471465
registerModelAndPositionCommand('_executeLinkedEditingProvider', (_accessor, model, position) => {
472466
const { linkedEditingRangeProvider } = _accessor.get(ILanguageFeaturesService);
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
/*---------------------------------------------------------------------------------------------
2+
* Copyright (c) Microsoft Corporation. All rights reserved.
3+
* Licensed under the MIT License. See License.txt in the project root for license information.
4+
*--------------------------------------------------------------------------------------------*/
5+
6+
.interactive-editor .input-cell-container:focus-within .input-editor-container .monaco-editor {
7+
outline: solid 1px var(--vscode-notebook-focusedCellBorder);
8+
}
9+
10+
.interactive-editor .input-cell-container .input-editor-container .monaco-editor {
11+
outline: solid 1px var(--vscode-notebook-inactiveFocusedCellBorder);
12+
}
13+
14+
.interactive-editor .input-cell-container .input-focus-indicator {
15+
top: 8px;
16+
}
17+
18+
.interactive-editor .input-cell-container .monaco-editor-background,
19+
.interactive-editor .input-cell-container .margin-view-overlays {
20+
background-color: var(--vscode-notebook-cellEditorBackground, --vscode-editor-background);
21+
}

src/vs/workbench/contrib/interactive/browser/interactiveEditor.ts

Lines changed: 4 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -16,16 +16,16 @@ import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
1616
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
1717
import { IStorageService } from 'vs/platform/storage/common/storage';
1818
import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
19-
import { editorBackground, editorForeground, resolveColorValue } from 'vs/platform/theme/common/colorRegistry';
20-
import { IThemeService, registerThemingParticipant } from 'vs/platform/theme/common/themeService';
19+
import { editorForeground, resolveColorValue } from 'vs/platform/theme/common/colorRegistry';
20+
import { IThemeService } from 'vs/platform/theme/common/themeService';
2121
import { EditorPane } from 'vs/workbench/browser/parts/editor/editorPane';
2222
import { EditorPaneSelectionChangeReason, IEditorMemento, IEditorOpenContext, IEditorPaneSelectionChangeEvent } from 'vs/workbench/common/editor';
2323
import { getSimpleEditorOptions } from 'vs/workbench/contrib/codeEditor/browser/simpleEditorOptions';
2424
import { InteractiveEditorInput } from 'vs/workbench/contrib/interactive/browser/interactiveEditorInput';
2525
import { ICellViewModel, INotebookEditorOptions, INotebookEditorViewState } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
2626
import { NotebookEditorExtensionsRegistry } from 'vs/workbench/contrib/notebook/browser/notebookEditorExtensions';
2727
import { IBorrowValue, INotebookEditorService } from 'vs/workbench/contrib/notebook/browser/services/notebookEditorService';
28-
import { cellEditorBackground, NotebookEditorWidget } from 'vs/workbench/contrib/notebook/browser/notebookEditorWidget';
28+
import { NotebookEditorWidget } from 'vs/workbench/contrib/notebook/browser/notebookEditorWidget';
2929
import { GroupsOrder, IEditorGroup, IEditorGroupsService } from 'vs/workbench/services/editor/common/editorGroupsService';
3030
import { ExecutionStateCellStatusBarContrib, TimerCellStatusBarContrib } from 'vs/workbench/contrib/notebook/browser/contrib/cellStatusBar/executionStatusBarItemController';
3131
import { INotebookKernelService } from 'vs/workbench/contrib/notebook/common/notebookKernelService';
@@ -60,6 +60,7 @@ import { IExtensionService } from 'vs/workbench/services/extensions/common/exten
6060
import { isEqual } from 'vs/base/common/resources';
6161
import { NotebookFindContrib } from 'vs/workbench/contrib/notebook/browser/contrib/find/notebookFindWidget';
6262
import { INTERACTIVE_WINDOW_EDITOR_ID } from 'vs/workbench/contrib/notebook/common/notebookCommon';
63+
import 'vs/css!./interactiveEditor';
6364

6465
const DECORATION_KEY = 'interactiveInputDecoration';
6566
const INTERACTIVE_EDITOR_VIEW_STATE_PREFERENCE_KEY = 'InteractiveEditorViewState';
@@ -683,25 +684,3 @@ export class InteractiveEditor extends EditorPane {
683684
};
684685
}
685686
}
686-
687-
registerThemingParticipant((theme, collector) => {
688-
collector.addRule(`
689-
.interactive-editor .input-cell-container:focus-within .input-editor-container .monaco-editor {
690-
outline: solid 1px var(--vscode-notebook-focusedCellBorder);
691-
}
692-
.interactive-editor .input-cell-container .input-editor-container .monaco-editor {
693-
outline: solid 1px var(--vscode-notebook-inactiveFocusedCellBorder);
694-
}
695-
.interactive-editor .input-cell-container .input-focus-indicator {
696-
top: ${INPUT_CELL_VERTICAL_PADDING}px;
697-
}
698-
`);
699-
700-
const editorBackgroundColor = theme.getColor(cellEditorBackground) ?? theme.getColor(editorBackground);
701-
if (editorBackgroundColor) {
702-
collector.addRule(`.interactive-editor .input-cell-container .monaco-editor-background,
703-
.interactive-editor .input-cell-container .margin-view-overlays {
704-
background: ${editorBackgroundColor};
705-
}`);
706-
}
707-
});
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
/*---------------------------------------------------------------------------------------------
2+
* Copyright (c) Microsoft Corporation. All rights reserved.
3+
* Licensed under the MIT License. See License.txt in the project root for license information.
4+
*--------------------------------------------------------------------------------------------*/
5+
6+
.markers-panel-action-filter > .markers-panel-filter-controls > .monaco-action-bar .action-label.markers-filters.checked {
7+
border-color: var(--vscode-inputOption-activeBorder);
8+
color: var(--vscode-inputOption-activeForeground);
9+
background-color: var(--vscode-inputOption-activeBackground);
10+
}

src/vs/workbench/contrib/markers/browser/markersViewActions.ts

Lines changed: 1 addition & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -7,15 +7,14 @@ import * as DOM from 'vs/base/browser/dom';
77
import { Action, IAction } from 'vs/base/common/actions';
88
import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
99
import Messages from 'vs/workbench/contrib/markers/browser/messages';
10-
import { registerThemingParticipant, ICssStyleCollector, IColorTheme } from 'vs/platform/theme/common/themeService';
1110
import { Disposable } from 'vs/base/common/lifecycle';
12-
import { inputActiveOptionBorder, inputActiveOptionBackground, inputActiveOptionForeground } from 'vs/platform/theme/common/colorRegistry';
1311
import { Marker } from 'vs/workbench/contrib/markers/browser/markersModel';
1412
import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
1513
import { Event, Emitter } from 'vs/base/common/event';
1614
import { Codicon } from 'vs/base/common/codicons';
1715
import { ActionViewItem } from 'vs/base/browser/ui/actionbar/actionViewItems';
1816
import { MarkersContextKeys } from 'vs/workbench/contrib/markers/common/markers';
17+
import 'vs/css!./markersViewActions';
1918

2019
export interface IMarkersFiltersChangeEvent {
2120
excludedFiles?: boolean;
@@ -174,17 +173,3 @@ export class QuickFixActionViewItem extends ActionViewItem {
174173
}
175174
}
176175

177-
registerThemingParticipant((theme: IColorTheme, collector: ICssStyleCollector) => {
178-
const inputActiveOptionBorderColor = theme.getColor(inputActiveOptionBorder);
179-
if (inputActiveOptionBorderColor) {
180-
collector.addRule(`.markers-panel-action-filter > .markers-panel-filter-controls > .monaco-action-bar .action-label.markers-filters.checked { border-color: ${inputActiveOptionBorderColor}; }`);
181-
}
182-
const inputActiveOptionForegroundColor = theme.getColor(inputActiveOptionForeground);
183-
if (inputActiveOptionForegroundColor) {
184-
collector.addRule(`.markers-panel-action-filter > .markers-panel-filter-controls > .monaco-action-bar .action-label.markers-filters.checked { color: ${inputActiveOptionForegroundColor}; }`);
185-
}
186-
const inputActiveOptionBackgroundColor = theme.getColor(inputActiveOptionBackground);
187-
if (inputActiveOptionBackgroundColor) {
188-
collector.addRule(`.markers-panel-action-filter > .markers-panel-filter-controls > .monaco-action-bar .action-label.markers-filters.checked { background-color: ${inputActiveOptionBackgroundColor}; }`);
189-
}
190-
});
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
/*---------------------------------------------------------------------------------------------
2+
* Copyright (c) Microsoft Corporation. All rights reserved.
3+
* Licensed under the MIT License. See License.txt in the project root for license information.
4+
*--------------------------------------------------------------------------------------------*/
5+
6+
.monaco-editor .test-output-peek .test-output-peek-tree {
7+
background-color: var(--vscode-peekViewResult-background);
8+
color: var(--vscode-peekViewResult-lineForeground);
9+
}
10+
11+
.monaco-editor .test-output-peek .test-output-peek-tree .monaco-list:focus .monaco-list-rows > .monaco-list-row.selected:not(.highlighted) {
12+
background-color: var(--vscode-peekViewResult-selectionBackground);
13+
color: var(--vscode-peekViewResult-selectionForeground) !important;
14+
}
15+
16+
.monaco-editor .test-output-peek .test-output-peek-message-container a {
17+
color: var(--vscode-textLink-foreground);
18+
}
19+
20+
.monaco-editor .test-output-peek .test-output-peek-message-container a :hover {
21+
color: var(--vscode-textLink-activeForeground);
22+
}

src/vs/workbench/contrib/testing/browser/testingOutputPeek.ts

Lines changed: 3 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ import { IEditorContribution, ScrollType } from 'vs/editor/common/editorCommon';
4040
import { EditorContextKeys } from 'vs/editor/common/editorContextKeys';
4141
import { IResolvedTextEditorModel, ITextModelService } from 'vs/editor/common/services/resolverService';
4242
import { MarkdownRenderer } from 'vs/editor/contrib/markdownRenderer/browser/markdownRenderer';
43-
import { getOuterEditor, IPeekViewService, peekViewResultsBackground, peekViewResultsMatchForeground, peekViewResultsSelectionBackground, peekViewResultsSelectionForeground, peekViewTitleForeground, peekViewTitleInfoForeground, PeekViewWidget } from 'vs/editor/contrib/peekView/browser/peekView';
43+
import { getOuterEditor, IPeekViewService, peekViewTitleForeground, peekViewTitleInfoForeground, PeekViewWidget } from 'vs/editor/contrib/peekView/browser/peekView';
4444
import { localize } from 'vs/nls';
4545
import { createAndFillInActionBarActions, MenuEntryActionViewItem } from 'vs/platform/actions/browser/menuEntryActionViewItem';
4646
import { IMenuService, MenuId, MenuItemAction } from 'vs/platform/actions/common/actions';
@@ -53,8 +53,7 @@ import { IInstantiationService, ServicesAccessor } from 'vs/platform/instantiati
5353
import { KeybindingWeight } from 'vs/platform/keybinding/common/keybindingsRegistry';
5454
import { WorkbenchCompressibleObjectTree } from 'vs/platform/list/browser/listService';
5555
import { IStorageService, StorageScope, StorageTarget } from 'vs/platform/storage/common/storage';
56-
import { textLinkActiveForeground, textLinkForeground } from 'vs/platform/theme/common/colorRegistry';
57-
import { IColorTheme, IThemeService, registerThemingParticipant, ThemeIcon } from 'vs/platform/theme/common/themeService';
56+
import { IColorTheme, IThemeService, ThemeIcon } from 'vs/platform/theme/common/themeService';
5857
import { Categories } from 'vs/platform/action/common/actionCommonCategories';
5958
import { EditorModel } from 'vs/workbench/common/editor/editorModel';
6059
import { flatTestItemDelimiter } from 'vs/workbench/contrib/testing/browser/explorerProjections/display';
@@ -77,6 +76,7 @@ import { ITestResultService, ResultChangeEvent } from 'vs/workbench/contrib/test
7776
import { ITestService } from 'vs/workbench/contrib/testing/common/testService';
7877
import { IRichLocation, ITestErrorMessage, ITestItem, ITestMessage, ITestRunTask, ITestTaskState, TestMessageType, TestResultItem, TestResultState, TestRunProfileBitset } from 'vs/workbench/contrib/testing/common/testTypes';
7978
import { IEditorService } from 'vs/workbench/services/editor/common/editorService';
79+
import 'vs/css!./testingOutputPeek';
8080

8181
class TestDto {
8282
public readonly test: ITestItem;
@@ -1621,35 +1621,6 @@ class TreeActionsProvider {
16211621
}
16221622
}
16231623

1624-
registerThemingParticipant((theme, collector) => {
1625-
const resultsBackground = theme.getColor(peekViewResultsBackground);
1626-
if (resultsBackground) {
1627-
collector.addRule(`.monaco-editor .test-output-peek .test-output-peek-tree { background-color: ${resultsBackground}; }`);
1628-
}
1629-
const resultsMatchForeground = theme.getColor(peekViewResultsMatchForeground);
1630-
if (resultsMatchForeground) {
1631-
collector.addRule(`.monaco-editor .test-output-peek .test-output-peek-tree { color: ${resultsMatchForeground}; }`);
1632-
}
1633-
const resultsSelectedBackground = theme.getColor(peekViewResultsSelectionBackground);
1634-
if (resultsSelectedBackground) {
1635-
collector.addRule(`.monaco-editor .test-output-peek .test-output-peek-tree .monaco-list:focus .monaco-list-rows > .monaco-list-row.selected:not(.highlighted) { background-color: ${resultsSelectedBackground}; }`);
1636-
}
1637-
const resultsSelectedForeground = theme.getColor(peekViewResultsSelectionForeground);
1638-
if (resultsSelectedForeground) {
1639-
collector.addRule(`.monaco-editor .test-output-peek .test-output-peek-tree .monaco-list:focus .monaco-list-rows > .monaco-list-row.selected:not(.highlighted) { color: ${resultsSelectedForeground} !important; }`);
1640-
}
1641-
1642-
const textLinkForegroundColor = theme.getColor(textLinkForeground);
1643-
if (textLinkForegroundColor) {
1644-
collector.addRule(`.monaco-editor .test-output-peek .test-output-peek-message-container a { color: ${textLinkForegroundColor}; }`);
1645-
}
1646-
1647-
const textLinkActiveForegroundColor = theme.getColor(textLinkActiveForeground);
1648-
if (textLinkActiveForegroundColor) {
1649-
collector.addRule(`.monaco-editor .test-output-peek .test-output-peek-message-container a :hover { color: ${textLinkActiveForegroundColor}; }`);
1650-
}
1651-
});
1652-
16531624
const navWhen = ContextKeyExpr.and(
16541625
EditorContextKeys.focus,
16551626
TestingContextKeys.isPeekVisible,

0 commit comments

Comments
 (0)