block33.javascript

//Form.js
    import React, { Component } from 'react';
    import styled from 'styled-components';
    import { Motion, spring } from 'react-motion';
    import './App.css';

    const NotificationBox = styled.div`
        position: absolute;
        padding: 1.5em;
        left: 5%;
        top: ${(props) => props.top}%;
        opacity: ${(props) => props.opacity};
        font-size: 0.8em;
        font-weight: bold;
        border-radius: 5px;
        background: #81C784;
        color: white;
    `;
    class Form extends Component {

      constructor(props) {
        super(props);
        this.state = {
          startAnimation: 1
        };
        this.handleClick = this.handleClick.bind(this);
        this.resetValue = this.resetValue.bind(this);
      }

      handleClick (e){
        e.preventDefault();
        this.setState({
          startAnimation: 0
        })
        setTimeout(this.resetValue, 2500);
      }

      resetValue (){
        this.setState({
          startAnimation: 1
        })
      }