Fix CSS on search input focus

3 files changed, 21 insertions, 3 deletions

diff --git a/src/librustdoc/html/static/css/themes/ayu.css b/src/librustdoc/html/static/css/themes/ayu.css
index 142ce456c52..7ff8063904a 100644
--- a/src/librustdoc/html/static/css/themes/ayu.css
+++ b/src/librustdoc/html/static/css/themes/ayu.css
@@ -184,7 +184,13 @@ details.rustdoc-toggle > summary::before {
 
 #crate-search, .search-input {
 	background-color: #141920;
-	/* Without the `!important`, the border-color is ignored for `<select>`... */
+	border-color: #424c57;
+}
+
+#crate-search {
+	/* Without the `!important`, the border-color is ignored for `<select>`...
+	   It cannot be in the group above because `.search-input` has a different border color on
+	   hover. */
 	border-color: #424c57 !important;
 }
 
diff --git a/src/librustdoc/html/static/css/themes/dark.css b/src/librustdoc/html/static/css/themes/dark.css
index aeaca7515f9..8e753f57682 100644
--- a/src/librustdoc/html/static/css/themes/dark.css
+++ b/src/librustdoc/html/static/css/themes/dark.css
@@ -159,7 +159,13 @@ details.rustdoc-toggle > summary::before {
 #crate-search, .search-input {
 	color: #111;
 	background-color: #f0f0f0;
-	/* Without the `!important`, the border-color is ignored for `<select>`... */
+	border-color: #f0f0f0;
+}
+
+#crate-search {
+	/* Without the `!important`, the border-color is ignored for `<select>`...
+	   It cannot be in the group above because `.search-input` has a different border color on
+	   hover. */
 	border-color: #f0f0f0 !important;
 }
 
diff --git a/src/librustdoc/html/static/css/themes/light.css b/src/librustdoc/html/static/css/themes/light.css
index 54d1a7b65d6..40d965c39c3 100644
--- a/src/librustdoc/html/static/css/themes/light.css
+++ b/src/librustdoc/html/static/css/themes/light.css
@@ -146,7 +146,13 @@ details.rustdoc-toggle > summary::before {
 
 #crate-search, .search-input {
 	background-color: white;
-	/* Without the `!important`, the border-color is ignored for `<select>`... */
+	border-color: #e0e0e0;
+}
+
+#crate-search {
+	/* Without the `!important`, the border-color is ignored for `<select>`...
+	   It cannot be in the group above because `.search-input` has a different border color on
+	   hover. */
 	border-color: #e0e0e0 !important;
 }