From fe687946ba9f517ed9054cd4cd9bcd4ed218c516 Mon Sep 17 00:00:00 2001
From: WT <24277775+zam157@users.noreply.github.com>
Date: Thu, 27 Oct 2022 04:12:57 +0800
Subject: [PATCH 1/3] fix(theme): use stored preference to be the value of
 `userPreference`

---
 .../theme-default/components/VPSwitchAppearance.vue      | 9 +++------
 1 file changed, 3 insertions(+), 6 deletions(-)

diff --git a/src/client/theme-default/components/VPSwitchAppearance.vue b/src/client/theme-default/components/VPSwitchAppearance.vue
index e23329a84c65..04e9c53f1079 100644
--- a/src/client/theme-default/components/VPSwitchAppearance.vue
+++ b/src/client/theme-default/components/VPSwitchAppearance.vue
@@ -18,13 +18,10 @@ function useAppearance() {
   const query = window.matchMedia('(prefers-color-scheme: dark)')
   const classList = document.documentElement.classList
 
-  let userPreference =
-    localStorage.getItem(APPEARANCE_KEY) || site.value.appearance !== true
-      ? site.value.appearance
-      : 'auto'
+  let userPreference = localStorage.getItem(APPEARANCE_KEY)
 
-  let isDark =
-    userPreference === 'auto' ? query.matches : userPreference === 'dark'
+  let isDark = (site.value.appearance === 'dark' && userPreference === null)
+    || (userPreference === 'auto' ? query.matches : userPreference === 'dark')
 
   query.onchange = (e) => {
     if (userPreference === 'auto') {

From 7f048f113ceedacdc4caa21d2e865b146fb25dd6 Mon Sep 17 00:00:00 2001
From: WT <24277775+zam157@users.noreply.github.com>
Date: Thu, 27 Oct 2022 16:46:25 +0800
Subject: [PATCH 2/3] handle userPreference null case

---
 src/client/theme-default/components/VPSwitchAppearance.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/client/theme-default/components/VPSwitchAppearance.vue b/src/client/theme-default/components/VPSwitchAppearance.vue
index 04e9c53f1079..13553185b9fb 100644
--- a/src/client/theme-default/components/VPSwitchAppearance.vue
+++ b/src/client/theme-default/components/VPSwitchAppearance.vue
@@ -21,7 +21,7 @@ function useAppearance() {
   let userPreference = localStorage.getItem(APPEARANCE_KEY)
 
   let isDark = (site.value.appearance === 'dark' && userPreference === null)
-    || (userPreference === 'auto' ? query.matches : userPreference === 'dark')
+    || ((userPreference === 'auto' || userPreference === null) ? query.matches : userPreference === 'dark')
 
   query.onchange = (e) => {
     if (userPreference === 'auto') {

From c987e44091e85ba2aa20073c0d0f574758182964 Mon Sep 17 00:00:00 2001
From: Divyansh Singh <40380293+brc-dd@users.noreply.github.com>
Date: Thu, 27 Oct 2022 18:31:19 +0530
Subject: [PATCH 3/3] format

---
 src/client/theme-default/components/VPSwitchAppearance.vue | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/client/theme-default/components/VPSwitchAppearance.vue b/src/client/theme-default/components/VPSwitchAppearance.vue
index 13553185b9fb..9613f1eb83da 100644
--- a/src/client/theme-default/components/VPSwitchAppearance.vue
+++ b/src/client/theme-default/components/VPSwitchAppearance.vue
@@ -20,8 +20,11 @@ function useAppearance() {
 
   let userPreference = localStorage.getItem(APPEARANCE_KEY)
 
-  let isDark = (site.value.appearance === 'dark' && userPreference === null)
-    || ((userPreference === 'auto' || userPreference === null) ? query.matches : userPreference === 'dark')
+  let isDark =
+    (site.value.appearance === 'dark' && userPreference == null) ||
+    (userPreference === 'auto' || userPreference == null
+      ? query.matches
+      : userPreference === 'dark')
 
   query.onchange = (e) => {
     if (userPreference === 'auto') {