From 693f44d1ff4f72ea8ac2709af596eef73d60ae8e Mon Sep 17 00:00:00 2001 From: Maxim Shelepov Date: Wed, 13 Dec 2023 09:55:21 -0500 Subject: [PATCH] Addressing the dark mode flicker issue. --- src/views/MainView.vue | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/views/MainView.vue b/src/views/MainView.vue index 3f656fa..bcb1828 100644 --- a/src/views/MainView.vue +++ b/src/views/MainView.vue @@ -122,11 +122,11 @@ const landingTransition = () => { const useDark = () => { // credit: https://tailwindcss.com/docs/dark-mode#supporting-system-preference-and-manual-selection if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) { - document.documentElement.classList.add('dark') document.documentElement.classList.remove('bg-white') + document.documentElement.classList.add('dark', 'bg-slate-900') darkModeActive.value = true } else { - document.documentElement.classList.remove('dark') + document.documentElement.classList.remove('dark', 'bg-slate-900') document.documentElement.classList.add('bg-white') darkModeActive.value = false }