diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css
index 7d578b5c7754a..933a44c5aa78d 100644
--- a/src/librustdoc/html/static/css/rustdoc.css
+++ b/src/librustdoc/html/static/css/rustdoc.css
@@ -87,21 +87,6 @@
box-sizing: border-box;
}
-/* This part handles the "default" theme being used depending on the system one. */
-html {
- content: "";
-}
-@media (prefers-color-scheme: light) {
- html {
- content: "light";
- }
-}
-@media (prefers-color-scheme: dark) {
- html {
- content: "dark";
- }
-}
-
/* General structure and fonts */
body {
@@ -1538,7 +1523,7 @@ However, it's not needed with smaller screen width because the doc/code block is
/*
WARNING: RUSTDOC_MOBILE_BREAKPOINT MEDIA QUERY
If you update this line, then you also need to update the line with the same warning
-in storage.js
+in main.js
*/
@media (max-width: 700px) {
/* When linking to an item with an `id` (for instance, by clicking a link in the sidebar,
diff --git a/src/librustdoc/html/static/js/main.js b/src/librustdoc/html/static/js/main.js
index 403b5004d6558..1487ebf9b0aa1 100644
--- a/src/librustdoc/html/static/js/main.js
+++ b/src/librustdoc/html/static/js/main.js
@@ -4,6 +4,11 @@
"use strict";
+// WARNING: RUSTDOC_MOBILE_BREAKPOINT MEDIA QUERY
+// If you update this line, then you also need to update the media query with the same
+// warning in rustdoc.css
+window.RUSTDOC_MOBILE_BREAKPOINT = 700;
+
// Given a basename (e.g. "storage") and an extension (e.g. ".js"), return a URL
// for a resource under the root-path, with the resource-suffix.
function resourcePath(basename, extension) {
diff --git a/src/librustdoc/html/static/js/storage.js b/src/librustdoc/html/static/js/storage.js
index c3fed9a72d4e2..8d82b5b78edbb 100644
--- a/src/librustdoc/html/static/js/storage.js
+++ b/src/librustdoc/html/static/js/storage.js
@@ -8,29 +8,14 @@
const darkThemes = ["dark", "ayu"];
window.currentTheme = document.getElementById("themeStyle");
-// WARNING: RUSTDOC_MOBILE_BREAKPOINT MEDIA QUERY
-// If you update this line, then you also need to update the media query with the same
-// warning in rustdoc.css
-window.RUSTDOC_MOBILE_BREAKPOINT = 700;
-
const settingsDataset = (function() {
const settingsElement = document.getElementById("default-settings");
- if (settingsElement === null) {
- return null;
- }
- const dataset = settingsElement.dataset;
- if (dataset === undefined) {
- return null;
- }
- return dataset;
+ return settingsElement && settingsElement.dataset ? settingsElement.dataset : null;
})();
function getSettingValue(settingName) {
const current = getCurrentValue(settingName);
- if (current !== null) {
- return current;
- }
- if (settingsDataset !== null) {
+ if (current === null && settingsDataset !== null) {
// See the comment for `default_settings.into_iter()` etc. in
// `Options::from_matches` in `librustdoc/config.rs`.
const def = settingsDataset[settingName.replace(/-/g,"_")];
@@ -38,7 +23,7 @@ function getSettingValue(settingName) {
return def;
}
}
- return null;
+ return current;
}
const localStoredTheme = getSettingValue("theme");
@@ -49,18 +34,16 @@ function hasClass(elem, className) {
}
function addClass(elem, className) {
- if (!elem || !elem.classList) {
- return;
+ if (elem && elem.classList) {
+ elem.classList.add(className);
}
- elem.classList.add(className);
}
// eslint-disable-next-line no-unused-vars
function removeClass(elem, className) {
- if (!elem || !elem.classList) {
- return;
+ if (elem && elem.classList) {
+ elem.classList.remove(className);
}
- elem.classList.remove(className);
}
/**
@@ -127,11 +110,7 @@ function getCurrentValue(name) {
// Rust to the JS. If there is no such element, return null.
const getVar = (function getVar(name) {
const el = document.getElementById("rustdoc-vars");
- if (el) {
- return el.attributes["data-" + name].value;
- } else {
- return null;
- }
+ return el ? el.attributes["data-" + name].value : null;
});
function switchTheme(newThemeName, saveTheme) {
@@ -158,6 +137,9 @@ function switchTheme(newThemeName, saveTheme) {
}
const updateTheme = (function() {
+ // only listen to (prefers-color-scheme: dark) because light is the default
+ const mql = window.matchMedia("(prefers-color-scheme: dark)");
+
/**
* Update the current theme to match whatever the current combination of
* * the preference for using the system theme
@@ -177,7 +159,7 @@ const updateTheme = (function() {
const lightTheme = getSettingValue("preferred-light-theme") || "light";
const darkTheme = getSettingValue("preferred-dark-theme") || "dark";
- if (isDarkMode()) {
+ if (mql.matches) {
use(darkTheme, true);
} else {
// prefers a light theme, or has no preference
@@ -191,37 +173,7 @@ const updateTheme = (function() {
}
}
- // This is always updated below to a function () => bool.
- let isDarkMode;
-
- // Determine the function for isDarkMode, and if we have
- // `window.matchMedia`, set up an event listener on the preferred color
- // scheme.
- //
- // Otherwise, fall back to the prefers-color-scheme value CSS captured in
- // the "content" property.
- if (window.matchMedia) {
- // only listen to (prefers-color-scheme: dark) because light is the default
- const mql = window.matchMedia("(prefers-color-scheme: dark)");
-
- isDarkMode = () => mql.matches;
-
- if (mql.addEventListener) {
- mql.addEventListener("change", updateTheme);
- } else {
- // This is deprecated, see:
- // https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/addListener
- mql.addListener(updateTheme);
- }
- } else {
- // fallback to the CSS computed value
- const cssContent = getComputedStyle(document.documentElement)
- .getPropertyValue("content");
- // (Note: the double-quotes come from that this is a CSS value, which
- // might be a length, string, etc.)
- const cssColorScheme = cssContent || "\"light\"";
- isDarkMode = () => (cssColorScheme === "\"dark\"");
- }
+ mql.addEventListener("change", updateTheme);
return updateTheme;
})();