Skip to content

Commit 55a95c7

Browse files
committed
Reduce theme participant for notebook diff editor
1 parent 19ca019 commit 55a95c7

File tree

2 files changed

+74
-120
lines changed

2 files changed

+74
-120
lines changed

src/vs/workbench/contrib/notebook/browser/diff/notebookDiff.css

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -318,3 +318,75 @@
318318
.notebook-text-diff-editor .diffViewport:active {
319319
background: var(--vscode-scrollbarSlider-activeBackground);
320320
}
321+
322+
/** Diff cell borders */
323+
.notebook-text-diff-editor .cell-body .border-container .top-border,
324+
.notebook-text-diff-editor .cell-body .border-container .bottom-border,
325+
.notebook-text-diff-editor .cell-diff-editor-container .output-header-container,
326+
.notebook-text-diff-editor .cell-diff-editor-container .metadata-header-container {
327+
border-top: 1px solid var(--vscode-notebook-cellBorderColor);
328+
}
329+
330+
.notebook-text-diff-editor .cell-body .border-container .left-border {
331+
border-left: 1px solid var(--vscode-notebook-cellBorderColor);
332+
}
333+
334+
.notebook-text-diff-editor .cell-body .border-container .right-border {
335+
border-right: 1px solid var(--vscode-notebook-cellBorderColor);
336+
}
337+
338+
/** Diff cell active borders */
339+
.notebook-text-diff-editor .monaco-list-row.focused .cell-body .border-container .top-border,
340+
.notebook-text-diff-editor .monaco-list-row.focused .cell-body .border-container .bottom-border {
341+
border-top: 1px solid var(--vscode-notebook-focusedEditorBorder);
342+
}
343+
344+
.notebook-text-diff-editor .monaco-list-row.focused .cell-body .border-container .left-border {
345+
border-left: 1px solid var(--vscode-notebook-focusedEditorBorder);
346+
}
347+
348+
.notebook-text-diff-editor .monaco-list-row.focused .cell-body .border-container .right-border {
349+
border-right: 1px solid var(--vscode-notebook-focusedEditorBorder);
350+
}
351+
352+
/** Diff cell diff background */
353+
354+
.monaco-workbench .notebook-text-diff-editor .cell-body.full .output-info-container.modified .output-view-container .output-view-container-right div.foreground,
355+
.monaco-workbench .notebook-text-diff-editor .cell-body.right .output-info-container .output-view-container div.foreground,
356+
.monaco-workbench .notebook-text-diff-editor .cell-body.right .output-info-container .output-view-container div.output-empty-view,
357+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .source-container,
358+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .source-container .monaco-editor .margin,
359+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .source-container .monaco-editor .monaco-editor-background,
360+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .metadata-editor-container,
361+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .metadata-editor-container .monaco-editor .margin,
362+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .metadata-editor-container .monaco-editor .monaco-editor-background,
363+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .output-editor-container,
364+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .output-editor-container .monaco-editor .margin,
365+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .output-editor-container .monaco-editor .monaco-editor-background,
366+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .metadata-header-container,
367+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .output-header-container {
368+
background-color: var(--vscode-diffEditor-insertedTextBackground);
369+
}
370+
371+
.monaco-workbench .notebook-text-diff-editor .cell-body.full .output-info-container.modified .output-view-container .output-view-container-left div.foreground,
372+
.monaco-workbench .notebook-text-diff-editor .cell-body.left .output-info-container .output-view-container div.foreground,
373+
.monaco-workbench .notebook-text-diff-editor .cell-body.left .output-info-container .output-view-container div.output-empty-view,
374+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .source-container,
375+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .source-container .monaco-editor .margin,
376+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .source-container .monaco-editor .monaco-editor-background,
377+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .metadata-editor-container,
378+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .metadata-editor-container .monaco-editor .margin,
379+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .metadata-editor-container .monaco-editor .monaco-editor-background,
380+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .output-editor-container,
381+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .output-editor-container .monaco-editor .margin,
382+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .output-editor-container .monaco-editor .monaco-editor-background,
383+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .metadata-header-container,
384+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .output-header-container {
385+
background-color: var(--vscode-diffEditor-removedTextBackground);
386+
}
387+
388+
/** Diff cell editor background */
389+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container .source-container .monaco-editor .margin,
390+
.notebook-text-diff-editor .cell-body .cell-diff-editor-container .source-container .monaco-editor .monaco-editor-background {
391+
background: var(--vscode-notebook-cellEditorBackground, var(--vscode-editor-background));
392+
}

src/vs/workbench/contrib/notebook/browser/diff/notebookDiffEditor.ts

