Fix #46519 - search result count badges should remain left-aligned in a narrow search view

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

@@ -179,6 +179,11 @@
 	padding: 0;
 }
 
+.search-view:not(.wide) .foldermatch .monaco-icon-label,
+.search-view:not(.wide) .filematch .monaco-icon-label {
+	flex: 1;
+}
+
 .search-view .monaco-tree .monaco-tree-row:hover:not(.highlighted) .foldermatch .monaco-icon-label,
 .search-view .monaco-tree .monaco-tree-row.focused .foldermatch .monaco-icon-label,
 .search-view .monaco-tree .monaco-tree-row:hover:not(.highlighted) .filematch .monaco-icon-label,
@@ -193,8 +198,8 @@
 	margin-left: 0.8em;
 }
 
-.search-view .foldermatch .badge,
-.search-view .filematch .badge {
+.search-view.wide .foldermatch .badge,
+.search-view.wide .filematch .badge {
 	margin-left: 10px;
 }
 

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

@@ -69,6 +69,9 @@ export class SearchView extends Viewlet implements IViewlet, IPanel {
 	private static readonly MAX_TEXT_RESULTS = 10000;
 	private static readonly SHOW_REPLACE_STORAGE_KEY = 'vs.search.show.replace';
 
+	private static readonly WIDE_CLASS_NAME = 'wide';
+	private static readonly WIDE_VIEW_SIZE = 600;
+
 	private isDisposed: boolean;
 
 	private queryBuilder: QueryBuilder;
@@ -748,6 +751,12 @@ export class SearchView extends Viewlet implements IViewlet, IPanel {
 			return;
 		}
 
+		if (this.size.width >= SearchView.WIDE_VIEW_SIZE) {
+			this.getContainer().addClass(SearchView.WIDE_CLASS_NAME);
+		} else {
+			this.getContainer().removeClass(SearchView.WIDE_CLASS_NAME);
+		}
+
 		this.searchWidget.setWidth(this.size.width - 28 /* container margin */);
 
 		this.inputPatternIncludes.setWidth(this.size.width - 28 /* container margin */);