Merge pull request #996 from mailpoet/add-extra-text

Add extra text on Send with... [MAILPOET-954]
This commit is contained in:
stoletniy
2017-07-13 13:24:22 +03:00
committed by GitHub
3 changed files with 107 additions and 88 deletions

View File

@@ -9,15 +9,25 @@
// sending methods
.mailpoet_sending_methods
margin 25px 0 0 0
li
float left
position relative
padding 15px 15px 0 15px
display flex
flex-direction row
justify-content space-around
> li
flex-grow 1
flex-shrink 1
display flex
flex-direction column
flex-basis 0
margin 0 25px 25px 0
width 300px
height 300px
border 1px solid #dedede
background-color #fff
max-width 500px
.mailpoet_sending_method_description
padding: 25px
flex-grow 1
flex-shrink 0
> li:last-child
margin-right 0
h3
text-align center
height 54px
@@ -25,12 +35,12 @@
.mailpoet_description
font-size 14px
.mailpoet_status
display flex
flex-direction row
justify-content space-between
align-items center
background-color #2f2f2f
color #fff
position absolute
bottom 0
left 0
right 0
text-overflow ellipsis
padding 15px
span
@@ -43,23 +53,17 @@
visibility visible
#mailpoet_mta_activate
visibility hidden
.mailpoet_actions
bottom 15px
color #fff
padding 0
position absolute
right 15px
.button-secondary
margin 0 -6px -4px 0
// premium key
.mailpoet_key
&_valid
&::before
content ' '
&_invalid
&::before
content: ' '
ul.sending-method-benefits
list-style-type: none
margin-bottom: 2em
margin-top: 2em
.mailpoet_success_item::before
content ' '
.mailpoet_error_item::before
content ' '
// responsive
@media screen and (max-width: 782px)
@@ -67,8 +71,10 @@
width auto
.mailpoet_sending_methods
li
float none
width auto
flex-flow: row wrap
justify-content: space-around
> li
margin-right 0
flex-basis auto

View File

@@ -54,76 +54,89 @@
/>
<!-- smtp: available sending methods -->
<ul class="mailpoet_sending_methods clearfix">
<ul class="mailpoet_sending_methods">
<li
data-group="mailpoet"
<% if(settings.mta_group == 'mailpoet') %>class="mailpoet_active"<% endif %>
>
<h3>
<img
src="<%= assets_url %>/img/mailpoet_logo.png"
alt="MailPoet"
width="137"
height="54"
/>
</h3>
<div class="mailpoet_sending_method_description">
<h3>
<img
src="<%= assets_url %>/img/mailpoet_logo.png"
alt="MailPoet"
width="137"
height="54"
/>
</h3>
<p
class="mailpoet_description<% if(settings.mta_group != 'mailpoet') %> mailpoet_hidden<% endif %>"
id="mailpoet_sending_method_active_text"
>
<strong><%= __("You're now sending with MailPoet!") %></strong>
<br />
<%= __("Great, you're all set up. Your emails will now be sent quickly and reliably!") %>
</p>
<p
class="mailpoet_description<% if(settings.mta_group == 'mailpoet') %> mailpoet_hidden<% endif %>"
id="mailpoet_sending_method_inactive_text"
>
<strong><%= __("Solve all of your sending problems!") %></strong>
<br />
<%= __("Let MailPoet send your emails and get the Premium features for as little as 10 dollars or euros per month.") %>
<br/>
<br/>
<a
href="<%= admin_url('admin.php?page=mailpoet-premium') %>"
class="button button-primary"
><%= __('Find out more') %></a>
</p>
<p
class="mailpoet_description<% if(settings.mta_group != 'mailpoet') %> mailpoet_hidden<% endif %>"
id="mailpoet_sending_method_active_text"
>
<strong><%= __("You're now sending with MailPoet!") %></strong>
<br />
<%= __("Great, you're all set up. Your emails will now be sent quickly and reliably!") %>
</p>
<div
class="mailpoet_description<% if(settings.mta_group == 'mailpoet') %> mailpoet_hidden<% endif %>"
id="mailpoet_sending_method_inactive_text"
>
<strong><%= __("Solve all of your sending problems!") %></strong>
<br />
<%= __("Let MailPoet send your emails and get the Premium features for as little as 10 dollars or euros per month.") %>
<ul class="sending-method-benefits mailpoet_success">
<li class="mailpoet_success_item"><%= __('Reach the inbox, not the spam box.') %>
<li class="mailpoet_success_item"><%= __('Send emails up to 20 times faster than other sending methods.') %>
<li class="mailpoet_success_item"><%= __('SPF & DKIM signatures are already set up! No configuration required.') %>
<li class="mailpoet_success_item"><%= __('Automatically remove invalid and bounced addresses (bounce handling) to keep your lists clean.') %>
</ul>
<a
href="<%= admin_url('admin.php?page=mailpoet-premium') %>"
class="button button-primary"
target="_blank"
><%= __('Find out more') %></a>
</div>
</div>
<div class="mailpoet_status">
<span><%= __('Activated') %></span>
<div class="mailpoet_actions">
<button
type="button"
class="mailpoet_sending_service_activate button-secondary"
<% if(settings.mta_group == 'mailpoet' or not(mss_key_valid)) %> disabled="disabled"<% endif %>
><%= __('Activate') %></button>
</div>
</div>
<div class="mailpoet_actions">
<button
type="button"
class="mailpoet_sending_service_activate button-secondary"
<% if(settings.mta_group == 'mailpoet' or not(mss_key_valid)) %> disabled="disabled"<% endif %>
><%= __('Activate') %></button>
</div>
</li>
<li
data-group="other"
<% if(settings.mta_group == 'smtp' or settings.mta_group == 'website') %>class="mailpoet_active"<% endif %>
>
<h3><%= __('Other') %></h3>
<p class="mailpoet_description">
<strong><%= __('Send with your website or third party') %></strong>
<br />
<%= __('Choose to send emails through your website (not recommended) or a third party sender.') %>
</p>
<div class="mailpoet_status">
<span><%= __('Activated') %></span>
</div>
<div class="mailpoet_actions">
<a
class="button-secondary"
href="#mta/other"><%= __('Configure') %></a>
</div>
<div class="mailpoet_sending_method_description">
<h3><%= __('Other') %></h3>
<div class="mailpoet_description">
<strong><%= __('Send with your website or third party') %></strong>
<br />
<%= __('Choose to send emails through your website (not recommended) or a third party sender.') %>
<ul class="sending-method-benefits mailpoet_error">
<li class="mailpoet_error_item"><%= __('You\'ll probably end up in spam.') %>
<li class="mailpoet_error_item"><%= __('Sending speed is limited by your web host.') %>
<li class="mailpoet_error_item"><%= __('Manual configuration of SPF and DKIM required.') %>
<li class="mailpoet_error_item"><%= __('Bounce handling is available, but only with an extra add-on.') %>
</ul>
</div>
</div>
<div class="mailpoet_status">
<span><%= __('Activated') %></span>
<div class="mailpoet_actions">
<a
class="button-secondary"
href="#mta/other"><%= __('Configure') %></a>
</div>
</div>
</li>
</ul>

