amitwh/markdown-converter
1
0
Fork 0
mirror of https://github.com/amitwh/markdown-converter.git synced 2026-08-02 18:10:18 +05:30
Code Issues Packages Projects Releases Wiki Activity

feat: apply JetBrains Mono font to editor and preview code

Browse Source 
- Add custom EditorView.theme for CodeMirror 6 with JetBrains Mono
- Update .editor-textarea and #editor font-family to prioritize JetBrains Mono
- Update preview code blocks (#preview code, .preview-content code) to use JetBrains Mono
- Ensures consistent monospace font across editor source and markdown rendering

Amit Haridas
This commit is contained in:
amitwh
2026-03-15 08:39:53 +05:30
parent d1c2c1c109
commit 95ea870039
2 changed files with 17 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/editor/codemirror-setup.js
+14
View File
@@ -33,6 +33,19 @@ const {
} = require('@codemirror/language'); } = require('@codemirror/language');
const { oneDark } = require('@codemirror/theme-one-dark'); 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. * Create a CodeMirror 6 editor instance.
* *
@@ -64,6 +77,7 @@ function createEditor(parentElement, options = {}) {
highlightSelectionMatches(), highlightSelectionMatches(),
autocompletion(), autocompletion(),
foldGutter(), foldGutter(),
jetBrainsMonoTheme,
keymap.of([ keymap.of([
...defaultKeymap, ...defaultKeymap,
...historyKeymap, ...historyKeymap,
src/styles.css
+3 -3
View File
@@ -209,7 +209,7 @@ body {
width: 100%; width: 100%;
height: 100%; height: 100%;
padding: 20px; 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; font-size: 15px;
line-height: 1.6; line-height: 1.6;
border: none; border: none;
@@ -253,7 +253,7 @@ body {
width: 100%; width: 100%;
height: 100%; height: 100%;
padding: 20px; 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; font-size: 15px;
line-height: 1.6; line-height: 1.6;
border: none; border: none;
@@ -533,7 +533,7 @@ body[class*="dark"] .bottom-panel-title { color: #ccc; }
background-color: #f6f8fa; background-color: #f6f8fa;
border: 1px solid #d0d7de; border: 1px solid #d0d7de;
border-radius: 6px; 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; color: #24292f;
} }