0

I need to display the words in italic within the editor. How can I do that? I didn't find how to set this in the IStandaloneEditorConstructionOptions options when passing it to create only how to specify that with defineTheme() like that:

monaco.editor.defineTheme('placeHolderTheme', {
    base: 'vs-dark',
    inherit: false,
    rules: [
        
        { 
            token: 'my-token',
            foreground: '#311b92',
            fontStyle: 'italic' 
        },
    colors: {
        "editor.background": "#2B2B2B",
        'editor.foreground': '#FFFFFF',
    }
});

but I do need to set the whole text at once. How can do that?

Jack
  • 16,276
  • 55
  • 159
  • 284

1 Answers1

1

Font styles can only be set for syntax tokens in the editor. If you want to set a style for all tokens then define a token with empty match and set it there: https://microsoft.github.io/monaco-editor/playground.html#customizing-the-appearence-tokens-and-colors.

monaco.editor.defineTheme('myCustomTheme', {
    base: 'vs', // can also be vs-dark or hc-black
    inherit: true, // can also be false to completely replace the builtin rules
    rules: [
        { token: '', fontStyle: 'italic' },
        { token: 'comment', foreground: 'ffa500', fontStyle: 'italic underline' },
        { token: 'comment.js', foreground: '008800', fontStyle: 'bold' },
        { token: 'comment.css', foreground: '0000ff' } // will inherit fontStyle from `comment` above
    ],
    colors: {
        'editor.foreground': '#000000'
    }
});

Mike Lischke
  • 48,925
  • 16
  • 119
  • 181
  • i'm using monaco within a reactl application. How do I set to use italic style for example? i did found font family size, etc but not style – Jack Aug 15 '22 at 04:43
  • Your reference to the creation options somehow confused me. See m updated answer. – Mike Lischke Aug 15 '22 at 09:57
  • This is exactly what i'm looking for. I did found about it inhering styles but didn't how to do that with all tokens – Jack Aug 15 '22 at 18:09