Handle noscript style with "js" class on `<html>`.

4 files changed, 9 insertions, 4 deletions

diff --git a/util/gh-pages/index_template.html b/util/gh-pages/index_template.html
index 061777809b9..2fab1f2a2cd 100644
--- a/util/gh-pages/index_template.html
+++ b/util/gh-pages/index_template.html
@@ -24,7 +24,6 @@ Otherwise, have a great day =^.^=
     <link id="styleNight" rel="stylesheet" href="https://rust-lang.github.io/mdBook/tomorrow-night.css" disabled="true"> {# #}
     <link id="styleAyu" rel="stylesheet" href="https://rust-lang.github.io/mdBook/ayu-highlight.css" disabled="true"> {# #}
     <link rel="stylesheet" href="style.css"> {# #}
-    <noscript><link rel="stylesheet" href="noscript.css"></noscript> {# #}
 </head> {# #}
 <body> {# #}
     <script src="theme.js"></script> {# #}
diff --git a/util/gh-pages/noscript.css b/util/gh-pages/noscript.css
deleted file mode 100644
index 907509ce314..00000000000
--- a/util/gh-pages/noscript.css
+++ /dev/null
@@ -1,3 +0,0 @@
-#settings-dropdown, #menu-filters {
-    display: none;
-}
diff --git a/util/gh-pages/style.css b/util/gh-pages/style.css
index 8c5d64ad4e4..896f2fdac76 100644
--- a/util/gh-pages/style.css
+++ b/util/gh-pages/style.css
@@ -230,6 +230,11 @@ details[open] {
     }
 }
 
+html:not(.js) #settings-dropdown,
+html:not(.js)#menu-filters {
+    display: none;
+}
+
 #settings-dropdown {
     position: absolute;
     margin: 0.7em;
diff --git a/util/gh-pages/theme.js b/util/gh-pages/theme.js
index bc296955ddf..90f57d4469d 100644
--- a/util/gh-pages/theme.js
+++ b/util/gh-pages/theme.js
@@ -45,6 +45,10 @@ function setTheme(theme, store) {
 }
 
 (function() {
+    // This file is loaded first. If so, we add the `js` class on the `<html>`
+    // element.
+    document.documentElement.classList.add("js");
+
     // loading the theme after the initial load
     const prefersDark = window.matchMedia("(prefers-color-scheme: dark)");
     const theme = loadValue("theme");