Added same border color as panel border , added image preview border color in theme

skprabhanjan · skprabhanjan · commit ffc49d532469 · 2019-07-03T14:54:55.000+05:30
diff --git a/src/vs/workbench/browser/parts/editor/media/resourceviewer.css b/src/vs/workbench/browser/parts/editor/media/resourceviewer.css
@@ -22,7 +22,6 @@
 	padding: 0;
 	background-position: 0 0, 8px 8px;
 	background-size: 16px 16px;
-	border: 1px solid;
 }
 
 .vs .monaco-resource-viewer.image img {
diff --git a/src/vs/workbench/browser/parts/editor/resourceViewer.ts b/src/vs/workbench/browser/parts/editor/resourceViewer.ts
@@ -21,6 +21,8 @@ import { IFileService } from 'vs/platform/files/common/files';
 import { IStatusbarEntry, IStatusbarEntryAccessor, IStatusbarService, StatusbarAlignment } from 'vs/platform/statusbar/common/statusbar';
 import { IEditorService } from 'vs/workbench/services/editor/common/editorService';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { ITheme, registerThemingParticipant, ICssStyleCollector } from 'vs/platform/theme/common/themeService';
+import { IMAGE_PREVIEW_BORDER } from 'vs/workbench/common/theme';
 
 export interface IResourceDescriptor {
 	readonly resource: URI;
@@ -67,6 +69,11 @@ interface ResourceViewerDelegate {
 	metadataClb(meta: string): void;
 }
 
+registerThemingParticipant((theme: ITheme, collector: ICssStyleCollector) => {
+	const borderColor = theme.getColor(IMAGE_PREVIEW_BORDER);
+	collector.addRule(`.monaco-resource-viewer.image img { border : 1px solid ${borderColor ? borderColor.toString() : ''}; }`);
+});
+
 /**
  * Helper to actually render the given resource into the provided container. Will adjust scrollbar (if provided) automatically based on loading
  * progress of the binary resource.
diff --git a/src/vs/workbench/common/theme.ts b/src/vs/workbench/common/theme.ts
@@ -200,7 +200,13 @@ export const EDITOR_DRAG_AND_DROP_BACKGROUND = registerColor('editorGroup.dropBa
 	hc: null
 }, nls.localize('editorDragAndDropBackground', "Background color when dragging editors around. The color should have transparency so that the editor contents can still shine through."));
 
+// < --- Resource Viewer --- >
 
+export const IMAGE_PREVIEW_BORDER = registerColor('imagePreview.border', {
+	dark: Color.fromHex('#808080').transparent(0.35),
+	light: Color.fromHex('#808080').transparent(0.35),
+	hc: contrastBorder
+}, nls.localize('imagePreviewBorder', "Border color for image in image preview."));
 
 // < --- Panels --- >
 

Original file line number	Diff line number	Diff line change
`@@ -22,7 +22,6 @@`
`22`	`22`	`padding: 0;`
`23`	`23`	`background-position: 0 0, 8px 8px;`
`24`	`24`	`background-size: 16px 16px;`
`25`		`- border: 1px solid;`
`26`	`25`	`}`
`27`	`26`
`28`	`27`	`.vs .monaco-resource-viewer.image img {`