Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2026-03-03 11:20:16 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

style: Improve block styles (#13564)

Browse source 
* style: 调整列表项的伪元素竖线高度

* style: 选中嵌入块的高亮覆盖其 border

* style: 代码块 margin 与其他块统一、代码块语言的位置有点难看

* style: 公式块 margin 与其他块统一

* style: iframe 块 margin 与其他块统一

* style: 标题块 margin padding 与其他块统一、标题文本在块内垂直居中

* style: 去除表格块下方多余的空白

* style: 避免标题块高度抖动（空标题块和有内容的标题块高度不一致）

* style: 选中水平布局超级块内的单个块时，高亮范围与超级块保持一致，覆盖 margin

* style: 使用 flex 避免超级块内的相邻子块发生外边距折叠 margin collapsing

* style: 选中水平布局超级块内的单个嵌入块时，高亮范围与超级块保持一致，覆盖 border 和 margin

* style: 添加编辑器字号的基准 CSS 变量 --b3-font-size-editor 供主题或插件使用

比如用 CSS 实现界面字号与编辑器字号同步调整

body > #dockBottom, body > .fn__flex-1 {
    font-size: calc(var(--b3-font-size-editor) - 2px);
}

* style: Improve block styles

* style: 减小列表内的标题块行高
This commit is contained in:
Jeffrey Chen 2025-01-29 12:36:20 +08:00 • committed by GitHub
parent d98d62dcc5
commit d9d48273fb
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 69 additions and 26 deletions
Download patch file Download diff file Expand all files Collapse all files

5
app/src/util/assets.ts
View file

@ -288,13 +288,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,