diff --git a/app/src/assets/scss/protyle/_wysiwyg.scss b/app/src/assets/scss/protyle/_wysiwyg.scss index f83466ecd..163495e02 100644 --- a/app/src/assets/scss/protyle/_wysiwyg.scss +++ b/app/src/assets/scss/protyle/_wysiwyg.scss @@ -572,7 +572,7 @@ .protyle .protyle-wysiwyg { .li[data-subtype="o"] > .protyle-action, .li[data-subtype="u"] > .protyle-action, - &[contenteditable="true"] .li[data-subtype="t"] > .protyle-action { + &[data-readonly="true"] .li[data-subtype="t"] > .protyle-action { cursor: pointer; &:hover { @@ -586,7 +586,7 @@ } // 导出 html 不需要编辑样式 -.protyle-wysiwyg[contenteditable="true"] { +.protyle-wysiwyg[data-readonly="false"] { span[data-type~="inline-math"], span[data-type~="tag"], span[data-type~="block-ref"], @@ -632,7 +632,7 @@ } .protyle-wysiwyg:not([contenteditable]), -.protyle-wysiwyg[contenteditable="false"] { +.protyle-wysiwyg[data-readonly="true"] { .img:hover .protyle-icons { display: none; } diff --git a/app/src/protyle/util/onGet.ts b/app/src/protyle/util/onGet.ts index d06015b77..0a789f426 100644 --- a/app/src/protyle/util/onGet.ts +++ b/app/src/protyle/util/onGet.ts @@ -304,6 +304,8 @@ export const disabledProtyle = (protyle: IProtyle) => { }); protyle.wysiwyg.element.style.userSelect = "text"; protyle.wysiwyg.element.setAttribute("contenteditable", "false"); + // 用于区分移动端样式 + protyle.wysiwyg.element.setAttribute("data-readonly", "true"); protyle.wysiwyg.element.querySelectorAll('[contenteditable="true"][spellcheck]').forEach(item => { item.setAttribute("contenteditable", "false"); }); @@ -345,6 +347,8 @@ export const enableProtyle = (protyle: IProtyle) => { protyle.wysiwyg.element.setAttribute("contenteditable", "true"); protyle.wysiwyg.element.style.userSelect = ""; } + // 用于区分移动端样式 + protyle.wysiwyg.element.setAttribute("data-readonly", "false"); if (protyle.title) { const titleElement = protyle.title.element.querySelector(".protyle-title__input") as HTMLElement; titleElement.setAttribute("contenteditable", "true");