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

This commit is contained in:
Guillaume Gomez 2024-11-01 20:16:43 +01:00
parent ca5c6f6c26
commit ac764df8ab
4 changed files with 9 additions and 4 deletions

View File

@ -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> {# #}

View File

@ -1,3 +0,0 @@
#settings-dropdown, #menu-filters {
display: none;
}

View File

@ -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;

View File

@ -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");