22824b9685
Fixes https://linear.app/tryghost/issue/DES-544/upgrade-email-paywall-button-doesnt-match-normal-buttons-in-newsletter In emails, the button for the paywall wasn't getting the border-radius, as [Gmail strips out font styling applied to the `td` element in the HTML](https://stackoverflow.com/a/38041282). Those styles are now moved out of that element, and look to apply correctly.
22 lines
1.8 KiB
Handlebars
22 lines
1.8 KiB
Handlebars
<div class="align-center" style="text-align: center;">
|
|
<hr
|
|
style="position: relative; display: block; width: 100%; margin: 3em 0; padding: 0; height: 1px; border: 0; border-top: 1px solid #e5eff5;">
|
|
<h2
|
|
style="margin-top: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; line-height: 1.11em; font-weight: 700; text-rendering: optimizeLegibility; margin: 1.5em 0 0.5em 0; font-size: 26px;">
|
|
Upgrade to <span style="white-space: nowrap; font-size: 26px!important;">continue reading.</span></h2>
|
|
<p style="margin: 0 auto 1.5em auto; line-height: 1.6em; max-width: 440px;">Become a paid member of {{site.title}} to get access to all
|
|
<span style="white-space: nowrap;">premium content.</span></p>
|
|
<div class="btn btn-accent" style="box-sizing: border-box; width: 100%; display: table;">
|
|
<table border="0" cellspacing="0" cellpadding="0" align="center" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; width: auto;">
|
|
<tbody>
|
|
<tr>
|
|
<td align="center" valign="top" bgcolor="{{accentColor}}" style="vertical-align: top; text-align: center; border-radius: 5px;">
|
|
<a href="{{paywall.signupUrl}}" style="overflow-wrap: anywhere; border: solid 1px #3498db; border-radius: 5px; box-sizing: border-box; cursor: pointer; display: inline-block; font-size: 14px; font-weight: bold; margin: 0; padding: 12px 25px; text-decoration: none; background-color: {{accentColor}}; border-color: {{accentColor}}; color: #FFFFFF;" target="_blank">Upgrade</a>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<p style="margin: 0 0 1.5em 0; line-height: 1.6em;"></p>
|
|
</div>
|