Rollup merge of #105132 - GuillaumeGomez:migrate-summary-toggle-to-var, r=notriddle

Migrate summary toggle filter to CSS variable

r? `@notriddle`

Author: matthiaskrgr

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

@@ -1516,6 +1516,7 @@ details.rustdoc-toggle > summary::before {
 	display: inline-block;
 	vertical-align: middle;
 	opacity: .5;
+	filter: var(--toggle-filter);
 }
 
 details.rustdoc-toggle > summary.hideme > span,

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

@@ -21,6 +21,7 @@ Original by Dempfi (https://github.com/dempfi/ayu)
 	--right-side-color: grey;
 	--code-attribute-color: #999;
 	--toggles-color: #999;
+	--toggle-filter: invert(100%);
 	--search-input-focused-border-color: #5c6773; /* Same as `--border-color`. */
 	--copy-path-button-color: #fff;
 	--copy-path-img-filter: invert(70%);
@@ -158,10 +159,6 @@ body.source .example-wrap pre.rust a {
 	background: #333;
 }
 
-details.rustdoc-toggle > summary::before {
-	filter: invert(100%);
-}
-
 .module-item .stab,
 .import-item .stab {
 	color: #000;

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

@@ -16,6 +16,7 @@
 	--right-side-color: grey;
 	--code-attribute-color: #999;
 	--toggles-color: #999;
+	--toggle-filter: invert(100%);
 	--search-input-focused-border-color: #008dfd;
 	--copy-path-button-color: #999;
 	--copy-path-img-filter: invert(50%);
@@ -89,10 +90,6 @@ body.source .example-wrap pre.rust a {
 	background: #333;
 }
 
-details.rustdoc-toggle > summary::before {
-	filter: invert(100%);
-}
-
 #titles > button:not(.selected) {
 	background-color: #252525;
 	border-top-color: #252525;

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

@@ -16,6 +16,7 @@
 	--right-side-color: grey;
 	--code-attribute-color: #999;
 	--toggles-color: #999;
+	--toggle-filter: none;
 	--search-input-focused-border-color: #66afe9;
 	--copy-path-button-color: #999;
 	--copy-path-img-filter: invert(50%);

src/test/rustdoc-gui/toggle-docs.goml

@@ -40,3 +40,32 @@ assert-attribute-false: (
 click: "#toggle-all-docs"
 wait-for-text: ("#toggle-all-docs", "[−]")
 assert-attribute: ("details.rustdoc-toggle", {"open": ""}, ALL)
+
+// Checking the toggles style.
+show-text: true
+define-function: (
+    "check-color",
+    (theme, filter),
+    [
+        // Setting the theme.
+	("local-storage", {"rustdoc-theme": |theme|, "rustdoc-use-system-theme": "false"}),
+        // We reload the page so the local storage settings are being used.
+        ("reload"),
+
+        ("assert-css", ("details.rustdoc-toggle > summary::before", {
+            "opacity": "0.5",
+            "filter": |filter|,
+        }, ALL)),
+        ("move-cursor-to", "details.rustdoc-toggle summary"),
+        ("assert-css", ("details.rustdoc-toggle > summary:hover::before", {
+            "opacity": "1",
+            "filter": |filter|,
+        })),
+        // moving the cursor somewhere else to not mess with next function calls.
+        ("move-cursor-to", ".search-input"),
+    ]
+)
+
+call-function: ("check-color", {"theme": "ayu", "filter": "invert(1)"})
+call-function: ("check-color", {"theme": "dark", "filter": "invert(1)"})
+call-function: ("check-color", {"theme": "light", "filter": "none"})