diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css
index 10f3c0e95d7..accd6093069 100644
--- a/src/librustdoc/html/static/css/rustdoc.css
+++ b/src/librustdoc/html/static/css/rustdoc.css
@@ -1431,6 +1431,9 @@ kbd {
border: solid 1px var(--border-color);
border-radius: 3px;
cursor: default;
+ color: var(--kbd--color);
+ background-color: var(--kbd-background);
+ box-shadow: inset 0 -1px 0 var(--kbd-box-shadow-color);
}
ul.all-items > li {
diff --git a/src/librustdoc/html/static/css/themes/ayu.css b/src/librustdoc/html/static/css/themes/ayu.css
index 9d2493c035d..952d3e833fb 100644
--- a/src/librustdoc/html/static/css/themes/ayu.css
+++ b/src/librustdoc/html/static/css/themes/ayu.css
@@ -69,6 +69,9 @@ Original by Dempfi (https://github.com/dempfi/ayu)
--target-border-color: rgba(255, 180, 76, 0.85);
--tooltip-background-color: #314559;
--tooltip-color: #c5c5c5;
+ --kbd-color: #c5c5c5;
+ --kbd-background: #314559;
+ --kbd-box-shadow-color: #5c6773;
--rust-logo-filter: drop-shadow(1px 0 0px #fff)
drop-shadow(0 1px 0 #fff)
drop-shadow(-1px 0 0 #fff)
@@ -195,12 +198,6 @@ pre.rust .kw {}
pre.rust .self, pre.rust .bool-val, pre.rust .prelude-val, pre.rust .attribute {}
pre.rust .kw-2, pre.rust .prelude-ty {}
-kbd {
- color: #c5c5c5;
- background-color: #314559;
- box-shadow: inset 0 -1px 0 #5c6773;
-}
-
#settings-menu > a img {
filter: invert(100);
}
diff --git a/src/librustdoc/html/static/css/themes/dark.css b/src/librustdoc/html/static/css/themes/dark.css
index 22a3ae7b273..6327083f6ae 100644
--- a/src/librustdoc/html/static/css/themes/dark.css
+++ b/src/librustdoc/html/static/css/themes/dark.css
@@ -64,6 +64,9 @@
--target-border-color: #bb7410;
--tooltip-background-color: #000;
--tooltip-color: #fff;
+ --kbd-color: #000;
+ --kbd-background: #fafbfc;
+ --kbd-box-shadow-color: #c6cbd1;
--rust-logo-filter: drop-shadow(1px 0 0px #fff)
drop-shadow(0 1px 0 #fff)
drop-shadow(-1px 0 0 #fff)
@@ -100,12 +103,6 @@ details.rustdoc-toggle > summary::before {
color: #888;
}
-kbd {
- color: #000;
- background-color: #fafbfc;
- box-shadow: inset 0 -1px 0 #c6cbd1;
-}
-
.search-results .result-name span.alias {
color: #fff;
}
diff --git a/src/librustdoc/html/static/css/themes/light.css b/src/librustdoc/html/static/css/themes/light.css
index 219dd5cd2ec..0ea709e3e8d 100644
--- a/src/librustdoc/html/static/css/themes/light.css
+++ b/src/librustdoc/html/static/css/themes/light.css
@@ -64,6 +64,9 @@
--target-border-color: #ad7c37;
--tooltip-background-color: #fdffd3;
--tooltip-color: #fff;
+ --kbd-color: #000;
+ --kbd-background: #fafbfc;
+ --kbd-box-shadow-color: #c6cbd1;
--rust-logo-filter: initial;
/* match border-color; uses https://codepen.io/sosuke/pen/Pjoqqp */
--crate-search-div-filter: invert(100%) sepia(0%) saturate(4223%) hue-rotate(289deg)
@@ -93,12 +96,6 @@ body.source .example-wrap pre.rust a {
color: #888;
}
-kbd {
- color: #000;
- background-color: #fafbfc;
- box-shadow: inset 0 -1px 0 #c6cbd1;
-}
-
.search-results .result-name span.alias {
color: #000;
}
diff --git a/src/test/rustdoc-gui/help-page.goml b/src/test/rustdoc-gui/help-page.goml
index 392f17bfd47..799ba851c92 100644
--- a/src/test/rustdoc-gui/help-page.goml
+++ b/src/test/rustdoc-gui/help-page.goml
@@ -13,6 +13,44 @@ assert-css: ("#help", {"display": "block"})
compare-elements-property: (".sub", "#help", ["offsetWidth"])
compare-elements-position: (".sub", "#help", ("x"))
+// Checking the color of the elements of the help menu.
+show-text: true
+define-function: (
+ "check-colors",
+ (theme, color, background, box_shadow),
+ [
+ // 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", ("#help kbd", {
+ "color": |color|,
+ "background-color": |background|,
+ "box-shadow": |box_shadow| + " 0px -1px 0px 0px inset",
+ "cursor": "default",
+ }, ALL)),
+ ],
+)
+
+call-function: ("check-colors", {
+ "theme": "ayu",
+ "color": "rgb(197, 197, 197)",
+ "background": "rgb(49, 69, 89)",
+ "box_shadow": "rgb(92, 103, 115)",
+})
+call-function: ("check-colors", {
+ "theme": "dark",
+ "color": "rgb(221, 221, 221)",
+ "background": "rgb(250, 251, 252)",
+ "box_shadow": "rgb(198, 203, 209)",
+})
+call-function: ("check-colors", {
+ "theme": "light",
+ "color": "rgb(0, 0, 0)",
+ "background": "rgb(250, 251, 252)",
+ "box_shadow": "rgb(198, 203, 209)",
+})
+
// This test ensures that opening the help popover without switching pages works.
goto: "file://" + |DOC_PATH| + "/test_docs/index.html"
size: (1000, 1000) // Only supported on desktop.