github/siyuan
4
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-05-15 00:21:00 +08:00
Code Issues Packages Projects Releases Wiki Activity

🎨 https://github.com/siyuan-note/siyuan/issues/3499

Browse Source
This commit is contained in:
Vanessa 2023-02-12 16:39:59 +08:00
parent ffb959db6e
commit 33b41c202a
4 changed files with 21 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/src/assets/scss/_layout.scss
View File

@ -275,6 +275,7 @@
padding: 0 42px; padding: 0 42px;
user-select: none; user-select: none;
background-color: var(--b3-theme-surface); background-color: var(--b3-theme-surface);
box-sizing: border-box;
&#dockLeft { &#dockLeft {
border-right: .5px solid var(--b3-border-color); border-right: .5px solid var(--b3-border-color);

2
app/src/assets/template/desktop/index.tpl
View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html style="position: fixed;top: 0;right: 0;left: 0;">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" <meta name="viewport"

21
app/src/layout/dock/index.ts
View File

@ -91,18 +91,19 @@ export class Dock {
if (this.position === "Left" || this.position === "Right") { if (this.position === "Left" || this.position === "Right") {
this.layout.element.setAttribute("style", `width:${this.layout.element.clientWidth}px; this.layout.element.setAttribute("style", `width:${this.layout.element.clientWidth}px;
opacity: ${hasActive ? 1 : 0}; opacity: ${hasActive ? 1 : 0};
${this.position === "Right" ? "right" : "left"}:${this.element.clientWidth + .5}px; ${this.position === "Right" ? "right" : "left"}:${this.element.clientWidth}px;
top: ${.5 + document.getElementById("toolbar").clientHeight + document.getElementById("dockTop").clientHeight}px; top: ${document.getElementById("toolbar").clientHeight + document.getElementById("dockTop").clientHeight}px;
bottom: ${document.getElementById("status").clientHeight + document.getElementById("dockBottom").clientHeight + 1}px;`); bottom: ${document.getElementById("status").clientHeight + document.getElementById("dockBottom").clientHeight}px;`);
} else { } else {
this.layout.element.setAttribute("style", `height:${this.layout.element.clientHeight}px; this.layout.element.setAttribute("style", `height:${this.layout.element.clientHeight}px;
opacity: ${hasActive ? 1 : 0}; opacity: ${hasActive ? 1 : 0};
left:0; left:0;
right:0; right:0;
${this.position === "Top" ? ("top:" + (.5 + this.element.clientHeight + document.getElementById("toolbar").clientHeight) + "px") : ("bottom:" + (1 + this.element.clientHeight + document.getElementById("status").clientHeight) + "px")};`); ${this.position === "Top" ? ("top:" + (this.element.clientHeight + document.getElementById("toolbar").clientHeight) + "px") : ("bottom:" + (this.element.clientHeight + document.getElementById("status").clientHeight) + "px")};`);
} }
target.setAttribute("aria-label", window.siyuan.languages.pin); target.setAttribute("aria-label", window.siyuan.languages.pin);
this.resizeElement.classList.add("fn__none"); this.resizeElement.classList.add("fn__none");
resizeTabs();
} else { } else {
target.setAttribute("aria-label", window.siyuan.languages.unpin); target.setAttribute("aria-label", window.siyuan.languages.unpin);
this.layout.element.style.opacity = ""; this.layout.element.style.opacity = "";
@ -144,8 +145,8 @@ ${this.position === "Top" ? ("top:" + (.5 + this.element.clientHeight + document
if (this.position === "Left" || this.position === "Right") { if (this.position === "Left" || this.position === "Right") {
this.layout.element.setAttribute("style", `opacity:0px; this.layout.element.setAttribute("style", `opacity:0px;
width:${this.layout.element.clientWidth}px;${this.position === "Right" ? "right" : "left"}:-${this.layout.element.clientWidth}px; width:${this.layout.element.clientWidth}px;${this.position === "Right" ? "right" : "left"}:-${this.layout.element.clientWidth}px;
top: ${.5 + document.getElementById("toolbar").clientHeight + document.getElementById("dockTop").clientHeight}px; top: ${document.getElementById("toolbar").clientHeight + document.getElementById("dockTop").clientHeight}px;
bottom: ${document.getElementById("status").clientHeight + document.getElementById("dockBottom").clientHeight + 1}px;`); bottom: ${document.getElementById("status").clientHeight + document.getElementById("dockBottom").clientHeight}px;`);
} else { } else {
this.layout.element.setAttribute("style", ` this.layout.element.setAttribute("style", `
opacity:0px; opacity:0px;
@ -174,13 +175,13 @@ ${this.position === "Top" ? "top" : "bottom"}:-${this.layout.element.clientHeigh
} }
this.layout.element.style.opacity = "1"; this.layout.element.style.opacity = "1";
if (this.position === "Left") { if (this.position === "Left") {
window.siyuan.layout.leftDock.layout.element.style.left = (window.siyuan.layout.leftDock.element.clientWidth + .5) + "px"; this.layout.element.style.left = this.element.clientWidth + "px";
} else if (this.position === "Right") { } else if (this.position === "Right") {
this.layout.element.style.right = (window.siyuan.layout.rightDock.element.clientWidth + .5) + "px"; this.layout.element.style.right = this.element.clientWidth + "px";
} else if (this.position === "Top") { } else if (this.position === "Top") {
this.layout.element.style.top = (document.getElementById("dockTop").clientHeight + document.getElementById("toolbar").clientHeight + .5) + "px"; this.layout.element.style.top = (this.element.clientHeight + document.getElementById("toolbar").clientHeight) + "px";
} else if (this.position === "Bottom") { } else if (this.position === "Bottom") {
this.layout.element.style.bottom = (document.getElementById("dockBottom").clientHeight + document.getElementById("status").clientHeight + 1) + "px"; this.layout.element.style.bottom = (this.element.clientHeight + document.getElementById("status").clientHeight) + "px";
} }
} }

16
app/src/layout/dock/util.ts
View File

@ -88,23 +88,23 @@ export const openOutline = (protyle: IProtyle) => {
export const resetFloatDockSize = () => { export const resetFloatDockSize = () => {
if (!window.siyuan.layout.leftDock.pin) { if (!window.siyuan.layout.leftDock.pin) {
window.siyuan.layout.leftDock.layout.element.style.top = (.5 + document.getElementById("toolbar").clientHeight + document.getElementById("dockTop").clientHeight) + "px"; window.siyuan.layout.leftDock.layout.element.style.top = (document.getElementById("toolbar").clientHeight + document.getElementById("dockTop").clientHeight) + "px";
window.siyuan.layout.leftDock.layout.element.style.bottom = (document.getElementById("status").clientHeight + document.getElementById("dockBottom").clientHeight + 1) + "px"; window.siyuan.layout.leftDock.layout.element.style.bottom = (document.getElementById("status").clientHeight + document.getElementById("dockBottom").clientHeight) + "px";
if (window.siyuan.layout.leftDock.layout.element.style.opacity === "1") { if (window.siyuan.layout.leftDock.layout.element.style.opacity === "1") {
window.siyuan.layout.leftDock.layout.element.style.left = (window.siyuan.layout.leftDock.element.clientWidth + .5) + "px"; window.siyuan.layout.leftDock.layout.element.style.left = window.siyuan.layout.leftDock.element.clientWidth + "px";
} }
} }
if (!window.siyuan.layout.rightDock.pin) { if (!window.siyuan.layout.rightDock.pin) {
window.siyuan.layout.rightDock.layout.element.style.top = (.5 + document.getElementById("toolbar").clientHeight + document.getElementById("dockTop").clientHeight) + "px"; window.siyuan.layout.rightDock.layout.element.style.top = (document.getElementById("toolbar").clientHeight + document.getElementById("dockTop").clientHeight) + "px";
window.siyuan.layout.rightDock.layout.element.style.bottom = (document.getElementById("status").clientHeight + document.getElementById("dockBottom").clientHeight + 1) + "px"; window.siyuan.layout.rightDock.layout.element.style.bottom = (document.getElementById("status").clientHeight + document.getElementById("dockBottom").clientHeight) + "px";
if (window.siyuan.layout.rightDock.layout.element.style.opacity === "1") { if (window.siyuan.layout.rightDock.layout.element.style.opacity === "1") {
window.siyuan.layout.rightDock.layout.element.style.right = (window.siyuan.layout.rightDock.element.clientWidth + .5) + "px"; window.siyuan.layout.rightDock.layout.element.style.right = window.siyuan.layout.rightDock.element.clientWidth + "px";
} }
} }
if (!window.siyuan.layout.topDock.pin && window.siyuan.layout.topDock.layout.element.style.opacity === "1") { if (!window.siyuan.layout.topDock.pin && window.siyuan.layout.topDock.layout.element.style.opacity === "1") {
window.siyuan.layout.topDock.layout.element.style.top = (document.getElementById("dockTop").clientHeight + document.getElementById("toolbar").clientHeight + .5) + "px"; window.siyuan.layout.topDock.layout.element.style.top = (document.getElementById("dockTop").clientHeight + document.getElementById("toolbar").clientHeight) + "px";
} }
if (!window.siyuan.layout.bottomDock.pin && window.siyuan.layout.bottomDock.layout.element.style.opacity === "1") { if (!window.siyuan.layout.bottomDock.pin && window.siyuan.layout.bottomDock.layout.element.style.opacity === "1") {
window.siyuan.layout.bottomDock.layout.element.style.bottom = (document.getElementById("dockBottom").clientHeight + document.getElementById("status").clientHeight + 1) + "px"; window.siyuan.layout.bottomDock.layout.element.style.bottom = (document.getElementById("dockBottom").clientHeight + document.getElementById("status").clientHeight) + "px";
} }
}; };