Ghost/core/server/services/mega/template.js

/* eslint indent: warn, no-irregular-whitespace: warn */
const iff = (cond, yes, no) => (cond ? yes : no);
module.exports = ({post, site, templateSettings}) => {
    const date = new Date();
    const hasFeatureImageCaption = templateSettings.labsFeatureImageMeta && templateSettings.showFeatureImage && post.feature_image && post.feature_image_caption;
    return `<!doctype html>
<html>

<head>
<meta name="viewport" content="width=device-width" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>${post.title}</title>
<style>
/* -------------------------------------
    GLOBAL RESETS
------------------------------------- */

/*All the styling goes here*/

img {
    border: none;
    -ms-interpolation-mode: bicubic;
    max-width: 100%;
}

body {
    background-color: #fff;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
    -webkit-font-smoothing: antialiased;
    font-size: 18px;
    line-height: 1.4;
    margin: 0;
    padding: 0;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    color: #15212A;
}

table {
    border-collapse: separate;
    mso-table-lspace: 0pt;
    mso-table-rspace: 0pt;
    width: 100%;
}

table td {
    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: #15212A;
}

/* -------------------------------------
    BODY & CONTAINER
------------------------------------- */
.body {
    background-color: #fff;
    width: 100%;
}

/* Set a max-width, and make it display as block so it will automatically stretch to that width, but will also shrink down on a phone or something */
.container {
    display: block;
    margin: 0 auto !important;
    /* makes it centered */
    max-width: 600px;
}

/* This should also be a block element, so that it will fill 100% of the .container */
.content {
    box-sizing: border-box;
    display: block;
    margin: 0 auto;
    max-width: 600px;
}

/* -------------------------------------
    POST CONTENT
------------------------------------- */
hr {
    position: relative;
    display: block;
    width: 100%;
    margin: 3em 0;
    padding: 0;
    height: 1px;
    border: 0;
    border-top: 1px solid #e5eff5;
}

p,
ul,
ol,
dl,
blockquote {
    margin: 0 0 1.5em 0;
    line-height: 1.6em;
}

ol,
ul {
    padding-left: 1.3em;
    padding-right: 1.5em;
}

ol ol,
ul ul,
ul ol,
ol ul {
    margin: 0.5em 0 1em;
}

ul {
    list-style: disc;
}

ol {
    list-style: decimal;
}

ul,
ol {
    max-width: 100%;
}

li {
    margin: 0.5em 0;
    padding-left: 0.3em;
    line-height: 1.6em;
}

dt {
    float: left;
    margin: 0 20px 0 0;
    width: 120px;
    color: #15212A;
    font-weight: 500;
    text-align: right;
}

dd {
    margin: 0 0 5px 0;
    text-align: left;
}

blockquote {
    margin: 2em 0;
    padding: 0 25px 0 25px;
    border-left: ${templateSettings.accentColor || '#15212A'} 2px solid;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.6em;
    letter-spacing: -0.2px;
}

blockquote p {
    margin: 0.8em 0;
    font-size: 1em;
}

blockquote small {
    display: inline-block;
    margin: 0.8em 0 0.8em 1.5em;
    font-size: 0.9em;
    opacity: 0.8;
}

blockquote cite {
    font-weight: bold;
}
blockquote cite a {
    font-weight: normal;
}

a {
    color: #15212A;
    text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    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.15em;
    font-weight: 600;
    text-rendering: optimizeLegibility;
}

h1 {
    margin: 1.5em 0 0.5em 0;
    font-size: 42px;
    font-weight: 600;
}

h2 {
    margin: 1.5em 0 0.5em 0;
    font-size: 32px;
    line-height: 1.22em;
}

h3 {
    margin: 1.5em 0 0.5em 0;
    font-size: 26px;
    line-height: 1.25em;
}

h4 {
    margin: 1.8em 0 0.5em 0;
    font-size: 21px;
    line-height: 1.3em;
}

h5 {
    margin: 2em 0 0.5em 0;
    font-size: 19px;
    line-height: 1.4em;
}

h6 {
    margin: 2em 0 0.5em 0;
    font-size: 19px;
    line-height: 1.4em;
    font-weight: 700;
}

strong {
    font-weight: 700;
}

figure {
    margin: 0 0 1.5em;
    padding: 0;
}

figcaption {
    text-align: center;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
    font-size: 14px;
    padding-top: 5px;
    line-height: 1.5em;
}

code {
    font-size: 0.9em;
}

pre {
    white-space: pre-wrap;
    background: #15212A;
    padding: 15px;
    border-radius: 3px;
    line-height: 1.2em;
    color: #ffffff;
}

p code {
    background: #F2F7FA;
    word-break: break-all;
    padding: 1px 7px;
    border-radius: 3px;
}

figure blockquote p {
    font-size: 1em;
}

.header-image {
    padding-top: 16px;
}

.site-icon {
    padding-bottom: 10px;
    padding-top: 20px;
    text-align: center;
    border-radius: 3px;
}

.site-icon img {
    width: 48px;
    height: 48px;
    border-radius: 3px;
}

.site-info {
    padding-top: 50px;
    border-bottom: 1px solid #e5eff5;
}

.site-url {
    color: #15212A;
    font-size: 16px;
    letter-spacing: -0.1px;
    font-weight: 700;
    text-transform: uppercase;
    text-align: center;
    padding-bottom: 50px;
}

.post-title {
    padding-bottom: 10px;
    font-size: 42px;
    line-height: 1.1em;
    font-weight: 600;
    text-align: center;
}
.post-title-serif {
    font-family: Georgia, serif;
}
.post-title-left {
    text-align: left;
}

.post-title-link {
    color: #15212A;
    display: block;
    text-align: center;
    margin-top: 50px;
}
.post-title-link-left {
    text-align: left;
}

.post-meta,
.view-online {
    padding-bottom: 50px;
    white-space: nowrap;
    color: #738a94;
    font-size: 13px;
    letter-spacing: 0.2px;
    text-transform: uppercase;
    text-align: center;
}
.post-meta-left {
    text-align: left;
}

.view-online {
    text-align: right;
}

.view-online-link {
    word-wrap: none;
    white-space: nowrap;
    color: #15212A;
}

.feature-image {
    padding-bottom: 30px;
    width: 100%;
}

.feature-image-with-caption {
    padding-bottom: 10px;
}

.feature-image-caption {
    width: 100%;
    padding-bottom: 30px;
    text-align: center;
    font-size: 13px;
    color: #738a94;
}

.post-content {
    max-width: 600px !important;
    font-family: Georgia, serif;
    font-size: 18px;
    line-height: 1.5em;
    color: #23323D;
    padding-bottom: 20px;
    border-bottom: 1px solid #e5eff5;
}

.post-content-sans-serif {
    max-width: 600px !important;
    font-size: 17px;
    line-height: 1.5em;
    color: #23323D;
    padding-bottom: 20px;
    border-bottom: 1px solid #e5eff5;
}

.post-content a,
.post-content-sans-serif a {
    color: #08121A;
    text-decoration: underline;
}

.kg-bookmark-card {
    width: 100%;
    background: #ffffff;
}

.kg-bookmark-card a {
    text-decoration: none;
}

.kg-card + .kg-bookmark-card {
    margin-top: 0;
}

.kg-image-card img {
    display: block;
    margin: 0 auto;
    height: auto !important;
}

.kg-bookmark-container {
    display: flex;
    min-height: 148px;
    color: #15212A;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
    text-decoration: none;
    border-radius: 3px;
    border: 1px solid #e5eff5;
}

.kg-bookmark-content {
    display: inline-block;
    width: 100%;
    padding: 20px;
}

.kg-bookmark-title {
    color: #15212A;
    font-size: 15px;
    line-height: 1.5em;
    font-weight: 600;
}

.kg-bookmark-description {
    display: -webkit-box;
    overflow-y: hidden;
    margin-top: 12px;
    max-height: 40px;
    color: #738a94;
    font-size: 13px;
    line-height: 1.5em;
    font-weight: 400;

    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.kg-bookmark-thumbnail {
    min-width: 140px;
    max-width: 180px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 0 2px 2px 0;
}

.kg-bookmark-thumbnail img {
    display: none;
}

.kg-bookmark-metadata {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 14px;
    color: #15212A;
    font-size: 13px;
    font-weight: 400;
}

.kg-bookmark-icon {
    margin-right: 8px;
    width: 22px;
    height: 22px;
}

.kg-bookmark-author {
    line-height: 1.5em;
}

.kg-bookmark-publisher {
    overflow: hidden;
    max-width: 240px;
    line-height: 1.5em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kg-bookmark-publisher:before {
    content: "•";
    margin: 0 6px;
}

.kg-gallery-container {
    margin-top: -20px;
}

.kg-gallery-image img {
    width: 100% !important;
    height: auto !important;
    padding-top: 20px;
}

.kg-video-preview {
    background-color: #1d1f21;
    background-image: radial-gradient(circle at center, #5b5f66, #1d1f21);
    display: block;
    text-decoration: none !important;
}
.kg-video-preview table {
    background-size: cover;
    min-height: 200px; /* for when images aren't loaded */
}
.kg-video-play-button {
    height: 2em;
    width: 3em;
    margin: 0 auto;
    border-radius: 10px;
    padding: 1em 0.8em 0.6em 1em;
    font-size: 1em; /* change this to resize */
    background-color: rgba(0,0,0,0.85);
}
.kg-video-play-button div {
    display: block;
    width: 0;
    height: 0;
    margin: 0 auto;
    line-height: 0px; /* fix for Yahoo Mail */
    border-color: transparent transparent transparent white;
    border-style: solid;
    border-width: 0.8em 0 0.8em 1.5em;
}


/* -------------------------------------
    HEADER, FOOTER, MAIN
------------------------------------- */
.main {
    background: #ffffff;
    border-radius: 3px;
    width: 100%;
}

.wrapper {
    box-sizing: border-box;
    padding: 0 20px;
}

.content-block {
    padding-bottom: 10px;
    padding-top: 10px;
}

.footer {
    color: #738a94;
    margin-top: 20px;
    text-align: center;
    font-size: 13px;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left: 30px;
    padding-right: 30px;
    line-height: 1.5em;
}

.footer a {
    color: #738a94;
    text-decoration: underline;
}

/* -------------------------------------
    BUTTONS
------------------------------------- */
.btn {
    box-sizing: border-box;
    width: 100%;
}

.btn>tbody>tr>td {
    padding-bottom: 15px;
}

.btn table {
    width: auto;
}

.btn table td {
    background-color: #ffffff;
    border-radius: 5px;
    text-align: center;
}

.btn a {
    background-color: #ffffff;
    border: solid 1px #3498db;
    border-radius: 5px;
    box-sizing: border-box;
    color: #3498db;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: bold;
    margin: 0;
    padding: 12px 25px;
    text-decoration: none;
    text-transform: capitalize;
}

.btn-primary table td {
    background-color: #3498db;
}

.btn-primary a {
    background-color: #3498db;
    border-color: #3498db;
    color: #ffffff;
}

/* -------------------------------------
    OTHER STYLES THAT MIGHT BE USEFUL
------------------------------------- */
.last {
    margin-bottom: 0;
}

.first {
    margin-top: 0;
}

.align-center {
    text-align: center;
}

.align-right {
    text-align: right;
}

.align-left {
    text-align: left;
}

.clear {
    clear: both;
}

.mt0 {
    margin-top: 0;
}

.mb0 {
    margin-bottom: 0;
}

.preheader {
    color: transparent;
    display: none;
    height: 0;
    max-height: 0;
    max-width: 0;
    opacity: 0;
    overflow: hidden;
    mso-hide: all;
    visibility: hidden;
    width: 0;
}

/* -------------------------------------
    RESPONSIVE AND MOBILE FRIENDLY STYLES
------------------------------------- */
@media only screen and (max-width: 620px) {

    table.body {
        width: 100%;
        min-width: 100%;
    }

    table.body p,
    table.body ul,
    table.body ol,
    table.body td,
    table.body span {
        font-size: 16px !important;
    }

    table.body pre {
        white-space: pre-wrap !important;
        word-break: break-word !important;
    }

    table.body .wrapper,
    table.body .article {
        padding: 0 10px !important;
    }

    table.body .content {
        padding: 0 !important;
    }

    table.body .container {
        padding: 0 !important;
        width: 100% !important;
    }

    table.body .main {
        border-left-width: 0 !important;
        border-radius: 0 !important;
        border-right-width: 0 !important;
    }

    table.body .btn table {
        width: 100% !important;
    }

    table.body .btn a {
        width: 100% !important;
    }

    table.body .img-responsive {
        height: auto !important;
        max-width: 100% !important;
        width: auto !important;
    }

    table.body .site-icon img {
        width: 40px !important;
        height: 40px !important;
    }

    table.body .site-url a {
        font-size: 14px !important;
        padding-bottom: 15px !important;
    }

    table.body .post-meta {
        white-space: normal !important;
        font-size: 12px !important;
        line-height: 1.5em;
    }

    table.body .view-online-link,
    table.body .footer,
    table.body .footer a {
        font-size: 12px !important;
    }

    table.body .post-title a {
        font-size: 32px !important;
        line-height: 1.15em !important;
    }

    table.body .kg-bookmark-card {
        width: 90vw !important;
    }

    table.body .kg-bookmark-thumbnail {
        display: none !important;
    }

    table.body .kg-bookmark-metadata span {
        font-size: 13px !important;
    }

    table.body .kg-embed-card {
        max-width: 90vw !important;
    }

    table.body h1 {
        font-size: 32px !important;
        line-height: 1.3em !important;
    }

    table.body h2 {
        font-size: 26px !important;
        line-height: 1.22em !important;
    }

    table.body h3 {
        font-size: 21px !important;
        line-height: 1.25em !important;
    }

    table.body h4 {
        font-size: 19px !important;
        line-height: 1.3em !important;
    }

    table.body h5 {
        font-size: 16px !important;
        line-height: 1.4em !important;
    }

    table.body h6 {
        font-size: 16px !important;
        line-height: 1.4em !important;
    }

    table.body blockquote {
        font-size: 17px !important;
        line-height: 1.6em !important;
        margin-bottom: 0 !important;
        padding-left: 15px !important;
    }

    table.body blockquote + * {
        margin-top: 1.5em !important;
    }

    table.body hr {
        margin: 2em 0 !important;
    }

    table.body figcaption,
    table.body figcaption a {
        font-size: 13px !important;
    }

}

/* -------------------------------------
    PRESERVE THESE STYLES IN THE HEAD
------------------------------------- */
@media all {
    .ExternalClass {
        width: 100%;
    }

    .ExternalClass,
    .ExternalClass p,
    .ExternalClass span,
    .ExternalClass font,
    .ExternalClass td,
    .ExternalClass div {
        line-height: 100%;
    }

    .apple-link a {
        color: inherit !important;
        font-family: inherit !important;
        font-size: inherit !important;
        font-weight: inherit !important;
        line-height: inherit !important;
        text-decoration: none !important;
    }

    #MessageViewBody a {
        color: inherit;
        text-decoration: none;
        font-size: inherit;
        font-family: inherit;
        font-weight: inherit;
        line-height: inherit;
    }

    .btn-primary table td:hover {
        background-color: #34495e !important;
    }

    .btn-primary a:hover {
        background-color: #34495e !important;
        border-color: #34495e !important;
    }
}


${ templateSettings.showBadge ? `
.footer-powered {
    text-align: center;
    padding-top: 70px;
    padding-bottom: 40px;
}

.gh-powered {
    width: 142px;
    height: 30px;
}
` : ''}

/* ----- ENDIF THE BROWSER ----- */

</style>
</head>

<body class="">
    <span class="preheader">${ post.excerpt ? post.excerpt : `${post.title} – ` }</span>
    <table role="presentation" border="0" cellpadding="0" cellspacing="0" class="body" width="100%">

        <!-- Outlook doesn't respect max-width so we need an extra centered table -->
        <!--[if mso]>
        <tr>
            <td>
                <center>
                    <table border="0" cellpadding="0" cellspacing="0" width="600">
        <![endif]-->

        <tr>
            <td>&nbsp;</td>
            <td class="container">
                <div class="content">

                    <!-- START CENTERED WHITE CONTAINER -->
                    <table role="presentation" border="0" cellpadding="0" cellspacing="0" class="main" width="100%">

                        <!-- START MAIN CONTENT AREA -->
                        <tr>
                            <td class="wrapper">
                                <table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%">

                                    ${ templateSettings.headerImage ? `
                                    <tr>
                                        <td class="header-image" width="100%" align="center"><img src="${templateSettings.headerImage}"${templateSettings.headerImageWidth ? ` width="${templateSettings.headerImageWidth}"` : ''}></td>
                                    </tr>
                                    ` : ''}


                                    ${ templateSettings.showHeaderIcon || templateSettings.showHeaderTitle ? `
                                    <tr>
                                        <td class="site-info" width="100%" align="center">
                                            <table role="presentation" border="0" cellpadding="0" cellspacing="0">
                                                ${ templateSettings.showHeaderIcon && site.iconUrl ? `
                                                <tr>
                                                    <td class="site-icon"><a href="${site.url}"><img src="${site.iconUrl}" border="0"></a></td>
                                                </tr>
                                                ` : ``}
                                                ${ templateSettings.showHeaderTitle ? `
                                                <tr>
                                                    <td class="site-url"><div style="width: 100% !important;"><a href="${site.url}">${site.title}</a></div></td>
                                                </tr>
                                                ` : ``}
                                            </table>
                                        </td>
                                    </tr>
                                    ` : ''}


                                    <tr>
                                        <td class="post-title ${templateSettings.titleFontCategory === 'serif' ? `post-title-serif` : `` } ${templateSettings.titleAlignment === 'left' ? `post-title-left` : ``}">
                                            <a href="${post.url}" class="post-title-link ${templateSettings.titleAlignment === 'left' ? `post-title-link-left` : ``}">${post.title}</a>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%">
                                                <tr>
                                                    <td class="post-meta ${templateSettings.titleAlignment === 'left' ? `post-meta-left` : ``}">
                                                        By ${post.authors} –
                                                        ${post.published_at} –
                                                        <a href="${post.url}" class="view-online-link">View online →</a>
                                                    </td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                    ${ templateSettings.showFeatureImage && post.feature_image ? `
                                    <tr>
                                        <td class="feature-image ${hasFeatureImageCaption ? 'feature-image-with-caption' : ''}"><img src="${post.feature_image}"${post.feature_image_width ? ` width="${post.feature_image_width}"` : ''} alt="${post.feature_image_alt}"></td>
                                    </tr>
                                    ` : ``}
                                    ${ hasFeatureImageCaption ? `
                                    <tr>
                                        <td class="feature-image-caption" align="center">${post.feature_image_caption}</td>
                                    </tr>
                                    ` : ``}
                                    <tr>
                                        <td class="${(templateSettings.bodyFontCategory === 'sans_serif') ? `post-content-sans-serif` : `post-content` }">
                                            <!-- POST CONTENT START -->
                                            ${post.html}
                                            <!-- POST CONTENT END -->
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>

                        <!-- END MAIN CONTENT AREA -->

                        <tr>
                            <td class="wrapper" align="center">
                                <table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%" style="padding-top: 40px; padding-bottom: 30px;">
                                    ${iff(!!templateSettings.footerContent, `<tr><td class="footer">${templateSettings.footerContent}</td></tr>`, '')}
                                    <tr>
                                        <td class="footer">${site.title} &copy; ${date.getFullYear()} – <a href="%recipient.unsubscribe_url%">Unsubscribe</a></td>
                                    </tr>

                                    ${ templateSettings.showBadge ? `
                                    <tr>
                                        <td class="footer-powered"><a href="https://ghost.org/"><img src="https://static.ghost.org/v4.0.0/images/powered.png" border="0" width="142" height="30" class="gh-powered" alt="Publish with Ghost"></a></td>
                                    </tr>
                                    ` : '' }
                                </table>
                            </td>
                        </tr>

                    </table>
                    <!-- END CENTERED WHITE CONTAINER -->
                </div>
            </td>
            <td>&nbsp;</td>
        </tr>

    <!--[if mso]>
                    </table>
                </center>
            </td>
        </tr>
    <![endif]-->

    </table>
</body>

</html>`;
};
-												Added eslint ignore comments for template

