fix(editor): align code block borders

Author: murongg

packages/app/src/styles.css

@@ -1162,6 +1162,8 @@
     pointer-events: none;
   }
 
+  /* The backdrop owns the continuous gutter divider. Keep this pseudo-element
+     inside the number column so it cannot cover that divider on text rows. */
   .markdown-paper .cm-line.cm-markra-code-content-line::before {
     position: relative;
     z-index: 1;
@@ -1170,11 +1172,10 @@
     min-width: 43px !important;
     margin-right: 16px !important;
     padding-right: 12px;
-    border-right: 1px solid var(--editor-border);
+    border-left: 1px solid var(--editor-border);
     background: var(--editor-code-line-bg);
     color: var(--editor-text-secondary) !important;
     font: inherit;
-    box-shadow: 16px 0 0 var(--editor-code-bg);
   }
 
   .markdown-paper .cm-line.cm-markra-code-header-line +

packages/app/src/styles.test.ts

@@ -85,8 +85,10 @@ describe("editor stylesheet", () => {
     expect(backdropRule).toContain("background: linear-gradient(");
     expect(lineNumberRule).toContain("position: relative");
     expect(lineNumberRule).toContain("z-index: 1");
+    expect(lineNumberRule).toContain("border-left: 1px solid var(--editor-border)");
     expect(lineNumberRule).toContain("background: var(--editor-code-line-bg)");
-    expect(lineNumberRule).toContain("box-shadow: 16px 0 0 var(--editor-code-bg)");
+    expect(lineNumberRule).not.toContain("border-right:");
+    expect(lineNumberRule).not.toContain("box-shadow:");
   });
 
   it("matches the original code block control layout", () => {