Volar (Debug): Show Virtual Files uses hard-coded color with poor contrast

[josh-berry]

Some context: I'm trying to understand why there's a miscompliation/type error happening with one of my Vue components, so I used the Volar (Debug): Show Virtual Files option to look at the generated code. The result is completely unreadable, because Volar seems to use a hard-coded dark blue background color which clashes with any light theme. See screenshot:

This dark-blue color also doesn't seem to be configurable anywhere in Volar's settings. Please make this color configurable (at the very least), or derive a background color from the user's theme colors instead. Thanks!

[johnsoncodehk]

PR is welcome. :)

https://github.com/johnsoncodehk/volar/blob/9ae9323c69f71fcc3dba8641781cff86263716fe/extensions/vscode-vue-language-features/src/features/virtualFiles.ts#L21-L25

[josh-berry]

@Sight-wcg @johnsoncodehk Thank you very much, really appreciate it!