🎨 tooltip

This commit is contained in:
Vanessa 2023-09-13 18:50:51 +08:00
parent cf1464e2ef
commit 64fdb274fb
3 changed files with 16 additions and 13 deletions

View file

@ -63,10 +63,10 @@ export class Tree {
} else if (item.type === "tag") {
iconHTML = '<svg class="b3-list-item__graphic"><use xlink:href="#iconTags"></use></svg>';
} else if (item.type === "backlink") {
titleTip = ` title="${item.hPath}"`;
titleTip = ` aria-label="${item.hPath}"`;
iconHTML = `<svg class="b3-list-item__graphic popover__block" data-id="${item.id}"><use xlink:href="#${getIconByType(item.nodeType, item.subType)}"></use></svg>`;
} else if (item.type === "outline") {
titleTip = ` title="${Lute.EscapeHTMLStr(Lute.BlockDOM2Content(item.name))}"`;
titleTip = ` aria-label="${Lute.EscapeHTMLStr(Lute.BlockDOM2Content(item.name))}"`;
iconHTML = `<svg class="b3-list-item__graphic popover__block" data-id="${item.id}"><use xlink:href="#${getIconByType(item.nodeType, item.subType)}"></use></svg>`;
}
let countHTML = "";
@ -94,7 +94,7 @@ ${item.label ? "data-label='" + item.label + "'" : ""}>
<svg data-id="${encodeURIComponent(item.name + item.depth)}" class="b3-list-item__arrow${hasChild ? " b3-list-item__arrow--open" : ""}"><use xlink:href="#iconRight"></use></svg>
</span>
${iconHTML}
<span class="b3-list-item__text"${titleTip}>${item.name}</span>
<span class="b3-list-item__text ariaLabel" data-position="parentE"${titleTip}>${item.name}</span>
${this.topExtHTML || ""}
${countHTML}
</li>`;
@ -148,7 +148,7 @@ data-def-path="${item.defPath}">
<svg data-id="${item.id}" class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
</span>
${iconHTML}
<span class="b3-list-item__text" ${type === "outline" ? ' title="' + Lute.EscapeHTMLStr(Lute.BlockDOM2Content(item.content)) + '"' : ""}>${item.content}</span>
<span class="b3-list-item__text ariaLabel" data-position="parentE" ${type === "outline" ? ' aria-label="' + Lute.EscapeHTMLStr(Lute.BlockDOM2Content(item.content)) + '"' : ""}>${item.content}</span>
${countHTML}
${this.blockExtHTML || ""}
</li>`;