theming - search viewlet

src/vs/editor/browser/widget/diffEditorWidget.ts

@@ -6,7 +6,6 @@
 'use strict';
 
 import 'vs/css!./media/diffEditor';
-import * as nls from 'vs/nls';
 import { RunOnceScheduler } from 'vs/base/common/async';
 import { Disposable } from 'vs/base/common/lifecycle';
 import * as objects from 'vs/base/common/objects';
@@ -33,8 +32,8 @@ import { ColorId, MetadataConsts, FontStyle } from 'vs/editor/common/modes';
 import Event, { Emitter } from 'vs/base/common/event';
 import * as editorOptions from 'vs/editor/common/config/editorOptions';
 import { registerThemingParticipant, IThemeService, ITheme, getThemeTypeSelector } from 'vs/platform/theme/common/themeService';
-import { registerColor, scrollbarShadow } from 'vs/platform/theme/common/colorRegistry';
-import { Color, RGBA } from 'vs/base/common/color';
+import { scrollbarShadow, diffInserted, diffRemoved, defaultInsertColor, defaultRemoveColor, diffInsertedOutline, diffRemovedOutline } from 'vs/platform/theme/common/colorRegistry';
+import { Color } from 'vs/base/common/color';
 import { OverviewRulerZone } from 'vs/editor/common/view/overviewZoneManager';
 import { IEditorWhitespace } from 'vs/editor/common/viewLayout/whitespaceComputer';
 
@@ -1946,14 +1945,6 @@ function createFakeLinesDiv(): HTMLElement {
 	return r;
 }
 
