From: Dan Brown <redacted>
Date: Wed, 23 Mar 2022 11:51:19 +0000 (+0000)
Subject: Updated tasklist style and functionality for cross-browser use
X-Git-Tag: v22.03~1^2~16^2~1
X-Git-Url: http://source.bookstackapp.com/bookstack/commitdiff_plain/883e18f7c4fe474d688b08bbc7d95643f1680a57

Updated tasklist style and functionality for cross-browser use

- Updated styles to better align checkboxes within page content.
- Updated functionality to use a cross-compatible property on checkbox
  click within the editor.
---

diff --git a/resources/js/wysiwyg/plugins-tasklist.js b/resources/js/wysiwyg/plugins-tasklist.js
index 2dd6528e1..5b0e1c1f0 100644
--- a/resources/js/wysiwyg/plugins-tasklist.js
+++ b/resources/js/wysiwyg/plugins-tasklist.js
@@ -84,9 +84,10 @@ function register(editor, url) {
 
     // Handle checkbox click in editor
     editor.on('click', function(event) {
-        const clickedEl = event.originalTarget;
+        const clickedEl = event.target;
         if (clickedEl.nodeName === 'LI' && clickedEl.classList.contains('task-list-item')) {
             handleTaskListItemClick(event, clickedEl, editor);
+            event.preventDefault();
         }
     });
 }
diff --git a/resources/sass/_pages.scss b/resources/sass/_pages.scss
index 8103ca20d..73819975f 100755
--- a/resources/sass/_pages.scss
+++ b/resources/sass/_pages.scss
@@ -164,6 +164,11 @@ body.tox-fullscreen, body.markdown-fullscreen {
     clear: both;
   }
 
+  li > input[type="checkbox"] {
+    vertical-align: top;
+    margin-top: 0.3em;
+  }
+
   p:empty {
     min-height: 1.6em;
   }