Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-12-18 15:40:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

🎨 Improve hyperlink tooltip

Browse source
This commit is contained in:
Jeffrey Chen 2025-12-16 09:40:55 +08:00
parent 979cb54766
commit aa38bb1500
2 changed files with 23 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -80,10 +80,12 @@ export const initBlockPopover = (app: App) => {
tip = childElement.textContent; tip = childElement.textContent;
} }
} }
let tooltipSpace: number | undefined;
if (!tip) { if (!tip) {
tip = escapeHtml(aElement.getAttribute("data-inline-memo-content")); tip = escapeHtml(aElement.getAttribute("data-inline-memo-content"));
if (tip) { if (tip) {
tooltipClass = "memo"; // 为行级备注添加 class https://github.com/siyuan-note/siyuan/issues/6161 tooltipClass = "memo"; // 为行级备注添加 class https://github.com/siyuan-note/siyuan/issues/6161
tooltipSpace = 0; // tooltip 和备注元素之间不能有空隙 https://github.com/siyuan-note/siyuan/issues/14796#issuecomment-3649757267
} }
} }
if (!tip) { if (!tip) {
@ -132,10 +134,10 @@ export const initBlockPopover = (app: App) => {
if (tip && !aElement.classList.contains("b3-tooltips")) { if (tip && !aElement.classList.contains("b3-tooltips")) {
// https://github.com/siyuan-note/siyuan/issues/11294 // https://github.com/siyuan-note/siyuan/issues/11294
try { try {
showTooltip(decodeURIComponent(tip), aElement, tooltipClass, event); showTooltip(decodeURIComponent(tip), aElement, tooltipClass, event, tooltipSpace);
} catch (e) { } catch (e) {
// https://ld246.com/article/1718235737991 // https://ld246.com/article/1718235737991
showTooltip(tip, aElement, tooltipClass, event); showTooltip(tip, aElement, tooltipClass, event, tooltipSpace);
} }
event.stopPropagation(); event.stopPropagation();
} else { } else {

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

@ -1,29 +1,29 @@
import {isMobile} from "../util/functions"; import {isMobile} from "../util/functions";
export const showTooltip = (message: string, target: Element, tooltipClass?: string, event?: MouseEvent) => { export const showTooltip = (message: string, target: Element, tooltipClass?: string, event?: MouseEvent, space: number = 0.5) => {
if (isMobile()) { if (isMobile()) {
return; return;
} }
let targetRect = target.getBoundingClientRect(); let targetRect = target.getBoundingClientRect();
let space = 0.5; // 跨行元素
if (target.getAttribute("data-inline-memo-content")) { const clientRects = target.getClientRects();
space = 0; if (clientRects.length > 1) {
if (target.getClientRects().length > 1) { if (event) {
// 选择包含鼠标的矩形
Array.from(clientRects).forEach(item => {
if (event.clientY >= item.top - 3 && event.clientY <= item.bottom) {
targetRect = item;
}
});
} else {
// 选择宽度最大的矩形
let lastWidth = 0; let lastWidth = 0;
if (event) { Array.from(clientRects).forEach(item => {
Array.from(target.getClientRects()).forEach(item => { if (item.width > lastWidth) {
if (event.clientY >= item.top - 3 && event.clientY <= item.bottom) { targetRect = item;
targetRect = item; }
} lastWidth = item.width;
}); });
} else {
Array.from(target.getClientRects()).forEach(item => {
if (item.width > lastWidth) {
targetRect = item;
}
lastWidth = item.width;
});
}
} }
} }
if (targetRect.height === 0 || !message) { if (targetRect.height === 0 || !message) {