// Live reloads on change
gulp.task('watch', ['serve'], function() {
gulp.watch([dirs.html], ['query','minify-html']);
- gulp.watch(['node_modules/gulp-zurb-foundation-email/index.js'], ['query'])
+ gulp.watch(['node_modules/gulp-zurb-foundation-email/node_modules/gulp-zurb-inky/index.js'], ['query'])
gulp.watch([dirs.styles], ['sass']);
});
<tr>
<td class="center" align="center" valign="top">
<center>
- <row>
- <columns large="12">
- Forever alone
- </columns>
- </row>
- </container>
<container>
- <columns small='8' large='2'>
- <panel>
- Hellfasdfasdf!!!
- </panel>
- </columns>
- <button>
- button
- </button>
+ <row>
+ <columns large="12">
+ <callout>
+ <img src="http://placehold.it/100x100">
+
+ <p>
+ I'm a freakin callout yo.
+ </p>
+ </callout>
+ </columns>
+ </row>
+ <row>
+ <columns large="6">
+ <callout class="success">
+ <p>
+ got some success yo
+ </p>
+ </callout>
+ </columns>
+ <columns large="6">
+ <callout class="success">
+ <p>
+ got some success yo
+ </p>
+ </callout>
+ </columns>
+ </row>
+ <row>
+ <columns large="12">
+ <callout class="warning">
+ <p>
+ Watch out there, cowboy. Watch out there, cowboy. Watch out there, cowboy. Watch out there, cowboy. Watch out there, cowboy. Watch out there, cowboy. Watch out there, cowboy. Watch out there, cowboy. Watch out there, cowboy. Watch out there, cowboy. Watch out there, cowboy. Watch out there, cowboy. Watch out there, cowboy. Watch out there, cowboy.
+ </p>
+ </callout>
+ </columns>
+ </row>
</container>
</center>
</td>
+++ /dev/null
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
-<head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <meta name="viewport" content="width=device-width"/>
- <link rel="stylesheet" href="css/ink.css">
- <link rel="stylesheet" href="css/overrides.css">
-</head>
-
-<body>
- <table class="body">
- <tr>
- <td class="center" align="center" valign="top">
- <center>
-
- <table class="container">
- <tr>
- <td style="padding: 20px;">
-
- <!-- logo -->
-
-
- <table class="row">
- <tr>
- <td class="wrapper last">
-
- <table class="large-12 columns">
- <tr>
- <td>
- <center>
- <img width="168" height="17" src="http://placehold.it/168x17" class="logo center"/>
- </center>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- </tr>
- </table>
-
- <!-- Opener -->
- <table class="row">
- <tr>
- <td class="wrapper last">
-
- <table class="large-12 columns">
- <tr>
- <td>
-
- <h1 class="center main">Build Email Buttons That Work</h1>
- <p class="center metadata">Lesson 67 | Responsive Email Design</p>
-
- </td>
- </tr>
- </table>
- <table class="large-12 columns">
- <tr>
- <td>
- <img width="580" height="300" src="http://placehold.it/580x300" class="thumbnail"/>
- </td>
- </tr>
- </table>
- <table class="large-12 columns">
- <tr>
- <td>
-
-
- <p>Calls to action are critical to many email campaigns: announcements, sales, and requests for donations all prompt people to do something outside of the email itself. That means buttons. And buttons mean trouble.</p>
-
- <p>A while back we learned the hard way that not every email browser reacts to buttons the same way. <strong>Here’s what we learned about making buttons in emails that work across most clients.</strong></p>
-
-
- <h3>1. Download Ink.</h3>
- <p><a href="#">Get a copy</a> of the framework (or look for the sample file at the end of this post).</p>
-
- <h3>2. Create a containing table.</h3>
- <p>Unfortunately, tables are the principle means of arranging content in emails. It’s 1998 all over again. In this case, we’ll create a button that’s about half the width of its container — something nice and big, but not an email-wide bar.</p>
-
-
- <h3>3. Create a link.</h3>
- <p>Naturally, this is where the button will take people when tapped. This is where we apply styles like color and shape to the button itself.</p>
-
-
- <h3>4. Create another table.</h3>
- <p>Inside the anchor — and we know that’s <a href="#">technically illegal before HTML5</a> — we add another table. This keeps the anchor from collapsing when we want a particular size. (We used to just have an anchor — but that made the button completely untappable in certain versions of Outlook. Learn from our mistakes, people!) Inside this table’s only cell is the text that you want to show users.</p>
-
- <h3>5. Apply different styles.</h3>
- <p>Ink comes with a few different options:</p>
- <h5>Sizes</h5>
- <ul>
- <li><strong>.tiny-button</strong> — smaller text size</li>
- <li><strong>.tiny-button</strong> — smaller text size</li>
- <li><strong>.tiny-button</strong> — smaller text size</li>
- </ul>
- <h5>Colors</h5>
- <ul>
- <li><strong>.success</strong> — green by default</li>
- <li><strong>.success</strong> — green by default</li>
- <li><strong>.success</strong> — green by default</li>
- </ul>
- <h5>Other</h5>
- <ul>
- <li><strong>.rounded</strong> — create circular ends</li>
- <li><strong>.rounded</strong> — create circular ends</li>
- <li><strong>.rounded</strong> — create circular ends</li>
- </ul>
- <p>And there you have it: Relatively simple buttons you can use in your ink-based templates. <a href="#">Download</a> the sample file. <a href="#">View this lesson</a> online.</p>
- </td>
- <td class="expander"></td>
-
- </td>
- </tr>
- </table>
-
- </td>
- </tr>
- </table>
-
- <hr>
-
- <!-- Feature Block -->
- <table class="row feature">
- <tr>
- <td class="wrapper last">
-
- <table class="large-12 columns">
- <tr>
- <td>
- <h2 class="center">Keep sharpening your skills online in our Responsive Email Design course</h2>
- <p>Following these tips is a great way to prepare for our online <a href="#">Responsive Email Design course</a> where you'll learn about the techniques, patterns and best practices that make email work across many email clients, even Outlook.</p>
- <p class="lead center gray" style="margin-top:20px;margin-bottom:0px;">Join the next class at 9AM (PDT) Jan. 20, 2015</h5>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
- </td>
- </tr>
- </table>
-
- <table class="row share-news">
- <tr>
- <td class="wrapper last offset-by-four">
- <table class="four columns">
- <tr>
- <td>
- <table class="button center university">
- <tr>
- <td class="center">
- <center>
- <a href="#">Reserve Your Spot</a>
- </center>
- </td>
- </tr>
- </table>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
- </td>
- </tr>
- </table>
- <br>
-
- <!-- Author -->
- <table class="row">
- <tr>
- <td class="wrapper last">
-
- <table class="large-12 columns">
- <tr>
- <td class="panel light-gray">
- <h5 class="center">About the author</h5>
- <p><a href="#">Ben Gremillion</a> is a Design Writer at ZURB. He started his career in newspaper and magazine design, saw a digital future, and learned HTML in short order. He facilitates the University training courses.</p>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
- </td>
- </tr>
- </table>
- <br>
-
- <!-- Sharing -->
-
- <table class="row copyright">
- <tr>
- <td class="wrapper last">
-
- <table class="large-12 columns">
- <tr>
- <td>
- <h5 class="center">Sharing is caring</h5>
- <p class="center">Share University Lessons and help us educate the world on Progressive Design.</p>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- </tr>
- </table>
-
- <table class="row share-news">
- <tr>
- <td class="wrapper offset-by-one">
-
- <table class="large-5 columns">
- <tr>
- <td class="white panel">
-
- <table class="button facebook">
- <tr>
- <td>
- <a href="#">Share on Facebook</a>
- </td>
- </tr>
- </table>
-
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- <td class="wrapper last">
-
- <table class="large-5 columns">
- <tr>
- <td class="white panel">
-
- <table class="button twitter">
- <tr>
- <td>
- <a href="#">Tweet on Twitter</a>
- </td>
- </tr>
- </table>
-
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- </tr>
- </table>
-
- <hr>
-
- <!-- Copyright -->
-
- <table class="row copyright">
- <tr>
- <td class="wrapper last">
-
- <table class="large-12 columns">
- <tr>
- <td>
- <h5 class="center">Brought to you by <a href="http://zurb.com">ZURB</a></h5>
- <p class="center">Talk to us on the phone <strong>(408) 341-0600</strong> or by email to <a href="mailto:getstarted@zurb.com">getstarted@zurb.com</a></p>
-
- <p class="center">ZURB, Inc. 100 W. Rincon Ave | Campbell, CA 95008</p>
- <p class="center">© 1998 – 2015 ZURB</p>
- <br>
- <p class="center">Want to Unsubscribe? We’re sorry to see you go, but happy to make it easy on you. Unsubscribe</p>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- </tr>
- </table>
-
- <!-- container end below -->
- </td>
- </tr>
- </table>
-
- </center>
- </td>
- </tr>
- </table>
-</body>
-</html>
\ No newline at end of file
+++ /dev/null
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
-<head>
- <link rel="stylesheet" type="text/css" href="../build/css/ink.css">
- <script type="text/javascript" src="js/jquery.js"></script>
- <script type="text/javascript" src="js/inky-prime.js"></script>
- <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">
- <tr>
- <td style="padding: 20px;">
-
- <!-- logo -->
- <table class="row">
- <tr>
- <td class="wrapper last">
-
- <table class="large-12 columns">
- <tr>
- <td>
- <img src="images/ZURB-logo.png" width="103" height="17" class="logo center">
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- </tr>
- </table>
-
- <!-- Opener -->
- <table class="row">
- <tr>
- <td class="wrapper last">
-
- <table class="large-12 columns">
- <tr>
- <td>
- <h1 class="center main">Punchy Headline Here</h1>
- <p class="center metadata">January 12, 2015</p>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
- <table class="large-12 columns">
- <tr>
- <td>
- <img width="580" height="300" src="http://placehold.it/580x300" class="thumbnail"/>
- </td>
- </tr>
- </table>
- <table class="large-12 columns">
- <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>
- <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 class="expander"></td>
- </td>
- </tr>
- </table>
-
- </td>
- </tr>
- </table>
-
- <!-- Opener CTA -->
- <table class="row">
- <tr>
- <td class="wrapper last offset-by-4">
-
- <table class="large-4 columns">
- <tr>
- <td>
-
- <table class="button radius center">
- <tr>
- <td class="center">
- <center>
- <a href="#">Put Link Here</a>
- </center>
- </td>
- </tr>
- </table>
-
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- </tr>
- </table>
- <br>
-
- <table class="row">
- <tr>
- <td class="wrapper last">
-
- <table class="large-12 columns">
- <tr>
- <td class="panel light-gray">
- <h5 class="center">thanks for the support</h5>
- <p>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
- </td>
- </tr>
- </table>
- <br>
-
- <!-- Feature Block -->
- <table class="row">
- <tr>
- <td class="wrapper last">
-
- <table class="large-12 columns">
- <tr>
- <td>
- <h2 class="center">Here’s something awesome</h2>
- <p class="gray lead center">Subheader please.. lorem ipsum dolor sit amet.</p>
- </td>
- </tr>
- </table>
- <table class="large-12 columns">
- <tr>
- <td>
- <img width="580" height="300" src="http://placehold.it/580x300" class="thumbnail"/>
- </td>
- </tr>
- </table>
- <table class="large-12 columns">
- <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>
- <p><a href="#">Text CTAs Are Capitalized and Have Arrows →</a></p>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- </tr>
- </table>
-
- <hr>
-
- <!-- Feature Block -->
- <table class="row">
- <tr>
- <td class="wrapper last">
-
- <table class="large-12 columns">
- <tr>
- <td>
- <h2 class="center">Here’s something awesome</h2>
- <p class="gray lead center">Subheader please.. lorem ipsum dolor sit amet.</p>
- </td>
- </tr>
- </table>
- <table class="large-12 columns">
- <tr>
- <td>
- <img width="580" height="300" src="http://placehold.it/580x300" class="thumbnail"/>
- </td>
- </tr>
- </table>
- <table class="large-12 columns">
- <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>
- <p><a href="#">Text CTAs Are Capitalized and Have Arrows →</a></p>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- </tr>
- </table>
-
- <hr>
-
- <!-- 3-Up Feature -->
- <table class="row">
- <tr>
- <td class="wrapper last">
-
- <table class="large-12 columns">
- <tr>
- <td>
- <h2 class="center">Here’s something awesome</h2>
- <p class="gray lead center">Subheader please.. lorem ipsum dolor sit amet.
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- </tr>
- </table>
-
- <table class="row">
- <tr>
- <td class="wrapper">
-
- <table class="large-4 columns">
- <tr>
- <td>
- <img width="180" height="120" src="http://placehold.it/180x120" class="thumbnail sm"/>
- </td>
- </tr>
- </table>
- <table class="large-4 columns">
- <tr>
- <td>
- <p >Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</p>
- <p><a href="#">Text CTA →</a></p>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- <td class="wrapper">
-
- <table class="large-4 columns">
- <tr>
- <td>
- <img width="180" height="120" src="http://placehold.it/180x120" class="thumbnail sm"/>
- </td>
- </tr>
- </table>
- <table class="large-4 columns">
- <tr>
- <td>
- <p >Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</p>
- <p><a href="#">Text CTA →</a></p>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- <td class="wrapper last">
-
- <table class="large-4 columns">
- <tr>
- <td>
- <img width="180" height="120" src="http://placehold.it/180x120" class="thumbnail sm"/>
- </td>
- </tr>
- </table>
- <table class="large-4 columns">
- <tr>
- <td>
- <p >Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</p>
- <p><a href="#">Text CTA →</a></p>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
-
- </tr>
- </table>
-
- <hr>
-
- <!-- Sharing -->
-
- <table class="row copyright">
- <tr>
- <td class="wrapper last">
-
- <table class="large-12 columns">
- <tr>
- <td>
- <h5 class="center">Sharing is caring</h5>
- <p class="center">Share ZURBnews and keep the good vibes going.</p>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- </tr>
- </table>
-
- <table class="row share-news">
- <tr>
- <td class="wrapper offset-by-1">
-
- <table class="large-5 columns">
- <tr>
- <td class="white panel">
-
- <table class="button facebook">
- <tr>
- <td>
- <a href="#">Share on Facebook</a>
- </td>
- </tr>
- </table>
-
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- <td class="wrapper last">
-
- <table class="large-5 columns">
- <tr>
- <td class="white panel">
-
- <table class="button twitter">
- <tr>
- <td>
- <a href="#">Tweet on Twitter</a>
- </td>
- </tr>
- </table>
-
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- </tr>
- </table>
-
- <hr>
-
- <!-- Copyright -->
-
- <table class="row copyright">
- <tr>
- <td class="wrapper last">
-
- <table class="large-12 columns">
- <tr>
- <td>
- <h5 class="center">Brought to you by <a href="http://zurb.com">ZURB</a></h5>
- <p class="center">Talk to us on the phone <strong>(408) 341-0600</strong> or by email to <a href="mailto:getstarted@zurb.com">getstarted@zurb.com</a></p>
-
- <p class="center">ZURB, Inc. 100 W. Rincon Ave | Campbell, CA 95008</p>
- <p class="center">© 1998 – 2015 ZURB</p>
- <br>
- <p class="center">Want to Unsubscribe? We’re sorry to see you go, but happy to make it easy on you. Unsubscribe</p>
- </td>
- <td class="expander"></td>
- </tr>
- </table>
-
- </td>
- </tr>
- </table>
-
- <!-- container end below -->
- </td>
- </tr>
- </table>
-
- </center>
- </td>
- </tr>
- </table>
- </body>
- </html>
\ No newline at end of file
var Inky = function Inky () {
this.customTags = [
- "panel",
+ "callout",
"row",
"container",
"columns",
getTags: function() {
return this.customTags;
},
-
+ // Description:
+ // Takes in HTML loaded via Cheerio as an argument, checks if there are any custom components.
+ // If there are, it replaces the nested components, traverses the DOM and replaces them with
+ // email markup.
+ //
+ // Arguments:
+ // $: Cheerio loaded string
+ // Returns:
+ // $: Cheerio modified string
releaseTheKraken: function($) {
var center = $('center').html(),
self = this;
$(nestedComponents).each(function(idx, el) {
var containerScaffold = self.scaffoldElements($, $(el));
});
+ // see the mark up for dev purposes
+ console.log($.html());
}
else {
console.log("all done");
// and replaces the custom tags with the correct table email markup.
//
// Arguments:
- // str (String): A string containing the markup of a singular element
+ // $, str (String): Cheerio, and a string containing the markup of a singular element
// Returns:
// str (String): A string containing the markup of inputted element with contained elements
scaffoldElements: function($, str) {
inner = $(str).html(),
self = this;
+
// replace tags with proper table syntax
// elMarkup retains the inner html within the markup
if (element !== undefined) {
// find if there are more nested elements in the inner syntax
var moreNested = self.findNestedComponents($, inner);
+
$(moreNested).each(function(idx, el) {
// call a recursion to replace all nested elements
self.scaffoldElements($, $(el));
// Executes a function to find and return nested custom elements within another element
//
// Arguments:
- // str (String): A string containing the markup of an element to be checked for nested components
+ // $, str (String): Cheerio, and a string containing the markup of an element to be checked for nested components
// Returns:
// nestedComponents (Array): An array containing the names (i.e. tags) of the nested components
findNestedComponents: function($, str) {
// Goes through array of custom nested components to determine whether or not there are any on the DOM
//
// Arguments:
- // null
+ // $ : Cheerio
// Returns:
// boolean: True if there are nested components on the DOM, false otherwise.
checkNestedComponents: function($) {
// Returns output for desired custom element
//
// Arguments:
- // element (obj), type (str): element as a cheerio object and type as the tag name
+ // $, element (obj), type (str): cheerio, element as a cheerio object, and type as the tag name
// Returns:
// HTML (string): Mark up for corresponding element with inner html contents untouched
componentFactory: function($, element, type) {
};
switch (type) {
- case 'panel':
- output = '<td class="panel ' + compClass +'">' + inner + '</td>';
+ case 'callout':
+ output = '<td class="callout ' + compClass +'">' + inner + '</td>';
break;
case 'button':
break;
case 'columns':
- self.makeCols($, component, component.nextAll('columns'));
+ output = self.makeCols($, component);
break;
case 'row':
// Returns output for column elements. TODO: this could be refactored to handle both cols and subcols
//
// Arguments:
- // col (obj), siblings (str): the initial target column and its siblings within the same row
+ // $ (obj), col (obj): cheerio, the target column
// Returns:
// HTML (string): Mark up for columns all contained in a row
- makeCols: function($, col, siblings) {
- var output = '',
- columns = [col, siblings],
- colCount = col.length + siblings.length;
-
- $(columns).each(function(i, el) {
- var wrapperHTML = '';
- var colSize = '';
- var col = $(el)
- var inner = $(el).html();
-
- var colClass = '';
- if ($(col).attr('class')) {
- colClass = $(col).attr('class');
- }
+ makeCols: function($, col) {
+ var output = '',
+ wrapperHTML = '',
+ colSize = '',
+ colClass = '',
+ inner = $(col).html();
- wrapperHTML = '<td class="wrapper ' + colClass + '">';
- if (i === colCount - 1) {
- wrapperHTML = '<td class="wrapper ' + colClass + 'last">';
- }
- // check for sizes
- if ($(col).attr('small')) {
- colSize += 'small' + '-' + $(col).attr('small') + ' ';
- }
- if ($(col).attr('large')) {
- colSize += 'large' + '-' + $(col).attr('large') + ' ';
- }
+ if ($(col).attr('class')) {
+ colClass = $(col).attr('class');
+ }
- wrapperHTML += '<table class="' + colSize + 'columns"><tr>';
+ // if it is the last column, add the class last
+ if (!$(col).next()[0]) {
+ output = '<td class="wrapper ' + colClass + 'last">';
- // subcolumns do not need an extra td
- if ($(col).children()[0] && $(col).children()[0].name !== 'subcolumns') {
- wrapperHTML += '<td>' + inner + '</td>';
- }
- else {
- wrapperHTML += inner;
- }
+ } else {
+ output = '<td class="wrapper ' + colClass + '">';
+ }
- wrapperHTML += '<td class="expander"></td></tr></table>';
+ // check for sizes
+ if ($(col).attr('small')) {
+ colSize += 'small' + '-' + $(col).attr('small') + ' ';
+ }
+ if ($(col).attr('large')) {
+ colSize += 'large' + '-' + $(col).attr('large') + ' ';
+ }
- $(col).replaceWith(wrapperHTML);
- });
+ output += '<table class="' + colSize + 'columns"><tr>';
+
+ // subcolumns do not need an extra td
+ // otherwise, place stuff inside columns in a td
+ if ($(col).children()[0] && $(col).children()[0].name !== 'subcolumns') {
+ output += '<td>' + inner + '</td>';
+ }
+ else {
+ output += inner;
+ }
+
+ output += '<td class="expander"></td></tr></table>';
+
+ return output;
}
};
describe("inky", function () {
it("should be targetting custom tags", function () {
- expect(inky.getTags()).toEqual([ 'panel', 'row', 'container', 'columns', 'button', 'subcolumns' ]);
+ expect(inky.getTags()).toEqual([ 'callout', 'row', 'container', 'columns', 'button', 'subcolumns' ]);
});
});
projects / thirdparty / foundation / foundation-emails.git / commitdiff
