From 7c69d58bc3a15b61957469cd5b5dd24bbe803c75 Mon Sep 17 00:00:00 2001 From: silverwind Date: Fri, 7 Jan 2022 03:35:07 +0100 Subject: [PATCH 1/2] Fix CSS specificity issue with easymde's css PR #18069 introduced a regression in certain overwritten editor styles because the dynamic loading of easymde.min.css causes its's style to apply after our supposed override styles. Solve this by bundling the styles into index.css. We should later aim to completely replace easymde.min.css completely with our own styles so there are no more conflicts. --- web_src/js/features/comp/EasyMDE.js | 2 +- webpack.config.js | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/web_src/js/features/comp/EasyMDE.js b/web_src/js/features/comp/EasyMDE.js index d5c1a4c7343f6..704a21942465c 100644 --- a/web_src/js/features/comp/EasyMDE.js +++ b/web_src/js/features/comp/EasyMDE.js @@ -25,10 +25,10 @@ export async function importEasyMDE() { // https://github.com/codemirror/CodeMirror/issues/5484 // https://github.com/codemirror/CodeMirror/issues/4838 + // easymde's css is loaded via webpack config const [{default: EasyMDE}, {default: CodeMirror}] = await Promise.all([ import(/* webpackChunkName: "easymde" */'easymde'), import(/* webpackChunkName: "codemirror" */'codemirror'), - import(/* webpackChunkName: "easymde" */'easymde/dist/easymde.min.css'), ]); // CodeMirror plugins must be loaded by a "Plain browser env" diff --git a/webpack.config.js b/webpack.config.js index b3887f723d0a2..5736615e604d3 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -46,6 +46,7 @@ export default { resolve(__dirname, 'web_src/js/jquery.js'), resolve(__dirname, 'web_src/fomantic/build/semantic.js'), resolve(__dirname, 'web_src/js/index.js'), + resolve(__dirname, 'node_modules/easymde/dist/easymde.min.css'), resolve(__dirname, 'web_src/fomantic/build/semantic.css'), resolve(__dirname, 'web_src/less/misc.css'), resolve(__dirname, 'web_src/less/index.less'), From 2380d7ee60768c2550e078a9d925471c2077a7eb Mon Sep 17 00:00:00 2001 From: wxiaoguang Date: Fri, 7 Jan 2022 12:00:23 +0800 Subject: [PATCH 2/2] Update web_src/js/features/comp/EasyMDE.js --- web_src/js/features/comp/EasyMDE.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web_src/js/features/comp/EasyMDE.js b/web_src/js/features/comp/EasyMDE.js index 704a21942465c..922d03d396197 100644 --- a/web_src/js/features/comp/EasyMDE.js +++ b/web_src/js/features/comp/EasyMDE.js @@ -25,7 +25,7 @@ export async function importEasyMDE() { // https://github.com/codemirror/CodeMirror/issues/5484 // https://github.com/codemirror/CodeMirror/issues/4838 - // easymde's css is loaded via webpack config + // EasyMDE's CSS should be loaded via webpack config, otherwise our own styles can not overwrite the default styles. const [{default: EasyMDE}, {default: CodeMirror}] = await Promise.all([ import(/* webpackChunkName: "easymde" */'easymde'), import(/* webpackChunkName: "codemirror" */'codemirror'),