diff --git a/src/editor/codemirror-setup.js b/src/editor/codemirror-setup.js index 8e25508..ff5214b 100644 --- a/src/editor/codemirror-setup.js +++ b/src/editor/codemirror-setup.js @@ -33,6 +33,19 @@ const { } = require('@codemirror/language'); const { oneDark } = require('@codemirror/theme-one-dark'); +// Custom theme for JetBrains Mono font +const jetBrainsMonoTheme = EditorView.theme({ + '&': { + fontFamily: "'JetBrains Mono', 'Fira Code', 'SF Mono', Monaco, 'Courier New', monospace" + }, + '.cm-content': { + fontFamily: 'inherit' + }, + '.cm-scroller': { + fontFamily: 'inherit' + } +}); + /** * Create a CodeMirror 6 editor instance. * @@ -64,6 +77,7 @@ function createEditor(parentElement, options = {}) { highlightSelectionMatches(), autocompletion(), foldGutter(), + jetBrainsMonoTheme, keymap.of([ ...defaultKeymap, ...historyKeymap, diff --git a/src/styles.css b/src/styles.css index 120d286..ba2b24a 100644 --- a/src/styles.css +++ b/src/styles.css @@ -209,7 +209,7 @@ body { width: 100%; height: 100%; padding: 20px; - font-family: 'SF Mono', Monaco, 'Courier New', monospace; + font-family: 'JetBrains Mono', 'Fira Code', 'SF Mono', Monaco, 'Courier New', monospace; font-size: 15px; line-height: 1.6; border: none; @@ -253,7 +253,7 @@ body { width: 100%; height: 100%; padding: 20px; - font-family: 'SF Mono', Monaco, 'Courier New', monospace; + font-family: 'JetBrains Mono', 'Fira Code', 'SF Mono', Monaco, 'Courier New', monospace; font-size: 15px; line-height: 1.6; border: none; @@ -533,7 +533,7 @@ body[class*="dark"] .bottom-panel-title { color: #ccc; } background-color: #f6f8fa; border: 1px solid #d0d7de; border-radius: 6px; - font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace; + font-family: 'JetBrains Mono', 'Fira Code', ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace; color: #24292f; }