fix: use default os colorscheme by default

stephane-r · Aug 29, 2023 · b970d8f · b970d8f
1 parent fe05dc5
commit b970d8f
Showing 1 changed file with 3 additions and 2 deletions.
diff --git a/src/providers/Mantine.tsx b/src/providers/Mantine.tsx
@@ -1,5 +1,5 @@
 import { ColorScheme, MantineProvider as Provider } from "@mantine/core";
-import { useLocalStorage } from "@mantine/hooks";
+import { useColorScheme, useLocalStorage } from "@mantine/hooks";
 
 interface MantineProviderProps {
   children: React.ReactNode;
@@ -8,14 +8,15 @@ interface MantineProviderProps {
 export const MantineProvider: React.FC<MantineProviderProps> = ({
   children,
 }) => {
+  const osColorScheme = useColorScheme();
   const [colorScheme] = useLocalStorage<ColorScheme>({
     key: "mantine-color-scheme",
   });
 
   return (
     <Provider
       theme={{
-        colorScheme,
+        colorScheme: colorScheme ?? osColorScheme,
         breakpoints: {
           xs: "30em",
           sm: "50em",