0ct0pu5/siyuan
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

✨ fix https://github.com/siyuan-note/siyuan/issues/6376

Browse source
This commit is contained in:
Vanessa 2022-10-29 21:58:09 +08:00
parent 262134aa03
commit 7050776fda
6 changed files with 77 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
app/appearance/themes/midnight/theme.css
View file

@ -153,11 +153,6 @@
}
/* PDF */
.pdfViewer .page canvas,
.thumbnailImage {
filter: grayscale(0%) invert(100%) contrast(100%) brightness(100%) hue-rotate(180deg);
}
.textLayer,
.pdf__resize {
mix-blend-mode: screen;

50
app/src/asset/index.ts
View file

@ -167,6 +167,15 @@ export class Asset extends Model {
</div> <!-- findbar -->
<div id="secondaryToolbar" class="secondaryToolbar fn__hidden doorHangerRight b3-menu">
<div id="secondaryToolbarButtonContainer">
<button id="pdfLight" class="secondaryToolbarButton b3-menu__item toggled" tabindex="54">
<svg class="b3-menu__icon"><use xlink:href="#iconLight"></use></svg>
<span class="b3-menu__label">${window.siyuan.languages.themeLight}</span>
</button>
<button id="pdfDark" class="secondaryToolbarButton b3-menu__item" tabindex="55">
<svg class="b3-menu__icon"><use xlink:href="#iconDark"></use></svg>
<span class="b3-menu__label">${window.siyuan.languages.themeDark}</span>
</button>
<div class="horizontalToolbarSeparator b3-menu__separator"></div>
<button id="firstPage" class="secondaryToolbarButton b3-menu__item firstPage" tabindex="56">
<svg class="b3-menu__icon"><use xlink:href="#iconUp"></use></svg>
<span class="b3-menu__label">${window.siyuan.languages.firstPage}</span>
@ -175,9 +184,7 @@ export class Asset extends Model {
<svg class="b3-menu__icon"><use xlink:href="#iconDown"></use></svg>
<span class="b3-menu__label">${window.siyuan.languages.lastPage}</span>
</button>
<div class="horizontalToolbarSeparator b3-menu__separator"></div>
<button id="pageRotateCw" class="secondaryToolbarButton b3-menu__item rotateCw" tabindex="58">
<svg class="b3-menu__icon"><use xlink:href="#iconRedo"></use></svg>
<span class="b3-menu__label">${window.siyuan.languages.rotateCw}</span>
@ -436,6 +443,45 @@ export class Asset extends Model {
</div>
</div> <!-- outerContainer -->
<div id="printContainer"></div>`;
const localPDF = JSON.parse(localStorage.getItem(Constants.LOCAL_PDFTHEME) || "{}");
let pdfTheme
if (window.siyuan.config.appearance.mode === 0) {
pdfTheme = localPDF.light || "light"
} else {
pdfTheme = localPDF.dark || "dark"
}
const darkElement = this.element.querySelector("#pdfDark")
const lightElement = this.element.querySelector("#pdfLight")
if (pdfTheme === "dark") {
this.element.firstElementChild.classList.add("pdf__outer--dark");
lightElement.classList.remove("toggled")
darkElement.classList.add("toggled")
} else {
lightElement.classList.add("toggled")
darkElement.classList.remove("toggled")
}
lightElement.addEventListener("click", () => {
if (window.siyuan.config.appearance.mode === 0) {
localPDF.light = "light"
} else {
localPDF.dark = "light"
}
this.element.firstElementChild.classList.remove("pdf__outer--dark");
localStorage.setItem(Constants.LOCAL_PDFTHEME, JSON.stringify(localPDF));
lightElement.classList.add("toggled")
darkElement.classList.remove("toggled")
})
darkElement.addEventListener("click", () => {
if (window.siyuan.config.appearance.mode === 0) {
localPDF.light = "dark"
} else {
localPDF.dark = "dark"
}
this.element.firstElementChild.classList.add("pdf__outer--dark");
localStorage.setItem(Constants.LOCAL_PDFTHEME, JSON.stringify(localPDF));
lightElement.classList.remove("toggled")
darkElement.classList.add("toggled")
})
// 初始化完成后需等待页签是否显示设置完成，才可以判断 pdf 是否能进行渲染
setTimeout(() => {
if (this.element.clientWidth === 0) {

6
app/src/assets/scss/pdf/_pdf.scss
View file

@ -75,6 +75,10 @@
}
}
.pdf__outer--dark .pdfViewer .page canvas,
.pdf__outer--dark .thumbnailImage {
filter: grayscale(0%) invert(100%) contrast(100%) brightness(100%) hue-rotate(180deg);
}
.annotationLayer section:not(.linkAnnotation) {
display: none;
}
@ -303,7 +307,7 @@
#secondaryToolbarButtonContainer {
max-width: 220px;
max-height: 400px;
max-height: 60vh;
}
#secondaryToolbarButtonContainer.hiddenScrollModeButtons > .scrollModeButtons,

4
app/src/block/popover.ts
View file

@ -9,6 +9,9 @@ export const initBlockPopover = () => {
let timeoutHide: number;
// 编辑器内容块引用/backlinks/tag/bookmark/套娃中使用
document.addEventListener("mouseover", (event: MouseEvent & { target: HTMLElement }) => {
if (!window.siyuan.config) {
return;
}
const aElement = hasClosestByAttribute(event.target, "data-type", "a", true) ||
hasClosestByAttribute(event.target, "data-type", "tab-header") ||
hasClosestByClassName(event.target, "emojis__item") ||
@ -35,7 +38,6 @@ export const initBlockPopover = () => {
} else if (!aElement) {
hideTooltip();
}
if (window.siyuan.config.editor.floatWindowMode === 1) {
clearTimeout(timeoutHide);
timeoutHide = window.setTimeout(() => {

1
app/src/constants.ts
View file

@ -69,6 +69,7 @@ export abstract class Constants {
public static readonly LOCAL_EXPORTPDF = "local-exportpdf";
public static readonly LOCAL_EXPORTWORD = "local-exportword";
public static readonly LOCAL_BAZAAR = "local-bazaar";
public static readonly LOCAL_PDFTHEME = "local-pdftheme";
// timeout
public static readonly TIMEOUT_DBLCLICK = 190;

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

@ -53,6 +53,26 @@ export const loadAssets = (data: IAppearance) => {
getAllModels().graph.forEach(item => {
item.searchGraph(false);
});
const localPDF = JSON.parse(localStorage.getItem(Constants.LOCAL_PDFTHEME) || "{}");
let pdfTheme: string
if (window.siyuan.config.appearance.mode === 0) {
pdfTheme = localPDF.light || "light"
} else {
pdfTheme = localPDF.dark || "dark"
}
document.querySelectorAll(".pdf__outer").forEach(item => {
const darkElement = item.querySelector("#pdfDark")
const lightElement = item.querySelector("#pdfLight")
if (pdfTheme === "dark") {
item.classList.add("pdf__outer--dark");
lightElement.classList.remove("toggled")
darkElement.classList.add("toggled")
} else {
item.classList.remove("pdf__outer--dark");
lightElement.classList.add("toggled")
darkElement.classList.remove("toggled")
}
})
/// #endif
setCodeTheme();