1
0
mirror of https://github.com/laurent22/joplin.git synced 2024-11-24 08:12:24 +02:00

Desktop: TinyMCE: Fixed clicking a link within a checkbox label

This commit is contained in:
Laurent Cozic 2020-05-04 23:08:36 +01:00
parent 9a2f0bee29
commit f2a1597ecc
3 changed files with 20 additions and 1 deletions

View File

@ -2103,6 +2103,8 @@
var editorClickHandler = function (event) {
if (!isJoplinChecklistItem(event.target))
return;
if (event.offsetX >= 0)
return;
editor.execCommand('ToggleJoplinChecklistItem', false, { element: event.target });
};
if (options.listType === 'joplinChecklist') {

View File

@ -40,6 +40,20 @@ const listState = function (editor: Editor, listName, options:any = {}) {
const editorClickHandler = (event) => {
if (!isJoplinChecklistItem(event.target)) return;
// We only process the click if it's within the checkbox itself (and not the label).
// That checkbox, based on
// the current styling is in the negative margin, so offsetX is negative when clicking
// on the checkbox itself, and positive when clicking on the label. This is strongly
// dependent on how the checkbox is styled, so if the style is changed, this might need
// to be updated too.
// For the styling, see:
// ReactNativeClient/lib/joplin-renderer/MdToHtml/rules/checkbox.ts
//
// The previous solution was to use "pointer-event: none", which mostly work, however
// it means that links are no longer clickable when they are within the checkbox label.
if (event.offsetX >= 0) return;
editor.execCommand('ToggleJoplinChecklistItem', false, { element: event.target });
}

View File

@ -38,10 +38,13 @@ pluginAssets[2] = function(theme:any) {
mime: 'text/css',
text: `
/* https://stackoverflow.com/questions/7478336/only-detect-click-event-on-pseudo-element#comment39751366_7478344 */
/* Not doing this trick anymore. See Modules/TinyMCE/JoplinLists/src/main/ts/ui/Buttons.ts */
/*
ul.joplin-checklist li {
pointer-events: none;
}
*/
ul.joplin-checklist {
list-style:none;