diff --git a/docs/download/_download.html b/docs/download/_download.html index 6c6ffd69f8..95dd79d7b2 100644 --- a/docs/download/_download.html +++ b/docs/download/_download.html @@ -74,11 +74,6 @@ } - window.tippy("a.checksum[data-tippy-content]", { - interactive: true, - placement: "top-end", - maxWidth: "none", - }); }) .catch((err) => { console.log(err); @@ -217,7 +212,15 @@ } const table = createTable(); - createHeadingRow(table, ["Platform", "Download", "Size", "SHA-256"]); + // Link the header to the release's checksums.txt: the full values stay + // reachable even where narrow screens truncate the hashes (WCAG 1.4.10). + const checksumsAsset = assets.find((asset) => + asset.name.endsWith("-checksums.txt") + ); + const shaHeading = checksumsAsset + ? `SHA-256` + : "SHA-256"; + createHeadingRow(table, ["Platform", "Download", "Size", shaHeading]); const tbody = table.createTBody(); assets.forEach((asset) => { @@ -228,11 +231,6 @@ } downloadTableContainer.append(table); - window.tippy(".checksum[data-tippy-content]", { - interactive: true, - placement: "top-end", - maxWidth: "none", - }); } function createTable() { @@ -287,12 +285,9 @@ const checksumCell = row.insertCell(i++); if (asset.checksum) { - const checkSumSlice = asset.checksum.slice(0, 7); - const checksumEl = window.document.createElement("div"); checksumEl.className = "checksum font-monospace"; - checksumEl.setAttribute("data-tippy-content", asset.checksum); - checksumEl.innerText = checkSumSlice; + checksumEl.innerText = asset.checksum; checksumCell.appendChild(checksumEl); } } diff --git a/styles.css b/styles.css index bd02daf0db..c946f5b0a4 100644 --- a/styles.css +++ b/styles.css @@ -91,11 +91,16 @@ body.quarto-dark #quarto-header { margin-bottom: 0; } +/* The cell holds the full hash; only the rendering truncates (ellipsis). + Screen readers, copying, and find-in-page all see the complete value, + and the header links to checksums.txt for the full values. */ .download-table .checksum { - color: var(--bs-primary); font-size: .775em; - cursor: pointer; padding-top: 4px; + max-width: 9ch; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } .download-button {