diff options
| -rw-r--r-- | assets/cgit.css | 1 | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| -rw-r--r-- | assets/cgit.js | 18 | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
2 files changed, 15 insertions, 4 deletions
diff --git a/assets/cgit.css b/assets/cgit.css index 2f53559..0149519 100644 --- a/assets/cgit.css +++ b/assets/cgit.css @@ -690,7 +690,6 @@ div#cgit table.blame { div#cgit div.line-hl { position: absolute; left: 0; - right: 0; background: var(--line-hl); pointer-events: none; } diff --git a/assets/cgit.js b/assets/cgit.js index 2c0a828..807f15f 100644 --- a/assets/cgit.js +++ b/assets/cgit.js @@ -112,7 +112,7 @@ var bar = null; function place_bar() { var match, first, last, table; - var table_box, first_box, last_box, top, bottom; + var table_box, first_box, last_box, leading, origin, top, bottom; if (bar) { bar.remove(); @@ -131,12 +131,24 @@ function place_bar() { table_box = table.getBoundingClientRect(); first_box = first.getBoundingClientRect(); last_box = last.getBoundingClientRect(); - top = Math.min(first_box.top, last_box.top) - table_box.top; - bottom = Math.max(first_box.bottom, last_box.bottom) - table_box.top; + + // An anchor's box holds only its digits, centred in a line that the line + // height makes taller, so the bar reaches out by the difference to cover + // whole lines. A line height of normal leaves nothing to add. + leading = parseFloat(getComputedStyle(first).lineHeight); + leading = (leading - first_box.height) / 2 || 0; + + // The bar is placed from inside the table's border, not from its edge. + origin = table_box.top + table.clientTop; + top = Math.min(first_box.top, last_box.top) - leading - origin; + bottom = Math.max(first_box.bottom, last_box.bottom) + leading - origin; bar = document.createElement("div"); bar.className = "line-hl"; bar.style.top = top + "px"; bar.style.height = (bottom - top) + "px"; + // A table too wide for the page scrolls sideways, and the bar has to run + // to the end of its longest line rather than to the edge of the view. + bar.style.width = table.scrollWidth + "px"; table.appendChild(bar); // A browser only scrolls to a fragment that names a real id, which a range |
