[themes] confusing alignment of file in folders in folder-less themes. Fixes #11762

src/vs/workbench/parts/files/browser/media/collapsed-dark.svg

+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="#E8E8E8" d="M6 4v8l4-4-4-4zm1 2.414L8.586 8 7 9.586V6.414z"/></svg>
\ No newline at end of file

src/vs/workbench/parts/files/browser/media/collapsed-hc.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path fill="#fff" d="M6 4v8l4-4-4-4zm1 2.414l1.586 1.586-1.586 1.586v-3.172z"/></svg>
\ No newline at end of file

src/vs/workbench/parts/files/browser/media/collapsed.svg

+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="#646465" d="M6 4v8l4-4-4-4zm1 2.414L8.586 8 7 9.586V6.414z"/></svg>
\ No newline at end of file

src/vs/workbench/parts/files/browser/media/expanded-dark.svg

+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="#E8E8E8" d="M11 10H5.344L11 4.414V10z"/></svg>
\ No newline at end of file

src/vs/workbench/parts/files/browser/media/expanded-hc.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path fill="#fff" d="M11 10.07h-5.656l5.656-5.656v5.656z"/></svg>
\ No newline at end of file

src/vs/workbench/parts/files/browser/media/expanded.svg

+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="#646465" d="M11 10H5.344L11 4.414V10z"/></svg>
\ No newline at end of file

src/vs/workbench/parts/files/browser/media/explorerviewlet.css

@@ -48,6 +48,48 @@
 	visibility: hidden;
 }
 
+.explorer-folders-view .monaco-tree-row > .content {
+	display: inline-block;
+}
+
+.explorer-folders-view .monaco-tree-row::before {
+	/* svg icons rendered as background image */
+	background-size: 16px;
+	background-position: left center;
+	background-repeat: no-repeat;
+	padding-right: 6px;
+	width: 16px;
+	height: 22px;
+	display: inline-block;
+	vertical-align: top;
+	content: ' ';
+}
+
+.explorer-folders-view .monaco-tree-row.has-children.expanded::before {
+	background-image: url("expanded.svg");
+}
+
+.explorer-folders-view .monaco-tree-row.has-children::before {
+	display: inline-block;
+	background-image: url("collapsed.svg");
+}
+
+.vs-dark .explorer-folders-view .monaco-tree-row.has-children.expanded::before {
+	background-image: url("expanded-dark.svg");
+}
+
+.vs-dark .explorer-folders-view .monaco-tree-row.has-children::before {
+	background-image: url("collapsed-dark.svg");
+}
+
+.hc-black .explorer-folders-view .monaco-tree-row.has-children.expanded::before {
+	background-image: url("expanded-hc.svg");
+}
+
+.hc-black .explorer-folders-view .monaco-tree-row.has-children::before {
+	background-image: url("collapsed-hc.svg");
+}
+
 .explorer-viewlet .explorer-open-editors .monaco-tree .monaco-tree-row:hover > .content .monaco-action-bar,
 .explorer-viewlet .explorer-open-editors .monaco-tree.focused .monaco-tree-row.focused > .content .monaco-action-bar,
 .explorer-viewlet .explorer-open-editors .monaco-tree .monaco-tree-row > .content.dirty > .monaco-action-bar {

src/vs/workbench/parts/files/browser/views/explorerView.ts

@@ -330,7 +330,9 @@ export class ExplorerView extends CollapsibleViewletView {
 			accessibilityProvider
 		}, {
 				autoExpandSingleChildren: true,
-				ariaLabel: nls.localize('treeAriaLabel', "Files Explorer")
+				ariaLabel: nls.localize('treeAriaLabel', "Files Explorer"),
+				twistiePixels: 16,
+				showTwistie: false
 			});
 
 		this.toDispose.push(lifecycle.toDisposable(() => renderer.dispose()));

src/vs/workbench/services/themes/electron-browser/themeService.ts

@@ -481,6 +481,10 @@ function _loadIconThemeDocument(fileSetPath: string): TPromise<IconThemeDocument
 }
 
 function _processIconThemeDocument(id: string, iconThemeDocumentPath: string, iconThemeDocument: IconThemeDocument): string {
+
+	let hasFolderIcons = false;
+	let hasIconAssociations = false;
+
 	if (!iconThemeDocument.iconDefinitions) {
 		return '';
 	}
@@ -498,6 +502,7 @@ function _processIconThemeDocument(id: string, iconThemeDocumentPath: string, ic
 					list = selectorByDefinitionId[defId] = [];
 				}
 				list.push(selector);
+				hasIconAssociations = true;
 			}
 		}
 		if (associations) {
@@ -512,18 +517,25 @@ function _processIconThemeDocument(id: string, iconThemeDocumentPath: string, ic
 			addSelector(`${qualifier} ${expanded} .folder-icon::before`, associations.folderExpanded);
 			addSelector(`${qualifier} .file-icon::before`, associations.file);
 
+			if (associations.folder || associations.folderExpanded) {
+				hasFolderIcons = true;
+			}
+
 			let folderNames = associations.folderNames;
 			if (folderNames) {
 				for (let folderName in folderNames) {
 					addSelector(`${qualifier} .${escapeCSS(folderName.toLowerCase())}-name-folder-icon.folder-icon::before`, folderNames[folderName]);
+					hasFolderIcons = true;
 				}
 			}
 			let folderNamesExpanded = associations.folderNamesExpanded;
 			if (folderNamesExpanded) {
 				for (let folderName in folderNamesExpanded) {
 					addSelector(`${qualifier} ${expanded} .${escapeCSS(folderName.toLowerCase())}-name-folder-icon.folder-icon::before`, folderNamesExpanded[folderName]);
+					hasFolderIcons = true;
 				}
 			}
+
 			let languageIds = associations.languageIds;
 			if (languageIds) {
 				for (let languageId in languageIds) {
@@ -561,8 +573,17 @@ function _processIconThemeDocument(id: string, iconThemeDocumentPath: string, ic
 	collectSelectors(iconThemeDocument.light, '.vs');
 	collectSelectors(iconThemeDocument.highContrast, '.hc-black');
 
+	if (!hasIconAssociations) {
+		return '';
+	}
+
 	let cssRules: string[] = [];
 
+	if (!hasFolderIcons) {
+		// as we only show file icons, unindent rows representing files
+		cssRules.push(`.explorer-folders-view .monaco-tree-row::before { display: none; }`);
+	}
+
 	let fonts = iconThemeDocument.fonts;
 	if (Array.isArray(fonts)) {
 		fonts.forEach(font => {