]> git.ipfire.org Git - thirdparty/foundation/foundation-emails.git/commitdiff
Get inliner working on test files
authorGeoff Kimball <geoff@zurb.com>
Mon, 24 Aug 2015 23:33:50 +0000 (16:33 -0700)
committerGeoff Kimball <geoff@zurb.com>
Mon, 24 Aug 2015 23:34:28 +0000 (16:34 -0700)
_build/container-test.html [deleted file]
_build/goodbye.html [deleted file]
_build/hello.html [deleted file]
_build/letter.html [deleted file]
test/gulpfile.js
test/layouts/default.html

diff --git a/_build/container-test.html b/_build/container-test.html
deleted file mode 100644 (file)
index b0cd7a7..0000000
+++ /dev/null
@@ -1,46 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <link rel="stylesheet" type="text/css" href="css/ink.css">
-  <!-- inject:mq-css -->
-  <!-- endinject -->
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-  <meta name="viewport" content="width=device-width">
-</head>
-<body>
-  <table class="body">
-    <tr>
-      <td class="center" align="center" valign="top">
-        <center>
-         <table class="container"><tbody><tr><td>
-           <table class="row"><tbody><tr>
-             <td class="wrapper last"><table class="small-12 large-12 columns"><tr><td class="sub-columns small-6 large-6">
-                   <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.
-                   </p>
-                 </td><td class="sub-columns last small-6 large-6">
-                   <img src="http://placehold.it/400x100" alt="">
-                  </td><td class="expander"></td></tr></table></td>
-           </tr></tbody></table>
-         </td></tr></tbody></table>
-         
-         <br>
-         <br>
-         <br>
-         <br>
-         
-         <table class="container"><tbody><tr><td>
-           <table class="row"><tbody><tr>
-             <td class="wrapper"><table class="small-12 large-6 columns"><tr></tr><tr><td><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.
-               </p></td></tr><td class="expander"></td></table></td>
-             <td class="wrapper last"><table class="small-12 large-6 columns"><tr></tr><tr><td><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.
-               </p></td></tr><td class="expander"></td></table></td>
-           </tr></tbody></table>
-         </td></tr></tbody></table>
-         
-        </center>
-      </td>
-    </tr>
-  </table>
-</body>
-</html>
\ No newline at end of file
diff --git a/_build/goodbye.html b/_build/goodbye.html
deleted file mode 100644 (file)
index 2b87975..0000000
+++ /dev/null
@@ -1,24 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <link rel="stylesheet" type="text/css" href="css/ink.css">
-  <!-- inject:mq-css -->
-  <!-- endinject -->
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-  <meta name="viewport" content="width=device-width">
-</head>
-<body>
-  <table class="body">
-    <tr>
-      <td class="center" align="center" valign="top">
-        <center>
-         <table class="row"><tbody><tr>
-           <td class="wrapper last"><table class="small-12 large-12 columns"><tr></tr><tr><td><h6>What&apos;s up</h6></td></tr><td class="expander"></td></table></td>
-         </tr></tbody></table>
-        </center>
-      </td>
-    </tr>
-  </table>
-</body>
-</html>
\ No newline at end of file
diff --git a/_build/hello.html b/_build/hello.html
deleted file mode 100644 (file)
index b060f56..0000000
+++ /dev/null
@@ -1,73 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <link rel="stylesheet" type="text/css" href="css/ink.css">
-  <!-- inject:mq-css -->
-  <!-- endinject -->
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-  <meta name="viewport" content="width=device-width">
-</head>
-<body>
-  <table class="body">
-    <tr>
-      <td class="center" align="center" valign="top">
-        <center>
-         <table class="row header"><tbody><tr>
-           <table class="container"><tbody><tr><td>
-             </td><td class="wrapper last"><table class="small-12 large-12 columns"><tr><td class="sub-columns small-6 large-6">
-                 <img src="http://placehold.it/200x50">
-               </td><td class="sub-columns last small-6 large-6">
-                 <span class="template-label">SIDEBAR HERO</span>
-               </td><td class="expander"></td></tr></table></td>
-           </tr></tbody></table></tr></tbody></table></center></td></tr></table>    
-         
-         <table class="container"><tbody><tr><td>
-           <table class="row"><tbody><tr>
-             <td class="wrapper last"><table class="small-12 large-12 columns"><tr></tr><tr><td><h1>asdfakh</h1></td></tr><tr><td><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</p></td></tr><img width="580" height="300" src="https://placekitten.com/g/580/300"><td class="expander"></td></table></td>
-           </tr></tbody></table>
-           <table class="row"><tbody><tr>
-             <td class="wrapper last"><table class="small-12 large-12 columns"><tr><td class="callout">
-                 <p>Phasellus dictum sapien a neque luctus cursus. Pellentesque sem dolor, fringilla et pharetra vitae.</p>
-                 <table class="button"><tbody><tr><td><a href="#">Click it! &#xBB;</a></td></tr></tbody></table>
-               </td><td class="expander"></td></tr></table></td>
-           </tr></tbody></table>
-           <table class="row"><tbody><tr>
-             <td class="wrapper"><table class="small-12 large-6 columns"><tr></tr><tr><td><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et. Lorem ipsum dolor sit amet.</p></td></tr><tr><td><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et. Lorem ipsum dolor sit amet.</p></td></tr><td><table class="button"><tbody><tr><td><a href="#">Click Me!</a></td></tr></tbody></table></td><tr><td><br></td></tr><td class="callout">
-               <p>What a game</p>
-               </td><td class="expander"></td></table></td>
-             <td class="wrapper last"><table class="small-12 large-6 columns"><tr><td class="callout">
-                 <h6>Header Thing</h6>
-                 <p>Sub-head or something</p>
-                 <table class="inline-list"><tbody><tr><td class="vertical"><a href="#">Just a Plain Link &#xBB;</a></td></tr><tr><td class="vertical"><a href="#">Just a Plain Link &#xBB;</a></td></tr><tr><td class="vertical"><a href="#">Just a Plain Link &#xBB;</a></td></tr><tr><td class="vertical"><hr></td></tr><tr><td class="vertical"><a href="#">Just a Plain Link &#xBB;</a></td></tr><tr><td class="vertical"><hr></td></tr><tr><td class="vertical"><a href="#">Just a Plain Link &#xBB;</a></td></tr><tr><td class="vertical"><hr></td></tr><tr><td class="vertical"><a href="#">Just a Plain Link &#xBB;</a></td></tr><tr><td class="vertical"><hr></td></tr><tr><td class="vertical"><a href="#">Just a Plain Link &#xBB;</a></td></tr></tbody></table>
-               </td><td class="expander"></td></tr></table></td>
-           </tr></tbody></table>
-           <table class="row"><tbody><tr>
-             <td class="wrapper"><table class="small-12 large-6 columns"><tr><td class="expander"></td></tr></table></td>
-             <td class="wrapper last"><table class="small-12 large-6 columns"><tr><td class="callout">
-                 <h6 style="margin-bottom:5px;">Connect With Us:</h6>
-                 <table class="button tiny-button facebook"><tbody><tr><td>
-                   <a href="#">Facebook</a>
-                 </td></tr></tbody></table>
-                 <hr>
-                 <table class="button tiny-button twitter"><tbody><tr><td>
-                   <a href="#">Twitter</a>
-                 </td></tr></tbody></table>
-                 <hr>
-                 <table class="button tiny-button google-plus"><tbody><tr><td>
-                   <a href="#">Google</a>
-                 </td></tr></tbody></table>
-                 <br>
-                 <h6 style="margin-bottom:5px;">Contact Info:</h6>
-                 <p>Phone: <b>408.341.0600</b></p>
-                 <p>Email: <a href="mailto:hseldon@trantor.com">hseldon@trantor.com</a></p>
-               </td><td class="expander"></td></tr></table></td>
-           </tr></tbody></table>
-         </td></tr></tbody></table>
-         
-        
-      
-    
-  
-</body>
-</html>
\ No newline at end of file
diff --git a/_build/letter.html b/_build/letter.html
deleted file mode 100644 (file)
index 07a2f76..0000000
+++ /dev/null
@@ -1,106 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <link rel="stylesheet" type="text/css" href="css/ink.css">
-  <!-- inject:mq-css -->
-  <!-- endinject -->
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-  <meta name="viewport" content="width=device-width">
-</head>
-<body>
-  <table class="body">
-    <tr>
-      <td class="center" align="center" valign="top">
-        <center>
-         <table class="container"><tbody><tr><td>
-           <table class="row"><tbody><tr>
-             <td class="wrapper last"><table class="small-12 large-12 columns"><tr></tr><tr><td><p class="lead">Hi John,</p></td></tr><tr><td><p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet.</p></td></tr><td class="expander"></td></table></td>
-         </tr></tbody></table>
-         <table class="row"><tbody><tr>
-           <td class="wrapper last"><table class="small-12 large-12 columns"><tr><img width="580" height="300" src="http://placehold.it/580x300"><td class="expander"></td></tr></table></td>
-         </tr></tbody></table>
-         <table class="row"><tbody><tr>
-           <td class="wrapper last"><table class="small-12 large-12 columns"><tr></tr><tr><td><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p></td></tr><tr><td><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</p></td></tr><tr><td><p>Cheers,<br>Bryan</p></td></tr><td class="expander"></td></table></td>
-         </tr></tbody></table>
-         <hr>
-         <table class="row"><tbody><tr>
-             <td class="wrapper"><table class="small-12 large-6 columns"><tr></tr><tr>
-                 <td class="tweet-pad panel tweet-head">
-                   <a href="https://twitter.com/ZURB/status/541043140933582848">
-                     <img align="left" class="tweet-avatar" src="http://placehold.it/50x50">
-                     <h3>ZURB</h3>
-                     <h6 class="tweet-handle">@ZURB</h6>
-                   </a>
-                 </td>
-                 <td class="expander"></td>
-               </tr><tr>
-                 <td class="tweet-pad panel">
-                   <p>Introducing Foundation for Apps: Create beautiful web apps that look great on all devices. <a href="http://t.co/ufBR1IalT5">zurb.us/1yjUnj6</a></p>
-                 </td>
-                 <td class="expander"></td>   
-               </tr><tr>
-                 <td class="tweet-pad tweet-foot panel">
-                   <a href="https://twitter.com/ZURB/status/541043140933582848">
-                     <p class="tweet-date">8:35 PM - 5 Dec 2014</p>
-                   </a>
-                 </td>
-                 <td class="expander"></td> 
-               </tr><td class="expander"></td></table></td>
-         
-             <td class="wrapper last"><table class="small-12 large-6 columns"><tr></tr><tr>
-                 <td align="left" class="tweet-pad panel tweet-head">
-                   <a href="https://twitter.com/ZURB/status/541043140933582848">
-                     <img align="left" class="tweet-avatar" src="http://placehold.it/50x50">
-                     <h3>ZURB</h3>
-                     <h6 class="tweet-handle">@ZURB</h6>
-                   </a>
-                 </td>
-                 <td class="expander"></td>
-               </tr><tr>
-                 <td class="tweet-pad panel">
-                   <p>Introducing Foundation for Apps: Create beautiful web apps that look great on all devices. <a href="http://t.co/ufBR1IalT5">zurb.us/1yjUnj6</a></p>
-                 </td>
-                 <td class="expander"></td>   
-               </tr><tr>
-                 <td class="tweet-pad tweet-foot panel">
-                   <a href="https://twitter.com/ZURB/status/541043140933582848">
-                     <p class="tweet-date">8:35 PM - 5 Dec 2014</p>
-                   </a>
-                 </td>
-                 <td class="expander"></td> 
-               </tr><td class="expander"></td></table></td>
-         </tr></tbody></table>
-         <hr>
-         
-         
-         
-         
-         <table class="row copyright"><tbody><tr>
-           <td class="wrapper last"><table class="small-12 large-12 columns"><tr></tr><tr><td><h5 class="center">Sharing is caring</h5></td></tr><tr><td><p class="center">Share ZURBnews and keep the good vibes going.</p></td></tr><td class="expander"></td></table></td>
-         </tr></tbody></table>
-         
-         <!-- ^^^^^Expander not working^^^^^ -->
-         
-         
-         <table class="row share-news" offset="1"><tbody><tr>
-         <!-- ^^^Not sure how to best implement the offset class.^^^^ 
-              It is applied to a td.wrapper that is automatically generated.
-              This might be a proposed option -->
-              <td class="wrapper"><table class="small-12 large-1 columns"><tr><td class="expander"></td></tr></table></td>
-           <td class="wrapper"><table class="small-12 large-5 columns"><tr><td><table class="button facebook"><tbody><tr><td>
-               <a href="#">Share on facebook</a> 
-             </td></tr></tbody></table></td><td class="expander"></td></tr></table></td>
-           <td class="wrapper last"><table class="small-12 large-5 columns"><tr><td><table class="button facebook"><tbody><tr><td>
-               <a href="#">Share on facebook</a> 
-             </td></tr></tbody></table></td><td class="expander"></td></tr></table></td>
-         </tr></tbody></table>
-         <hr>
-         </td></tr></tbody></table>
-         
-        </center>
-      </td>
-    </tr>
-  </table>
-</body>
-</html>
\ No newline at end of file
index 923553cc7180490be1cd0d23b5461a238366e5d9..60261a6412234d99a61028c2a1816759059f07f5 100644 (file)
@@ -33,31 +33,24 @@ gulp.task('sass', function() {
 });
 
 // Inline CSS and minify HTML
