Rollup merge of #101600 - notriddle:notriddle/li, r=GuillaumeGomez

rustdoc: simplify the codeblock tooltip

**https://github.com/rust-lang/rust/pull/101593 needs merged first**

This PR moves the tooltip into example-wrap, simplifying several overly-complex aspects of how these tooltips work:

* 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 `<li>` tag, which was added in https://github.com/rust-lang/rust/commit/e861efd9f9ca45c1048a256812dfe8faffbb1367 to fix the positioning of the code tooltip, can now be removed, because example-wrap itself already has relative positioning.

3 files changed, 38 insertions, 60 deletions

diff --git a/src/librustdoc/html/highlight.rs b/src/librustdoc/html/highlight.rs
index bb8e46af762..84781d89838 100644
--- a/src/librustdoc/html/highlight.rs
+++ b/src/librustdoc/html/highlight.rs
@@ -52,35 +52,14 @@ pub(crate) fn render_example_with_highlighting(
     tooltip: Tooltip,
     playground_button: Option<&str>,
 ) {
-    let class = match tooltip {
-        Tooltip::Ignore => " ignore",
-        Tooltip::CompileFail => " compile_fail",
-        Tooltip::ShouldPanic => " should_panic",
-        Tooltip::Edition(_) => " edition",
-        Tooltip::None => "",
-    };
-
-    if tooltip != Tooltip::None {
-        write!(
-            out,
-            "<div class='information'><div class='tooltip{}'{}>ⓘ</div></div>",
-            class,
-            if let Tooltip::Edition(edition_info) = tooltip {
-                format!(" data-edition=\"{}\"", edition_info)
-            } else {
-                String::new()
-            },
-        );
-    }
-
-    write_header(out, &format!("rust-example-rendered{}", class), None);
+    write_header(out, "rust-example-rendered", None, tooltip);
     write_code(out, src, None, None);
     write_footer(out, playground_button);
 }
 
 /// Highlights `src` as a macro, returning the HTML output.
 pub(crate) fn render_macro_with_highlighting(src: &str, out: &mut Buffer) {
-    write_header(out, "macro", None);
+    write_header(out, "macro", None, Tooltip::None);
     write_code(out, src, None, None);
     write_footer(out, None);
 }
@@ -93,20 +72,42 @@ pub(crate) fn render_source_with_highlighting(
     href_context: HrefContext<'_, '_, '_>,
     decoration_info: DecorationInfo,
 ) {
-    write_header(out, "", Some(line_numbers));
+    write_header(out, "", Some(line_numbers), Tooltip::None);
     write_code(out, src, Some(href_context), Some(decoration_info));
     write_footer(out, None);
 }
 
-fn write_header(out: &mut Buffer, class: &str, extra_content: Option<Buffer>) {
+fn write_header(out: &mut Buffer, class: &str, extra_content: Option<Buffer>, tooltip: Tooltip) {
     write!(out, "<div class=\"example-wrap\">");
+
+    let tooltip_class = match tooltip {
+        Tooltip::Ignore => " ignore",
+        Tooltip::CompileFail => " compile_fail",
+        Tooltip::ShouldPanic => " should_panic",
+        Tooltip::Edition(_) => " edition",
+        Tooltip::None => "",
+    };
+
+    if tooltip != Tooltip::None {
+        write!(
+            out,
+            "<div class='information'><div class='tooltip{}'{}>ⓘ</div></div>",
+            tooltip_class,
+            if let Tooltip::Edition(edition_info) = tooltip {
+                format!(" data-edition=\"{}\"", edition_info)
+            } else {
+                String::new()
+            },
+        );
+    }
+
     if let Some(extra) = extra_content {
         out.push_buffer(extra);
     }
-    if class.is_empty() {
+    if class.is_empty() && tooltip_class.is_empty() {
         write!(out, "<pre class=\"rust\">");
     } else {
-        write!(out, "<pre class=\"rust {}\">", class);
+        write!(out, "<pre class=\"rust {class}{tooltip_class}\">");
     }
     write!(out, "<code>");
 }
diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css
index 22217a39012..ec9e3b1ecd1 100644
--- a/src/librustdoc/html/static/css/rustdoc.css
+++ b/src/librustdoc/html/static/css/rustdoc.css
@@ -347,10 +347,6 @@ img {
 	max-width: 100%;
 }
 
-li {
-	position: relative;
-}
-
 .source .content {
 	max-width: none;
 	overflow: visible;
@@ -652,7 +648,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;
 }
@@ -1169,12 +1165,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);
 }
 
@@ -1187,12 +1183,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);
 }
 
@@ -1727,7 +1723,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;