diff --git a/app/src/block/popover.ts b/app/src/block/popover.ts index ec287d47f..55599cf70 100644 --- a/app/src/block/popover.ts +++ b/app/src/block/popover.ts @@ -7,6 +7,7 @@ import {App} from "../index"; import {Constants} from "../constants"; import {getCellText} from "../protyle/render/av/cell"; import {isTouchDevice} from "../util/functions"; +import {escapeAriaLabel} from "../util/escape"; let popoverTargetElement: HTMLElement; let notebookItemElement: HTMLElement | false; @@ -28,7 +29,17 @@ export const initBlockPopover = (app: App) => { let tooltipClass = ""; let tip = aElement.getAttribute("aria-label"); if (aElement.classList.contains("av__cell")) { - if (!aElement.classList.contains("av__cell--header")) { + if (aElement.classList.contains("av__cell--header")) { + const textElement = aElement.querySelector(".av__celltext"); + const desc = aElement.getAttribute("data-desc") + if (textElement.scrollWidth > textElement.clientWidth + 2 || desc) { + if (desc) { + tip = `${getCellText(aElement)}
${escapeAriaLabel(desc)}
`; + } else { + tip = getCellText(aElement); + } + } + } else { if (aElement.firstElementChild?.getAttribute("data-type") === "url") { if (aElement.firstElementChild.textContent.indexOf("...") > -1) { tip = Lute.EscapeHTMLStr(aElement.firstElementChild.getAttribute("data-href")); @@ -43,6 +54,16 @@ export const initBlockPopover = (app: App) => { aElement.style.overflow = ""; } } + } else if (aElement.parentElement.parentElement.classList.contains("av__views")) { + const textElement = aElement.querySelector(".item__text"); + const desc = aElement.getAttribute("data-desc") + if (textElement.scrollWidth > textElement.clientWidth + 2 || desc) { + if (desc) { + tip = `${textElement.textContent}
${escapeAriaLabel(desc)}
`; + } else { + tip = textElement.textContent; + } + } } else if (aElement.classList.contains("av__celltext--url")) { tip = tip ? `${tip.substring(0, Constants.SIZE_TITLE)}
${aElement.getAttribute("data-name")}` : aElement.getAttribute("data-name"); tooltipClass = "href"; diff --git a/app/src/protyle/render/av/render.ts b/app/src/protyle/render/av/render.ts index 0697c61a2..b90fecc4e 100644 --- a/app/src/protyle/render/av/render.ts +++ b/app/src/protyle/render/av/render.ts @@ -131,10 +131,9 @@ export const avRender = (element: Element, protyle: IProtyle, cb?: () => void, v if (column.hidden) { return; } - tableHTML += `
" style="width: ${column.width || "200px"};"> ${column.icon ? unicode2Emoji(column.icon, "av__cellheadericon", true) : ``} ${escapeHtml(column.name)} @@ -202,7 +201,7 @@ ${cell.color ? `color:${cell.color};` : ""}">${renderCell(cell.value, rowIndex)} let tabHTML = ""; let viewData: IAVView; response.data.views.forEach((item: IAVView) => { - tabHTML += `
" class="ariaLabel item${item.id === response.data.viewID ? " item--focus" : ""}"> + tabHTML += `
${item.icon ? unicode2Emoji(item.icon, "item__graphic", true) : ''} ${escapeHtml(item.name)}
`; diff --git a/app/src/protyle/render/av/view.ts b/app/src/protyle/render/av/view.ts index 05dbea5cb..97dafa53f 100644 --- a/app/src/protyle/render/av/view.ts +++ b/app/src/protyle/render/av/view.ts @@ -319,7 +319,7 @@ export const getSwitcherHTML = (views: IAVView[], viewId: string) => {
${item.icon ? unicode2Emoji(item.icon, "b3-menu__icon", true) : ''} - ${item.name} + ${item.name}
`; @@ -330,7 +330,7 @@ export const getSwitcherHTML = (views: IAVView[], viewId: string) => { ${window.siyuan.languages.newView} -
+