-gulp.task('inline', ['build'], function() {
+gulp.task('inline', function() {
   // Extracts media query-specific CSS into a separate file
-  mq('../_build/css/app.css', '../_build/css/app-mq.css');
+  mq('../_build/css/ink.css', '../_build/css/ink-mq.css');
 
-  // Injects that extracted CSS into the HTML
-  var inject = $.inject(gulp.src('../_build/css/app-mq.css'), {
-    starttag: '<!-- inject:mq -->',
-    transform: function(path, file) {
-      return '<style>\n' + file.contents.toString() + '\n</style>';
-    }
+  var inject = $.inject(gulp.src('../_build/css/ink-mq.css'), {
+    transform: function(path, file) { return '<style>' + file.contents.toString(); + '</style>'; }
   });
 
   return gulp.src('../_build/*.html')
     .pipe($.inlineCss())
-    .pipe(inject())
-    .pipe($.htmlmin())
+    .pipe(inject)
+    // .pipe($.htmlmin())
     .pipe(gulp.dest('../_build'));
 });
 
 // Build the "dist" folder by running all of the above tasks
-gulp.task('build', function(done) {
-  var tasks = ['pages', 'sass'];
-  if (isProduction) tasks.push('inline');
-
-  sequence('clean', tasks, done);
+gulp.task('build', function(cb) {
+  sequence('clean', ['pages', 'sass'], 'inline', cb);
 });
 
 // Build emails, run the server, and watch for file changes
index fe259875a59a0733064398edb9ae14a86842c1f7..eafd235d8101e5885cf2337e2e06b4bb9dcba88c 100644 (file)
@@ -2,7 +2,7 @@
 <html>
 <head>
   <link rel="stylesheet" type="text/css" href="css/ink.css">
-  <!-- inject:mq-css -->
+  <!-- inject:css -->
   <!-- endinject -->
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   <meta name="viewport" content="width=device-width"/>