From d16a84eb2323d4819f35fada4f5e1dea2c4dbd4e Mon Sep 17 00:00:00 2001
From: Lucas de Lima Martins de Souza <lms.souza39@gmail.com>
Date: Mon, 22 Jan 2024 16:47:22 -0300
Subject: [PATCH] :lipstick: :adhesive_bandage: Fix dark mode logic to respect
 the user's system theme and update focus-visible style :adhesive_bandage:
 :lipstick:

---
 src/context/theme/index.tsx   | 2 +-
 src/storage/theme/getTheme.ts | 2 +-
 src/theme/global.css          | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/context/theme/index.tsx b/src/context/theme/index.tsx
index c8a0c23..c0adb35 100644
--- a/src/context/theme/index.tsx
+++ b/src/context/theme/index.tsx
@@ -25,7 +25,7 @@ function ThemeProvider({ children }: Readonly<ThemeProviderProps>) {
   const isTheSystemThemeDarkMode = systemTheme.matches // return true if the system theme is dark mode
   const isTheLocalStorageThemeDarkMode = getTheme() === THEME.dark
   const isDefaultThemeDarkMode =
-    isTheSystemThemeDarkMode || isTheLocalStorageThemeDarkMode
+    isTheSystemThemeDarkMode && isTheLocalStorageThemeDarkMode
 
   const [isDarkMode, setIsDarkMode] = useState(isDefaultThemeDarkMode)
 
diff --git a/src/storage/theme/getTheme.ts b/src/storage/theme/getTheme.ts
index 2dd6268..f7a6b65 100644
--- a/src/storage/theme/getTheme.ts
+++ b/src/storage/theme/getTheme.ts
@@ -4,7 +4,7 @@ import { APP_THEME } from '../storageConfig'
 export function getTheme() {
   const response = localStorage.getItem(APP_THEME)
 
-  const theme = response ? JSON.parse(response) : THEME.light
+  const theme = response ? JSON.parse(response) : THEME.dark
 
   return theme as ITheme
 }
diff --git a/src/theme/global.css b/src/theme/global.css
index 301afae..43307cd 100644
--- a/src/theme/global.css
+++ b/src/theme/global.css
@@ -5,7 +5,7 @@
 
 @layer base {   
     :focus-visible {
-        @apply ring-4 ring-purple-200 outline-none
+        @apply ring-4 dark:ring-purple-300 ring-purple-200 outline-none
       }
       
     ::selection {