I followed the instructions in this blog post Multiple Fonts: Alternative to Operator Mono in VSCode, but did not see any changes made to VS Code. After digging a bit, I discovered that all the CSS class names had changed. They’re now e.g. .mtk13, .mtk16 { … }
.
- Ensure it’s a file URL e.g.
{ "vscode_custom_css.imports": [ "file:///Users/Brian/Desktop/vscode-style.css" ] }
- If you move the location of your file and update your user settings with the new location, you will need to disable and enable custom CSS cmd+shift+p.
- Also, anytime you change the style in your custom CSS file, you need to disable, then re-enable the extension.
Hello wheldrak3,
How I made it work :)
Update: I wrote a Medium article about how to fix the issues: "Customize Visual Studio Code for Multiple Fonts and styles."
https://medium.com/@rzvdaniel_71068/customize-visual-studio-code-for-multiple-fonts-and-styles-96f83562af58
Install vscode-custom-css extension
https://github.com/be5invis/vscode-custom-css/blob/master/README.md
Without it, the statement "vscode_custom_css.imports" is not recognized as a valid one inside user settings (settings.json)
Make sure vscode-custom-css is enabled after installation
Do this: CTRL + SHIFT + P and then type "Enable Custom CSS and JS" as documented on their official page above.
Make sure you have the font (Brush Script MT)
make sure the path to the custom CSS is like this (for Windows version):
"vscode_custom_css.imports": ["file://C:/Users/daniel/Desktop/styles.css"]
Restart VS Code.
You'll notice that the comments inside Javascript files are now rendered using Brush Script MT font, but some other keywords aren't. This is caused by the constant change in style names for VS Code, as the author of the gist also noted. To fix this, do the following:
For example, I had to add .mtk7 to make "import" statements be rendered with the new font.
I hope it helps,
Razvan