@kait/use-theme
v0.2.0
Published
Theme. Powered by React hooks.
Downloads
3
Readme
@kait/use-theme
Theme. Powered by React hooks.
Install
# yarn
$ yarn add @kait/use-theme
# npm
$ npm i @kait/use-theme
Usage
import React, { useState } from 'react'
import { ThemeProvider } from 'styled-components'
import useTheme, { ThemeAttributes } from '@kait/use-theme'
const ThemeExample: React.SFC<RouteComponentProps> = () => {
const [isDarkTheme, setIsDarkTheme] = useState(false)
const theme = useTheme(isDarkTheme ? darkTheme : lightTheme)
return (
<ThemeProvider theme={theme}>
<Page>
<PageTitle>Media Queries</PageTitle>
<ThemeDemo>{isDarkTheme ? 'dark theme' : 'light theme'}</ThemeDemo>
<button onClick={() => setIsDarkTheme(!isDarkTheme)}>
toggle theme
</button>
</Page>
</ThemeProvider>
)
}