Merge 16379dc40d into 879369dd94

app/src/assets/scss/component/_typography.scss

@@ -146,17 +146,11 @@
     flex-direction: column;
   }
 
-  .h1,
   h1,
-  .h2,
   h2,
-  .h3,
   h3,
-  .h4,
   h4,
-  .h5,
   h5,
-  .h6,
   h6 {
     padding: 4px;
     margin: 4px 0;
@@ -165,17 +159,36 @@
   }
 
   .h1,
+  .h2,
+  .h3,
+  .h4,
+  .h5,
+  .h6 {
+    font-weight: 600;
+
+    &[data-node-id] [spellcheck] {
+      min-height: 1.625em;
+    }
+  }
+
   h1 {
     padding: .3em 4px;
     font-size: 1.75em;
   }
 
-  .h2,
+  .h1 {
+    font-size: 1.75em;
+  }
+
   h2 {
     padding: .3em 4px;
     font-size: 1.55em;
   }
 
+  .h2 {
+    font-size: 1.55em;
+  }
+
   .h3,
   h3 {
     font-size: 1.38em;
@@ -281,7 +294,7 @@
   }
 
   .code-block:not(pre) {
-    margin: 1em 0;
+    margin: 2px 0;
     box-sizing: border-box;
 
     .protyle-action {
@@ -299,8 +312,14 @@
         align-self: center;
       }
 
-      .protyle-icon,
+      .protyle-icon {
+        opacity: 0;
+        transition: var(--b3-transition);
+      }
+
       .protyle-action__language {
+        position: absolute;
+        left: 1em;
         opacity: 0;
         transition: var(--b3-transition);
       }
@@ -467,8 +486,6 @@
 
   .iframe {
     text-align: center;
-    padding: 4px;
-    margin: 4px 0;
   }
 }
 

app/src/assets/scss/protyle/_wysiwyg.scss

@@ -125,16 +125,6 @@
         align-items: center;
         word-break: keep-all;
 
-        & ~ .h1,
-        & ~ .h2,
-        & ~ .h3,
-        & ~ .h4,
-        & ~ .h5,
-        & ~ .h6 {
-          padding-top: 0;
-          padding-bottom: 0;
-        }
-
         &::after {
           content: "";
           position: absolute;
@@ -158,11 +148,13 @@
     }
 
     &.sb {
+      display: flex;
+      flex-direction: column;
       padding: 0;
       max-width: 100%;
 
       &[data-sb-layout="col"] {
-        display: flex;
+        flex-direction: row;
         flex-wrap: wrap;
         justify-content: space-between;
         column-gap: 1.5em;
@@ -187,6 +179,20 @@
           position: initial;
           margin-left: 4px;
         }
+
+        /* 选中块的高亮覆盖 margin */
+        &> .protyle-wysiwyg--select:not(.sb)::after,
+        &> .protyle-wysiwyg--hl:not(.sb)::after{
+          height: calc(100% + 4px);
+          top: -2px;
+        }
+
+        /* 选中块的高亮覆盖 border 和 margin */
+        &> .protyle-wysiwyg--select.render-node[data-type="NodeBlockQueryEmbed"]::after,
+        &> .protyle-wysiwyg--hl.render-node[data-type="NodeBlockQueryEmbed"]::after{
+          height: calc(100% + 6px);
+          top: -3px;
+        }
       }
     }
 
@@ -266,6 +272,15 @@
         max-width: 100%;
         padding: 2px 4px;
 
+        /* 选中块的高亮覆盖 border */
+        &.protyle-wysiwyg--select::after,
+        &.protyle-wysiwyg--hl::after{
+          width: calc(100% + 2px);
+          height: calc(100% + 2px);
+          left: -1px;
+          top: -1px;
+        }
+
         // https://github.com/siyuan-note/siyuan/issues/8715 & https://ld246.com/article/1689063197687 第一点无法进行以下设置
         //.protyle-attr--refcount {right: 0;}
 
@@ -310,6 +325,7 @@
 
     &.table table {
       display: inline-block;
+      vertical-align: top;
     }
 
     .img {
@@ -487,8 +503,6 @@
   }
 
   div[data-type="NodeMathBlock"] {
-    margin-top: 0;
-    margin-bottom: 0;
     min-height: 62px !important;
   }
 

app/src/util/assets.ts

@@ -273,13 +273,14 @@ export const setInlineStyle = async (set = true) => {
 }`;
         }
     }
-    style += `.b3-typography, .protyle-wysiwyg, .protyle-title {font-size:${window.siyuan.config.editor.fontSize}px !important}
+    style += `\n:root{--b3-font-size-editor:${window.siyuan.config.editor.fontSize}px}
+.b3-typography, .protyle-wysiwyg, .protyle-title {font-size:${window.siyuan.config.editor.fontSize}px !important}
 .b3-typography code:not(.hljs), .protyle-wysiwyg span[data-type~=code] { font-variant-ligatures: ${window.siyuan.config.editor.codeLigatures ? "normal" : "none"} }
 .li > .protyle-action {height:${height + 8}px;line-height: ${height + 8}px}
 .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h1, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h2, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h3, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h4, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h5, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h6 {line-height:${height + 8}px;}
 .protyle-wysiwyg [data-node-id].li > .protyle-action::after {height: ${window.siyuan.config.editor.fontSize}px;width: ${window.siyuan.config.editor.fontSize}px;margin:-${window.siyuan.config.editor.fontSize / 2}px 0 0 -${window.siyuan.config.editor.fontSize / 2}px}
 .protyle-wysiwyg [data-node-id].li > .protyle-action svg {height: ${Math.max(14, window.siyuan.config.editor.fontSize - 8)}px}
-.protyle-wysiwyg [data-node-id].li::before {height: calc(100% - ${height + 8}px);top:${(height + 8)}px}
+.protyle-wysiwyg [data-node-id].li::before {height: calc(100% - ${height + 12}px);top:${(height + 12)}px}
 .protyle-wysiwyg [data-node-id] [spellcheck] {min-height:${height}px;}
 .protyle-wysiwyg .p,
 .protyle-wysiwyg .code-block .hljs,