feat(v2): add ability set dark mode by default (#2597)

* feat(v2): add ability set dark mode by default

* s/forceDarkMode/defaultDarkMode

Co-authored-by: Yangshun Tay <tay.yang.shun@gmail.com>

packages/docusaurus-theme-classic/src/index.js

@@ -11,7 +11,9 @@ const ContextReplacementPlugin = require('webpack/lib/ContextReplacementPlugin')
 // Need to be inlined to prevent dark mode FOUC
 // Make sure that the 'storageKey' is the same as the one in `/theme/hooks/useTheme.js`
 const storageKey = 'theme';
-const noFlash = `(function() {
+const noFlash = (defaultDarkMode) => `(function() {
+  var defaultDarkMode = ${defaultDarkMode};
+
   function setDataThemeAttribute(theme) {
     document.documentElement.setAttribute('data-theme', theme);
   }
@@ -30,7 +32,7 @@ const noFlash = `(function() {
   var preferredTheme = getPreferredTheme();
   if (preferredTheme !== null) {
     setDataThemeAttribute(preferredTheme);
-  } else if (darkQuery.matches) {
+  } else if (darkQuery.matches || defaultDarkMode) {
     setDataThemeAttribute('dark');
   }
 })();`;
@@ -39,8 +41,11 @@ module.exports = function (context, options) {
   const {
     siteConfig: {themeConfig},
   } = context;
-  const {disableDarkMode = false, prism: {additionalLanguages = []} = {}} =
-    themeConfig || {};
+  const {
+    disableDarkMode = false,
+    defaultDarkMode = false,
+    prism: {additionalLanguages = []} = {},
+  } = themeConfig || {};
   const {customCss} = options || {};
 
   return {
@@ -85,7 +90,7 @@ module.exports = function (context, options) {
             attributes: {
               type: 'text/javascript',
             },
-            innerHTML: noFlash,
+            innerHTML: noFlash(defaultDarkMode),
           },
         ],
       };