Redesign sending error page

This commit is contained in:
Amine Ben hammou
2020-09-10 00:07:29 +02:00
committed by Veljko V
parent 71f2290ec1
commit dbcf1b95db
3 changed files with 13 additions and 7 deletions

View File

@@ -17,7 +17,8 @@
} }
} }
.mailpoet_congratulate_success { .mailpoet_congratulate_success,
.mailpoet_congratulate_fail {
width: 100%; width: 100%;
h1 { h1 {

View File

@@ -3,11 +3,14 @@ import PropTypes from 'prop-types';
import ReactStringReplace from 'react-string-replace'; import ReactStringReplace from 'react-string-replace';
import MailPoet from 'mailpoet'; import MailPoet from 'mailpoet';
import { Button } from 'common';
import Heading from 'common/typography/heading/heading';
function Fail(props) { function Fail(props) {
return ( return (
<div className="mailpoet_centered"> <div className="mailpoet_congratulate_fail">
<h1>{MailPoet.I18n.t('congratulationsSendFailHeader')}</h1> <Heading level={1}>{MailPoet.I18n.t('congratulationsSendFailHeader')}</Heading>
<p> <h1>
{ ReactStringReplace( { ReactStringReplace(
MailPoet.I18n.t('congratulationsSendFailExplain'), MailPoet.I18n.t('congratulationsSendFailExplain'),
/\[link\](.*?)\[\/link\]/g, /\[link\](.*?)\[\/link\]/g,
@@ -23,8 +26,9 @@ function Fail(props) {
</a> </a>
) )
)} )}
</p> </h1>
<button type="button" className="button" onClick={props.failClicked}>{MailPoet.I18n.t('close')}</button> <img src={window.mailpoet_congratulations_error_image} alt="" width="500" />
<Button dimension="small" type="button" onClick={props.failClicked}>{MailPoet.I18n.t('close')}</Button>
</div> </div>
); );
} }

View File

@@ -47,6 +47,7 @@
'<%= cdn_url('newsletter/congratulate-3.png') %>', '<%= cdn_url('newsletter/congratulate-3.png') %>',
'<%= cdn_url('newsletter/congratulate-4.png') %>', '<%= cdn_url('newsletter/congratulate-4.png') %>',
]; ];
var mailpoet_congratulations_error_image = '<%= cdn_url('newsletter/error.png') %>';
var mailpoet_congratulations_loading_image = '<%= cdn_url('newsletter/congratulation-page-illustration-transparent-LQ.20181121-1440.png') %>'; var mailpoet_congratulations_loading_image = '<%= cdn_url('newsletter/congratulation-page-illustration-transparent-LQ.20181121-1440.png') %>';
var mailpoet_main_page = '<%= mailpoet_main_page %>'; var mailpoet_main_page = '<%= mailpoet_main_page %>';
var mailpoet_review_request_illustration_url = '<%= cdn_url('review-request/review-request-illustration.20190815-1427.svg') %>'; var mailpoet_review_request_illustration_url = '<%= cdn_url('review-request/review-request-illustration.20190815-1427.svg') %>';
@@ -388,7 +389,7 @@
'congratulationsPostNotificationSuccessBody': __('Your Post Notification is now active.'), 'congratulationsPostNotificationSuccessBody': __('Your Post Notification is now active.'),
'congratulationsWelcomeEmailSuccessBody': __('Your Welcome Email is now active.'), 'congratulationsWelcomeEmailSuccessBody': __('Your Welcome Email is now active.'),
'congratulationsSendFailHeader': __('Oops! We cant send your newsletter 😕'), 'congratulationsSendFailHeader': __('Oops! We cant send your newsletter'),
'congratulationsSendFailExplain': __('Rest assured, this is fairly common and is usually fixed quickly. [link]See our quick guide[/link] to help you solve this and get your website sending.'), 'congratulationsSendFailExplain': __('Rest assured, this is fairly common and is usually fixed quickly. [link]See our quick guide[/link] to help you solve this and get your website sending.'),
'congratulationsLoadingHeader': __('Verification'), 'congratulationsLoadingHeader': __('Verification'),
'congratulationsLoadingBody': __('Congrats, youre sending your first newsletter! Were doing a quick verification to make sure everything works fine.'), 'congratulationsLoadingBody': __('Congrats, youre sending your first newsletter! Were doing a quick verification to make sure everything works fine.'),