Lines changed: 2 additions & 120 deletions
Original file line numberDiff line numberDiff line change
@@ -9,15 +9,15 @@ import { IStorageService } from 'vs/platform/storage/common/storage';
99
import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
1010
import { IThemeService, registerThemingParticipant } from 'vs/platform/theme/common/themeService';
1111
import { EditorPaneSelectionChangeReason, EditorPaneSelectionCompareResult, IEditorOpenContext, IEditorPaneSelection, IEditorPaneSelectionChangeEvent, IEditorPaneWithSelection } from 'vs/workbench/common/editor';
12-
import { cellEditorBackground, focusedEditorBorderColor, getDefaultNotebookCreationOptions, notebookCellBorder, NotebookEditorWidget } from 'vs/workbench/contrib/notebook/browser/notebookEditorWidget';
12+
import { getDefaultNotebookCreationOptions, NotebookEditorWidget } from 'vs/workbench/contrib/notebook/browser/notebookEditorWidget';
1313
import { IEditorGroup } from 'vs/workbench/services/editor/common/editorGroupsService';
1414
import { NotebookDiffEditorInput } from '../../common/notebookDiffEditorInput';
1515
import { CancellationToken, CancellationTokenSource } from 'vs/base/common/cancellation';
1616
import { DiffElementViewModelBase, SideBySideDiffElementViewModel, SingleSideDiffElementViewModel } from 'vs/workbench/contrib/notebook/browser/diff/diffElementViewModel';
1717
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
1818
import { CellDiffSideBySideRenderer, CellDiffSingleSideRenderer, NotebookCellTextDiffListDelegate, NotebookTextDiffList } from 'vs/workbench/contrib/notebook/browser/diff/notebookDiffList';
1919
import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
20-
import { diffDiagonalFill, diffInserted, diffRemoved, editorBackground, focusBorder, foreground } from 'vs/platform/theme/common/colorRegistry';
20+
import { diffDiagonalFill, editorBackground, focusBorder, foreground } from 'vs/platform/theme/common/colorRegistry';
2121
import { INotebookEditorWorkerService } from 'vs/workbench/contrib/notebook/common/services/notebookWorkerService';
2222
import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
2323
import { IEditorOptions as ICodeEditorOptions } from 'vs/editor/common/config/editorOptions';
@@ -1023,27 +1023,6 @@ export class NotebookTextDiffEditor extends EditorPane implements INotebookTextD
10231023
registerZIndex(ZIndex.Base, 10, 'notebook-diff-view-viewport-slider');
10241024

