From 088023552e4f2ff4eb98caf335a36fc70fb2d9a8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Felix=20N=C3=BCsse?= Date: Thu, 2 Dec 2021 18:04:36 +0100 Subject: [PATCH 1/2] add 'markdown-it-task-checkbox' dependency to render checkboxes --- package-lock.json | 12 +++++++++++- package.json | 1 + src/components/EditorMarkdownIt.vue | 21 ++++++++++++++++++--- 3 files changed, 30 insertions(+), 4 deletions(-) diff --git a/package-lock.json b/package-lock.json index 837f4690a..342496079 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4,7 +4,6 @@ "requires": true, "packages": { "": { - "name": "notes", "license": "agpl", "dependencies": { "@nextcloud/axios": "^1.7.0", @@ -17,6 +16,7 @@ "diff": "^5.0.0", "easymde": "^2.15.0", "markdown-it": "^12.2.0", + "markdown-it-task-checkbox": "^1.0.6", "vue": "^2.6.14", "vue-fragment": "1.5.1", "vue-material-design-icons": "^4.13.0", @@ -8002,6 +8002,11 @@ "markdown-it": "bin/markdown-it.js" } }, + "node_modules/markdown-it-task-checkbox": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/markdown-it-task-checkbox/-/markdown-it-task-checkbox-1.0.6.tgz", + "integrity": "sha512-7pxkHuvqTOu3iwVGmDPeYjQg+AIS9VQxzyLP9JCg9lBjgPAJXGEkChK6A2iFuj3tS0GV3HG2u5AMNhcQqwxpJw==" + }, "node_modules/markdown-it/node_modules/argparse": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz", @@ -18924,6 +18929,11 @@ } } }, + "markdown-it-task-checkbox": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/markdown-it-task-checkbox/-/markdown-it-task-checkbox-1.0.6.tgz", + "integrity": "sha512-7pxkHuvqTOu3iwVGmDPeYjQg+AIS9VQxzyLP9JCg9lBjgPAJXGEkChK6A2iFuj3tS0GV3HG2u5AMNhcQqwxpJw==" + }, "marked": { "version": "2.1.3", "resolved": "https://registry.npmjs.org/marked/-/marked-2.1.3.tgz", diff --git a/package.json b/package.json index a6d3befa4..4ee707e99 100644 --- a/package.json +++ b/package.json @@ -23,6 +23,7 @@ "diff": "^5.0.0", "easymde": "^2.15.0", "markdown-it": "^12.2.0", + "markdown-it-task-checkbox": "^1.0.6", "vue": "^2.6.14", "vue-fragment": "1.5.1", "vue-material-design-icons": "^4.13.0", diff --git a/src/components/EditorMarkdownIt.vue b/src/components/EditorMarkdownIt.vue index 8e783867b..e563a63ce 100644 --- a/src/components/EditorMarkdownIt.vue +++ b/src/components/EditorMarkdownIt.vue @@ -17,11 +17,19 @@ export default { }, data() { + + const md = new MarkdownIt({ + linkify: true, + }) + + md.use(require('markdown-it-task-checkbox'), { + disabled: true, + liClass: 'task-list-item' + }) + return { html: '', - md: new MarkdownIt({ - linkify: true, - }), + md } }, @@ -127,5 +135,12 @@ export default { & table td:empty::after { content: '\00a0'; } + + .task-list-item { + list-style-type: none; + input { + min-height: initial !important; + } + } } From bd0a04ff1ae0e27754c1950c4c1ebc725476ded4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Felix=20N=C3=BCsse?= Date: Thu, 2 Dec 2021 23:25:59 +0100 Subject: [PATCH 2/2] update styling --- src/components/EditorMarkdownIt.vue | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/components/EditorMarkdownIt.vue b/src/components/EditorMarkdownIt.vue index e563a63ce..e3fd31a4e 100644 --- a/src/components/EditorMarkdownIt.vue +++ b/src/components/EditorMarkdownIt.vue @@ -24,12 +24,12 @@ export default { md.use(require('markdown-it-task-checkbox'), { disabled: true, - liClass: 'task-list-item' + liClass: 'task-list-item', }) return { html: '', - md + md, } }, @@ -141,6 +141,9 @@ export default { input { min-height: initial !important; } + label { + cursor: default; + } } }