diff options
Diffstat (limited to 'src/Toolkit.js')
-rw-r--r-- | src/Toolkit.js | 20 |
1 files changed, 16 insertions, 4 deletions
diff --git a/src/Toolkit.js b/src/Toolkit.js index 35d8759..b12f418 100644 --- a/src/Toolkit.js +++ b/src/Toolkit.js @@ -4,11 +4,11 @@ import './fontawesome-all.min.js' class ToolKitItem extends Component { render() { let iconClass = this.props.tool.icon + " fa-2x" - var divClass = "toolkititem" + let style = styles.toolkititem if (this.props.selected) { - divClass += " selected" + style = Object.assign({}, style, styles.selected) } - return <div className={divClass} + return <div style={style} onClick={() => this.props.onSelectTool(this.props.tool)}> <i className={iconClass}></i> </div> @@ -24,8 +24,20 @@ export default class Toolkit extends Component { selected={tool === this.props.selectedTool} onSelectTool={this.props.onSelectTool}/> }) - return <div className="toolkit"> + return <div style={styles.toolkit}> {toolComponents} </div> } } + +const styles = { + toolkit: { + background: "grey" + }, + toolkititem: { + padding: "5px", + }, + selected: { + background: "lightcoral" + } +}
\ No newline at end of file |