Add css variables with editor font settings

[mjbvz]

There's a fair number of places in our UX code that want to render code in the same font that's used in the editor. Currently this is done with code such as:

const fontInfo = this.editor.getOption(EditorOption.fontInfo);
element.style.fontSize = `${fontInfo.fontSize}px`;
element.style.lineHeight = `${fontInfo.lineHeight / fontInfo.fontSize}`;

Instead I think we can use css variables for this. This should reduce duplicate code and also fix a few places where we don't correctly watch for editor config change to force re-rendering of UI elements

[aeschli]

I'm not the right owner for this, fonts are not covered by theming. For the editor font this probably needs to be done in Editor land.