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

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

Browse source
This commit is contained in:
Vanessa 2025-02-28 12:19:11 +08:00
parent 19a37f19a3
commit 82bf05d919
3 changed files with 19 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

28
app/src/dialog/tooltip.ts
View file

@ -22,17 +22,7 @@ export const showTooltip = (message: string, target: Element, tooltipClass?: str
let left;
let top;
if (position?.startsWith("right")) {
// right${number}bottom - target 右面底对齐; right${number}top - target 右面上对齐;
// scroll & background 无需调整
left = targetRect.right - messageElement.clientWidth;
if (position?.endsWith("bottom")) {
top = targetRect.bottom + parseInt(position.replace("right", "")) || 0;
} else if (position?.endsWith("top")) {
// 数据库视图、编辑器动态滚动条
top = targetRect.top - messageElement.clientHeight;
}
} else if (position === "parentE") {
if (position === "parentE") {
// parentE: file tree and outline、backlink & viewcard
top = Math.max(0, parentRect.top - (messageElement.clientHeight - parentRect.height) / 2);
if (top > window.innerHeight - messageElement.clientHeight) {
@ -52,27 +42,29 @@ export const showTooltip = (message: string, target: Element, tooltipClass?: str
if (left < 0) {
left = parentRect.right;
}
} else if (position === "west") {
} else if (position?.endsWith("west")) {
// west: gutter & 标题图标 & av relation
const positionDiff = parseInt(position) || 0.5;
top = Math.max(0, targetRect.top - (messageElement.clientHeight - targetRect.height) / 2);
if (top > window.innerHeight - messageElement.clientHeight) {
top = window.innerHeight - messageElement.clientHeight;
}
left = targetRect.left - messageElement.clientWidth;
left = targetRect.left - messageElement.clientWidth - positionDiff;
if (left < 0) {
left = targetRect.right;
}
} else if (position === "north") {
// north: av 视图，列，多选描述
const positionDiff = 0.5;
left = Math.max(0, targetRect.left - (messageElement.clientWidth - targetRect.width) / 2);
top = targetRect.top - messageElement.clientHeight;
top = targetRect.top - messageElement.clientHeight - positionDiff;
if (top < 0) {
if (targetRect.top < window.innerHeight - targetRect.bottom) {
top = targetRect.bottom;
messageElement.style.maxHeight = (window.innerHeight - targetRect.bottom) + "px";
top = targetRect.bottom + positionDiff;
messageElement.style.maxHeight = (window.innerHeight - top) + "px";
} else {
top = 0;
messageElement.style.maxHeight = targetRect.top + "px";
messageElement.style.maxHeight = (targetRect.top - positionDiff) + "px";
}
}
if (left + messageElement.clientWidth > window.innerWidth) {
@ -80,7 +72,7 @@ export const showTooltip = (message: string, target: Element, tooltipClass?: str
}
} else {
// ${number}south & 默认值
const positionDiff = parseInt(position) || 0;
const positionDiff = parseInt(position) || 0.5;
left = Math.max(0, targetRect.left - (messageElement.clientWidth - targetRect.width) / 2);
top = targetRect.bottom + positionDiff;

12
app/src/protyle/header/Background.ts
View file

@ -110,12 +110,12 @@ export class Background {
this.element.innerHTML = `<div class="protyle-background__img">
<img src="${this.transparentData}">
<div class="protyle-icons">
<span class="protyle-icon protyle-icon--first" style="position: relative;overflow: hidden"><input aria-label="${window.siyuan.languages.upload}" class="ariaLabel" data-position="right2bottom" type="file" style="position: absolute;height: 100%;top: 0;right: 0;opacity: .001;overflow: hidden;cursor: pointer;"><svg><use xlink:href="#iconUpload"></use></svg></span>
<span class="protyle-icon ariaLabel" data-position="right2bottom" data-type="link" aria-label="${window.siyuan.languages.link}"><svg><use xlink:href="#iconLink"></use></svg></span>
<span class="protyle-icon ariaLabel" data-position="right2bottom" data-type="asset" aria-label="${window.siyuan.languages.assets}"><svg><use xlink:href="#iconImage"></use></svg></span>
<span class="protyle-icon ariaLabel" data-position="right2bottom" data-type="show-random" aria-label="${window.siyuan.languages.builtIn}"><svg><use xlink:href="#iconRefresh"></use></svg></span>
<span class="protyle-icon ariaLabel fn__none" data-position="right2bottom" data-type="position" aria-label="${window.siyuan.languages.dragPosition}"><svg><use xlink:href="#iconMove"></use></svg></span>
<span class="protyle-icon protyle-icon--last ariaLabel" data-position="right2bottom" data-type="remove" aria-label="${window.siyuan.languages.remove}"><svg><use xlink:href="#iconTrashcan"></use></svg></span>
<span class="protyle-icon protyle-icon--first" style="position: relative;overflow: hidden"><input aria-label="${window.siyuan.languages.upload}" class="ariaLabel" type="file" style="position: absolute;height: 100%;top: 0;right: 0;opacity: .001;overflow: hidden;cursor: pointer;"><svg><use xlink:href="#iconUpload"></use></svg></span>
<span class="protyle-icon ariaLabel" data-type="link" aria-label="${window.siyuan.languages.link}"><svg><use xlink:href="#iconLink"></use></svg></span>
<span class="protyle-icon ariaLabel" data-type="asset" aria-label="${window.siyuan.languages.assets}"><svg><use xlink:href="#iconImage"></use></svg></span>
<span class="protyle-icon ariaLabel" data-type="show-random" aria-label="${window.siyuan.languages.builtIn}"><svg><use xlink:href="#iconRefresh"></use></svg></span>
<span class="protyle-icon ariaLabel fn__none" data-type="position" aria-label="${window.siyuan.languages.dragPosition}"><svg><use xlink:href="#iconMove"></use></svg></span>
<span class="protyle-icon protyle-icon--last ariaLabel" data-type="remove" aria-label="${window.siyuan.languages.remove}"><svg><use xlink:href="#iconTrashcan"></use></svg></span>
</div>
<div class="protyle-icons fn__none"><span class="protyle-icon protyle-icon--text">${window.siyuan.languages.dragPosition}</span></div>
<div class="protyle-icons fn__none" style="opacity: .86;">

6
app/src/protyle/scroll/index.ts
View file

@ -16,13 +16,13 @@ export class Scroll {
constructor(protyle: IProtyle) {
this.parentElement = document.createElement("div");
this.parentElement.classList.add("protyle-scroll");
this.parentElement.innerHTML = `<div class="protyle-scroll__up ariaLabel" data-position="right4top" aria-label="${updateHotkeyTip("⌘Home")}">
this.parentElement.innerHTML = `<div class="protyle-scroll__up ariaLabel" data-position="north" aria-label="${updateHotkeyTip("⌘Home")}">
<svg><use xlink:href="#iconUp"></use></svg>
</div>
<div class="fn__none protyle-scroll__bar ariaLabel" data-position="right20bottom" aria-label="Blocks 1/1">
<div class="fn__none protyle-scroll__bar ariaLabel" data-position="2west" aria-label="Blocks 1/1">
<input class="b3-slider" type="range" max="1" min="1" step="1" value="1" />
</div>
<div class="protyle-scroll__down ariaLabel" data-position="right4bottom" aria-label="${updateHotkeyTip("⌘End")}">
<div class="protyle-scroll__down ariaLabel" aria-label="${updateHotkeyTip("⌘End")}">
<svg><use xlink:href="#iconDown"></use></svg>
</div>`;