Files
housesof-newsletters/housesof-newsletter-template.mjml
2020-06-02 22:40:17 +02:00

125 lines
4.6 KiB
XML
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<mjml lang="en">
<mj-head>
<!-- Font families -->
<mj-font name="HOW-Sans" href="https://static.housesof.world/fonts/webfont-sans.css" />
<mj-font name="HOW-Serif" href="https://static.housesof.world/fonts/webfont-serif.css" />
<mj-attributes>
<!-- Global attributes -->
<mj-all font-family="HOW-Sans" />
<mj-wrapper padding="0" background-color="#3C0576" />
<mj-section padding="0" />
<mj-text font-weight="300" padding="0" />
<mj-image padding="0" />
<mj-button font-weight="600" />
<mj-divider border-color="#E6E6E6" border-width="2px" />
<!-- Classes -->
<mj-class name="intro-text" color="#9D729C" font-size="16px" padding-bottom="0" />
<mj-class name="title" align="center" padding="0 8% 10%" color="#FF6C89" font-size="32px" font-family="HOW-Serif" font-weight="200" />
<mj-class name="subtitle" align="center" font-size="16px" font-weight="600" color="#999" letter-spacing="1px" text-transform="uppercase" />
<mj-class name="text" align="center" padding="0 10%" font-size="18px" color="#333" line-height="32px" />
<mj-class name="button" padding="16px 0 0" background-color="#FF6C89" color="#fff" height="48px" inner-padding="0 24px" border-radius="24px" font-size="18px" />
<mj-class name="footer-text" color="#fff" font-size="16px" align="center" />
<mj-class name="footer-info" color="#9D729D" font-size="14px" line-height="18px" align="center" padding="4px 0" />
</mj-attributes>
<!-- CSS classes (usually for links) -->
<mj-style>
.footer-link {
color: #9D729D;
text-decoration: underline;
}
.footer-link:hover {
color: #C7AEC7;
}
</mj-style>
</mj-head>
<mj-body background-color="#2D0458">
<!-- Header -->
<mj-wrapper>
<mj-section>
<mj-column width="100%">
<mj-image src="images/title-houses.png" alt="" />
</mj-column>
</mj-section>
<!-- Informations -->
<mj-section padding="96px 24px 32px">
<mj-column>
<mj-text align="left" mj-class="intro-text">
Houses Of Update #1
</mj-text>
</mj-column>
<mj-column>
<mj-text align="right" mj-class="intro-text">
May 8th, 2020
</mj-text>
</mj-column>
</mj-section>
</mj-wrapper>
<!-- Content -->
<mj-wrapper padding="0 24px">
<mj-section background-color="#fff" border-radius="6px" padding="13% 0">
<mj-column>
<!-- New Photos -->
<mj-text mj-class="title">
New Photos!
</mj-text>
<mj-image src="images/photos.jpg" alt="" padding="0 40px" />
<mj-text mj-class="subtitle" padding-top="32px">
Montpellier and Melbourne
</mj-text>
<mj-text mj-class="text" padding-top="32px" padding-bottom="32px">
In hac habitasse platea dictumst, in hac habitasse platea dictumst. Aliquam erat volutpat curabitur maximus blandit dolor, sit amet consequat mauris iaculis non!
</mj-text>
<mj-button mj-class="button" href="/">
See the new photos
</mj-button>
<mj-divider padding="13% 0" />
<!-- New Location(s) -->
<mj-text mj-class="title" >
New Locations!
</mj-text>
<mj-image src="images/location.png" alt="" width="480px" padding="0 24px" />
<mj-text mj-class="text" padding-top="32px" padding-bottom="32px">
In hac habitasse platea dictumst, in hac habitasse platea dictumst. Aliquam erat volutpat curabitur maximus blandit dolor, sit amet consequat mauris iaculis non!
</mj-text>
<mj-button mj-class="button" href="/">
Discover Marseille's homes
</mj-button>
</mj-column>
</mj-section>
</mj-wrapper>
<!-- Footer -->
<mj-wrapper padding="13% 0 6%">
<mj-section>
<mj-column>
<mj-text mj-class="footer-text" padding="0 0 16px">
&copy; Houses Of 2020
</mj-text>
<mj-text mj-class="footer-text" padding="16px 0 12px">
A project by
</mj-text>
<mj-image src="images/logo-cetrucflotte.png" alt="Cetrucflotte logo" href="https://cetrucflotte.com" align="center" width="140px" />
<!-- Links -->
<mj-text mj-class="footer-info" padding-top="48px">
<a href="/" class="footer-link">Manage subscribe preferences</a>
</mj-text>
<mj-text mj-class="footer-info">
<a href="/" class="footer-link">Unsubscribe</a>
</mj-text>
<mj-text mj-class="footer-info">
See this email as a <a href="/" class="footer-link">web page</a>.
</mj-text>
</mj-column>
</mj-section>
</mj-wrapper>
</mj-body>
</mjml>