take into account the system theme

2 files changed, 28 insertions, 3 deletions

diff --git a/src/librustdoc/html/static/rustdoc.css b/src/librustdoc/html/static/rustdoc.css
index 59d10668f11..244b24af43f 100644
--- a/src/librustdoc/html/static/rustdoc.css
+++ b/src/librustdoc/html/static/rustdoc.css
@@ -54,6 +54,21 @@
 		  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 {
diff --git a/src/librustdoc/html/static/storage.js b/src/librustdoc/html/static/storage.js
index e3927350d11..86efc781560 100644
--- a/src/librustdoc/html/static/storage.js
+++ b/src/librustdoc/html/static/storage.js
@@ -86,7 +86,7 @@ function getCurrentValue(name) {
     return null;
 }
 
-function switchTheme(styleElem, mainStyleElem, newTheme) {
+function switchTheme(styleElem, mainStyleElem, newTheme, skipStorage) {
     var fullBasicCss = "rustdoc" + resourcesSuffix + ".css";
     var fullNewTheme = newTheme + resourcesSuffix + ".css";
     var newHref = mainStyleElem.href.replace(fullBasicCss, fullNewTheme);
@@ -109,8 +109,18 @@ function switchTheme(styleElem, mainStyleElem, newTheme) {
     });
     if (found === true) {
         styleElem.href = newHref;
-        updateLocalStorage("rustdoc-theme", newTheme);
+        // If this new value comes from a system setting or from the previously saved theme, no
+        // need to save it.
+        if (skipStorage !== true) {
+            updateLocalStorage("rustdoc-theme", newTheme);
+        }
     }
 }
 
-switchTheme(currentTheme, mainTheme, getCurrentValue("rustdoc-theme") || "light");
+function getSystemValue() {
+    return getComputedStyle(document.documentElement).getPropertyValue('content');
+}
+
+switchTheme(currentTheme, mainTheme,
+            getCurrentValue("rustdoc-theme") || getSystemValue() || "light",
+            true);