25 lines
697 B
JavaScript
25 lines
697 B
JavaScript
import { createContext, useContext, useState, useEffect } from 'react'
|
|
|
|
const ThemeContext = createContext()
|
|
|
|
export function ThemeProvider({ children }) {
|
|
const [dark, setDark] = useState(() => {
|
|
const saved = localStorage.getItem('pf_dark')
|
|
if (saved !== null) return saved === 'true'
|
|
return window.matchMedia('(prefers-color-scheme: dark)').matches
|
|
})
|
|
|
|
useEffect(() => {
|
|
localStorage.setItem('pf_dark', dark)
|
|
document.documentElement.classList.toggle('dark', dark)
|
|
}, [dark])
|
|
|
|
return (
|
|
<ThemeContext.Provider value={{ dark, setDark }}>
|
|
{children}
|
|
</ThemeContext.Provider>
|
|
)
|
|
}
|
|
|
|
const useTheme = () => useContext(ThemeContext)
|
|
export default useTheme |