diff --git a/build/vite/index.html b/build/vite/index.html index c3a0e36b8ef5c..3b05ff64c35da 100644 --- a/build/vite/index.html +++ b/build/vite/index.html @@ -1,6 +1,12 @@ + + + + + Monaco Playground +

Use the Playground Launch Config for a better dev experience

diff --git a/build/vite/index.ts b/build/vite/index.ts index b852612bc66ef..377033f2c7abe 100644 --- a/build/vite/index.ts +++ b/build/vite/index.ts @@ -11,6 +11,14 @@ import './style.css'; import * as monaco from '../../src/vs/editor/editor.main'; globalThis.monaco = monaco; + +// Enable automatic dark mode for accessibility. +const dark = matchMedia('(prefers-color-scheme: dark)'); +monaco.editor.setTheme(dark.matches ? 'vs-dark' : 'vs-light'); +dark.addEventListener('change', () => { + monaco.editor.setTheme(dark.matches ? 'vs-dark' : 'vs-light'); +}); + const root = document.getElementById('sampleContent'); if (root) { const d = monaco.editor.createDiffEditor(root);