Allow for custom icons for non-file based editors (extensions, keybindings, search, settings)

[Tyriar]

Nice easy polish change to switch to the 4 square icon here:

[Tyriar]

Makes sense for other editors: keybindings, search, settings

[Tyriar]

I was hoping to do this myself and looked into it, but there's no clear way other than CSS with !important which is a hack to assign an icon for. I'm also a little worried I'll cause regressions with how this interacts with icon themes which I have minimal knowledge on, so assigning to respective owners.

For reference the terminal does it by generating CSS in JS and injecting it such that the codicon chars (which could theoretically change) are not hard coded in CSS:

vscode/src/vs/workbench/contrib/terminal/browser/terminalService.ts

Lines 1246 to 1252 in 97082b0

	const iconClasses = getUriClasses(instance, colorTheme.type);
	if (uri instanceof URI && iconClasses && iconClasses.length > 1) {
	css += (
	`.monaco-workbench .terminal-tab.${iconClasses[0]}::before` +
	`{background-image: ${dom.asCSSUrl(uri)};}`
	);
	}

[bpasero]

It seems that @mjbvz started the work on allowing Codicon in tab labels via #92122 to enable #90616. That PR had ongoing discussions and is still draft, but maybe some of the changes can be taken for consideration.

[benibenj]

Verification steps:

1. open following editors: Settings editor, Keyboard shortcut editor, multi diff editor and an extension view (the view with the info about an extension) in the editor
2. you should be seeing a different icon (non default) for each editor in the tab bar, open editors view and quick pick