Browse Source

Update grapesjs mjml v0.1.10

pull/2301/head
Artur Arseniev 7 years ago
parent
commit
d309c9528c
  1. 42
      demo-mjml.html
  2. 81
      js/grapesjs-mjml.min.js

42
demo-mjml.html

@ -20,7 +20,7 @@
<!-- Plugins -->
<script src="./js/grapesjs-plugin-ckeditor.min.js"></script>
<script src="./js/grapesjs-mjml.min.js?v=0.0.31"></script>
<script src="./js/grapesjs-mjml.min.js?v0.1.10"></script>
<script src="./js/grapesjs-aviary.min.js"></script>
</head>
@ -43,30 +43,26 @@
<div id="gjs" style="height:0px; overflow:hidden">
<mjml><mj-body>
<mj-container>
<!-- Company Header -->
<mj-section background-color="#f0f0f0">
<mj-column>
<mj-text font-style="italic" font-size="20" color="#626262">
<mj-text font-style="italic" font-size="20px" color="#626262">
My Company
</mj-text>
</mj-column>
</mj-section>
<!-- Image Header -->
<mj-section background-url="//1.bp.blogspot.com/-TPrfhxbYpDY/Uh3Refzk02I/AAAAAAAALw8/5sUJ0UUGYuw/s1600/New+York+in+The+1960's+-+70's+(2).jpg" background-size="cover" background-repeat="no-repeat">
<mj-column>
<mj-text align="center" color="#fff" font-size="40" font-family="Helvetica Neue">Slogan here</mj-text>
<mj-text align="center" color="#fff" font-size="40px" font-family="Helvetica Neue">Slogan here</mj-text>
<mj-button background-color="#F63A4D" href="#">
Promotion
</mj-button>
</mj-column>
</mj-section>
<!-- Intro text -->
<mj-section background-color="#fafafa">
<mj-column width="400">
<mj-text font-style="italic" font-size="20" font-family="Helvetica Neue" color="#626262">My Awesome Text</mj-text>
<mj-column width="400px">
<mj-text font-style="italic" font-size="20px" font-family="Helvetica Neue" color="#626262">My Awesome Text</mj-text>
<mj-text color="#525252">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin rutrum enim eget magna efficitur, eu semper augue semper. Aliquam erat volutpat. Cras id dui lectus. Vestibulum sed finibus lectus, sit amet suscipit nibh. Proin nec commodo purus. Sed eget
nulla elit. Nulla aliquet mollis faucibus.
@ -75,13 +71,12 @@
</mj-column>
</mj-section>
<!-- Side image -->
<mj-section background-color="white">
<mj-column>
<mj-image width="200" src="https://designspell.files.wordpress.com/2012/01/sciolino-paris-bw.jpg" />
<mj-image width="200px" src="https://designspell.files.wordpress.com/2012/01/sciolino-paris-bw.jpg" />
</mj-column>
<mj-column>
<mj-text font-style="italic" font-size="20" font-family="Helvetica Neue" color="#626262">
<mj-text font-style="italic" font-size="20px" font-family="Helvetica Neue" color="#626262">
Find amazing places
</mj-text>
<mj-text color="#525252">
@ -89,29 +84,34 @@
</mj-column>
</mj-section>
<!-- Icons -->
<mj-section background-color="#fbfbfb">
<mj-column>
<mj-image width="100" src="//191n.mj.am/img/191n/3s/x0l.png" />
<mj-image width="100px" src="//191n.mj.am/img/191n/3s/x0l.png" />
</mj-column>
<mj-column>
<mj-image width="100" src="//191n.mj.am/img/191n/3s/x01.png" />
<mj-image width="100px" src="//191n.mj.am/img/191n/3s/x01.png" />
</mj-column>
<mj-column>
<mj-image width="100" src="//191n.mj.am/img/191n/3s/x0s.png" />
<mj-image width="100px" src="//191n.mj.am/img/191n/3s/x0s.png" />
</mj-column>
</mj-section>
<!-- Footer -->
<mj-section background-color="#e7e7e7">
<mj-column>
<mj-button href="#">Hello There!</mj-button>
<mj-social display="facebook twitter" />
<mj-social font-size="15px" icon-size="30px" mode="horizontal">
<mj-social-element name="facebook" href="https://mjml.io/">
Facebook
</mj-social-element>
<mj-social-element name="google" href="https://mjml.io/">
Google
</mj-social-element>
<mj-social-element name="twitter" href="https://mjml.io/">
Twitter
</mj-social-element>
</mj-social>
</mj-column>
</mj-section>
<!-- Footer -->
</mj-container>
</mj-body></mjml>
</div>

81
js/grapesjs-mjml.min.js

File diff suppressed because one or more lines are too long
Loading…
Cancel
Save