View File

@@ -25,22 +25,22 @@
><%= __('Verify') %></a>
</div>
<div
class="mailpoet_premium_key_valid mailpoet_key_valid mailpoet_success<% if not(settings.premium.premium_key) or not(premium_key_valid) %> mailpoet_hidden<% endif %>"
class="mailpoet_premium_key_valid mailpoet_success_item mailpoet_success<% if not(settings.premium.premium_key) or not(premium_key_valid) %> mailpoet_hidden<% endif %>"
>
<%= __('Your Premium key has been successfully validated.') %>
</div>
<div
class="mailpoet_premium_key_invalid mailpoet_key_invalid mailpoet_error<% if not(settings.premium.premium_key) or premium_key_valid %> mailpoet_hidden<% endif %>"
class="mailpoet_premium_key_invalid mailpoet_error_item mailpoet_error<% if not(settings.premium.premium_key) or premium_key_valid %> mailpoet_hidden<% endif %>"
>
<%= __('Your Premium key is invalid.') %>
</div>
<div
class="mailpoet_mss_key_valid mailpoet_key_valid mailpoet_success<% if not(settings.mta.mailpoet_api_key) or not(mss_key_valid) %> mailpoet_hidden<% endif %>"
class="mailpoet_mss_key_valid mailpoet_success_item mailpoet_success<% if not(settings.mta.mailpoet_api_key) or not(mss_key_valid) %> mailpoet_hidden<% endif %>"
>
<%= __('Your MailPoet Sending Service key has been successfully validated.') %>
</div>
<div
class="mailpoet_mss_key_invalid mailpoet_key_invalid mailpoet_error<% if not(settings.mta.mailpoet_api_key) or mss_key_valid %> mailpoet_hidden<% endif %>"
class="mailpoet_mss_key_invalid mailpoet_error_item mailpoet_error<% if not(settings.mta.mailpoet_api_key) or mss_key_valid %> mailpoet_hidden<% endif %>"
>
<%= __('Your MailPoet Sending Service key is invalid.') %>
</div>