diff --git a/app/components/GlobalError/GlobalError.js b/app/components/GlobalError/GlobalError.js index a0e8b2ab..75f09a1e 100644 --- a/app/components/GlobalError/GlobalError.js +++ b/app/components/GlobalError/GlobalError.js @@ -1,18 +1,23 @@ import React from 'react' import PropTypes from 'prop-types' +import { MdClose } from 'react-icons/lib/md' import styles from './GlobalError.scss' -const GlobalError = ({ error }) => { - if (!error) { return null } - return ( -
+const GlobalError = ({ error, clearError }) => ( +
+
+
+ +

{error}

- ) -} +
+) + GlobalError.propTypes = { - error: PropTypes.string + error: PropTypes.string, + clearError: PropTypes.func.isRequired } export default GlobalError diff --git a/app/components/GlobalError/GlobalError.scss b/app/components/GlobalError/GlobalError.scss index 4e0dad23..5486c7fc 100644 --- a/app/components/GlobalError/GlobalError.scss +++ b/app/components/GlobalError/GlobalError.scss @@ -8,17 +8,27 @@ width: 100%; text-align: center; padding: 20px; - // height: 0; transition: all 0.25s ease; - &.active { - height: 100%; - padding: 20px; + &.closed { + max-height: 0; + padding: 0; } - h2 { - font-size: 20px; - letter-spacing: 1.5px; - font-weight: bold; + .content { + position: relative; + + .close { + position: absolute; + top: calc(50% - 8px); + right: 10%; + cursor: pointer; + } + + h2 { + font-size: 20px; + letter-spacing: 1.5px; + font-weight: bold; + } } } \ No newline at end of file diff --git a/app/routes/app/components/App.js b/app/routes/app/components/App.js index ed38a3a6..f1485478 100644 --- a/app/routes/app/components/App.js +++ b/app/routes/app/components/App.js @@ -42,6 +42,7 @@ class App extends Component { closeForm, error: { error }, + clearError, children } = this.props @@ -60,7 +61,7 @@ class App extends Component { return (
- + >>>>>> feature(globalerror): clear error } const mapStateToProps = state => ({