Adjusted spacing and amount of text of newsletter latest posts (#20285)
ref DES-347 - adjusted title and excerpt length of latest posts in emails - as the layout is same (horizontal) on both desktop and mobile, truncateHtml() needed some update - now maxLength is expected to be larger than maxLengthMobile, because the mobile layout isn't stacked anymore - some spacing adjustment has been made as well
This commit is contained in:
Sodbileg Gansukh
GitHub
parent
2ce8351c4b
commit
9ef92035f6
@ -175,6 +175,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -297,8 +305,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -315,10 +321,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -711,7 +713,7 @@ exports[`Email Preview API Read can read post email preview with email card and
|
||||
Object {
|
||||
"access-control-allow-origin": "http://127.0.0.1:2369",
|
||||
"cache-control": "no-cache, private, no-store, must-revalidate, max-stale=0, post-check=0, pre-check=0",
|
||||
"content-length": "23528",
|
||||
"content-length": "23508",
|
||||
"content-type": "application/json; charset=utf-8",
|
||||
"content-version": StringMatching /v\\\\d\\+\\\\\\.\\\\d\\+/,
|
||||
"etag": StringMatching /\\(\\?:W\\\\/\\)\\?"\\(\\?:\\[ !#-\\\\x7E\\\\x80-\\\\xFF\\]\\*\\|\\\\r\\\\n\\[\\\\t \\]\\|\\\\\\\\\\.\\)\\*"/,
|
||||
@ -800,6 +802,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -922,8 +932,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -940,10 +948,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -1356,7 +1360,7 @@ exports[`Email Preview API Read can read post email preview with fields 4: [head
|
||||
Object {
|
||||
"access-control-allow-origin": "http://127.0.0.1:2369",
|
||||
"cache-control": "no-cache, private, no-store, must-revalidate, max-stale=0, post-check=0, pre-check=0",
|
||||
"content-length": "28339",
|
||||
"content-length": "28319",
|
||||
"content-type": "application/json; charset=utf-8",
|
||||
"content-version": StringMatching /v\\\\d\\+\\\\\\.\\\\d\\+/,
|
||||
"etag": StringMatching /\\(\\?:W\\\\/\\)\\?"\\(\\?:\\[ !#-\\\\x7E\\\\x80-\\\\xFF\\]\\*\\|\\\\r\\\\n\\[\\\\t \\]\\|\\\\\\\\\\.\\)\\*"/,
|
||||
@ -1476,6 +1480,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -1598,8 +1610,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -1616,10 +1626,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -2019,7 +2025,7 @@ exports[`Email Preview API Read has custom content transformations for email com
|
||||
Object {
|
||||
"access-control-allow-origin": "http://127.0.0.1:2369",
|
||||
"cache-control": "no-cache, private, no-store, must-revalidate, max-stale=0, post-check=0, pre-check=0",
|
||||
"content-length": "23282",
|
||||
"content-length": "23262",
|
||||
"content-type": "application/json; charset=utf-8",
|
||||
"content-version": StringMatching /v\\\\d\\+\\\\\\.\\\\d\\+/,
|
||||
"etag": StringMatching /\\(\\?:W\\\\/\\)\\?"\\(\\?:\\[ !#-\\\\x7E\\\\x80-\\\\xFF\\]\\*\\|\\\\r\\\\n\\[\\\\t \\]\\|\\\\\\\\\\.\\)\\*"/,
|
||||
@ -2468,6 +2474,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -2590,8 +2604,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -2608,10 +2620,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -3025,7 +3033,7 @@ exports[`Email Preview API Read uses the newsletter provided through ?newsletter
|
||||
Object {
|
||||
"access-control-allow-origin": "http://127.0.0.1:2369",
|
||||
"cache-control": "no-cache, private, no-store, must-revalidate, max-stale=0, post-check=0, pre-check=0",
|
||||
"content-length": "24043",
|
||||
"content-length": "24023",
|
||||
"content-type": "application/json; charset=utf-8",
|
||||
"content-version": StringMatching /v\\\\d\\+\\\\\\.\\\\d\\+/,
|
||||
"etag": StringMatching /\\(\\?:W\\\\/\\)\\?"\\(\\?:\\[ !#-\\\\x7E\\\\x80-\\\\xFF\\]\\*\\|\\\\r\\\\n\\[\\\\t \\]\\|\\\\\\\\\\.\\)\\*"/,
|
||||
@ -3500,6 +3508,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -3622,8 +3638,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -3640,10 +3654,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -4057,7 +4067,7 @@ exports[`Email Preview API Read uses the posts newsletter by default 4: [headers
|
||||
Object {
|
||||
"access-control-allow-origin": "http://127.0.0.1:2369",
|
||||
"cache-control": "no-cache, private, no-store, must-revalidate, max-stale=0, post-check=0, pre-check=0",
|
||||
"content-length": "24043",
|
||||
"content-length": "24023",
|
||||
"content-type": "application/json; charset=utf-8",
|
||||
"content-version": StringMatching /v\\\\d\\+\\\\\\.\\\\d\\+/,
|
||||
"etag": StringMatching /\\(\\?:W\\\\/\\)\\?"\\(\\?:\\[ !#-\\\\x7E\\\\x80-\\\\xFF\\]\\*\\|\\\\r\\\\n\\[\\\\t \\]\\|\\\\\\\\\\.\\)\\*"/,
|
||||
|
||||
@ -68,6 +68,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -190,8 +198,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -208,10 +214,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -672,6 +674,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -794,8 +804,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -812,10 +820,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -1262,6 +1266,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -1384,8 +1396,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -1402,10 +1412,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -1852,6 +1858,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -1974,8 +1988,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -1992,10 +2004,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -2442,6 +2450,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -2564,8 +2580,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -2582,10 +2596,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -2980,6 +2990,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -3102,8 +3120,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -3120,10 +3136,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -3570,6 +3582,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -3692,8 +3712,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -3710,10 +3728,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -4254,6 +4268,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -4376,8 +4398,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -4394,10 +4414,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -6258,6 +6274,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -6380,8 +6404,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -6398,10 +6420,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -6624,10 +6642,10 @@ table.body h2 span {
|
||||
|
||||
<tr>
|
||||
<td style=\\"font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; font-size: 18px; vertical-align: top; color: #000000; padding: 24px 0; border-bottom: 1px solid #e5eff5; border-bottom: 1px solid rgba(0, 0, 0, 0.12);\\" valign=\\"top\\">
|
||||
<h3 class=\\"latest-posts-header\\" 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; text-rendering: optimizeLegibility; margin: 0; padding: 8px 0 16px; color: #000000; font-size: 13px; font-weight: 700; text-transform: uppercase;\\">Keep reading</h3>
|
||||
<h3 class=\\"latest-posts-header\\" 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; text-rendering: optimizeLegibility; margin: 0; padding: 8px 0 8px; color: #000000; font-size: 13px; font-weight: 700; text-transform: uppercase;\\">Keep reading</h3>
|
||||
<table role=\\"presentation\\" border=\\"0\\" cellpadding=\\"0\\" cellspacing=\\"0\\" style=\\"border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; width: 100%;\\" width=\\"100%\\">
|
||||
<tr>
|
||||
<td class=\\"latest-post\\" style=\\"font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; font-size: 18px; vertical-align: top; color: #000000; padding: 8px 0; max-width: 600px;\\" valign=\\"top\\">
|
||||
<td class=\\"latest-post\\" style=\\"font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; font-size: 18px; vertical-align: top; color: #000000; padding: 16px 0; max-width: 600px;\\" valign=\\"top\\">
|
||||
<table role=\\"presentation\\" border=\\"0\\" cellpadding=\\"0\\" cellspacing=\\"0\\" style=\\"border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; width: 100%;\\" width=\\"100%\\">
|
||||
<tr>
|
||||
<td valign=\\"top\\" align=\\"left\\" class=\\"latest-post-title\\" style=\\"font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; font-size: 18px; vertical-align: top; color: #000000; padding-right: 12px;\\">
|
||||
@ -6645,7 +6663,7 @@ table.body h2 span {
|
||||
</table>
|
||||
<table role=\\"presentation\\" border=\\"0\\" cellpadding=\\"0\\" cellspacing=\\"0\\" style=\\"border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; width: 100%;\\" width=\\"100%\\">
|
||||
<tr>
|
||||
<td class=\\"latest-post\\" style=\\"font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; font-size: 18px; vertical-align: top; color: #000000; padding: 8px 0; max-width: 600px;\\" valign=\\"top\\">
|
||||
<td class=\\"latest-post\\" style=\\"font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; font-size: 18px; vertical-align: top; color: #000000; padding: 16px 0; max-width: 600px;\\" valign=\\"top\\">
|
||||
<table role=\\"presentation\\" border=\\"0\\" cellpadding=\\"0\\" cellspacing=\\"0\\" style=\\"border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; width: 100%;\\" width=\\"100%\\">
|
||||
<tr>
|
||||
<td valign=\\"top\\" align=\\"left\\" class=\\"latest-post-title\\" style=\\"font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; font-size: 18px; vertical-align: top; color: #000000; padding-right: 12px;\\">
|
||||
@ -6663,7 +6681,7 @@ table.body h2 span {
|
||||
</table>
|
||||
<table role=\\"presentation\\" border=\\"0\\" cellpadding=\\"0\\" cellspacing=\\"0\\" style=\\"border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; width: 100%;\\" width=\\"100%\\">
|
||||
<tr>
|
||||
<td class=\\"latest-post\\" style=\\"font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; font-size: 18px; vertical-align: top; color: #000000; padding: 8px 0; max-width: 600px;\\" valign=\\"top\\">
|
||||
<td class=\\"latest-post\\" style=\\"font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; font-size: 18px; vertical-align: top; color: #000000; padding: 16px 0; max-width: 600px;\\" valign=\\"top\\">
|
||||
<table role=\\"presentation\\" border=\\"0\\" cellpadding=\\"0\\" cellspacing=\\"0\\" style=\\"border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; width: 100%;\\" width=\\"100%\\">
|
||||
<tr>
|
||||
<td valign=\\"top\\" align=\\"left\\" class=\\"latest-post-title\\" style=\\"font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; font-size: 18px; vertical-align: top; color: #000000; padding-right: 12px;\\">
|
||||
@ -6993,6 +7011,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -7115,8 +7141,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -7133,10 +7157,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -7638,6 +7658,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -7760,8 +7788,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -7778,10 +7804,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -8283,6 +8305,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -8405,8 +8435,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -8423,10 +8451,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -8928,6 +8952,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -9050,8 +9082,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -9068,10 +9098,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -9573,6 +9599,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -9695,8 +9729,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -9713,10 +9745,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -10218,6 +10246,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -10340,8 +10376,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -10358,10 +10392,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -10810,6 +10840,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -10932,8 +10970,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -10950,10 +10986,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
|
||||
@ -68,6 +68,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -190,8 +198,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -208,10 +214,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -658,6 +660,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -780,8 +790,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -798,10 +806,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -1248,6 +1252,14 @@ Object {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -1370,8 +1382,6 @@ table.body .feedback-button-mobile-text {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -1388,10 +1398,6 @@ table.body .latest-post-excerpt span {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
|
||||
@ -836,18 +836,23 @@ class EmailRenderer {
|
||||
*
|
||||
* @param {*} text
|
||||
* @param {number} maxLength
|
||||
* @param {number} maxLengthMobile should be larger than maxLength
|
||||
* @param {number} maxLengthMobile should be smaller than maxLength
|
||||
* @returns
|
||||
*/
|
||||
truncateHtml(text, maxLength, maxLengthMobile) {
|
||||
if (!maxLengthMobile || maxLength >= maxLengthMobile) {
|
||||
if (!maxLengthMobile || maxLength <= maxLengthMobile) {
|
||||
return escapeHtml(this.truncateText(text, maxLength));
|
||||
}
|
||||
if (text && text.length > maxLength) {
|
||||
if (text.length <= maxLengthMobile) {
|
||||
return escapeHtml(text.substring(0, maxLength - 1)) + '<span class="mobile-only">' + escapeHtml(text.substring(maxLength - 1, maxLengthMobile - 1)) + '</span>' + '<span class="hide-mobile">…</span>';
|
||||
if (text && text.length > maxLengthMobile) {
|
||||
let ellipsis = '';
|
||||
|
||||
if (text.length > maxLengthMobile && text.length <= maxLength) {
|
||||
ellipsis = '<span class="hide-desktop">…</span>';
|
||||
} else if (text.length > maxLength) {
|
||||
ellipsis = '…';
|
||||
}
|
||||
return escapeHtml(text.substring(0, maxLength - 1)) + '<span class="mobile-only">' + escapeHtml(text.substring(maxLength - 1, maxLengthMobile - 1)) + '</span>' + '…';
|
||||
|
||||
return escapeHtml(text.substring(0, maxLengthMobile - 1)) + '<span class="desktop-only">' + escapeHtml(text.substring(maxLengthMobile - 1, maxLength - 1)) + '</span>' + ellipsis;
|
||||
} else {
|
||||
return escapeHtml(text ?? '');
|
||||
}
|
||||
@ -996,7 +1001,7 @@ class EmailRenderer {
|
||||
const {href: featureImageMobile, width: featureImageMobileWidth, height: featureImageMobileHeight} = await this.limitImageWidth(latestPost.get('feature_image'), 600, 480);
|
||||
|
||||
latestPosts.push({
|
||||
title: this.truncateHtml(latestPost.get('title'), featureImage ? 85 : 105, 105),
|
||||
title: this.truncateHtml(latestPost.get('title'), featureImage ? 85 : 95, featureImageMobile ? 55 : 75),
|
||||
url: this.#getPostUrl(latestPost),
|
||||
featureImage: featureImage ? {
|
||||
src: featureImage,
|
||||
@ -1008,7 +1013,7 @@ class EmailRenderer {
|
||||
width: featureImageMobileWidth,
|
||||
height: featureImageMobileHeight
|
||||
} : null,
|
||||
excerpt: this.truncateHtml(latestPost.get('custom_excerpt') || latestPost.get('plaintext'), featureImage ? 60 : 70, 105)
|
||||
excerpt: this.truncateHtml(latestPost.get('custom_excerpt') || latestPost.get('plaintext'), featureImage ? 120 : 130, featureImageMobile ? 90 : 100)
|
||||
});
|
||||
|
||||
if (featureImage) {
|
||||
|
||||
@ -499,7 +499,7 @@ figure blockquote p {
|
||||
|
||||
.latest-posts-header {
|
||||
margin: 0;
|
||||
padding: 8px 0 16px;
|
||||
padding: 8px 0 8px;
|
||||
color: #15212A;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
@ -507,7 +507,8 @@ figure blockquote p {
|
||||
}
|
||||
|
||||
.latest-post {
|
||||
padding: 8px 0;
|
||||
max-width: 600px !important;
|
||||
padding: 16px 0;
|
||||
}
|
||||
|
||||
.latest-post a {
|
||||
@ -1288,6 +1289,10 @@ a[data-flickr-embed] img {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* -------------------------------------
|
||||
RESPONSIVE AND MOBILE FRIENDLY STYLES
|
||||
------------------------------------- */
|
||||
@ -1306,6 +1311,14 @@ a[data-flickr-embed] img {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -1448,8 +1461,6 @@ a[data-flickr-embed] img {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -1465,10 +1476,6 @@ a[data-flickr-embed] img {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
|
||||
@ -464,7 +464,7 @@ figure blockquote p {
|
||||
width: 100%;
|
||||
padding: 10px 0 30px 0;
|
||||
font-size: 13px !important;
|
||||
text-align: center;
|
||||
text-align: center;
|
||||
color: {{secondaryTextColor}};
|
||||
}
|
||||
|
||||
@ -496,7 +496,7 @@ figure blockquote p {
|
||||
|
||||
.latest-posts-header {
|
||||
margin: 0;
|
||||
padding: 8px 0 16px;
|
||||
padding: 8px 0 8px;
|
||||
color: {{titleColor}};
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
@ -505,7 +505,7 @@ figure blockquote p {
|
||||
|
||||
.latest-post {
|
||||
max-width: 600px !important;
|
||||
padding: 8px 0;
|
||||
padding: 16px 0;
|
||||
}
|
||||
|
||||
.latest-post a {
|
||||
@ -1015,9 +1015,9 @@ a[data-flickr-embed] img {
|
||||
|
||||
.kg-product-card {
|
||||
width: 100%;
|
||||
margin: 0 0 1.5em;
|
||||
margin: 0 0 1.5em;
|
||||
padding: 20px;
|
||||
border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid #e5eff5;
|
||||
border: 1px solid {{secondaryBorderColor}};
|
||||
}
|
||||
@ -1034,105 +1034,105 @@ a[data-flickr-embed] img {
|
||||
}
|
||||
|
||||
.kg-audio-card {
|
||||
width: auto;
|
||||
width: auto;
|
||||
width: 100%;
|
||||
margin: 0 auto 1.5em;
|
||||
border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid #e5eff5;
|
||||
border: 1px solid {{secondaryBorderColor}};
|
||||
}
|
||||
|
||||
.kg-audio-title {
|
||||
display: block;
|
||||
padding-right: 20px;
|
||||
padding-bottom: 4px;
|
||||
padding-top: 4px;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
line-height: 18px;
|
||||
text-decoration: none !important;
|
||||
display: block;
|
||||
padding-right: 20px;
|
||||
padding-bottom: 4px;
|
||||
padding-top: 4px;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
line-height: 18px;
|
||||
text-decoration: none !important;
|
||||
color: {{textColor}} !important;
|
||||
}
|
||||
|
||||
.kg-audio-play-button {
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
color: {{textColor}} !important;
|
||||
border-style: solid;
|
||||
border-width: 8px 0px 8px 16px;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
color: {{textColor}} !important;
|
||||
border-style: solid;
|
||||
border-width: 8px 0px 8px 16px;
|
||||
border-color: transparent transparent transparent currentColor;
|
||||
}
|
||||
|
||||
.kg-audio-duration {
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
font-size: 13px;
|
||||
text-decoration: none !important;
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
font-size: 13px;
|
||||
text-decoration: none !important;
|
||||
color: {{textColor}} !important;
|
||||
}
|
||||
|
||||
.kg-audio-link {
|
||||
text-decoration: none !important;
|
||||
color: {{textColor}};
|
||||
text-decoration: none !important;
|
||||
color: {{textColor}};
|
||||
color: {{secondaryTextColor}};
|
||||
}
|
||||
|
||||
.kg-file-card {
|
||||
width: 100%;
|
||||
margin: 0 0 1.5em 0;
|
||||
border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid #e5eff5;
|
||||
border: 1px solid {{secondaryBorderColor}};
|
||||
}
|
||||
|
||||
.kg-file-title {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding-left: 12px;
|
||||
padding-top: 8px;
|
||||
font-size: 17px;
|
||||
font-weight: bold;
|
||||
line-height: 1.3em;
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding-left: 12px;
|
||||
padding-top: 8px;
|
||||
font-size: 17px;
|
||||
font-weight: bold;
|
||||
line-height: 1.3em;
|
||||
text-decoration: none !important;
|
||||
color: {{textColor}} !important;
|
||||
color: {{textColor}} !important;
|
||||
}
|
||||
|
||||
.kg-file-description {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding-left: 12px;
|
||||
padding-top: 2px;
|
||||
font-size: 15px;
|
||||
line-height: 1.4em;
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding-left: 12px;
|
||||
padding-top: 2px;
|
||||
font-size: 15px;
|
||||
line-height: 1.4em;
|
||||
text-decoration: none !important;
|
||||
color: {{textColor}} !important;
|
||||
color: {{secondaryTextColor}} !important;
|
||||
color: {{textColor}} !important;
|
||||
color: {{secondaryTextColor}} !important;
|
||||
}
|
||||
|
||||
.kg-file-meta {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding-left: 12px;
|
||||
padding-top: 4px;
|
||||
width: 100%;
|
||||
padding-left: 12px;
|
||||
padding-top: 4px;
|
||||
padding-bottom: 8px;
|
||||
font-size: 13px;
|
||||
line-height: 1.4em;
|
||||
font-size: 13px;
|
||||
line-height: 1.4em;
|
||||
text-decoration: none !important;
|
||||
color: {{textColor}} !important;
|
||||
color: {{secondaryTextColor}} !important;
|
||||
color: {{secondaryTextColor}} !important;
|
||||
}
|
||||
|
||||
.kg-file-name {
|
||||
font-weight: 500;
|
||||
font-weight: 500;
|
||||
color: {{textColor}};
|
||||
}
|
||||
|
||||
.kg-file-thumbnail {
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
border-radius: 2px;
|
||||
{{#if backgroundIsDark}}
|
||||
background: {{backgroundColor}} !important;
|
||||
@ -1143,20 +1143,20 @@ a[data-flickr-embed] img {
|
||||
}
|
||||
|
||||
.kg-twitter-card {
|
||||
width: auto;
|
||||
width: auto;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
background: #FFFFFF !important;
|
||||
border-radius: 12px;
|
||||
border-radius: 12px;
|
||||
border: 1px solid #e5eff5;
|
||||
}
|
||||
|
||||
.kg-toggle-card {
|
||||
background: transparent;
|
||||
padding: 20px;
|
||||
padding: 20px;
|
||||
margin-bottom: 1.5em;
|
||||
border-radius: 4px;
|
||||
border: 1px solid {{secondaryBorderColor}};
|
||||
border-radius: 4px;
|
||||
border: 1px solid {{secondaryBorderColor}};
|
||||
}
|
||||
|
||||
|
||||
@ -1318,6 +1318,10 @@ a[data-flickr-embed] img {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* -------------------------------------
|
||||
RESPONSIVE AND MOBILE FRIENDLY STYLES
|
||||
------------------------------------- */
|
||||
@ -1338,6 +1342,14 @@ a[data-flickr-embed] img {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.hide-desktop {
|
||||
display: initial !important;
|
||||
}
|
||||
|
||||
.desktop-only {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body p,
|
||||
table.body ul,
|
||||
table.body ol,
|
||||
@ -1461,8 +1473,6 @@ a[data-flickr-embed] img {
|
||||
}
|
||||
|
||||
table.body .latest-post-title {
|
||||
display: inline-block !important;
|
||||
width: 100%;
|
||||
padding-right: 8px !important;
|
||||
}
|
||||
|
||||
@ -1478,10 +1488,6 @@ a[data-flickr-embed] img {
|
||||
line-height: 1.2 !important;
|
||||
}
|
||||
|
||||
table.body .latest-post-excerpt span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
table.body .subscription-box h3 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
|
||||
@ -2243,7 +2243,7 @@ describe('Email renderer', function () {
|
||||
assert.deepEqual(data.latestPosts,
|
||||
[
|
||||
{
|
||||
excerpt: 'Super long custom excerpt. Super long custom excerpt. Super<span class="mobile-only"> long custom excerpt. Super long custom excer</span>…',
|
||||
excerpt: 'Super long custom excerpt. Super long custom excerpt. Super long custom excerpt. Super lo<span class="desktop-only">ng custom excerpt. Super long </span>…',
|
||||
title: 'Test Post 1',
|
||||
url: 'http://example.com',
|
||||
featureImage: {
|
||||
@ -2327,12 +2327,12 @@ describe('Email renderer', function () {
|
||||
describe('truncateHTML', function () {
|
||||
it('works correctly', async function () {
|
||||
const emailRenderer = new EmailRenderer({});
|
||||
assert.equal(emailRenderer.truncateHtml('This is a short one', 5, 10), 'This<span class="mobile-only"> is a</span>…');
|
||||
assert.equal(emailRenderer.truncateHtml('This is a', 5, 10), 'This<span class="mobile-only"> is a</span><span class="hide-mobile">…</span>');
|
||||
assert.equal(emailRenderer.truncateHtml('This', 5, 10), 'This');
|
||||
assert.equal(emailRenderer.truncateHtml('This is a short one', 10, 5), 'This<span class="desktop-only"> is a</span>…');
|
||||
assert.equal(emailRenderer.truncateHtml('This is a', 10, 5), 'This<span class="desktop-only"> is a</span><span class="hide-desktop">…</span>');
|
||||
assert.equal(emailRenderer.truncateHtml('This', 10, 5), 'This');
|
||||
assert.equal(emailRenderer.truncateHtml('This is a long text', 5, 5), 'This…');
|
||||
assert.equal(emailRenderer.truncateHtml('This is a long text', 5), 'This…');
|
||||
assert.equal(emailRenderer.truncateHtml(null, 5, 10), '');
|
||||
assert.equal(emailRenderer.truncateHtml(null, 10, 5), '');
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user