git: fbf328b48f - main - Documentation theme: Add new system option to theme chooser

From: Sergio Carlavilla Delgado <carlavilla_at_FreeBSD.org>
Date: Fri, 14 Jul 2023 14:12:15 UTC
The branch main has been updated by carlavilla:

URL: https://cgit.FreeBSD.org/doc/commit/?id=fbf328b48f749b62f2166771e94b5cd0664dd52d

commit fbf328b48f749b62f2166771e94b5cd0664dd52d
Author:     Minsoo Choo <minsoochoo0122@proton.me>
AuthorDate: 2023-07-14 14:00:50 +0000
Commit:     Sergio Carlavilla Delgado <carlavilla@FreeBSD.org>
CommitDate: 2023-07-14 14:00:50 +0000

    Documentation theme: Add new system option to theme chooser
    
    Add new 'system' option to the theme chooser.
    In this way the user will not have to select the theme and the
    system will choose it automatically based on the theme of the
    web browser
    
    Tested in: Chromium and Firefox in FreeBSD.
    
    Differential Revision:  https://reviews.freebsd.org/D41024
---
 .../themes/beastie/assets/js/theme-chooser.js        | 20 +++++++++++++++++---
 documentation/themes/beastie/i18n/bn-bd.toml         |  2 ++
 documentation/themes/beastie/i18n/da.toml            |  3 +++
 documentation/themes/beastie/i18n/de.toml            |  3 +++
 documentation/themes/beastie/i18n/el.toml            |  3 +++
 documentation/themes/beastie/i18n/en.toml            |  3 +++
 documentation/themes/beastie/i18n/es.toml            |  3 +++
 documentation/themes/beastie/i18n/fr.toml            |  3 +++
 documentation/themes/beastie/i18n/hu.toml            |  3 +++
 documentation/themes/beastie/i18n/it.toml            |  3 +++
 documentation/themes/beastie/i18n/ja.toml            |  3 +++
 documentation/themes/beastie/i18n/ko.toml            |  3 +++
 documentation/themes/beastie/i18n/mn.toml            |  3 +++
 documentation/themes/beastie/i18n/nl.toml            |  3 +++
 documentation/themes/beastie/i18n/pl.toml            |  3 +++
 documentation/themes/beastie/i18n/pt-br.toml         |  3 +++
 documentation/themes/beastie/i18n/ru.toml            |  3 +++
 documentation/themes/beastie/i18n/tr.toml            |  3 +++
 documentation/themes/beastie/i18n/zh-cn.toml         |  3 +++
 documentation/themes/beastie/i18n/zh-tw.toml         |  3 +++
 .../themes/beastie/layouts/partials/site-footer.html |  1 +
 .../themes/beastie/layouts/partials/site-head.html   |  2 +-
 22 files changed, 75 insertions(+), 4 deletions(-)

diff --git a/documentation/themes/beastie/assets/js/theme-chooser.js b/documentation/themes/beastie/assets/js/theme-chooser.js
index 40e4cd898f..d33f3d6f97 100644
--- a/documentation/themes/beastie/assets/js/theme-chooser.js
+++ b/documentation/themes/beastie/assets/js/theme-chooser.js
@@ -41,9 +41,12 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
   } else if (theme === "theme-high-contrast") {
     setTheme('theme-high-contrast');
     themeChooser.value = 'theme-high-contrast';
-  } else {
+  } else if (theme === "theme-light") {
     setTheme('theme-light');
     themeChooser.value = 'theme-light';
+  } else {
+    setTheme('theme-system');
+    themeChooser.value = 'theme-system';
   }
 
   themeChooser.addEventListener('change', function() {
@@ -53,13 +56,24 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
       setTheme('theme-dark');
     } else if (theme === "theme-high-contrast") {
       setTheme('theme-high-contrast');
-    } else {
+    } else if (theme === "theme-light") {
       setTheme('theme-light');
+    } else {
+      setTheme('theme-system');
     }
   });
 
   function setTheme(themeName) {
     localStorage.setItem('theme', themeName);
-    document.documentElement.className = themeName;
+
+    if (themeName === 'theme-system') {
+      if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+        document.documentElement.className = 'theme-dark';
+      } else {
+        document.documentElement.className = 'theme-light';
+      }
+    } else {
+      document.documentElement.className = themeName;
+    }
   }
 })();
