Theme, & and cm-editor

1

Hi,

I am confused by the & rule when defining a theme. What is the difference with the cm-editor class? When I inspect the DOM, I see a div element that has the cm-editor class and two generated CSS class. I don’t see any outer element with a generated class fomr CodeMirror. Am I missing something? Or is the documentation about theming outdated?

Another question: can I add selectors of elements that are not from CodeMirror in the the rules defining the theme? Something like:

export const myTheme = EditorView.theme({
  '.jp-CodeMirrorEditor[data-type=\'inline\'] .cm-cursor': {
    // rules
  }
})
2

& can be used to explicitly provide the place where the generated class is put. Unless you’re styling the cm-editor element, or some ancestor of it, you don’t need it.

Yes, if you use the & to indicate where the editor element would appear in your rule.

3

Ok, thanks!