Rollup merge of #101593 - GuillaumeGomez:cleanup-theme-tooltip, r=notriddle

Cleanup themes (tooltip)

No changes in the UI. I used this opportunity to unify the dark theme with the others for the alpha parameter though.

r? `@notriddle`

src/librustdoc/html/static/css/rustdoc.css

@@ -1160,6 +1160,42 @@ pre.rust .question-mark {
 	font-weight: bold;
 }
 
+pre.compile_fail,
+pre.should_panic {
+	border-left: 2px solid var(--codeblock-error-color);
+}
+
+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 {
+	border-left: 2px solid var(--codeblock-error-hover-color);
+}
+
+pre.ignore:hover, .information:hover + .example-wrap pre.ignore {
+	border-left: 2px solid var(--codeblock-ignore-hover-color);
+}
+
+.tooltip.compile_fail,
+.tooltip.should_panic {
+	color: var(--codeblock-error-color);
+}
+
+.tooltip.ignore {
+	color:  var(--codeblock-ignore-color);
+}
+
+.information > .compile_fail:hover,
+.information > .should_panic:hover {
+	color: var(--codeblock-error-hover-color);
+}
+
+.information > .ignore:hover {
+	color: var(--codeblock-ignore-hover-color);
+}
+
 a.test-arrow {
 	display: inline-block;
 	visibility: hidden;

src/librustdoc/html/static/css/themes/ayu.css

@@ -23,6 +23,10 @@ Original by Dempfi (https://github.com/dempfi/ayu)
 	--copy-path-button-color: #fff;
 	--copy-path-img-filter: invert(70%);
 	--copy-path-img-hover-filter: invert(100%);
+	--codeblock-error-hover-color: rgb(255, 0, 0);
+	--codeblock-error-color: rgba(255, 0, 0, .5);
+	--codeblock-ignore-hover-color: rgb(255, 142, 0);
+	--codeblock-ignore-color: rgba(255, 142, 0, .6);
 }
 
 .slider {
@@ -244,54 +248,6 @@ a.test-arrow:hover {
 	border-right: 3px solid rgba(255, 180, 76, 0.85);
 }
 
-pre.compile_fail {
-	border-left: 2px solid rgba(255,0,0,.4);
-}
-
-pre.compile_fail:hover, .information:hover + pre.compile_fail {
-	border-left: 2px solid #f00;
-}
-
-pre.should_panic {
-	border-left: 2px solid rgba(255,0,0,.4);
-}
-
-pre.should_panic:hover, .information:hover + pre.should_panic {
-	border-left: 2px solid #f00;
-}
-
-pre.ignore {
-	border-left: 2px solid rgba(255,142,0,.6);
-}
-
-pre.ignore:hover, .information:hover + pre.ignore {
-	border-left: 2px solid #ff9200;
-}
-
-.tooltip.compile_fail {
-	color: rgba(255,0,0,.5);
-}
-
-.information > .compile_fail:hover {
-	color: #f00;
-}
-
-.tooltip.should_panic {
-	color: rgba(255,0,0,.5);
-}
-
-.information > .should_panic:hover {
-	color: #f00;
-}
-
-.tooltip.ignore {
-	color: rgba(255,142,0,.6);
-}
-
-.information > .ignore:hover {
-	color: #ff9200;
-}
-
 .search-failed a {
 	color: #39AFD7;
 }

src/librustdoc/html/static/css/themes/dark.css

@@ -18,6 +18,10 @@
 	--copy-path-button-color: #999;
 	--copy-path-img-filter: invert(50%);
 	--copy-path-img-hover-filter: invert(65%);
+	--codeblock-error-hover-color: rgb(255, 0, 0);
+	--codeblock-error-color: rgba(255, 0, 0, .5);
+	--codeblock-ignore-hover-color: rgb(255, 142, 0);
+	--codeblock-ignore-color: rgba(255, 142, 0, .6);
 }
 
 .slider {
@@ -194,54 +198,6 @@ a.test-arrow:hover{
 	border-right: 3px solid #bb7410;
 }
 
-pre.compile_fail {
-	border-left: 2px solid rgba(255,0,0,.8);
-}
-
-pre.compile_fail:hover, .information:hover + pre.compile_fail {
-	border-left: 2px solid #f00;
-}
-
-pre.should_panic {
-	border-left: 2px solid rgba(255,0,0,.8);
-}
-
-pre.should_panic:hover, .information:hover + pre.should_panic {
-	border-left: 2px solid #f00;
-}
-
-pre.ignore {
-	border-left: 2px solid rgba(255,142,0,.6);
-}
-
-pre.ignore:hover, .information:hover + pre.ignore {
-	border-left: 2px solid #ff9200;
-}
-
-.tooltip.compile_fail {
-	color: rgba(255,0,0,.8);
-}
-
-.information > .compile_fail:hover {
-	color: #f00;
-}
-
-.tooltip.should_panic {
-	color: rgba(255,0,0,.8);
-}
-
-.information > .should_panic:hover {
-	color: #f00;
-}
-
-.tooltip.ignore {
-	color: rgba(255,142,0,.6);
-}
-
-.information > .ignore:hover {
-	color: #ff9200;
-}
-
 .search-failed a {
 	color: #0089ff;
 }

src/librustdoc/html/static/css/themes/light.css

@@ -18,6 +18,10 @@
 	--copy-path-button-color: #999;
 	--copy-path-img-filter: invert(50%);
 	--copy-path-img-hover-filter: invert(35%);
+	--codeblock-error-hover-color: rgb(255, 0, 0);
+	--codeblock-error-color: rgba(255, 0, 0, .5);
+	--codeblock-ignore-hover-color: rgb(255, 142, 0);
+	--codeblock-ignore-color: rgba(255, 142, 0, .6);
 }
 
 .slider {
@@ -180,54 +184,6 @@ a.test-arrow:hover{
 	border-right: 3px solid #AD7C37;
 }
 
-pre.compile_fail {
-	border-left: 2px solid rgba(255,0,0,.5);
-}
-
-pre.compile_fail:hover, .information:hover + pre.compile_fail {
-	border-left: 2px solid #f00;
-}
-
-pre.should_panic {
-	border-left: 2px solid rgba(255,0,0,.5);
-}
-
-pre.should_panic:hover, .information:hover + pre.should_panic {
-	border-left: 2px solid #f00;
-}
-
-pre.ignore {
-	border-left: 2px solid rgba(255,142,0,.6);
-}
-
-pre.ignore:hover, .information:hover + pre.ignore {
-	border-left: 2px solid #ff9200;
-}
-
-.tooltip.compile_fail {
-	color: rgba(255,0,0,.5);
-}
-
-.information > .compile_fail:hover {
-	color: #f00;
-}
-
-.tooltip.should_panic {
-	color: rgba(255,0,0,.5);
-}
-
-.information > .should_panic:hover {
-	color: #f00;
-}
-
-.tooltip.ignore {
-	color: rgba(255,142,0,.6);
-}
-
-.information > .ignore:hover {
-	color: #ff9200;
-}
-
 .search-failed a {
 	color: #3873AD;
 }

src/test/rustdoc-gui/code-tags.goml

@@ -1,9 +1,9 @@
 // This test ensures that items and documentation code blocks are wrapped in <pre><code>
 goto: file://|DOC_PATH|/test_docs/fn.foo.html
 size: (1080, 600)
-// There should be three doc codeblocks
+// There should be four doc codeblocks.
 // Check that their content is inside <pre><code>
-assert-count: (".example-wrap pre > code", 3)
+assert-count: (".example-wrap pre > code", 4)
 // Check that function signature is inside <pre><code>
 assert: "pre.rust.fn > code"
 

src/test/rustdoc-gui/codeblock-tooltip.goml

@@ -0,0 +1,96 @@
+// Checking the colors of the codeblocks tooltips.
+goto: file://|DOC_PATH|/test_docs/fn.foo.html
+show-text: true
+
+// Dark theme.
+local-storage: {"rustdoc-theme": "dark", "rustdoc-use-system-theme": "false"}
+reload:
+
+// compile_fail block
+assert-css: (".docblock .information .compile_fail", {"color": "rgba(255, 0, 0, 0.5)"})
+assert-css: (".docblock .example-wrap .compile_fail", {"border-left": "2px solid rgba(255, 0, 0, 0.5)"})
+
+move-cursor-to: ".docblock .information .compile_fail"
+
+assert-css: (".docblock .information .compile_fail", {"color": "rgb(255, 0, 0)"})
+assert-css: (".docblock .example-wrap .compile_fail", {"border-left": "2px solid rgb(255, 0, 0)"})
+
+// should_panic block
+assert-css: (".docblock .information .should_panic", {"color": "rgba(255, 0, 0, 0.5)"})
+assert-css: (".docblock .example-wrap .should_panic", {"border-left": "2px solid rgba(255, 0, 0, 0.5)"})
+
+move-cursor-to: ".docblock .information .should_panic"
+
+assert-css: (".docblock .information .should_panic", {"color": "rgb(255, 0, 0)"})
+assert-css: (".docblock .example-wrap .should_panic", {"border-left": "2px solid rgb(255, 0, 0)"})
+
+// ignore block
+assert-css: (".docblock .information .ignore", {"color": "rgba(255, 142, 0, 0.6)"})
+assert-css: (".docblock .example-wrap .ignore", {"border-left": "2px solid rgba(255, 142, 0, 0.6)"})
+
+move-cursor-to: ".docblock .information .ignore"
+
+assert-css: (".docblock .information .ignore", {"color": "rgb(255, 142, 0)"})
+assert-css: (".docblock .example-wrap .ignore", {"border-left": "2px solid rgb(255, 142, 0)"})
+
+
+// Light theme.
+local-storage: {"rustdoc-theme": "light"}
+reload:
+
+assert-css: (".docblock .information .compile_fail", {"color": "rgba(255, 0, 0, 0.5)"})
+assert-css: (".docblock .example-wrap .compile_fail", {"border-left": "2px solid rgba(255, 0, 0, 0.5)"})
+
+move-cursor-to: ".docblock .information .compile_fail"
+
+assert-css: (".docblock .information .compile_fail", {"color": "rgb(255, 0, 0)"})
+assert-css: (".docblock .example-wrap .compile_fail", {"border-left": "2px solid rgb(255, 0, 0)"})
+
+// should_panic block
+assert-css: (".docblock .information .should_panic", {"color": "rgba(255, 0, 0, 0.5)"})
+assert-css: (".docblock .example-wrap .should_panic", {"border-left": "2px solid rgba(255, 0, 0, 0.5)"})
+
+move-cursor-to: ".docblock .information .should_panic"
+
+assert-css: (".docblock .information .should_panic", {"color": "rgb(255, 0, 0)"})
+assert-css: (".docblock .example-wrap .should_panic", {"border-left": "2px solid rgb(255, 0, 0)"})
+
+// ignore block
+assert-css: (".docblock .information .ignore", {"color": "rgba(255, 142, 0, 0.6)"})
+assert-css: (".docblock .example-wrap .ignore", {"border-left": "2px solid rgba(255, 142, 0, 0.6)"})
+
+move-cursor-to: ".docblock .information .ignore"
+
+assert-css: (".docblock .information .ignore", {"color": "rgb(255, 142, 0)"})
+assert-css: (".docblock .example-wrap .ignore", {"border-left": "2px solid rgb(255, 142, 0)"})
+
+
+// Ayu theme.
+local-storage: {"rustdoc-theme": "ayu"}
+reload:
+
+assert-css: (".docblock .information .compile_fail", {"color": "rgba(255, 0, 0, 0.5)"})
+assert-css: (".docblock .example-wrap .compile_fail", {"border-left": "2px solid rgba(255, 0, 0, 0.5)"})
+
+move-cursor-to: ".docblock .information .compile_fail"
+
+assert-css: (".docblock .information .compile_fail", {"color": "rgb(255, 0, 0)"})
+assert-css: (".docblock .example-wrap .compile_fail", {"border-left": "2px solid rgb(255, 0, 0)"})
+
+// should_panic block
+assert-css: (".docblock .information .should_panic", {"color": "rgba(255, 0, 0, 0.5)"})
+assert-css: (".docblock .example-wrap .should_panic", {"border-left": "2px solid rgba(255, 0, 0, 0.5)"})
+
+move-cursor-to: ".docblock .information .should_panic"
+
+assert-css: (".docblock .information .should_panic", {"color": "rgb(255, 0, 0)"})
+assert-css: (".docblock .example-wrap .should_panic", {"border-left": "2px solid rgb(255, 0, 0)"})
+
+// ignore block
+assert-css: (".docblock .information .ignore", {"color": "rgba(255, 142, 0, 0.6)"})
+assert-css: (".docblock .example-wrap .ignore", {"border-left": "2px solid rgba(255, 142, 0, 0.6)"})
+
+move-cursor-to: ".docblock .information .ignore"
+
+assert-css: (".docblock .information .ignore", {"color": "rgb(255, 142, 0)"})
+assert-css: (".docblock .example-wrap .ignore", {"border-left": "2px solid rgb(255, 142, 0)"})

src/test/rustdoc-gui/src/test_docs/lib.rs

@@ -28,6 +28,12 @@ use std::fmt;
 /// Let's say I'm just some text will ya?
 /// ```
 ///
+/// A failing to run one:
+///
+/// ```should_panic
+/// panic!("tadam");
+/// ```
+///
 /// An inlined `code`!
 pub fn foo() {}