Inconsistency in EditorView.theme

v6
1

I’m trying to dynamically change the character color in the editor theme (yes, there are topics on that. I will read them but this is not the reason of this topic).
The " Example: Styling" page suggest to use the selectors “&light” and “&dark”. But if I use them this way:

        const myTheme = EditorView.theme({
            "&": {
                // color: appTheme === "dark" ? "#DDD" : "#222",
                fontSize: "110%",
                fontFamily: "'Roboto Mono',Consolas,monospace"
            },
            "&light .cm-content": {
                color: "#222"
            },
            "&dark .cm-content": {
                color: "#DDD"
            },
            . . .
         });

I receive the error: Unhandled rejection RangeError: Unsupported selector: &light

The workaround is to remove the &light and &dark lines and uncomment the line in &.
What I’m doing wrong?
Thanks!
mario

2

&light/&dark are supported only in baseTheme, not in theme.

1 Like