Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/lowmess/lameass.recipes. A recipe site, but without the ads and 3,000 word essays lameass.recipes
nextjs sanity-io theme-ui typescript
Something went wrong. Try again.
597 B · 22 lines
TSX
at develop
1234567891011121314151617181920212223import * as React from 'react'import { useColorMode, Button } from 'theme-ui'import { Sun, Moon } from 'phosphor-react'import { VisuallyHidden } from '@reach/visually-hidden'
const ColorModeToggle: React.FC = () => { const [colorMode, setColorMode] = useColorMode()
return ( <Button variant="color-mode-toggle" onClick={() => { setColorMode(colorMode === 'default' ? 'dark' : 'default') }} > <VisuallyHidden>Toggle color mode</VisuallyHidden> {colorMode === 'default' ? <Sun weight="bold" /> : <Moon weight="bold" />} </Button> )}
export default ColorModeToggle