Allow to theme editor scroll shadow (fixes #25528)

src/vs/editor/browser/viewParts/scrollDecoration/scrollDecoration.css

@@ -8,13 +8,4 @@
 	top: 0;
 	left: 0;
 	height: 6px;
-	box-shadow: #DDD 0 6px 6px -6px inset;
-}
-
-.monaco-editor.vs-dark .scroll-decoration {
-	box-shadow: #000 0 6px 6px -6px inset;
-}
-
-.monaco-editor.hc-black .scroll-decoration {
-	box-shadow: none;
 }
\ No newline at end of file

src/vs/editor/browser/viewParts/scrollDecoration/scrollDecoration.ts

@@ -11,6 +11,8 @@ import { ViewPart } from 'vs/editor/browser/view/viewPart';
 import { ViewContext } from 'vs/editor/common/view/viewContext';
 import { RenderingContext, RestrictedRenderingContext } from 'vs/editor/common/view/renderingContext';
 import * as viewEvents from 'vs/editor/common/view/viewEvents';
+import { registerThemingParticipant } from "vs/platform/theme/common/themeService";
+import { scrollbarShadow } from "vs/platform/theme/common/colorRegistry";
 
 export class ScrollDecorationViewPart extends ViewPart {
 
@@ -86,3 +88,10 @@ export class ScrollDecorationViewPart extends ViewPart {
 		this._domNode.setClassName(this._shouldShow ? 'scroll-decoration' : '');
 	}
 }
+
+registerThemingParticipant((theme, collector) => {
+	let shadow = theme.getColor(scrollbarShadow);
+	if (shadow) {
+		collector.addRule(`.monaco-editor .scroll-decoration { box-shadow: ${shadow} 0 6px 6px -6px inset; }`);
+	}
+});
\ No newline at end of file

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

@@ -1958,7 +1958,6 @@ export const diffRemoved = registerColor('diffEditor.removedTextBackground', { d
 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/workbench/parts/preferences/browser/media/preferences.css

@@ -135,14 +135,6 @@
 	padding-left:10px;
 }
 
-.vs-dark .preferences-editor .side-by-side-preferences-editor > .editable-preferences-editor-container {
-	box-shadow: -6px 0 5px -5px black;
-}
-
-.preferences-editor .side-by-side-preferences-editor > .editable-preferences-editor-container {
-	box-shadow: -6px 0 5px -5px #DDD;
-}
-
 .monaco-editor .settings-group-title-widget {
 	z-index: 1;
 }

src/vs/workbench/parts/preferences/browser/preferencesEditor.ts

@@ -53,6 +53,9 @@ import { FindController } from 'vs/editor/contrib/find/browser/find';
 import { SelectionHighlighter } from 'vs/editor/contrib/find/common/findController';
 import { IEditorOptions } from 'vs/editor/common/config/editorOptions';
 import { KeybindingsRegistry } from 'vs/platform/keybinding/common/keybindingsRegistry';
+import { IThemeService } from "vs/platform/theme/common/themeService";
+import { attachStylerCallback } from "vs/platform/theme/common/styler";
+import { scrollbarShadow } from "vs/platform/theme/common/colorRegistry";
 
 export class PreferencesEditorInput extends SideBySideEditorInput {
 	public static ID: string = 'workbench.editorinputs.preferencesEditorInput';
@@ -329,7 +332,7 @@ class SideBySidePreferencesWidget extends Widget {
 
 	private sash: VSash;
 
-	constructor(parent: HTMLElement, @IInstantiationService private instantiationService: IInstantiationService) {
+	constructor(parent: HTMLElement, @IInstantiationService private instantiationService: IInstantiationService, @IThemeService private themeService: IThemeService) {
 		super();
 		this.create(parent);
 	}
@@ -346,6 +349,15 @@ class SideBySidePreferencesWidget extends Widget {
 
 		this.editablePreferencesEditorContainer = DOM.append(parentElement, DOM.$('.editable-preferences-editor-container'));
 		this.editablePreferencesEditorContainer.style.position = 'absolute';
+		this._register(attachStylerCallback(this.themeService, { scrollbarShadow }, colors => {
+			const shadow = colors.scrollbarShadow ? colors.scrollbarShadow.toString() : null;
+
+			if (shadow) {
+				this.editablePreferencesEditorContainer.style.boxShadow = `-6px 0 5px -5px ${shadow}`;
+			} else {
+				this.editablePreferencesEditorContainer.style.boxShadow = null;
+			}
+		}));
 	}
 
 	public setInput(defaultPreferencesEditorInput: DefaultPreferencesEditorInput, editablePreferencesEditorInput: EditorInput, options?: EditorOptions): TPromise<{ defaultPreferencesRenderer: IPreferencesRenderer<ISetting>, editablePreferencesRenderer: IPreferencesRenderer<ISetting> }> {