diff --git a/components/Collapse.js b/components/Collapse.js new file mode 100644 index 0000000..1fadde6 --- /dev/null +++ b/components/Collapse.js @@ -0,0 +1,27 @@ +import React from 'react' +import Toggle from './Toggle' +import Arrowdown from './svg/Arrowdown' + +class Collapse extends React.Component { + constructor(props) { + super(props) + this.state = { + open: false + } + } + + toggle = () => { + this.setState(state => ({ + open: !state.open + })) + } + + render() { + if (this.state.open) { + return this.props.children + } + return + } +} + +export default Collapse diff --git a/components/Settings.js b/components/Settings.js index bf901c5..a28ebc3 100644 --- a/components/Settings.js +++ b/components/Settings.js @@ -5,6 +5,7 @@ import ThemeSelect from './ThemeSelect' import Slider from './Slider' import Toggle from './Toggle' import WindowPointer from './WindowPointer' +import Collapse from './Collapse' import { COLORS } from '../lib/constants' class Settings extends React.Component { @@ -39,46 +40,48 @@ class Settings extends React.Component { selected={this.props.enabled.windowTheme || 'none'} onChange={this.props.onChange.bind(null, 'windowTheme')} /> - - - - - - + + + + + + +