Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-09-22 00:20:47 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

🎨 https://github.com/siyuan-note/siyuan/pull/15110

Browse source
This commit is contained in:
Vanessa 2025-07-29 23:55:29 +08:00
parent 48933e62f3
commit 842dbb6863
3 changed files with 18 additions and 90 deletions
Download patch file Download diff file Expand all files Collapse all files

28
app/src/assets/scss/component/_typography.scss
View file

@ -529,34 +529,6 @@
.protyle-icons {
display: none;
}
&[data-copy-to="mp-wechat"] {
input[type="checkbox"] {
display: none;
}
li {
&.protyle-task:not(.protyle-task--done) {
list-style-type: "▢";
}
&.protyle-task--done {
list-style-type: "☑︎";
}
}
pre {
margin: 16px 0;
}
}
}
// 暗黑模式
section.b3-typography {
&[data-copy-to="mp-wechat"] {
background-color: var(--b3-theme-background);
padding: 10px;
}
}
.protyle {

21
app/src/config/appearance.ts
View file

@ -11,9 +11,6 @@ import {loadAssets} from "../util/assets";
import {resetFloatDockSize} from "../layout/dock/util";
import {confirmDialog} from "../dialog/confirmDialog";
import {useShell} from "../util/pathName";
/// #if !MOBILE
import {getAllEditor} from "../layout/getAll";
/// #endif
export const appearance = {
element: undefined as Element,
@ -267,24 +264,6 @@ export const appearance = {
return;
}
// #if !MOBILE
// 外观模式或主题改变之后，重新加载所有将 CSS 变量替换为实际值的导出预览
if (data.mode !== window.siyuan.config.appearance.mode ||
(data.mode === window.siyuan.config.appearance.mode && (
(data.mode === 0 && window.siyuan.config.appearance.themeLight !== data.themeLight) ||
(data.mode === 1 && window.siyuan.config.appearance.themeDark !== data.themeDark))
)
) {
getAllEditor().forEach(editor => {
if (editor.protyle.preview && !editor.protyle.preview.element.classList.contains("fn__none") &&
editor.protyle.preview.previewElement.dataset.fillCssVar === "true"
) {
editor.protyle.preview.render(editor.protyle);
}
});
}
/// #endif
window.siyuan.config.appearance = data;
if (appearance.element) {
const modeElement = appearance.element.querySelector("#mode") as HTMLSelectElement;

59
app/src/protyle/preview/index.ts
View file

@ -188,11 +188,6 @@ export class Preview {
}, response => {
const oldScrollTop = protyle.preview.previewElement.scrollTop;
protyle.preview.previewElement.innerHTML = response.data.html;
if (response.data.fillCSSVar) {
protyle.preview.previewElement.dataset.fillCssVar = "true";
} else {
protyle.preview.previewElement.dataset.fillCssVar = "";
}
processRender(protyle.preview.previewElement);
highlightRender(protyle.preview.previewElement);
avRender(protyle.preview.previewElement, protyle);
@ -223,7 +218,6 @@ export class Preview {
private async copyToX(copyElement: HTMLElement, protyle: IProtyle, type?: string) {
// fix math render
if (type === "mp-wechat") {
copyElement.dataset.copyTo = "mp-wechat";
this.link2online(copyElement);
copyElement.querySelectorAll(".katex-html .base").forEach((item: HTMLElement) => {
item.style.display = "initial";
@ -240,41 +234,18 @@ export class Preview {
}
});
});
if (copyElement.dataset.fillCssVar === "true") {
// 需要内联样式
// 微信公众号不能显示 input[type="checkbox"]
copyElement.querySelectorAll("li.protyle-task").forEach((taskItem: HTMLElement) => {
const checkbox = taskItem.querySelector('input[type="checkbox"]') as HTMLInputElement;
if (checkbox) {
checkbox.style.display = "none";
if (checkbox.checked) {
taskItem.style.setProperty("list-style-type", "'☑︎'");
} else {
taskItem.style.setProperty("list-style-type", "'▢'");
}
// 处理任务列表（微信公众号不能显示input[type="checkbox"]）
copyElement.querySelectorAll("li.protyle-task").forEach((taskItem: HTMLElement) => {
const checkbox = taskItem.querySelector('input[type="checkbox"]') as HTMLInputElement;
if (checkbox) {
checkbox.style.opacity = "0";
if (checkbox.checked) {
taskItem.style.setProperty("list-style-type", "'✅'", "important");
} else {
taskItem.style.setProperty("list-style-type", "'▢'", "important");
}
});
// 代码块没有外间距
copyElement.querySelectorAll("pre").forEach((item: HTMLElement) => {
item.style.margin = "16px 0";
});
} else {
if (window.siyuan.config.appearance.mode === 0) {
// 明亮模式防止背景色被粘贴到公众号中
copyElement.style.backgroundColor = "#fff";
} else {
// 暗黑模式插入一层 section 设置背景色
const sectionElement = document.createElement("section");
sectionElement.innerHTML = copyElement.innerHTML;
copyElement.innerHTML = "";
copyElement.removeAttribute("style");
copyElement.appendChild(sectionElement);
// b3-typography 类名移动，否则选择器不匹配
sectionElement.classList.add("b3-typography");
copyElement.classList.remove("b3-typography");
sectionElement.dataset.copyTo = copyElement.dataset.copyTo;
}
}
});
if (typeof window.MathJax === "undefined") {
window.MathJax = {
svg: {
@ -317,9 +288,15 @@ export class Preview {
return;
}
// 防止背景色被粘贴到公众号中
copyElement.style.backgroundColor = "#fff";
// 代码背景
copyElement.querySelectorAll("code").forEach((item) => {
item.style.backgroundImage = "none";
});
this.element.append(copyElement);
// 最后一个块是公式块时无法复制下来；section 元素后面还需要一个其他元素才能被复制
copyElement.insertAdjacentHTML("beforeend", "<p style='background-color: transparent;'>&zwj;</p>");
// 最后一个块是公式块时无法复制下来
copyElement.insertAdjacentHTML("beforeend", "<p>&zwj;</p>");
let cloneRange;
if (getSelection().rangeCount > 0) {
cloneRange = getSelection().getRangeAt(0).cloneRange();