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

GuillaumeGomez · GuillaumeGomez · commit ac764df8ab34 · 2024-11-01T20:20:12.000+01:00
diff --git a/util/gh-pages/index_template.html b/util/gh-pages/index_template.html
@@ -24,7 +24,6 @@
     <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
diff --git 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
@@ -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");

Original file line number	Diff line number	Diff line change
`@@ -230,6 +230,11 @@ details[open] {`
`230`	`230`	`}`
`231`	`231`	`}`
`232`	`232`
	`233`	`+html:not(.js) #settings-dropdown,`
	`234`	`+html:not(.js)#menu-filters {`
	`235`	`+ display: none;`
	`236`	`+}`
	`237`	`+`
`233`	`238`	`#settings-dropdown {`
`234`	`239`	`position: absolute;`
`235`	`240`	`margin: 0.7em;`