diff options
-rw-r--r-- | src/components/theme-switcher.js | 30 |
1 files changed, 30 insertions, 0 deletions
diff --git a/src/components/theme-switcher.js b/src/components/theme-switcher.js new file mode 100644 index 0000000..a24e634 --- /dev/null +++ b/src/components/theme-switcher.js @@ -0,0 +1,30 @@ +import React from 'react' +import { css } from '@emotion/core' + +const buttonStyle = ({ margins, colours, radius }) => css` + border: none; + background: none; + margin: ${margins.sm}px; + font-size: 1.3em; +` + +export const ThemeSwitcher = ({ themes, onClick, currentTheme }) => { + const nextTheme = themes.find(theme => theme.key !== currentTheme) + return ( + <div + css={css` + top: 0; + right: 0; + position: absolute; + `} + > + <button + css={buttonStyle} + key={nextTheme} + onClick={e => onClick(nextTheme.key)} + > + {nextTheme.name} + </button> + </div> + ) +} |