-const defaultInsertColor = Color.fromRGBA(new RGBA(155, 185, 85, 255 * 0.2));
-const defaultRemoveColor = Color.fromRGBA(new RGBA(255, 0, 0, 255 * 0.2));
-
-export const diffInserted = registerColor('diffEditor.insertedTextBackground', { dark: defaultInsertColor, light: defaultInsertColor, hc: null }, nls.localize('diffEditorInserted', 'Background color for text that got inserted.'));
-export const diffRemoved = registerColor('diffEditor.removedTextBackground', { dark: defaultRemoveColor, light: defaultRemoveColor, hc: null }, nls.localize('diffEditorRemoved', 'Background color for text that got removed.'));
-export const diffInsertedOutline = registerColor('diffEditor.insertedTextBorder', { dark: null, light: null, hc: '#33ff2eff' }, nls.localize('diffEditorInsertedOutline', 'Outline color for the text that got inserted.'));
-export const diffRemovedOutline = registerColor('diffEditor.removedTextBorder', { dark: null, light: null, hc: '#FF008F' }, nls.localize('diffEditorRemovedOutline', 'Outline color for text that got removed.'));
-
 registerThemingParticipant((theme, collector) => {
 	let added = theme.getColor(diffInserted);
 	if (added) {

src/vs/platform/theme/common/colorRegistry.ts

@@ -6,7 +6,7 @@
 
 import platform = require('vs/platform/platform');
 import { IJSONSchema } from 'vs/base/common/jsonSchema';
-import { Color } from 'vs/base/common/color';
+import { Color, RGBA } from 'vs/base/common/color';
 import { ITheme } from 'vs/platform/theme/common/themeService';
 
 import nls = require('vs/nls');
@@ -243,6 +243,18 @@ export const editorHoverBorder = registerColor('editorHoverWidget.border', { lig
  */
 export const editorActiveLinkForeground = registerColor('editorLink.activeForeground', { dark: '#4E94CE', light: Color.blue, hc: Color.cyan }, nls.localize('activeLinkForeground', 'Color of active links.'));
 
+/**
+ * Diff Editor Colors
+ */
+export const defaultInsertColor = Color.fromRGBA(new RGBA(155, 185, 85, 255 * 0.2));
+export const defaultRemoveColor = Color.fromRGBA(new RGBA(255, 0, 0, 255 * 0.2));
+
+export const diffInserted = registerColor('diffEditor.insertedTextBackground', { dark: defaultInsertColor, light: defaultInsertColor, hc: null }, nls.localize('diffEditorInserted', 'Background color for text that got inserted.'));
+export const diffRemoved = registerColor('diffEditor.removedTextBackground', { dark: defaultRemoveColor, light: defaultRemoveColor, hc: null }, nls.localize('diffEditorRemoved', 'Background color for text that got removed.'));
+
+export const diffInsertedOutline = registerColor('diffEditor.insertedTextBorder', { dark: null, light: null, hc: '#33ff2eff' }, nls.localize('diffEditorInsertedOutline', 'Outline color for the text that got inserted.'));
+export const diffRemovedOutline = registerColor('diffEditor.removedTextBorder', { dark: null, light: null, hc: '#FF008F' }, nls.localize('diffEditorRemovedOutline', 'Outline color for text that got removed.'));
+
 // ----- color functions
 
 export function darken(colorValue: ColorValue, factor: number): ColorFunction {

src/vs/workbench/parts/search/browser/media/searchviewlet.css

@@ -203,28 +203,6 @@
 	font-style: italic;
 }
 
-.search-viewlet .checkbox {
-	display: inline-block;
-	visibility: hidden;
-	border: 1px solid rgba(128, 128, 128, 0.5);
-	width: 0;
-	height: 12px;
-	margin-right: 0;
-	position: relative;
-	top: 2px;
-	transition:			width 150ms, margin-right 150ms ease-in;
-}
-
-.search-viewlet .linematch .checkbox.checked {
-	background-position: -66px -150px;
-}
-
-.search-viewlet .select .linematch .checkbox {
-	visibility: visible;
-	width: 12px;
-	margin-right: 4px;
-}
-
 .search-viewlet .query-clear {
 	background: url("action-query-clear.svg") center center no-repeat;
 }
@@ -354,16 +332,8 @@
 	background: url('excludeSettings-dark.svg') center center no-repeat;
 }
 
-.search-viewlet .findInFileMatch,
-.monaco-editor .findInFileMatch {
-	background-color: rgba(234, 92, 0, 0.3);
-	animation-duration: 0;
-	animation-name: inherit !important;
-}
-
 .search-viewlet .replace.findInFileMatch {
 	text-decoration: line-through;
-	background-color: rgba(255, 0, 0, 0.2);
 }
 
 .search-viewlet .findInFileMatch,
@@ -371,45 +341,18 @@
 	white-space: pre;
 }
 
-.search-viewlet .replaceMatch {
-	background-color: rgba(155, 185, 85, 0.5);
-}
-
 .hc-black .monaco-workbench .search-viewlet .replaceMatch,
-.hc-black .monaco-workbench .search-viewlet .findInFileMatch,
-.monaco-editor.hc-black .findInFileMatch {
+.hc-black .monaco-workbench .search-viewlet .findInFileMatch {
 	background: none !important;
-	border: 1px dotted #f38518;
 	box-sizing: border-box;
 }
 
-.hc-black .monaco-workbench .search-viewlet .replace.findInFileMatch {
-	border: 1px dashed #FF008F;
-}
-
-.hc-black .monaco-workbench .search-viewlet .replaceMatch {
-	border: 1px dashed rgb(51, 255, 46);
-}
-
 .monaco-workbench .search-viewlet a.prominent {
 	text-decoration: underline;
 }
 
 /* Theming */
 
-.search-viewlet .highlight {
-	color: black;
-	background-color: rgba(234, 92, 0, 0.3);
-}
-
-.vs .search-viewlet .filematch .name {
-	color: #1E1E1E;
-}
-
-.vs .search-viewlet .monaco-tree.focused .monaco-tree-row.selected .filematch .name {
-	color: #FFF;
-}
-
 .vs .search-viewlet .search-widget .toggle-replace-button:hover {
 	background-color: rgba(0, 0, 0, 0.1) !important;
 }
@@ -426,10 +369,6 @@
 	background-image: url('expando-expanded.svg');
 }
 
-.vs-dark .search-viewlet .monaco-tree .filematch .name {
-	color: #FFF;
-}
-
 .vs-dark .search-viewlet .query-clear {
 	background: url("action-query-clear-dark.svg") center center no-repeat;
 }
@@ -440,7 +379,6 @@
 }
 
 .vs-dark .search-viewlet .message {
-	color: #FFF;
 	opacity: .5;
 }
 

src/vs/workbench/parts/search/browser/searchViewlet.ts

@@ -57,7 +57,7 @@ import { OpenFolderAction, OpenFileFolderAction } from 'vs/workbench/browser/act
 import * as Constants from 'vs/workbench/parts/search/common/constants';
 import { IListService } from 'vs/platform/list/browser/listService';
 import { IThemeService, ITheme, ICssStyleCollector, registerThemingParticipant } from 'vs/platform/theme/common/themeService';
-import { editorFindMatchHighlight } from 'vs/platform/theme/common/colorRegistry';
+import { editorFindMatchHighlight, diffInserted, diffRemoved, diffInsertedOutline, diffRemovedOutline, activeContrastBorder } from 'vs/platform/theme/common/colorRegistry';
 import FileResultsNavigation from 'vs/workbench/browser/fileResultsNavigation';
 import { attachListStyler } from 'vs/platform/theme/common/styler';
 import { IOutputService } from 'vs/workbench/parts/output/common/output';
@@ -1369,9 +1369,35 @@ export class SearchViewlet extends Viewlet {
 }
 
 registerThemingParticipant((theme: ITheme, collector: ICssStyleCollector) => {
-	let matchHighlightColor = theme.getColor(editorFindMatchHighlight);
+	const matchHighlightColor = theme.getColor(editorFindMatchHighlight);
 	if (matchHighlightColor) {
-		collector.addRule(`.search-viewlet .findInFileMatch { background-color: ${matchHighlightColor}; }`);
-		collector.addRule(`.search-viewlet .highlight { background-color: ${matchHighlightColor}; }`);
+		collector.addRule(`.monaco-workbench .search-viewlet .findInFileMatch { background-color: ${matchHighlightColor}; }`);
+	}
+
+	const diffInsertedColor = theme.getColor(diffInserted);
+	if (diffInsertedColor) {
+		collector.addRule(`.monaco-workbench .search-viewlet .replaceMatch { background-color: ${diffInsertedColor}; }`);
+	}
+
+	const diffRemovedColor = theme.getColor(diffRemoved);
+	if (diffRemovedColor) {
+		collector.addRule(`.monaco-workbench .search-viewlet .replace.findInFileMatch { background-color: ${diffRemovedColor}; }`);
+	}
+
+	const diffInsertedOutlineColor = theme.getColor(diffInsertedOutline);
+	if (diffInsertedOutlineColor) {
+		collector.addRule(`.monaco-workbench .search-viewlet .replaceMatch:not(:empty) { border: 1px dashed ${diffInsertedOutlineColor}; }`);
+	}
+
+	const diffRemovedOutlineColor = theme.getColor(diffRemovedOutline);
+	if (diffRemovedOutlineColor) {
+		collector.addRule(`.monaco-workbench .search-viewlet .replace.findInFileMatch { border: 1px dashed ${diffRemovedOutlineColor}; }`);
+	}
+
+	const activeContrastBorderColor = theme.getColor(activeContrastBorder);
+	if (activeContrastBorderColor) {
+		collector.addRule(`
+			.monaco-workbench .search-viewlet .findInFileMatch { border: 1px dashed ${activeContrastBorderColor}; }
+		`);
 	}
 });
\ No newline at end of file