A tiny browser-console script for Hacker News that displays each comment's indentation level directly inside the comment cell.

1 min read Original article ↗

A tiny browser-console script for Hacker News that displays each comment's indentation level directly inside the comment cell.

function showIndentNumberInTDs({
selector = "td.ind",
attr = "indent",
className = "indent-label",
color = "#ff660088",
fontSize = "28px",
fontWeight = "600",
padding = "4px"
} = {}) {
const tds = document.querySelectorAll(selector);
tds.forEach(td => {
const n = parseInt(td.getAttribute(attr), 10);
if (!Number.isFinite(n)) return;
// Remove existing label if re-running
td.querySelectorAll(`:scope > .${className}`).forEach(el => el.remove());
// Ensure positioning context
if (getComputedStyle(td).position === "static") {
td.style.position = "relative";
}
const label = document.createElement("div");
label.className = className;
label.textContent = n;
Object.assign(label.style, {
position: "absolute",
top: padding,
right: padding,
color,
fontSize,
fontWeight,
lineHeight: "1",
pointerEvents: "none",
userSelect: "none",
zIndex: 1
});
td.appendChild(label);
});
return { updated: tds.length };
}
// Run it
showIndentNumberInTDs();