1
0
mirror of https://github.com/laurent22/joplin.git synced 2025-01-26 18:58:21 +02:00

Desktop: Fixed vim mode issue where status bar was not visible (#3606)

This commit is contained in:
Caleb John 2020-08-08 03:15:01 -06:00 committed by GitHub
parent e1144c098e
commit 0eedae1f62
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 86 additions and 6 deletions

View File

@ -276,6 +276,85 @@ function CodeMirror(props: NoteBodyEditorProps, ref: any) {
menu.popup(bridge().window());
}, [props.content, editorCutText, editorPasteText, editorCopyText, onEditorPaste]);
const loadScript = async (script:any) => {
return new Promise((resolve) => {
let element:any = document.createElement('script');
if (script.src.indexOf('.css') >= 0) {
element = document.createElement('link');
element.rel = 'stylesheet';
element.href = script.src;
} else {
element.src = script.src;
if (script.attrs) {
for (const attr in script.attrs) {
element[attr] = script.attrs[attr];
}
}
}
element.id = script.id;
element.onload = () => {
resolve();
};
document.getElementsByTagName('head')[0].appendChild(element);
});
};
useEffect(() => {
let cancelled = false;
async function loadScripts() {
const scriptsToLoad:{src: string, id:string, loaded: boolean}[] = [
{
src: 'node_modules/codemirror/lib/codemirror.css',
id: 'codemirrorBaseStyle',
loaded: false,
},
{
src: 'node_modules/codemirror/addon/dialog/dialog.css',
id: 'codemirrorDialogStyle',
loaded: false,
},
];
// The default codemirror theme is defined in codemirror.css
// and doesn't have an extra css file
if (styles.editor.codeMirrorTheme !== 'default') {
// Solarized light and solarized dark are loaded by the single
// solarized.css file
let theme = styles.editor.codeMirrorTheme;
if (theme.indexOf('solarized') >= 0) theme = 'solarized';
scriptsToLoad.push({
src: `node_modules/codemirror/theme/${theme}.css`,
id: `codemirrorTheme${theme}`,
loaded: false,
});
}
for (const s of scriptsToLoad) {
if (document.getElementById(s.id)) {
s.loaded = true;
continue;
}
await loadScript(s);
if (cancelled) return;
s.loaded = true;
}
}
loadScripts();
return () => {
cancelled = true;
};
}, [styles.editor.codeMirrorTheme]);
useEffect(() => {
const element = document.createElement('style');
element.setAttribute('id', 'codemirrorStyle');
@ -334,6 +413,13 @@ function CodeMirror(props: NoteBodyEditorProps, ref: any) {
box-sizing: border-box;
opacity: .5;
}
/* We need to use important to override theme specific values */
.cm-error {
color: inherit !important;
background-color: inherit !important;
border-bottom: 1px dotted #dc322f;
}
`));
return () => {

View File

@ -12,12 +12,6 @@
<link rel="stylesheet" href="node_modules/@fortawesome/fontawesome-free/css/all.min.css">
<link rel="stylesheet" href="node_modules/react-datetime/css/react-datetime.css">
<link rel="stylesheet" href="node_modules/smalltalk/css/smalltalk.css">
<link rel="stylesheet" href="node_modules/codemirror/lib/codemirror.css">
<link rel="stylesheet" href="node_modules/codemirror/theme/dracula.css">
<link rel="stylesheet" href="node_modules/codemirror/theme/monokai.css">
<link rel="stylesheet" href="node_modules/codemirror/theme/solarized.css">
<link rel="stylesheet" href="node_modules/codemirror/theme/nord.css">
<link rel="stylesheet" href="node_modules/codemirror/theme/material-darker.css">
<style>
.smalltalk {