feat: zoom with scroll and note tabs #909
adrianataetae-coder
started this conversation in
Ideas
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Uh oh!
There was an error while loading. Please reload this page.
Two quality-of-life improvements for the notes and code editors:
1. Zoom with Ctrl+Scroll
Add the ability to zoom in/out of notes and code snippets using
Ctrl + mouse wheel. This scales the entire editor content (text, code blocks, Mermaid diagrams, tables) proportionally.Ctrl+0resets zoom to 1xstore.appNotes editor: Uses CSS
zoomon the editor container.Code editor: Uses
transform: scale()on the CodeMirror element with container height adjustment.2. Note Tabs (Open in new tab)
Add tab support for notes via right-click context menu → "Open in new tab".
store.app.notes.tabsMotivation
When working with long notes or code snippets at larger font sizes, the current zoom (via preferences) is not granular enough. Ctrl+scroll provides a natural, discoverable way to adjust zoom on the fly.
Tabs allow keeping multiple notes open simultaneously without losing context, similar to how browser tabs work.
Implementation
I have a working implementation based on
v5.10.0with:useNotesZoom/useCodeZoomcomposablesuseNoteTabscomposablemain-menu:font-size-resetthat also reset zoom.exebuild tested on WindowsHappy to submit a PR if there's interest.
All reactions