diff --git a/assets/js/cell/live_editor.js b/assets/js/cell/live_editor.js index 8a4559416..255e01248 100644 --- a/assets/js/cell/live_editor.js +++ b/assets/js/cell/live_editor.js @@ -162,7 +162,7 @@ class LiveEditor { renderLineHighlight: "none", theme: "custom", fontFamily: "JetBrains Mono, Droid Sans Mono, monospace", - fontSize: 14, + fontSize: settings.editor_font_size, tabIndex: -1, tabSize: 2, autoIndent: true, diff --git a/assets/js/editor_settings/index.js b/assets/js/editor_settings/index.js index 2b3d89134..eb9363f02 100644 --- a/assets/js/editor_settings/index.js +++ b/assets/js/editor_settings/index.js @@ -1,4 +1,8 @@ -import { loadLocalSettings, storeLocalSettings } from "../lib/settings"; +import { + loadLocalSettings, + storeLocalSettings, + EDITOR_FONT_SIZE, +} from "../lib/settings"; /** * A hook for the editor settings. @@ -17,9 +21,14 @@ const EditorSettings = { const editorAutoSignatureCheckbox = this.el.querySelector( `[name="editor_auto_signature"][value="true"]` ); + const editorFontSizeCheckbox = this.el.querySelector( + `[name="editor_font_size"][value="true"]` + ); editorAutoCompletionCheckbox.checked = settings.editor_auto_completion; editorAutoSignatureCheckbox.checked = settings.editor_auto_signature; + editorFontSizeCheckbox.checked = + settings.editor_font_size === EDITOR_FONT_SIZE.large ? true : false; editorAutoCompletionCheckbox.addEventListener("change", (event) => { storeLocalSettings({ editor_auto_completion: event.target.checked }); @@ -28,6 +37,14 @@ const EditorSettings = { editorAutoSignatureCheckbox.addEventListener("change", (event) => { storeLocalSettings({ editor_auto_signature: event.target.checked }); }); + + editorFontSizeCheckbox.addEventListener("change", (event) => { + storeLocalSettings({ + editor_font_size: event.target.checked + ? EDITOR_FONT_SIZE.large + : EDITOR_FONT_SIZE.normal, + }); + }); }, }; diff --git a/assets/js/lib/settings.js b/assets/js/lib/settings.js index 98fd73dc5..6375b6afa 100644 --- a/assets/js/lib/settings.js +++ b/assets/js/lib/settings.js @@ -1,8 +1,14 @@ const SETTINGS_KEY = "livebook:settings"; +export const EDITOR_FONT_SIZE = { + normal: 14, + large: 16, +}; + const DEFAULT_SETTINGS = { editor_auto_completion: true, editor_auto_signature: true, + editor_font_size: EDITOR_FONT_SIZE.normal, }; /** diff --git a/lib/livebook_web/live/settings_live.ex b/lib/livebook_web/live/settings_live.ex index f28b4a95c..db9e9ec59 100644 --- a/lib/livebook_web/live/settings_live.ex +++ b/lib/livebook_web/live/settings_live.ex @@ -111,6 +111,10 @@ defmodule LivebookWeb.SettingsLive do name="editor_auto_signature" label="Show function signature while typing" checked={false} /> + <.switch_checkbox + name="editor_font_size" + label="Increase font size" + checked={false} />