diff --git a/documentation/themes/beastie/i18n/bn-bd.toml b/documentation/themes/beastie/i18n/bn-bd.toml
index 426f9f42ce..86a78009ba 100644
--- a/documentation/themes/beastie/i18n/bn-bd.toml
+++ b/documentation/themes/beastie/i18n/bn-bd.toml
@@ -115,6 +115,8 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/da.toml b/documentation/themes/beastie/i18n/da.toml
index 426f9f42ce..edc3eb986b 100644
--- a/documentation/themes/beastie/i18n/da.toml
+++ b/documentation/themes/beastie/i18n/da.toml
@@ -115,6 +115,9 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/de.toml b/documentation/themes/beastie/i18n/de.toml
index 3d5543a006..68ba7e0f78 100644
--- a/documentation/themes/beastie/i18n/de.toml
+++ b/documentation/themes/beastie/i18n/de.toml
@@ -115,6 +115,9 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/el.toml b/documentation/themes/beastie/i18n/el.toml
index cd52247ffc..e01e2a0100 100644
--- a/documentation/themes/beastie/i18n/el.toml
+++ b/documentation/themes/beastie/i18n/el.toml
@@ -115,6 +115,9 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/en.toml b/documentation/themes/beastie/i18n/en.toml
index b4f5a837e0..0f2eb26e91 100644
--- a/documentation/themes/beastie/i18n/en.toml
+++ b/documentation/themes/beastie/i18n/en.toml
@@ -199,6 +199,9 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/es.toml b/documentation/themes/beastie/i18n/es.toml
index 82acd0af90..2330482edd 100644
--- a/documentation/themes/beastie/i18n/es.toml
+++ b/documentation/themes/beastie/i18n/es.toml
@@ -115,6 +115,9 @@ other = "Páginas del Manual de FreeBSD"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Claro"
 
diff --git a/documentation/themes/beastie/i18n/fr.toml b/documentation/themes/beastie/i18n/fr.toml
index 189d785227..91a9b435b4 100644
--- a/documentation/themes/beastie/i18n/fr.toml
+++ b/documentation/themes/beastie/i18n/fr.toml
@@ -115,6 +115,9 @@ other = "Pages de manuel FreeBSD"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Clair"
 
