فهرست منبع

:art: https://github.com/siyuan-note/siyuan/issues/10769

Vanessa 10 ماه پیش
والد
کامیت
f5ddcd2bbb

+ 21 - 26
app/src/assets/scss/component/_typography.scss

@@ -554,36 +554,31 @@
     }
   }
 
-  &-linenumber {
-    border-top-left-radius: 0 !important;
-    border-bottom-left-radius: 0 !important;
+  &-linenumber__rows {
+    pointer-events: none;
+    user-select: none;
+    counter-reset: linenumber;
+    font-size: 85%;
+    box-sizing: border-box;
+    font-family: var(--b3-font-family-code);
+    margin-right: 1em;
+    min-width: 1.2em;
+    text-align: right;
 
-    &__rows {
+    & > span {
       pointer-events: none;
-      user-select: none;
-      counter-reset: linenumber;
-      font-size: 85%;
-      box-sizing: border-box;
-      font-family: var(--b3-font-family-code);
-      margin-right: 1em;
-      min-width: 1.2em;
-      text-align: right;
+      display: block;
 
-      & > span {
-        pointer-events: none;
+      &::before {
+        counter-increment: linenumber;
+        content: counter(linenumber);
+        color: var(--b3-theme-on-surface);
         display: block;
-
-        &::before {
-          counter-increment: linenumber;
-          content: counter(linenumber);
-          color: var(--b3-theme-on-surface);
-          display: block;
-          text-align: right;
-          white-space: nowrap;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          direction: rtl;
-        }
+        text-align: right;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        direction: rtl;
       }
     }
   }

+ 2 - 2
app/src/menus/protyle.ts

@@ -2100,8 +2100,8 @@ export const setFold = (protyle: IProtyle, nodeElement: Element, isOpen?: boolea
         }
         nodeElement.removeAttribute("fold");
         // https://github.com/siyuan-note/siyuan/issues/4411
-        nodeElement.querySelectorAll(".protyle-linenumber").forEach((item: HTMLElement) => {
-            lineNumberRender(item);
+        nodeElement.querySelectorAll(".protyle-linenumber__rows").forEach((item: HTMLElement) => {
+            lineNumberRender(item.parentElement);
         });
     } else {
         if (typeof isOpen === "boolean" && isOpen) {

+ 2 - 4
app/src/protyle/render/highlightRender.ts

@@ -89,8 +89,7 @@ export const highlightRender = (element: Element, cdn = Constants.PROTYLE_CDN) =
                 const codeText = block.textContent;
                 if (!isPreview && (lineNumber === "true" || (lineNumber !== "false" && window.siyuan.config.editor.codeSyntaxHighlightLineNum))) {
                     // 需要先添加 class 以防止抖动 https://ld246.com/article/1648116585443
-                    block.classList.add("protyle-linenumber");
-                    block.innerHTML = '<div class="protyle-linenumber__rows"></div><div style="flex: 1"></div>'
+                    block.firstElementChild.classList.add("protyle-linenumber__rows")
                     lineNumberRender(block);
                 }
 
@@ -116,11 +115,10 @@ export const lineNumberRender = (block: HTMLElement) => {
     if (!window.siyuan.config.editor.codeSyntaxHighlightLineNum && lineNumber !== "true") {
         return;
     }
-    block.classList.add("protyle-linenumber");
     // clientHeight 总是取的整数
     block.parentElement.style.lineHeight = `${((parseInt(block.parentElement.style.fontSize) || window.siyuan.config.editor.fontSize) * 1.625 * 0.85).toFixed(0)}px`;
     const lineNumberTemp = document.createElement("div");
-    lineNumberTemp.className = "hljs protyle-linenumber";
+    lineNumberTemp.className = "hljs";
     lineNumberTemp.setAttribute("style", `box-sizing: border-box;width: calc(100% - 3.6em);position: absolute;padding-top:0 !important;padding-bottom:0 !important;min-height:auto !important;white-space:${block.style.whiteSpace};word-break:${block.style.wordBreak};font-variant-ligatures:${block.style.fontVariantLigatures};`);
     lineNumberTemp.setAttribute("contenteditable", "true");
     block.insertAdjacentElement("afterend", lineNumberTemp);

+ 0 - 6
app/src/protyle/toolbar/index.ts

@@ -1195,12 +1195,6 @@ export class Toolbar {
             nodeElement.innerHTML = `<div spin="1"></div><div class="protyle-attr" contenteditable="false">${Constants.ZWSP}</div>`;
             processRender(nodeElement);
         } else {
-            const lineNumber = nodeElement.getAttribute("linenumber");
-            if (lineNumber === "true" || (lineNumber !== "false" && window.siyuan.config.editor.codeSyntaxHighlightLineNum)) {
-                editElement.classList.add("protyle-linenumber");
-            } else {
-                editElement.classList.remove("protyle-linenumber");
-            }
             (editElement as HTMLElement).textContent = editElement.textContent;
             editElement.removeAttribute("data-render");
             highlightRender(nodeElement);

+ 2 - 2
app/src/protyle/ui/initUI.ts

@@ -73,8 +73,8 @@ export const initUI = (protyle: IProtyle) => {
         wheelTimeout = window.setTimeout(() => {
             fetchPost("/api/setting/setEditor", window.siyuan.config.editor);
             if (window.siyuan.config.editor.codeSyntaxHighlightLineNum) {
-                protyle.wysiwyg.element.querySelectorAll(".code-block .protyle-linenumber").forEach((block: HTMLElement) => {
-                    lineNumberRender(block);
+                protyle.wysiwyg.element.querySelectorAll(".code-block .protyle-linenumber__rows").forEach((block: HTMLElement) => {
+                    lineNumberRender(block.parentElement);
                 });
             }
         }, Constants.TIMEOUT_LOAD);

+ 2 - 1
app/src/protyle/util/resize.ts

@@ -28,7 +28,8 @@ export const resize = (protyle: IProtyle) => {
                     }
                 });
             }
-            protyle.wysiwyg.element.querySelectorAll(".code-block .protyle-linenumber").forEach((block: HTMLElement) => {
+            protyle.wysiwyg.element.querySelectorAll(".code-block .protyle-linenumber__rows").forEach((item: HTMLElement) => {
+                const block = item.parentElement;
                 if ((window.siyuan.config.editor.codeSyntaxHighlightLineNum && block.parentElement.getAttribute("lineNumber") !== "false" &&
                         window.siyuan.config.editor.codeLineWrap && block.parentElement.getAttribute("linewrap") !== "false") ||
                     (block.parentElement.getAttribute("lineNumber") === "true" && block.parentElement.getAttribute("linewrap") === "true")) {