10251025
registerThemingParticipant((theme, collector) => {
1026-
const cellBorderColor = theme.getColor(notebookCellBorder);
1027-
if (cellBorderColor) {
1028-
collector.addRule(`.notebook-text-diff-editor .cell-body .border-container .top-border { border-top: 1px solid ${cellBorderColor};}`);
1029-
collector.addRule(`.notebook-text-diff-editor .cell-body .border-container .bottom-border { border-top: 1px solid ${cellBorderColor};}`);
1030-
collector.addRule(`.notebook-text-diff-editor .cell-body .border-container .left-border { border-left: 1px solid ${cellBorderColor};}`);
1031-
collector.addRule(`.notebook-text-diff-editor .cell-body .border-container .right-border { border-right: 1px solid ${cellBorderColor};}`);
1032-
collector.addRule(`.notebook-text-diff-editor .cell-diff-editor-container .output-header-container,
1033-
.notebook-text-diff-editor .cell-diff-editor-container .metadata-header-container {
1034-
border-top: 1px solid ${cellBorderColor};
1035-
}`);
1036-
}
1037-
1038-
const focusCellBackgroundColor = theme.getColor(focusedEditorBorderColor);
1039-
1040-
if (focusCellBackgroundColor) {
1041-
collector.addRule(`.notebook-text-diff-editor .monaco-list-row.focused .cell-body .border-container .top-border { border-top: 1px solid ${focusCellBackgroundColor};}`);
1042-
collector.addRule(`.notebook-text-diff-editor .monaco-list-row.focused .cell-body .border-container .bottom-border { border-top: 1px solid ${focusCellBackgroundColor};}`);
1043-
collector.addRule(`.notebook-text-diff-editor .monaco-list-row.focused .cell-body .border-container .left-border { border-left: 1px solid ${focusCellBackgroundColor};}`);
1044-
collector.addRule(`.notebook-text-diff-editor .monaco-list-row.focused .cell-body .border-container .right-border { border-right: 1px solid ${focusCellBackgroundColor};}`);
1045-
}
1046-
10471026
const diffDiagonalFillColor = theme.getColor(diffDiagonalFill);
10481027
collector.addRule(`
10491028
.notebook-text-diff-editor .diagonal-fill {
@@ -1058,102 +1037,5 @@ registerThemingParticipant((theme, collector) => {
10581037
}
10591038
`);
10601039

1061-
const editorBackgroundColor = theme.getColor(cellEditorBackground) ?? theme.getColor(editorBackground);
1062-
if (editorBackgroundColor) {
1063-
collector.addRule(`.notebook-text-diff-editor .cell-body .cell-diff-editor-container .source-container .monaco-editor .margin,
1064-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container .source-container .monaco-editor .monaco-editor-background { background: ${editorBackgroundColor}; }`
1065-
);
1066-
}
1067-
1068-
const added = theme.getColor(diffInserted);
1069-
if (added) {
1070-
collector.addRule(
1071-
`
1072-
.monaco-workbench .notebook-text-diff-editor .cell-body.full .output-info-container.modified .output-view-container .output-view-container-right div.foreground { background-color: ${added}; }
1073-
.monaco-workbench .notebook-text-diff-editor .cell-body.right .output-info-container .output-view-container div.foreground { background-color: ${added}; }
1074-
.monaco-workbench .notebook-text-diff-editor .cell-body.right .output-info-container .output-view-container div.output-empty-view { background-color: ${added}; }
1075-
`
1076-
);
1077-
collector.addRule(`
1078-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .source-container { background-color: ${added}; }
1079-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .source-container .monaco-editor .margin,
1080-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .source-container .monaco-editor .monaco-editor-background {
1081-
background-color: ${added};
1082-
}
1083-
`
1084-
);
1085-
collector.addRule(`
1086-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .metadata-editor-container { background-color: ${added}; }
1087-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .metadata-editor-container .monaco-editor .margin,
1088-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .metadata-editor-container .monaco-editor .monaco-editor-background {
1089-
background-color: ${added};
1090-
}
1091-
`
1092-
);
1093-
collector.addRule(`
1094-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .output-editor-container { background-color: ${added}; }
1095-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .output-editor-container .monaco-editor .margin,
1096-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .output-editor-container .monaco-editor .monaco-editor-background {
1097-
background-color: ${added};
1098-
}
1099-
`
1100-
);
1101-
collector.addRule(`
1102-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .metadata-header-container { background-color: ${added}; }
1103-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.inserted .output-header-container { background-color: ${added}; }
1104-
`
1105-
);
1106-
}
1107-
const removed = theme.getColor(diffRemoved);
1108-
if (removed) {
1109-
collector.addRule(
1110-
`
1111-
.monaco-workbench .notebook-text-diff-editor .cell-body.full .output-info-container.modified .output-view-container .output-view-container-left div.foreground { background-color: ${removed}; }
1112-
.monaco-workbench .notebook-text-diff-editor .cell-body.left .output-info-container .output-view-container div.foreground { background-color: ${removed}; }
1113-
.monaco-workbench .notebook-text-diff-editor .cell-body.left .output-info-container .output-view-container div.output-empty-view { background-color: ${removed}; }
1114-
1115-
`
1116-
);
1117-
collector.addRule(`
1118-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .source-container { background-color: ${removed}; }
1119-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .source-container .monaco-editor .margin,
1120-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .source-container .monaco-editor .monaco-editor-background {
1121-
background-color: ${removed};
1122-
}
1123-
`
1124-
);
1125-
collector.addRule(`
1126-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .metadata-editor-container { background-color: ${removed}; }
1127-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .metadata-editor-container .monaco-editor .margin,
1128-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .metadata-editor-container .monaco-editor .monaco-editor-background {
1129-
background-color: ${removed};
1130-
}
1131-
`
1132-
);
1133-
collector.addRule(`
1134-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .output-editor-container { background-color: ${removed}; }
1135-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .output-editor-container .monaco-editor .margin,
1136-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .output-editor-container .monaco-editor .monaco-editor-background {
1137-
background-color: ${removed};
1138-
}
1139-
`
1140-
);
1141-
collector.addRule(`
1142-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .metadata-header-container { background-color: ${removed}; }
1143-
.notebook-text-diff-editor .cell-body .cell-diff-editor-container.removed .output-header-container { background-color: ${removed}; }
1144-
`
1145-
);
1146-
}
1147-
1148-
// const changed = theme.getColor(editorGutterModifiedBackground);
1149-
1150-
// if (changed) {
1151-
// collector.addRule(`
1152-
// .notebook-text-diff-editor .cell-diff-editor-container .metadata-header-container.modified {
1153-
// background-color: ${changed};
1154-
// }
1155-
// `);
1156-
// }
1157-
11581040
collector.addRule(`.notebook-text-diff-editor .cell-body { margin: ${DIFF_CELL_MARGIN}px; }`);
11591041
});

0 commit comments

Comments
 (0)