import React, { Component } from 'react';
import './css/App.css';

class App extends Component {
  constructor(props){
    super(props);
    this.state = {
      textStyle: {
        color: null,
      }
    }
  }
  render() {
    return (
      <div>
        <div style={this.state.textStyle}>Text</div>
        <button onClick={this.red}>Red</button>
        <button onClick={this.blue}>Blue</button>
        <button onClick={this.reset}>Reset</button>
      </div>
    );
  }
  //custom methods
  red = ()=>{
    this.setState({textStyle: {color: 'red'}});
  }
  blue = ()=>{
    this.setState({textStyle: {color: 'blue'}});
  }
  reset = ()=>{
    this.setState({textStyle: {color: null}});
  }
}

export default App;
