From cbcb74e939527750740b0c715068723f5a6e595c Mon Sep 17 00:00:00 2001 From: Michael Howell Date: Thu, 8 Sep 2022 17:46:57 -0700 Subject: rustdoc: simplify the codeblock tooltip This commit moves the tooltip into example-wrap, simplifying allowing several overly-complex things to be fixed: * The mousover javascript can be removed, because hovering example-wrap can style the tooltip inside. * The sibling selecor can be removed, because hovering the tooltip also hovers the wrapper, which can hover the codeblock itself. * The relative positioning of the `
  • ` tag, which was added in e861efd9f9ca45c1048a256812dfe8faffbb1367 to fix the positioning of the code tooltip, can now be removed, because example-wrap itself already has relative positioning. --- src/librustdoc/html/static/css/rustdoc.css | 20 ++++++++------------ src/librustdoc/html/static/js/main.js | 23 ++--------------------- 2 files changed, 10 insertions(+), 33 deletions(-) (limited to 'src/librustdoc/html/static') diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css index 1b8b28f0432..7585824ee6e 100644 --- a/src/librustdoc/html/static/css/rustdoc.css +++ b/src/librustdoc/html/static/css/rustdoc.css @@ -352,10 +352,6 @@ img { max-width: 100%; } -li { - position: relative; -} - .source .content { max-width: none; overflow: visible; @@ -657,7 +653,7 @@ h2.location a { position: relative; } -.docblock > :not(.information):not(.more-examples-toggle) { +.docblock > :not(.more-examples-toggle):not(.example-wrap) { max-width: 100%; overflow-x: auto; } @@ -1174,12 +1170,12 @@ pre.ignore { border-left: 2px solid var(--codeblock-ignore-color); } -pre.compile_fail:hover, .information:hover + .example-wrap pre.compile_fail, -pre.should_panic:hover, .information:hover + .example-wrap pre.should_panic { +.example-wrap:hover pre.compile_fail, +.example-wrap:hover pre.should_panic { border-left: 2px solid var(--codeblock-error-hover-color); } -pre.ignore:hover, .information:hover + .example-wrap pre.ignore { +.example-wrap:hover pre.ignore { border-left: 2px solid var(--codeblock-ignore-hover-color); } @@ -1192,12 +1188,12 @@ pre.ignore:hover, .information:hover + .example-wrap pre.ignore { color: var(--codeblock-ignore-color); } -.information > .compile_fail:hover, -.information > .should_panic:hover { +.example-wrap:hover .tooltip.compile_fail, +.example-wrap:hover .tooltip.should_panic { color: var(--codeblock-error-hover-color); } -.information > .ignore:hover { +.example-wrap:hover .tooltip.ignore { color: var(--codeblock-ignore-hover-color); } @@ -1738,7 +1734,7 @@ in storage.js plus the media query with (max-width: 700px) to prevent an overlay between the "collapse toggle" and the information tooltip. However, it's not needed with smaller screen width because the doc/code block is always put "one line" below. */ - .docblock > .information:first-child > .tooltip { + .docblock > .example-wrap:first-child > .information > .tooltip { margin-top: 16px; } diff --git a/src/librustdoc/html/static/js/main.js b/src/librustdoc/html/static/js/main.js index 7f61c95e794..6e9660ddcc9 100644 --- a/src/librustdoc/html/static/js/main.js +++ b/src/librustdoc/html/static/js/main.js @@ -699,9 +699,8 @@ function loadCss(cssFileName) { (function() { // To avoid checking on "rustdoc-line-numbers" value on every loop... - let lineNumbersFunc = () => {}; if (getSettingValue("line-numbers") === "true") { - lineNumbersFunc = x => { + onEachLazy(document.getElementsByClassName("rust-example-rendered"), x => { const count = x.textContent.split("\n").length; const elems = []; for (let i = 0; i < count; ++i) { @@ -711,26 +710,8 @@ function loadCss(cssFileName) { addClass(node, "line-number"); node.innerHTML = elems.join("\n"); x.parentNode.insertBefore(node, x); - }; + }); } - onEachLazy(document.getElementsByClassName("rust-example-rendered"), e => { - if (hasClass(e, "compile_fail")) { - e.addEventListener("mouseover", function() { - this.parentElement.previousElementSibling.childNodes[0].style.color = "#f00"; - }); - e.addEventListener("mouseout", function() { - this.parentElement.previousElementSibling.childNodes[0].style.color = ""; - }); - } else if (hasClass(e, "ignore")) { - e.addEventListener("mouseover", function() { - this.parentElement.previousElementSibling.childNodes[0].style.color = "#ff9200"; - }); - e.addEventListener("mouseout", function() { - this.parentElement.previousElementSibling.childNodes[0].style.color = ""; - }); - } - lineNumbersFunc(e); - }); }()); let oldSidebarScrollPosition = null; -- cgit 1.4.1-3-g733a5