mirror of
https://github.com/misode/misode.github.io.git
synced 2026-04-23 15:17:09 +00:00
1b91485bf1
* Test giscus on homepage * Use @giscus/react and support light theme * Track prefers color scheme * Create a discussion tab for each version
20 lines
467 B
TypeScript
20 lines
467 B
TypeScript
import { useEffect, useState } from 'preact/hooks'
|
|
|
|
export function useMediaQuery(query: string): boolean {
|
|
const [prefers, setPrefers] = useState(matchMedia(query).matches)
|
|
|
|
const onChange = (e: MediaQueryListEvent) => {
|
|
setPrefers(e.matches)
|
|
}
|
|
|
|
useEffect(() => {
|
|
const mediaQuery = matchMedia(query)
|
|
mediaQuery.addEventListener('change', onChange)
|
|
return () => {
|
|
mediaQuery.removeEventListener('change', onChange)
|
|
}
|
|
}, [query])
|
|
|
|
return prefers
|
|
}
|