Improve code injection dialog

[guanglinn]

Hello, @gsantner

JavaScript and CSS code injection is a powerful feature for Markor, but the experience of using code injection dialog is very bad.

Related issues:
#2765 - Improve the user experience of code injection dialog

To solve these problems, this PR implemented the following features:

1. Better dialog size;
2. Monospaced font;
3. Syntax highlighting (HTML, CSS and JavaScript);
4. Auto-completion (HTML, CSS and basic JavaScript);
5. Auto-indentation;
6. Code block folding;
7. Bracket and HTML tag matching;
8. Line numbers;
9. Undo redo support;
10. Reset template code button;
11. Better code format;
12. File Browser: Add add an option "favorite first" to FolderSortDialog.

Major features are supported by CodeMirror: https://codemirror.net.
This is limited use of CodeMirror, it is only used in this code editing dialog.
These features can greatly enhance UX.

I learned that Obsidian and GitHub are all using CodeMirror, so it can be proven that CodeMirror is stable for production.

Some great features of CodeMirror:

1. Lightweight and efficient, the size of build files for Markor is only about 500 KB;

2. Multiple language support, see Language Support;

3. Highly customizable styles and themes extensions, see CodeMirror Styling Example;

4. Rich programming interface and extensions, see Extension;

5. Excellent performance and huge document support, see Huge Document Support: load a document with millions of lines;

6. Optimizing for mobile support, use the platform's native selection and editing features on phones;

7. Strong community support;

8. LICENSE.

CodeMirror development and build guidance for Markor

Who is using CodeMirror?

Sponsors

[guanglinn]

Screen recording

SVID_20260316_170402_1.mp4

[guanglinn]

1

Before

Now

---

2

Before

Now

[guanglinn]

Dark theme