Update csl editor theme based on system color scheme
This commit is contained in:
parent
d99ad84d4c
commit
c514f92f9b
1 changed files with 7 additions and 1 deletions
|
@ -33,6 +33,8 @@ var Zotero_CSL_Editor = new function() {
|
|||
|
||||
async function init() {
|
||||
await Zotero.Schema.schemaUpdatePromise;
|
||||
|
||||
const isDarkMQL = Zotero.getMainWindow()?.matchMedia('(prefers-color-scheme: dark)');
|
||||
|
||||
Zotero.Styles.populateLocaleList(document.getElementById("locale-menu"));
|
||||
|
||||
|
@ -65,7 +67,7 @@ var Zotero_CSL_Editor = new function() {
|
|||
let editorWin = document.getElementById("zotero-csl-editor-iframe").contentWindow;
|
||||
let { monaco: _monaco, editor: _editor } = await editorWin.loadMonaco({
|
||||
language: 'xml',
|
||||
theme: 'vs-light'
|
||||
theme: isDarkMQL.matches ? 'vs-dark' : 'vs-light'
|
||||
});
|
||||
monaco = _monaco;
|
||||
editor = _editor;
|
||||
|
@ -78,6 +80,10 @@ var Zotero_CSL_Editor = new function() {
|
|||
// Call asynchronously, see note in Zotero.Styles
|
||||
window.setTimeout(this.onStyleSelected.bind(this, currentStyle.styleID), 1);
|
||||
}
|
||||
|
||||
isDarkMQL.addEventListener("change", (ev) => {
|
||||
monaco.editor.setTheme(ev.matches ? 'vs-dark' : 'vs-light');
|
||||
});
|
||||
}
|
||||
|
||||
this.onStyleSelected = function(styleID) {
|
||||
|
|
Loading…
Add table
Reference in a new issue