change blink cursor

1

Hi,

trying to change the color of the cursor within the area, this way:

const theme = EditorView.theme({
	"&.cm-editor": {
		fontFamily: "Arial, sans-serif !important",
		fontWeight: "bold",
		background: "#2d3748",
		borderRadius: '8px',
		outline: "none",
		fontSize: "14px",
		padding: "6px",
		width: "700px",
		color: "#ffffff",
		caretColor: "#ffffff"
	},
	".cm-content": {
		fontFamily: "var(--bs-body-font-family) !important"
	},
	".cm-cursor": {
		borderLeft: "none",
		backgroundColor: "#ffffff",
		width: "2px"
	}
})

but nothing change: its always black. How can I change to white?

Here’s the version, I’m using bootstrap alongside it:

    "@codemirror/autocomplete": "^6.18.6",
    "@codemirror/commands": "^6.8.0",
    "@codemirror/language": "^6.10.8",
    "@codemirror/state": "^6.5.2",
    "@codemirror/view": "^6.36.4",
    "bootstrap": "^5.3.3",

Thanks

2

I don’t know, that should work. Try to figure out with the browser devtools what the styles are doing.

3

How can I intercept the cursor with devtool?

4

@marijn fixed it: I need to add this to the end of EditorView.theme: }, { dark: true });

Is that normal and desired?