no-issue

											
										
										
											2019-11-06 09:12:21 +03:00
+								/* eslint indent: warn, no-irregular-whitespace: warn */
-												Added setting for newsletter footer content (#12359)

no-issue

We want to give users to ability to customise the content of their newsletter, and the first step
toward that is a setting in which we can store text or html to embed in the template
											
										
										
											2020-11-13 16:18:47 +03:00
+								const iff = (cond, yes, no) => (cond ? yes : no);
-												✨ Added newsletter design settings (#12352)

refs https://github.com/TryGhost/Ghost/issues/12355

- Adds new default settings for newsletter customisations - `newsletter_show_badge`, `newsletter_show_header` and `newsletter_body_font_category`
- Adds migrations to update group for new settings
- Add migration to update settings based on existing config value for newsletter settings
- Passes new newsletter settings to newsletter template and updates design based on them
- Fix tests
											
										
										
											2020-11-11 15:56:11 +03:00
+								module.exports = ({post, site, templateSettings}) => {
-												Added authors to email preview template

											
										
										
											2019-11-06 14:03:28 +03:00
+								    const date = new Date();
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								    const hasFeatureImageCaption = templateSettings.labsFeatureImageMeta && templateSettings.showFeatureImage && post.feature_image && post.feature_image_caption;
-												Added current year in email footer

											
										
										
											2019-11-06 12:16:50 +03:00
+								    return `<!doctype html>
-												Added basic HTML template support to MEGA (#11336)

no issue

- Sends formatted email to members
- Added css inlining support for MEGA template
- Migrated MEGA service to use API serializers
- Service needs to be compliant with the API to be able to serve absolute URLs for resources like images
- Fixed send email check for previously sent mails
											
										
										
											2019-11-04 13:53:42 +03:00
+								<html>
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
 								<head>
 								<meta name="viewport" content="width=device-width" />
 								<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 								<title>${post.title}</title>
 								<style>
 								/* -------------------------------------
 								    GLOBAL RESETS
 								------------------------------------- */
 								/*All the styling goes here*/
 								img {
 								    border: none;
 								    -ms-interpolation-mode: bicubic;
 								    max-width: 100%;
 								}
 								body {
 								    background-color: #fff;
 								    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
 								    -webkit-font-smoothing: antialiased;
 								    font-size: 18px;
 								    line-height: 1.4;
 								    margin: 0;
 								    padding: 0;
 								    -ms-text-size-adjust: 100%;
 								    -webkit-text-size-adjust: 100%;
 								    color: #15212A;
 								}
 								table {
 								    border-collapse: separate;
 								    mso-table-lspace: 0pt;
 								    mso-table-rspace: 0pt;
 								    width: 100%;
 								}
 								table td {
 								    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: #15212A;
 								}
 								/* -------------------------------------
 								    BODY & CONTAINER
 								------------------------------------- */
 								.body {
 								    background-color: #fff;
 								    width: 100%;
 								}
 								/* Set a max-width, and make it display as block so it will automatically stretch to that width, but will also shrink down on a phone or something */
 								.container {
 								    display: block;
 								    margin: 0 auto !important;
 								    /* makes it centered */
 								    max-width: 600px;
 								}
 								/* This should also be a block element, so that it will fill 100% of the .container */
 								.content {
 								    box-sizing: border-box;
 								    display: block;
 								    margin: 0 auto;
 								    max-width: 600px;
 								}
 								/* -------------------------------------
 								    POST CONTENT
 								------------------------------------- */
 								hr {
 								    position: relative;
 								    display: block;
 								    width: 100%;
 								    margin: 3em 0;
 								    padding: 0;
 								    height: 1px;
 								    border: 0;
 								    border-top: 1px solid #e5eff5;
 								}
 								p,
 								ul,
 								ol,
 								dl,
 								blockquote {
 								    margin: 0 0 1.5em 0;
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								    line-height: 1.6em;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
 								ol,
 								ul {
 								    padding-left: 1.3em;
 								    padding-right: 1.5em;
 								}
 								ol ol,
 								ul ul,
 								ul ol,
 								ol ul {
 								    margin: 0.5em 0 1em;
 								}
 								ul {
 								    list-style: disc;
 								}
 								ol {
 								    list-style: decimal;
 								}
 								ul,
 								ol {
 								    max-width: 100%;
 								}
 								li {
 								    margin: 0.5em 0;
 								    padding-left: 0.3em;
 								    line-height: 1.6em;
 								}
 								dt {
 								    float: left;
 								    margin: 0 20px 0 0;
 								    width: 120px;
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    color: #15212A;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    font-weight: 500;
 								    text-align: right;
 								}
 								dd {
 								    margin: 0 0 5px 0;
 								    text-align: left;
 								}
 								blockquote {
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    margin: 2em 0;
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								    padding: 0 25px 0 25px;
-												💄Updated newsletter design to use accent color

no issue

- Updates newsletter design to use accent color for blockquote border if present

											
										
										
											2021-01-15 17:01:57 +03:00
+								    border-left: ${templateSettings.accentColor || '#15212A'} 2px solid;
-												Updated newsletter blockquote font styling

											
										
										
											2021-01-15 17:41:27 +03:00
+								    font-size: 17px;
 								    font-weight: 500;
 								    line-height: 1.6em;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    letter-spacing: -0.2px;
 								}
 								blockquote p {
 								    margin: 0.8em 0;
-												Updated newsletter blockquote font styling

											
										
										
											2021-01-15 17:41:27 +03:00
+								    font-size: 1em;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
 								blockquote small {
 								    display: inline-block;
 								    margin: 0.8em 0 0.8em 1.5em;
 								    font-size: 0.9em;
 								    opacity: 0.8;
 								}
 								blockquote cite {
 								    font-weight: bold;
 								}
 								blockquote cite a {
 								    font-weight: normal;
 								}
 								a {
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    color: #15212A;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    text-decoration: none;
 								}
 								h1,
 								h2,
 								h3,
 								h4,
 								h5,
 								h6 {
 								    margin-top: 0;
 								    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    line-height: 1.15em;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    font-weight: 600;
 								    text-rendering: optimizeLegibility;
 								}
 								h1 {
 								    margin: 1.5em 0 0.5em 0;
-												Refined mail design

											
										
										
											2019-11-13 16:11:54 +03:00
+								    font-size: 42px;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    font-weight: 600;
 								}
 								h2 {
 								    margin: 1.5em 0 0.5em 0;
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    font-size: 32px;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    line-height: 1.22em;
 								}
 								h3 {
 								    margin: 1.5em 0 0.5em 0;
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    font-size: 26px;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    line-height: 1.25em;
 								}
 								h4 {
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    margin: 1.8em 0 0.5em 0;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    font-size: 21px;
 								    line-height: 1.3em;
 								}
 								h5 {
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    margin: 2em 0 0.5em 0;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    font-size: 19px;
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    line-height: 1.4em;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
 								h6 {
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    margin: 2em 0 0.5em 0;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    font-size: 19px;
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    line-height: 1.4em;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    font-weight: 700;
 								}
 								strong {
 								    font-weight: 700;
 								}
 								figure {
 								    margin: 0 0 1.5em;
 								    padding: 0;
 								}
 								figcaption {
 								    text-align: center;
 								    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
 								    font-size: 14px;
-												Email design refinements

											
										
										
											2019-11-20 20:27:52 +03:00
+								    padding-top: 5px;
-												🐛 Fixed small image alignment for newsletters

no refs.
- fixed image alignment to be center for images smaller than newsletter content width

											
										
										
											2020-01-21 15:21:45 +03:00
+								    line-height: 1.5em;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								code {
 								    font-size: 0.9em;
 								}
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								pre {
 								    white-space: pre-wrap;
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    background: #15212A;
 								    padding: 15px;
 								    border-radius: 3px;
 								    line-height: 1.2em;
 								    color: #ffffff;
 								}
 								p code {
 								    background: #F2F7FA;
 								    word-break: break-all;
 								    padding: 1px 7px;
 								    border-radius: 3px;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
 								figure blockquote p {
 								    font-size: 1em;
 								}
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								.header-image {
 								    padding-top: 16px;
 								}
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								.site-icon {
-												Refined mail design

											
										
										
											2019-11-13 16:11:54 +03:00
+								    padding-bottom: 10px;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    padding-top: 20px;
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    text-align: center;
 								    border-radius: 3px;
 								}
 								.site-icon img {
 								    width: 48px;
 								    height: 48px;
 								    border-radius: 3px;
 								}
 								.site-info {
-												Refined mail design

											
										
										
											2019-11-13 16:11:54 +03:00
+								    padding-top: 50px;
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								    border-bottom: 1px solid #e5eff5;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
 								.site-url {
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    color: #15212A;
 								    font-size: 16px;
 								    letter-spacing: -0.1px;
 								    font-weight: 700;
 								    text-transform: uppercase;
 								    text-align: center;
-												Refined mail design

											
										
										
											2019-11-13 16:11:54 +03:00
+								    padding-bottom: 50px;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
 								.post-title {
-												Email design refinements

											
										
										
											2019-11-20 20:27:52 +03:00
+								    padding-bottom: 10px;
-												Refined mail design

											
										
										
											2019-11-13 16:11:54 +03:00
+								    font-size: 42px;
 								    line-height: 1.1em;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    font-weight: 600;
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    text-align: center;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								.post-title-serif {
 								    font-family: Georgia, serif;
 								}
 								.post-title-left {
 								    text-align: left;
 								}
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
 								.post-title-link {
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    color: #15212A;
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								    display: block;
 								    text-align: center;
 								    margin-top: 50px;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								.post-title-link-left {
 								    text-align: left;
 								}
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								.post-meta,
 								.view-online {
-												Refined mail design

											
										
										
											2019-11-13 16:11:54 +03:00
+								    padding-bottom: 50px;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    white-space: nowrap;
 								    color: #738a94;
 								    font-size: 13px;
 								    letter-spacing: 0.2px;
 								    text-transform: uppercase;
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    text-align: center;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								.post-meta-left {
 								    text-align: left;
 								}
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
 								.view-online {
 								    text-align: right;
 								}
 								.view-online-link {
 								    word-wrap: none;
 								    white-space: nowrap;
-												Refined email template

											
										
										
											2019-11-06 11:39:10 +03:00
+								    color: #15212A;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								.feature-image {
 								    padding-bottom: 30px;
 								    width: 100%;
 								}
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								.feature-image-with-caption {
 								    padding-bottom: 10px;
 								}
 								.feature-image-caption {
 								    width: 100%;
 								    padding-bottom: 30px;
 								    text-align: center;
 								    font-size: 13px;
 								    color: #738a94;
 								}
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								.post-content {
 								    max-width: 600px !important;
 								    font-family: Georgia, serif;
 								    font-size: 18px;
 								    line-height: 1.5em;
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    color: #23323D;
-												Email design refinements

											
										
										
											2019-11-20 20:27:52 +03:00
+								    padding-bottom: 20px;
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								    border-bottom: 1px solid #e5eff5;
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								}
-												✨ Added newsletter design settings (#12352)

refs https://github.com/TryGhost/Ghost/issues/12355

- Adds new default settings for newsletter customisations - `newsletter_show_badge`, `newsletter_show_header` and `newsletter_body_font_category`
- Adds migrations to update group for new settings
- Add migration to update settings based on existing config value for newsletter settings
- Passes new newsletter settings to newsletter template and updates design based on them
- Fix tests
											
										
										
											2020-11-11 15:56:11 +03:00
+								.post-content-sans-serif {
 								    max-width: 600px !important;
 								    font-size: 17px;
 								    line-height: 1.5em;
 								    color: #23323D;
 								    padding-bottom: 20px;
 								    border-bottom: 1px solid #e5eff5;
 								}
-												Fixed sans-serif link style

no refs.
- fixed regression that links in emails with sans-serif setting wasn't underlined

											
										
										
											2020-11-23 17:50:02 +03:00
+								.post-content a,
 								.post-content-sans-serif a {
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    color: #08121A;
 								    text-decoration: underline;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
 								.kg-bookmark-card {
 								    width: 100%;
 								    background: #ffffff;
 								}
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								.kg-bookmark-card a {
 								    text-decoration: none;
 								}
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								.kg-card + .kg-bookmark-card {
 								    margin-top: 0;
 								}
-												🐛 Fixed small image alignment for newsletters

no refs.
- fixed image alignment to be center for images smaller than newsletter content width

											
										
										
											2020-01-21 15:21:45 +03:00
+								.kg-image-card img {
 								    display: block;
 								    margin: 0 auto;
-												🐛 Fixed emails appearing very wide in Outlook and improved email image sizes

closes https://github.com/TryGhost/Ghost/issues/11536

- bumps `@tryghost/kg-default-cards`
  - image and gallery cards now output `width/height` attributes on `img` elements with a max width of 600px
  - uses resized images where possible to keep email weight down
- adds `height: auto` style to image card images so that the `height` attribute does not cause distortion at smaller screen widths

											
										
										
											2020-08-18 17:33:40 +03:00
+								    height: auto !important;
-												🐛 Fixed small image alignment for newsletters

no refs.
- fixed image alignment to be center for images smaller than newsletter content width

											
										
										
											2020-01-21 15:21:45 +03:00
+								}
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								.kg-bookmark-container {
 								    display: flex;
 								    min-height: 148px;
 								    color: #15212A;
 								    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
 								    text-decoration: none;
 								    border-radius: 3px;
 								    border: 1px solid #e5eff5;
 								}
 								.kg-bookmark-content {
-												Fixed gmail bug for newsletter bookmark cards not displaying correctly

											
										
										
											2021-02-08 18:49:13 +03:00
+								    display: inline-block;
 								    width: 100%;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    padding: 20px;
 								}
 								.kg-bookmark-title {
 								    color: #15212A;
 								    font-size: 15px;
 								    line-height: 1.5em;
 								    font-weight: 600;
 								}
 								.kg-bookmark-description {
 								    display: -webkit-box;
 								    overflow-y: hidden;
 								    margin-top: 12px;
 								    max-height: 40px;
 								    color: #738a94;
 								    font-size: 13px;
 								    line-height: 1.5em;
 								    font-weight: 400;
 								    -webkit-line-clamp: 2;
 								    -webkit-box-orient: vertical;
 								}
 								.kg-bookmark-thumbnail {
 								    min-width: 140px;
 								    max-width: 180px;
-												🐛 Fixed bookmark card display in member emails when using Gmail+Chrome

no issue

- updates `@tryghost/kg-default-cards` which contains two fixes
  - removes email-specific output being added to post html (had no visual impact due to use of conditional comments but keeps rendered html smaller+cleaner)
  - adds a background-url style to the thumbnail container to give two options for styling
- updates member email template styling to hide the `<img>` element in bookmark cards and use a background image instead to get consistent rendering across email clients

											
										
										
											2020-08-24 20:17:22 +03:00
+								    background-repeat: no-repeat;
 								    background-size: cover;
 								    background-position: center;
 								    border-radius: 0 2px 2px 0;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
 								.kg-bookmark-thumbnail img {
-												🐛 Fixed bookmark card display in member emails when using Gmail+Chrome

no issue

- updates `@tryghost/kg-default-cards` which contains two fixes
  - removes email-specific output being added to post html (had no visual impact due to use of conditional comments but keeps rendered html smaller+cleaner)
  - adds a background-url style to the thumbnail container to give two options for styling
- updates member email template styling to hide the `<img>` element in bookmark cards and use a background image instead to get consistent rendering across email clients

											
										
										
											2020-08-24 20:17:22 +03:00
+								    display: none;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
 								.kg-bookmark-metadata {
 								    display: flex;
 								    flex-wrap: wrap;
 								    align-items: center;
 								    margin-top: 14px;
 								    color: #15212A;
 								    font-size: 13px;
 								    font-weight: 400;
 								}
 								.kg-bookmark-icon {
 								    margin-right: 8px;
 								    width: 22px;
 								    height: 22px;
 								}
 								.kg-bookmark-author {
 								    line-height: 1.5em;
 								}
 								.kg-bookmark-publisher {
 								    overflow: hidden;
 								    max-width: 240px;
 								    line-height: 1.5em;
 								    text-overflow: ellipsis;
 								    white-space: nowrap;
 								}
-												Fixed bug for newsletter bookmarks without author displaying redundant separator

											
										
										
											2021-02-09 11:35:30 +03:00
+								.kg-bookmark-publisher:before {
 								    content: "•";
 								    margin: 0 6px;
 								}
-												Email design refinements

											
										
										
											2019-11-20 20:27:52 +03:00
+								.kg-gallery-container {
 								    margin-top: -20px;
 								}
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								.kg-gallery-image img {
 								    width: 100% !important;
-												Fixed gallery image height

											
										
										
											2019-11-07 13:17:20 +03:00
+								    height: auto !important;
-												Email design refinements

											
										
										
											2019-11-20 20:27:52 +03:00
+								    padding-top: 20px;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
-												✨ Improved display of video embed cards in member emails

refs core/server/api/canary/oembed.js

- updated `kg-default-cards` to a version that will render a thumbnail and play button overlay for video embed cards when rendering to an email target
- added styling for video embed play button overlays to members email template

											
										
										
											2020-04-29 18:44:10 +03:00
+								.kg-video-preview {
 								    background-color: #1d1f21;
 								    background-image: radial-gradient(circle at center, #5b5f66, #1d1f21);
 								    display: block;
 								    text-decoration: none !important;
 								}
 								.kg-video-preview table {
 								    background-size: cover;
-												Fixed video embed card fallback display in Outlook

refs https://github.com/TryGhost/Ghost/issues/11756

- updates `@tryghost/kg-default-cards` which includes a VML version of video embed card fallbacks
- fixes play button styling for Yahoo Mail
- adds a minimum height to video embeds so they appear more reasonable when images are not loaded

											
										
										
											2020-04-30 14:07:49 +03:00
+								    min-height: 200px; /* for when images aren't loaded */
-												✨ Improved display of video embed cards in member emails

refs core/server/api/canary/oembed.js

- updated `kg-default-cards` to a version that will render a thumbnail and play button overlay for video embed cards when rendering to an email target
- added styling for video embed play button overlays to members email template

											
										
										
											2020-04-29 18:44:10 +03:00
+								}
 								.kg-video-play-button {
 								    height: 2em;
 								    width: 3em;
 								    margin: 0 auto;
 								    border-radius: 10px;
 								    padding: 1em 0.8em 0.6em 1em;
 								    font-size: 1em; /* change this to resize */
 								    background-color: rgba(0,0,0,0.85);
 								}
 								.kg-video-play-button div {
-												Fixed video embed card fallback display across gmail apps

refs https://github.com/TryGhost/Ghost/issues/11756

- bumped kg-default-cards package to generate fixed html for video embed fallbacks

											
										
										
											2020-05-01 15:22:40 +03:00
+								    display: block;
 								    width: 0;
 								    height: 0;
 								    margin: 0 auto;
-												Fixed video embed card fallback display in Outlook

refs https://github.com/TryGhost/Ghost/issues/11756

- updates `@tryghost/kg-default-cards` which includes a VML version of video embed card fallbacks
- fixes play button styling for Yahoo Mail
- adds a minimum height to video embeds so they appear more reasonable when images are not loaded

											
										
										
											2020-04-30 14:07:49 +03:00
+								    line-height: 0px; /* fix for Yahoo Mail */
-												✨ Improved display of video embed cards in member emails

refs core/server/api/canary/oembed.js

- updated `kg-default-cards` to a version that will render a thumbnail and play button overlay for video embed cards when rendering to an email target
- added styling for video embed play button overlays to members email template

											
										
										
											2020-04-29 18:44:10 +03:00
+								    border-color: transparent transparent transparent white;
 								    border-style: solid;
 								    border-width: 0.8em 0 0.8em 1.5em;
 								}
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
 								/* -------------------------------------
 								    HEADER, FOOTER, MAIN
 								------------------------------------- */
 								.main {
 								    background: #ffffff;
 								    border-radius: 3px;
 								    width: 100%;
 								}
 								.wrapper {
 								    box-sizing: border-box;
-												Refined mail design

											
										
										
											2019-11-13 16:11:54 +03:00
+								    padding: 0 20px;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
 								.content-block {
 								    padding-bottom: 10px;
 								    padding-top: 10px;
 								}
 								.footer {
-												Refined email template

											
										
										
											2019-11-06 11:39:10 +03:00
+								    color: #738a94;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    margin-top: 20px;
 								    text-align: center;
 								    font-size: 13px;
-												Newsletter email template refinements

no refs.
- updated color styles, links for footer text
- refined spacings for email footer paragraphs

											
										
										
											2020-11-13 18:58:56 +03:00
+								    padding-bottom: 10px;
 								    padding-top: 10px;
 								    padding-left: 30px;
 								    padding-right: 30px;
 								    line-height: 1.5em;
 								}
 								.footer a {
 								    color: #738a94;
 								    text-decoration: underline;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
 								/* -------------------------------------
 								    BUTTONS
 								------------------------------------- */
 								.btn {
 								    box-sizing: border-box;
 								    width: 100%;
 								}
 								.btn>tbody>tr>td {
 								    padding-bottom: 15px;
 								}
 								.btn table {
 								    width: auto;
 								}
 								.btn table td {
 								    background-color: #ffffff;
 								    border-radius: 5px;
 								    text-align: center;
 								}
 								.btn a {
 								    background-color: #ffffff;
 								    border: solid 1px #3498db;
 								    border-radius: 5px;
 								    box-sizing: border-box;
 								    color: #3498db;
 								    cursor: pointer;
 								    display: inline-block;
 								    font-size: 14px;
 								    font-weight: bold;
 								    margin: 0;
 								    padding: 12px 25px;
 								    text-decoration: none;
 								    text-transform: capitalize;
 								}
 								.btn-primary table td {
 								    background-color: #3498db;
 								}
 								.btn-primary a {
 								    background-color: #3498db;
 								    border-color: #3498db;
 								    color: #ffffff;
 								}
 								/* -------------------------------------
 								    OTHER STYLES THAT MIGHT BE USEFUL
 								------------------------------------- */
 								.last {
 								    margin-bottom: 0;
 								}
 								.first {
 								    margin-top: 0;
 								}
 								.align-center {
 								    text-align: center;
 								}
 								.align-right {
 								    text-align: right;
 								}
 								.align-left {
 								    text-align: left;
 								}
 								.clear {
 								    clear: both;
 								}
 								.mt0 {
 								    margin-top: 0;
 								}
 								.mb0 {
 								    margin-bottom: 0;
 								}
 								.preheader {
 								    color: transparent;
 								    display: none;
 								    height: 0;
 								    max-height: 0;
 								    max-width: 0;
 								    opacity: 0;
 								    overflow: hidden;
 								    mso-hide: all;
 								    visibility: hidden;
 								    width: 0;
 								}
 								/* -------------------------------------
 								    RESPONSIVE AND MOBILE FRIENDLY STYLES
 								------------------------------------- */
 								@media only screen and (max-width: 620px) {
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body {
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								        width: 100%;
 								        min-width: 100%;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body p,
 								    table.body ul,
 								    table.body ol,
 								    table.body td,
 								    table.body span {
-												Added basic HTML template support to MEGA (#11336)

no issue

- Sends formatted email to members
- Added css inlining support for MEGA template
- Migrated MEGA service to use API serializers
- Service needs to be compliant with the API to be able to serve absolute URLs for resources like images
- Fixed send email check for previously sent mails
											
										
										
											2019-11-04 13:53:42 +03:00
+								        font-size: 16px !important;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body pre {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        white-space: pre-wrap !important;
 								        word-break: break-word !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .wrapper,
 								    table.body .article {
-												Refined mail design

											
										
										
											2019-11-13 16:11:54 +03:00
+								        padding: 0 10px !important;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .content {
-												Added basic HTML template support to MEGA (#11336)

no issue

- Sends formatted email to members
- Added css inlining support for MEGA template
- Migrated MEGA service to use API serializers
- Service needs to be compliant with the API to be able to serve absolute URLs for resources like images
- Fixed send email check for previously sent mails
											
										
										
											2019-11-04 13:53:42 +03:00
+								        padding: 0 !important;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .container {
-												Added basic HTML template support to MEGA (#11336)

no issue

- Sends formatted email to members
- Added css inlining support for MEGA template
- Migrated MEGA service to use API serializers
- Service needs to be compliant with the API to be able to serve absolute URLs for resources like images
- Fixed send email check for previously sent mails
											
										
										
											2019-11-04 13:53:42 +03:00
+								        padding: 0 !important;
 								        width: 100% !important;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .main {
-												Added basic HTML template support to MEGA (#11336)

no issue

- Sends formatted email to members
- Added css inlining support for MEGA template
- Migrated MEGA service to use API serializers
- Service needs to be compliant with the API to be able to serve absolute URLs for resources like images
- Fixed send email check for previously sent mails
											
										
										
											2019-11-04 13:53:42 +03:00
+								        border-left-width: 0 !important;
 								        border-radius: 0 !important;
 								        border-right-width: 0 !important;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .btn table {
-												Added basic HTML template support to MEGA (#11336)

no issue

- Sends formatted email to members
- Added css inlining support for MEGA template
- Migrated MEGA service to use API serializers
- Service needs to be compliant with the API to be able to serve absolute URLs for resources like images
- Fixed send email check for previously sent mails
											
										
										
											2019-11-04 13:53:42 +03:00
+								        width: 100% !important;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .btn a {
-												Added basic HTML template support to MEGA (#11336)

no issue

- Sends formatted email to members
- Added css inlining support for MEGA template
- Migrated MEGA service to use API serializers
- Service needs to be compliant with the API to be able to serve absolute URLs for resources like images
- Fixed send email check for previously sent mails
											
										
										
											2019-11-04 13:53:42 +03:00
+								        width: 100% !important;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .img-responsive {
-												Added basic HTML template support to MEGA (#11336)

no issue

- Sends formatted email to members
- Added css inlining support for MEGA template
- Migrated MEGA service to use API serializers
- Service needs to be compliant with the API to be able to serve absolute URLs for resources like images
- Fixed send email check for previously sent mails
											
										
										
											2019-11-04 13:53:42 +03:00
+								        height: auto !important;
 								        max-width: 100% !important;
 								        width: auto !important;
 								    }
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .site-icon img {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        width: 40px !important;
 								        height: 40px !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .site-url a {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        font-size: 14px !important;
 								        padding-bottom: 15px !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .post-meta {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        white-space: normal !important;
 								        font-size: 12px !important;
 								        line-height: 1.5em;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .view-online-link,
 								    table.body .footer,
 								    table.body .footer a {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        font-size: 12px !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .post-title a {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        font-size: 32px !important;
-												Refined mail design

											
										
										
											2019-11-13 16:11:54 +03:00
+								        line-height: 1.15em !important;
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .kg-bookmark-card {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        width: 90vw !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .kg-bookmark-thumbnail {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        display: none !important;
 								    }
-												✨ Improved display of video embed cards in member emails

refs core/server/api/canary/oembed.js

- updated `kg-default-cards` to a version that will render a thumbnail and play button overlay for video embed cards when rendering to an email target
- added styling for video embed play button overlays to members email template

											
										
										
											2020-04-29 18:44:10 +03:00
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .kg-bookmark-metadata span {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        font-size: 13px !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body .kg-embed-card {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        max-width: 90vw !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body h1 {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        font-size: 32px !important;
 								        line-height: 1.3em !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body h2 {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        font-size: 26px !important;
 								        line-height: 1.22em !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body h3 {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        font-size: 21px !important;
 								        line-height: 1.25em !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body h4 {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        font-size: 19px !important;
 								        line-height: 1.3em !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body h5 {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        font-size: 16px !important;
 								        line-height: 1.4em !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body h6 {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        font-size: 16px !important;
 								        line-height: 1.4em !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body blockquote {
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								        font-size: 17px !important;
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        line-height: 1.6em !important;
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								        margin-bottom: 0 !important;
 								        padding-left: 15px !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body blockquote + * {
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								        margin-top: 1.5em !important;
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								    }
-												✨ Improved display of video embed cards in member emails

refs core/server/api/canary/oembed.js

- updated `kg-default-cards` to a version that will render a thumbnail and play button overlay for video embed cards when rendering to an email target
- added styling for video embed play button overlays to members email template

											
										
										
											2020-04-29 18:44:10 +03:00
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body hr {
-												Refined post email template

											
										
										
											2019-11-06 10:53:29 +03:00
+								        margin: 2em 0 !important;
 								    }
-												🐛 Fixed tiny font sizes sometimes seen in member emails on gmail mobile apps

refs https://github.com/TryGhost/Ghost/issues/11756

- fixed gmail scaling problems
  - the `width: 600px` on `.container` was forcing gmail to always render at 600px wide and then use scaling to resize the email to fit the device width
  - for most emails gmail would also apply their own font resizing to compensate so it didn't look _too_ bad
  - some emails however would not trigger the font resizing, most notably when posts contained a feature image, which would result in very small text
  - removing the fixed `width: 600px` resolves the scaling problem and lets the email be truly responsive
- removed attribute selectors in the media query CSS
  - gmail does not support attribute selectors
  - attribute selectors used to be necessary for Yahoo Mail but this is no longer the case
- tested using litmus.com for all popular email clients

											
										
										
											2020-05-01 13:06:52 +03:00
+								    table.body figcaption,
 								    table.body figcaption a {
-												Refined figcaption size in emails

											
										
										
											2019-11-06 14:35:03 +03:00
+								        font-size: 13px !important;
 								    }
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
 								/* -------------------------------------
 								    PRESERVE THESE STYLES IN THE HEAD
 								------------------------------------- */
 								@media all {
 								    .ExternalClass {
-												Added basic HTML template support to MEGA (#11336)

no issue

- Sends formatted email to members
- Added css inlining support for MEGA template
- Migrated MEGA service to use API serializers
- Service needs to be compliant with the API to be able to serve absolute URLs for resources like images
- Fixed send email check for previously sent mails
											
										
										
											2019-11-04 13:53:42 +03:00
+								        width: 100%;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    }
 								    .ExternalClass,
 								    .ExternalClass p,
 								    .ExternalClass span,
 								    .ExternalClass font,
 								    .ExternalClass td,
 								    .ExternalClass div {
-												Added basic HTML template support to MEGA (#11336)

no issue

- Sends formatted email to members
- Added css inlining support for MEGA template
- Migrated MEGA service to use API serializers
- Service needs to be compliant with the API to be able to serve absolute URLs for resources like images
- Fixed send email check for previously sent mails
											
										
										
											2019-11-04 13:53:42 +03:00
+								        line-height: 100%;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    }
 								    .apple-link a {
-												Added basic HTML template support to MEGA (#11336)

no issue

- Sends formatted email to members
- Added css inlining support for MEGA template
- Migrated MEGA service to use API serializers
- Service needs to be compliant with the API to be able to serve absolute URLs for resources like images
- Fixed send email check for previously sent mails
											
										
										
											2019-11-04 13:53:42 +03:00
+								        color: inherit !important;
 								        font-family: inherit !important;
 								        font-size: inherit !important;
 								        font-weight: inherit !important;
 								        line-height: inherit !important;
 								        text-decoration: none !important;
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								    }
 								    #MessageViewBody a {
-												Added basic HTML template support to MEGA (#11336)

no issue

- Sends formatted email to members
- Added css inlining support for MEGA template
- Migrated MEGA service to use API serializers
- Service needs to be compliant with the API to be able to serve absolute URLs for resources like images
- Fixed send email check for previously sent mails
											
										
										
											2019-11-04 13:53:42 +03:00
+								        color: inherit;
 								        text-decoration: none;
 								        font-size: inherit;
 								        font-family: inherit;
 								        font-weight: inherit;
 								        line-height: inherit;
 								    }
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
 								    .btn-primary table td:hover {
 								        background-color: #34495e !important;
 								    }
 								    .btn-primary a:hover {
 								        background-color: #34495e !important;
 								        border-color: #34495e !important;
-												Added basic HTML template support to MEGA (#11336)

no issue

- Sends formatted email to members
- Added css inlining support for MEGA template
- Migrated MEGA service to use API serializers
- Service needs to be compliant with the API to be able to serve absolute URLs for resources like images
- Fixed send email check for previously sent mails
											
										
										
											2019-11-04 13:53:42 +03:00
+								    }
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								}
-												Added minor member newsletter customisations via config

no issue
- adds a `members:emailTemplate` config object
  - `showSiteHeader` - defaults to `true`, shows the site title and icon in member emails
  - `showPoweredBy` - defaults to `false`, adds a "Publish with Ghost" button to member email footer
- updates member newsletter email template with hideable site header and "powered by" badge

											
										
										
											2020-08-20 18:14:43 +03:00
-												✨ Added newsletter design settings (#12352)

refs https://github.com/TryGhost/Ghost/issues/12355

- Adds new default settings for newsletter customisations - `newsletter_show_badge`, `newsletter_show_header` and `newsletter_body_font_category`
- Adds migrations to update group for new settings
- Add migration to update settings based on existing config value for newsletter settings
- Passes new newsletter settings to newsletter template and updates design based on them
- Fix tests
											
										
										
											2020-11-11 15:56:11 +03:00
+								${ templateSettings.showBadge ? `
-												Added minor member newsletter customisations via config

no issue
- adds a `members:emailTemplate` config object
  - `showSiteHeader` - defaults to `true`, shows the site title and icon in member emails
  - `showPoweredBy` - defaults to `false`, adds a "Publish with Ghost" button to member email footer
- updates member newsletter email template with hideable site header and "powered by" badge

											
										
										
											2020-08-20 18:14:43 +03:00
+								.footer-powered {
 								    text-align: center;
-												Udpated email template footer spacings

no refs.
- updated padding between Ghost badge and rest of the footer

											
										
										
											2020-11-16 14:31:37 +03:00
+								    padding-top: 70px;
-												Added minor member newsletter customisations via config

no issue
- adds a `members:emailTemplate` config object
  - `showSiteHeader` - defaults to `true`, shows the site title and icon in member emails
  - `showPoweredBy` - defaults to `false`, adds a "Publish with Ghost" button to member email footer
- updates member newsletter email template with hideable site header and "powered by" badge

											
										
										
											2020-08-20 18:14:43 +03:00
+								    padding-bottom: 40px;
 								}
 								.gh-powered {
 								    width: 142px;
 								    height: 30px;
 								}
 								` : ''}
 								/* ----- ENDIF THE BROWSER ----- */
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								</style>
 								</head>
 								<body class="">
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								    <span class="preheader">${ post.excerpt ? post.excerpt : `${post.title} – ` }</span>
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								    <table role="presentation" border="0" cellpadding="0" cellspacing="0" class="body" width="100%">
-												Fixed Outlook not centring content column in member emails

refs https://github.com/TryGhost/Ghost/issues/11756

- we removed the fixed `width: 600px` to fix gmail scaling but that means we need a new way of creating a 600px centre column in Outlook

											
										
										
											2020-05-01 15:40:02 +03:00
 								        <!-- Outlook doesn't respect max-width so we need an extra centered table -->
 								        <!--[if mso]>
 								        <tr>
 								            <td>
 								                <center>
 								                    <table border="0" cellpadding="0" cellspacing="0" width="600">
 								        <![endif]-->
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								        <tr>
 								            <td>&nbsp;</td>
 								            <td class="container">
 								                <div class="content">
 								                    <!-- START CENTERED WHITE CONTAINER -->
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								                    <table role="presentation" border="0" cellpadding="0" cellspacing="0" class="main" width="100%">
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
 								                        <!-- START MAIN CONTENT AREA -->
 								                        <tr>
 								                            <td class="wrapper">
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								                                <table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%">
-												Added minor member newsletter customisations via config

no issue
- adds a `members:emailTemplate` config object
  - `showSiteHeader` - defaults to `true`, shows the site title and icon in member emails
  - `showPoweredBy` - defaults to `false`, adds a "Publish with Ghost" button to member email footer
- updates member newsletter email template with hideable site header and "powered by" badge

											
										
										
											2020-08-20 18:14:43 +03:00
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								                                    ${ templateSettings.headerImage ? `
 								                                    <tr>
 								                                        <td class="header-image" width="100%" align="center"><img src="${templateSettings.headerImage}"${templateSettings.headerImageWidth ? ` width="${templateSettings.headerImageWidth}"` : ''}></td>
 								                                    </tr>
 								                                    ` : ''}
-												Added minor member newsletter customisations via config

no issue
- adds a `members:emailTemplate` config object
  - `showSiteHeader` - defaults to `true`, shows the site title and icon in member emails
  - `showPoweredBy` - defaults to `false`, adds a "Publish with Ghost" button to member email footer
- updates member newsletter email template with hideable site header and "powered by" badge

											
										
										
											2020-08-20 18:14:43 +03:00
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								                                    ${ templateSettings.showHeaderIcon || templateSettings.showHeaderTitle ? `
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								                                    <tr>
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								                                        <td class="site-info" width="100%" align="center">
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								                                            <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								                                                ${ templateSettings.showHeaderIcon && site.iconUrl ? `
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								                                                <tr>
-												🐛 Fixed missing publication icon in newsletter emails

no issue

Email template was incorrectly setting up publication icon url in case of subdirectory setup, leading to missing publication logo from newsletter emails in such cases. This adds the fix to use correct absolute url for publication icons in all setups.

											
										
										
											2020-03-12 07:22:33 +03:00
+								                                                    <td class="site-icon"><a href="${site.url}"><img src="${site.iconUrl}" border="0"></a></td>
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								                                                </tr>
 								                                                ` : ``}
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								                                                ${ templateSettings.showHeaderTitle ? `
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								                                                <tr>
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								                                                    <td class="site-url"><div style="width: 100% !important;"><a href="${site.url}">${site.title}</a></div></td>
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								                                                </tr>
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								                                                ` : ``}
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								                                            </table>
 								                                        </td>
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								                                    </tr>
-												Added minor member newsletter customisations via config

no issue
- adds a `members:emailTemplate` config object
  - `showSiteHeader` - defaults to `true`, shows the site title and icon in member emails
  - `showPoweredBy` - defaults to `false`, adds a "Publish with Ghost" button to member email footer
- updates member newsletter email template with hideable site header and "powered by" badge

											
										
										
											2020-08-20 18:14:43 +03:00
+								                                    ` : ''}
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								                                    <tr>
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								                                        <td class="post-title ${templateSettings.titleFontCategory === 'serif' ? `post-title-serif` : `` } ${templateSettings.titleAlignment === 'left' ? `post-title-left` : ``}">
 								                                            <a href="${post.url}" class="post-title-link ${templateSettings.titleAlignment === 'left' ? `post-title-link-left` : ``}">${post.title}</a>
 								                                        </td>
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								                                    </tr>
 								                                    <tr>
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								                                        <td>
-												Refined email styles

											
										
										
											2019-11-22 13:40:56 +03:00
+								                                            <table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%">
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								                                                <tr>
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								                                                    <td class="post-meta ${templateSettings.titleAlignment === 'left' ? `post-meta-left` : ``}">
-												✨ Improved display of video embed cards in member emails

refs core/server/api/canary/oembed.js

- updated `kg-default-cards` to a version that will render a thumbnail and play button overlay for video embed cards when rendering to an email target
- added styling for video embed play button overlays to members email template

											
										
										
											2020-04-29 18:44:10 +03:00
+								                                                        By ${post.authors} –
 								                                                        ${post.published_at} –
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								                                                        <a href="${post.url}" class="view-online-link">View online →</a>
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								                                                    </td>
 								                                                </tr>
 								                                            </table>
 								                                        </td>
 								                                    </tr>
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								                                    ${ templateSettings.showFeatureImage && post.feature_image ? `
 								                                    <tr>
 								                                        <td class="feature-image ${hasFeatureImageCaption ? 'feature-image-with-caption' : ''}"><img src="${post.feature_image}"${post.feature_image_width ? ` width="${post.feature_image_width}"` : ''} alt="${post.feature_image_alt}"></td>
 								                                    </tr>
 								                                    ` : ``}
 								                                    ${ hasFeatureImageCaption ? `
-												Fixed code linting issues

no issue

- just extraneous whitespace

											
										
										
											2020-02-03 20:49:41 +03:00
+								                                    <tr>
-												✨ Added additional newsletter customisation settings (#13074)

refs https://github.com/TryGhost/Team/issues/793

New settings added for newsletter customisation options:

- `newsletter_header_image` - `null/"$url"`
- `newsletter_show_header_icon` - `"true/false"`
- `newsletter_show_header_title` - `"true/false"`
- `newsletter_title_alignment` - `"center/left"`
- `newsletter_title_font_category` - `"serif/sans_serif"`
- `newsletter_show_feature_image` - `"true/false"`

`newsletter_show_header` has been dropped because the same functionality can be achieved by setting both `newsletter_show_header_icon` and `newsletter_show_header_title` to `false`

---

- migration to convert and delete `newsletter_show_header` setting
- removed `newsletter_show_header` from default settings to ensure it doesn't get re-created
- replaced main labs template and template settings generation with the labs template
- deleted labs template
											
										
										
											2021-06-21 15:40:40 +03:00
+								                                        <td class="feature-image-caption" align="center">${post.feature_image_caption}</td>
-												Fixed code linting issues

no issue

- just extraneous whitespace

											
										
										
											2020-02-03 20:49:41 +03:00
+								                                    </tr>
 								                                    ` : ``}
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								                                    <tr>
-												✨ Added newsletter design settings (#12352)

refs https://github.com/TryGhost/Ghost/issues/12355

- Adds new default settings for newsletter customisations - `newsletter_show_badge`, `newsletter_show_header` and `newsletter_body_font_category`
- Adds migrations to update group for new settings
- Add migration to update settings based on existing config value for newsletter settings
- Passes new newsletter settings to newsletter template and updates design based on them
- Fix tests
											
										
										
											2020-11-11 15:56:11 +03:00
+								                                        <td class="${(templateSettings.bodyFontCategory === 'sans_serif') ? `post-content-sans-serif` : `post-content` }">
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								                                            <!-- POST CONTENT START -->
 								                                            ${post.html}
 								                                            <!-- POST CONTENT END -->
 								                                        </td>
 								                                    </tr>
 								                                </table>
 								                            </td>
 								                        </tr>
 								                        <!-- END MAIN CONTENT AREA -->
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
 								                        <tr>
-												Udpated email template footer spacings

no refs.
- updated padding between Ghost badge and rest of the footer

											
										
										
											2020-11-16 14:31:37 +03:00
+								                            <td class="wrapper" align="center">
 								                                <table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%" style="padding-top: 40px; padding-bottom: 30px;">
-												Added setting for newsletter footer content (#12359)

no-issue

We want to give users to ability to customise the content of their newsletter, and the first step
toward that is a setting in which we can store text or html to embed in the template
											
										
										
											2020-11-13 16:18:47 +03:00
+								                                    ${iff(!!templateSettings.footerContent, `<tr><td class="footer">${templateSettings.footerContent}</td></tr>`, '')}
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								                                    <tr>
-												Fixed code linting issues

no issue

- just extraneous whitespace

											
										
										
											2020-02-03 20:49:41 +03:00
+								                                        <td class="footer">${site.title} &copy; ${date.getFullYear()} – <a href="%recipient.unsubscribe_url%">Unsubscribe</a></td>
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								                                    </tr>
-												Added minor member newsletter customisations via config

no issue
- adds a `members:emailTemplate` config object
  - `showSiteHeader` - defaults to `true`, shows the site title and icon in member emails
  - `showPoweredBy` - defaults to `false`, adds a "Publish with Ghost" button to member email footer
- updates member newsletter email template with hideable site header and "powered by" badge

											
										
										
											2020-08-20 18:14:43 +03:00
-												✨ Added newsletter design settings (#12352)

refs https://github.com/TryGhost/Ghost/issues/12355

- Adds new default settings for newsletter customisations - `newsletter_show_badge`, `newsletter_show_header` and `newsletter_body_font_category`
- Adds migrations to update group for new settings
- Add migration to update settings based on existing config value for newsletter settings
- Passes new newsletter settings to newsletter template and updates design based on them
- Fix tests
											
										
										
											2020-11-11 15:56:11 +03:00
+								                                    ${ templateSettings.showBadge ? `
-												Added minor member newsletter customisations via config

no issue
- adds a `members:emailTemplate` config object
  - `showSiteHeader` - defaults to `true`, shows the site title and icon in member emails
  - `showPoweredBy` - defaults to `false`, adds a "Publish with Ghost" button to member email footer
- updates member newsletter email template with hideable site header and "powered by" badge

											
										
										
											2020-08-20 18:14:43 +03:00
+								                                    <tr>
-												Updated 'Powered by' badge ref to 4.0 repo

											
										
										
											2021-03-10 18:02:00 +03:00
+								                                        <td class="footer-powered"><a href="https://ghost.org/"><img src="https://static.ghost.org/v4.0.0/images/powered.png" border="0" width="142" height="30" class="gh-powered" alt="Publish with Ghost"></a></td>
-												Added minor member newsletter customisations via config

no issue
- adds a `members:emailTemplate` config object
  - `showSiteHeader` - defaults to `true`, shows the site title and icon in member emails
  - `showPoweredBy` - defaults to `false`, adds a "Publish with Ghost" button to member email footer
- updates member newsletter email template with hideable site header and "powered by" badge

											
										
										
											2020-08-20 18:14:43 +03:00
+								                                    </tr>
 								                                    ` : '' }
-												Working on email template

											
										
										
											2019-11-06 06:21:35 +03:00
+								                                </table>
 								                            </td>
 								                        </tr>
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								                    </table>
 								                    <!-- END CENTERED WHITE CONTAINER -->
 								                </div>
 								            </td>
 								            <td>&nbsp;</td>
 								        </tr>
-												Fixed Outlook not centring content column in member emails

refs https://github.com/TryGhost/Ghost/issues/11756

- we removed the fixed `width: 600px` to fix gmail scaling but that means we need a new way of creating a 600px centre column in Outlook

											
										
										
											2020-05-01 15:40:02 +03:00
 								    <!--[if mso]>
 								                    </table>
 								                </center>
 								            </td>
 								        </tr>
 								    <![endif]-->
-												Added basic HTML template support to MEGA (#11336)

no issue

- Sends formatted email to members
- Added css inlining support for MEGA template
- Migrated MEGA service to use API serializers
- Service needs to be compliant with the API to be able to serve absolute URLs for resources like images
- Fixed send email check for previously sent mails
											
										
										
											2019-11-04 13:53:42 +03:00
+								    </table>
-												Updated post email template

											
										
										
											2019-11-05 12:36:40 +03:00
+								</body>
-												Added current year in email footer

											
										
										
											2019-11-06 12:16:50 +03:00
+								</html>`;
-												✨ Improved display of video embed cards in member emails

refs core/server/api/canary/oembed.js

- updated `kg-default-cards` to a version that will render a thumbnail and play button overlay for video embed cards when rendering to an email target
- added styling for video embed play button overlays to members email template

											
										
										
											2020-04-29 18:44:10 +03:00
+								};