diff --git a/documentation/themes/beastie/i18n/hu.toml b/documentation/themes/beastie/i18n/hu.toml
index 1b00390645..acb13b242f 100644
--- a/documentation/themes/beastie/i18n/hu.toml
+++ b/documentation/themes/beastie/i18n/hu.toml
@@ -115,6 +115,9 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/it.toml b/documentation/themes/beastie/i18n/it.toml
index 227aea174e..c3b9752c25 100644
--- a/documentation/themes/beastie/i18n/it.toml
+++ b/documentation/themes/beastie/i18n/it.toml
@@ -115,6 +115,9 @@ other = "FreeBSD man page"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/ja.toml b/documentation/themes/beastie/i18n/ja.toml
index ea52c990c7..cb19b3fdbf 100644
--- a/documentation/themes/beastie/i18n/ja.toml
+++ b/documentation/themes/beastie/i18n/ja.toml
@@ -115,6 +115,9 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/ko.toml b/documentation/themes/beastie/i18n/ko.toml
index 426f9f42ce..edc3eb986b 100644
--- a/documentation/themes/beastie/i18n/ko.toml
+++ b/documentation/themes/beastie/i18n/ko.toml
@@ -115,6 +115,9 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/mn.toml b/documentation/themes/beastie/i18n/mn.toml
index 4be6fcd9af..218b61786e 100644
--- a/documentation/themes/beastie/i18n/mn.toml
+++ b/documentation/themes/beastie/i18n/mn.toml
@@ -115,6 +115,9 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/nl.toml b/documentation/themes/beastie/i18n/nl.toml
index a6c9cd516e..6a2e71de7d 100644
--- a/documentation/themes/beastie/i18n/nl.toml
+++ b/documentation/themes/beastie/i18n/nl.toml
@@ -115,6 +115,9 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/pl.toml b/documentation/themes/beastie/i18n/pl.toml
index 426f9f42ce..edc3eb986b 100644
--- a/documentation/themes/beastie/i18n/pl.toml
+++ b/documentation/themes/beastie/i18n/pl.toml
@@ -115,6 +115,9 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/pt-br.toml b/documentation/themes/beastie/i18n/pt-br.toml
index 2db88d801d..448774c675 100644
--- a/documentation/themes/beastie/i18n/pt-br.toml
+++ b/documentation/themes/beastie/i18n/pt-br.toml
@@ -115,6 +115,9 @@ other = "Páginas de Manual do FreeBSD"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/ru.toml b/documentation/themes/beastie/i18n/ru.toml
index ad49eb685c..187a9c1954 100644
--- a/documentation/themes/beastie/i18n/ru.toml
+++ b/documentation/themes/beastie/i18n/ru.toml
@@ -115,6 +115,9 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/tr.toml b/documentation/themes/beastie/i18n/tr.toml
index 426f9f42ce..edc3eb986b 100644
--- a/documentation/themes/beastie/i18n/tr.toml
+++ b/documentation/themes/beastie/i18n/tr.toml
@@ -115,6 +115,9 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/zh-cn.toml b/documentation/themes/beastie/i18n/zh-cn.toml
index 1d06a3ef12..db6a1e628e 100644
--- a/documentation/themes/beastie/i18n/zh-cn.toml
+++ b/documentation/themes/beastie/i18n/zh-cn.toml
@@ -115,6 +115,9 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "Light"
 
diff --git a/documentation/themes/beastie/i18n/zh-tw.toml b/documentation/themes/beastie/i18n/zh-tw.toml
index 38234e8756..000f75ff9a 100644
--- a/documentation/themes/beastie/i18n/zh-tw.toml
+++ b/documentation/themes/beastie/i18n/zh-tw.toml
@@ -115,6 +115,9 @@ other = "FreeBSD Manual Pages"
 # ---------------------------------------------------
 # Footer
 # ---------------------------------------------------
+[system]
+other = "System"
+
 [light]
 other = "淺色"
 
diff --git a/documentation/themes/beastie/layouts/partials/site-footer.html b/documentation/themes/beastie/layouts/partials/site-footer.html
index d16dd23b9d..aab2506f36 100755
--- a/documentation/themes/beastie/layouts/partials/site-footer.html
+++ b/documentation/themes/beastie/layouts/partials/site-footer.html
@@ -17,6 +17,7 @@
           {{ end }}
           <div class="theme-container">
             <select id="theme-chooser">
+	      <option value="theme-system">{{ i18n "system" }}</option>
               <option value="theme-light">{{ i18n "light" }}</option>
               <option value="theme-dark">{{ i18n "dark" }}</option>
               <option value="theme-high-contrast">{{ i18n "high-contrast" }}</option>
diff --git a/documentation/themes/beastie/layouts/partials/site-head.html b/documentation/themes/beastie/layouts/partials/site-head.html
index 3df53a79fe..24d52f53fa 100644
--- a/documentation/themes/beastie/layouts/partials/site-head.html
+++ b/documentation/themes/beastie/layouts/partials/site-head.html
@@ -9,7 +9,7 @@
   <title>{{ with .Params.Title }}{{ . }} | {{ end }} {{ block "title" . }}{{ .Site.Title }}{{ end }}</title>
 
   <meta name="theme-color" content="#790000">
-  <meta name="color-scheme" content="light dark high-contrast">
+  <meta name="color-scheme" content="system light dark high-contrast">
 
   {{ if $.Site.Params.isOnline }}
     <link rel="shortcut icon" href="{{ absLangURL ($.Site.BaseURL) }}favicon.ico">