docs: load theme

Close #427

diff --git a/docs/.vitepress/theme/index.js b/docs/.vitepress/theme/index.js
index 6c435a672d1edc4d8cce4cce8ad28198ab203a5e..423cf24f1d2bedce4f2dcd023e082fed43f8efd5 100644 (file)
--- a/docs/.vitepress/theme/index.js
+++ b/docs/.vitepress/theme/index.js
@@ -2,6 +2,25 @@ import Theme from 'vitepress/theme'
 import './custom.css'
 import './code-theme.css'
 
-export default {
+const { Layout } = Theme
+
+const existingMounted = Layout.mounted || (() => {})
+
+Layout.mounted = function () {
+  existingMounted.call(this)
+
+  const storedTheme = localStorage.getItem('pinia-color-scheme')
+  const mediaQuery = window.matchMedia('(prefers-color-scheme: light)')
+
+  if (mediaQuery.matches || storedTheme === 'light') {
+    const htmlElement = document.body.parentElement
+    htmlElement.classList.add('light')
+  }
+}
+
+/** @type {import('vitepress').Theme} */
+const config = {
   ...Theme,
 }
+
+export default config