diff --git a/src/components/Contacts/Contacts.scss b/src/components/Contacts/Contacts.scss index 4d123c9..4bcfeeb 100644 --- a/src/components/Contacts/Contacts.scss +++ b/src/components/Contacts/Contacts.scss @@ -26,6 +26,13 @@ & h2 { margin-bottom: 10px; } + & .reload-form { + text-decoration: underline; + cursor: pointer; + color: #6ab0f3; + background: none; + font-size: 16px; + } } & .contacts-form { margin-bottom: 50px; @@ -33,10 +40,12 @@ margin-bottom: 30px; } & form { - display: flex; - flex-wrap: wrap; - justify-content: space-between; - padding: 0 20px; + & .form-content { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + padding: 0 20px; + } & input { margin-bottom: 10px; border-radius: 5px; diff --git a/src/components/Contacts/ContactsForm/ContactsForm.js b/src/components/Contacts/ContactsForm/ContactsForm.js index ef48b00..0b087f4 100644 --- a/src/components/Contacts/ContactsForm/ContactsForm.js +++ b/src/components/Contacts/ContactsForm/ContactsForm.js @@ -9,6 +9,7 @@ function encode(data) { const ContactsFrom = () => { const [state, setState] = React.useState({}) const [submitted, setSubmitted] = React.useState(false) + const [error, setError] = React.useState(false) const handleChange = e => { setState({ ...state, [e.target.name]: e.target.value }) @@ -26,9 +27,28 @@ const ContactsFrom = () => { }), }) .then(() => setSubmitted(true)) - .catch(error => alert(error)) + .catch(error => { + console.error(error) + setError(true) + }) } + if (error) + return ( +
+ При обработке вашго письма произошла ошибка, попробуйте повторить + запрос через некоторое время. +
+