Skip to content

Instantly share code, notes, and snippets.

@jmahc
Last active November 6, 2019 23:07
Show Gist options
  • Save jmahc/4e92cbb66ad2005c2ae737c5d093d148 to your computer and use it in GitHub Desktop.
Save jmahc/4e92cbb66ad2005c2ae737c5d093d148 to your computer and use it in GitHub Desktop.
VS Code Solution for Fira Code and Flottflott - based on the Medium article: https://medium.com/@docodemore/an-alternative-to-operator-mono-font-6e5d040e1c7e#.jq6tb618c
// `File > Preferences > User Settings`(WINDOWS)
// Place your settings in this file to overwrite the default settings
{
"editor.fontSize": 14,
"editor.fontFamily": "'Fira Code', Consolas, 'Courier New', monospace",
"editor.fontLigatures": true,
"editor.fontWeight": "normal",
"editor.tabSize": 2,
"editor.formatOnSave": true,
"editor.wrappingColumn": 95,
"workbench.editor.showIcons": true
}
/* Paste this line of CSS at the END of the minified CSS file found in:
C:\Program Files (x86)\Microsoft VS Code\resources\app\out\vs\workbench\electron-browser\workbench.main.css
*/
div.monaco-editor.vs-dark { text-rendering: optimizeLegibility } .editor-container[data-mode-id~="javascript"] .storage, .editor-container[data-mode-id~="javascriptreact"] .storage, .editor-container[data-mode-id~="javascript"] .type .function, .editor-container[data-mode-id~="javascriptreact"] .type .function { vertical-align: baseline; font-family: 'flottflott'; height: inherit; font-size: 24px; line-height: 16px } .editor-container[data-mode-id~="javascript"] .string.quoted, .editor-container[data-mode-id~="javascriptreact"] .string.quoted, .editor-container[data-mode-id~="javascript"] .string.regexp, .editor-container[data-mode-id~="javascriptreact"] .string.regexp { -webkit-font-feature-settings: "liga" off, "calt" off } .editor-container[data-mode-id~="javascript"] .entity.name, .editor-container[data-mode-id~="javascriptreact"] .entity.name { font-weight: 500 } .editor-container[data-mode-id~="javascript"] .string.unquoted, .editor-container[data-mode-id~="javascriptreact"] .string.unquoted { color: #CDD3DE } .editor-container[data-mode-id~="javascript"] .storage.type.function.arrow.js, .editor-container[data-mode-id~="javascript"] .indent-guide, .editor-container[data-mode-id~="javascript"] .variable, .editor-container[data-mode-id~="javascriptreact"] .storage.type.function.arrow.js, .editor-container[data-mode-id~="javascriptreact"] .indent-guide, .editor-container[data-mode-id~="javascriptreact"] .variable { font-family: 'Fira Code'; font-style: normal; font-size: 16px; line-height: 24px }
@smoothness
Copy link

Hey thanks;
Did not worked for me, any updates?

@blakethepatton
Copy link

I think with VS you have to use the same theme as the author of the gist. Considering the classnames I thought it might be vs dark, but that didn't make it work for me.

@protoEvangelion
Copy link

Didn't work for me either...

@tieorange
Copy link

Worked for me on VS Code - Insiders

@nachodiazcode
Copy link

in javascript don't work

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment