Update grapesjs mjml v0.1.10

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-column width="400px">
-            <mj-text font-style="italic" font-size="20" font-family="Helvetica Neue" color="#626262">My Awesome Text</mj-text>
+            <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>