uiwjs / react-codemirror

CodeMirror 6 component for React. @codemirror https://uiwjs.github.io/react-codemirror/
https://uiwjs.github.io/react-codemirror/
MIT License
1.5k stars 125 forks source link

How to change the font #636

Open acsses opened 4 months ago

acsses commented 4 months ago

How to change font to one included in google fonts?

jaywcjlove commented 4 months ago

@acsses like this?

.cm-editor {
  font-family: 'Your Desired Font', sans-serif !important; 
}
acsses commented 3 months ago

I tried it, But it didn't work.

and I forget to write my env. my env is blow

jaywcjlove commented 3 months ago

@acsses You can give it a try:

const FontFamilyTheme = EditorView.theme({
  $: {
    fontFamily: "'Your Desired Font', sans-serif !important"
  }
});

<CodeMirror extensions={[FontFamilyTheme]} />;
jaywcjlove commented 3 months ago
const Theme = EditorView.theme({
  ".cm-content": {
    fontFamily: "Menlo, Monaco, Lucida Console, monospace"
  },
});
acsses commented 3 months ago

the later methods work! thank you!