26 lines
639 B
TypeScript
26 lines
639 B
TypeScript
|
|
import styled, { useTheme } from "styled-components";
|
||
|
|
import { IconComponent as Icon } from '../../../const/theme/icons';
|
||
|
|
import { ThemName } from "../../../const/theme/names";
|
||
|
|
|
||
|
|
const Button = styled.div`
|
||
|
|
width: 100%;
|
||
|
|
cursor: pointer;
|
||
|
|
`
|
||
|
|
|
||
|
|
const IconContainer = styled.div`
|
||
|
|
padding: 10px;
|
||
|
|
color: ${props => props.theme.text};
|
||
|
|
`
|
||
|
|
|
||
|
|
export default function ThemeButton() {
|
||
|
|
const theme = useTheme();
|
||
|
|
const name = localStorage.getItem('theme') as ThemName
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Button onClick={theme.toggleTheme}>
|
||
|
|
<IconContainer>
|
||
|
|
<Icon name={name} width="30" height="30"/>
|
||
|
|
</IconContainer>
|
||
|
|
</Button>
|
||
|
|
);
|
||
|
|
}
|