Skip to content

Commit

Permalink
Initial release of classic and responsive email templates
Browse files Browse the repository at this point in the history
  • Loading branch information
@kzalewski
kzalewski committed Mar 15, 2017
1 parent c1aa7cd commit e9fffe2
Show file tree
Hide file tree
Showing 4 changed files with 290 additions and 0 deletions.
28 changes: 28 additions & 0 deletions templates/classic_email_footer.tpl
View file
@@ -0,0 +1,28 @@
</div>
</td>
</tr>
<tr>
<td align="center" valign="top">
<table style="color:#707070; font-size:12px; line-height:125%;" border="0" cellpadding="20px" cellspacing="0" width="100%">
<tr>
{{foreach from=$senator.offices item=offinfo name=offices}}
<td valign="top" width="{{math equation="100/x" x=$smarty.foreach.offices.total format="%d"}}%"><strong>{{$offinfo->name}}:</strong>
<br/>{{$offinfo->street}}
<br/>{{$offinfo->city}}, {{$offinfo->province}} {{$offinfo->postal_code}}
<br/>{{$offinfo->phone}}
</td>
{{/foreach}}
</tr>
</table>
</td>
</tr>
<tr style="background-color:#D8E2EA;">
<td><a href="http://www.nysenate.gov/" target="_blank"><img src="http://{{$bbcfg.servername}}/data/{{$bbcfg.shortname}}/pubfiles/images/template/footer.png" alt="New York State Senate seal"/></a></td>
</tr>
</table>
</td>
</tr>
</table>
</center>
</body>
</html>
19 changes: 19 additions & 0 deletions templates/classic_email_header.tpl
View file
@@ -0,0 +1,19 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>{mailing.name}</title>
</head>
<body style="font-family:{{$bbcfg.email_font_family}}; font-size:{{$bbcfg.email_font_size}}px; color:{{$bbcfg.email_font_color}}; background-color:{{$bbcfg.email_background_color}};" leftmargin="0" topmargin="0" marginheight="0" marginwidth="0" offset="0">
<center>
<table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%">
<tr>
<td align="center" valign="top">
<table style="border:1px solid #DDDDDD;" cellpadding="0" cellspacing="0" width="600px">
<tr>
<td><a href="{{$senator.url}}" target="_blank"><img src="http://{{$bbcfg.servername}}/data/{{$bbcfg.shortname}}/pubfiles/images/template/header.png" alt="{{$senator.full_name}}"/></a></td>
</tr>
<tr>
<td valign="top">
<div style="padding:20px; text-align:left; line-height:150%;">

75 changes: 75 additions & 0 deletions templates/responsive_email_footer.tpl
View file
@@ -0,0 +1,75 @@
</td>
</tr>
</table>
</td>
</tr>
</table>

<!-- footer -->
<table style="min-width:320px;" width="100%" cellspacing="0" cellpadding="0" bgcolor="#efefef">
<tr>
<td class="two-column" style="padding:29px 0 0;text-align:center;font-size:0;">
<!--[if (gte mso 9)|(IE)]>
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
{{foreach from=$senator.offices item=offinfo name=offices}}
<td width="{{math equation="100/x" x=$smarty.foreach.offices.total format="%d"}}%" valign="top" style="padding:0;">
<![endif]-->
<div class="column" style="width:100%;max-width:285px;display:inline-block;vertical-align:top;">
<table width="100%" style="width:100%;max-width:285px;display:inline-block;vertical-align:top;" cellpadding="0" cellspacing="0">
<tr>
<td style="padding:0 10px 20px;">
<table width="100%" style="min-width:265px;" cellpadding="0" cellspacing="0" bgcolor="#ffffff">
<tr>
<td style="padding:24px 15px 33px;" bgcolor="#ffffff">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td align="center" style="font:bold 14px/16px Helvetica, Arial, sans-serif; color:#000; letter-spacing:-0.2px; padding:0 0 20px;">
<a href="https://www.google.com/maps/@{{$offinfo->latitude}},{{$offinfo->longitude}},17z" target="_blank" style="color:#010101; text-decoration:underline;">{{$offinfo->name}}</a>
</td>
</tr>
<tr>
<td class="address" align="center" style="font:12px/14px Helvetica, Arial, sans-serif; color:#000;">
{{$offinfo->street}}<br/>
{{$offinfo->city}}, {{$offinfo->province}} {{$offinfo->postal_code}}<br/>
Phone: <a href="tel:{{$offinfo->phone}}" target="_blank" style="color:#010101; text-decoration:none;">{{$offinfo->phone}}</a><br/>
Fax: <a href="tel:{{$offinfo->fax}}" target="_blank" style="color:#010101; text-decoration:none;">{{$offinfo->fax}}</a><br/>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<!--[if (gte mso 9)|(IE)]>
</td>
{{/foreach}}
</tr>
</table>
<![endif]-->
</td>
</tr>
<tr>
<td>
<table cellpadding="0" cellspacing="0" align="center" style="margin:0 auto !important;">
<tr>
<td align="center" style="padding:0 0 19px;">
<a target="_blank" href="https://www.nysenate.gov/"><img src="%COMMON_IMAGES_BASE_URL%/nyss_seal_bw.png" border="0" style="vertical-align:top; width:115px; height:116px;" width="115" height="116" alt="New York State Senate" /></a>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
</div>
</center>
</body>
</html>
168 changes: 168 additions & 0 deletions templates/responsive_email_header.tpl
View file
@@ -0,0 +1,168 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>New York State Senate - Senator Correspondence</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style type="text/css">
a {
outline:none;
color:#850530;
text-decoration:underline;
}
a:hover {
text-decoration:none !important;
}
.post-footer a {
color:#386eff !important;
}
a[x-apple-data-detectors] {
color:inherit !important;
text-decoration:none !important;
}
a img {
border:none;
}
.address span {
color:inherit !important;
border:none !important;
}
table td {
mso-line-height-rule:exactly;
}
.ExternalClass, .ExternalClass a, .ExternalClass span, .ExternalClass b, .ExternalClass br, .ExternalClass p, .ExternalClass div {
line-height:inherit;
}
@media only screen and (max-width:500px) {
/* default style */
table[class="flexible"]{width:100% !important;}
td[class="img-flex"] img{width:100% !important; height:auto !important;}
/* custom style */
td[class="header"]{padding:10px 15px 20px !important;}
td[class="box"]{padding:20px !important;}
.two-column .column, .three-column .column {max-width:100% !important;}
}
</style>
</head>
<body style="margin:0; padding:0; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;" bgcolor="#efefef">
<div class="preview" style="display:none;font-size:1px;color:#333333;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;">%PREVIEW_TEXT%
</div>
<center style="width:100%; table-layout:fixed; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; min-width:320px; background:#efefef;">
<div style="max-width:570px; margin:0 auto;">
<!--[if (gte mso 9)|(IE)]>
<table width="550" align="center" cellspacing="0" cellpadding="0">
<tr>
<td style="padding:0;">
<![endif]-->
<table align="center" style="min-width:320px;margin:0 auto;" width="100%" cellspacing="0" cellpadding="0" bgcolor="#efefef">
<tr>
<td style="padding:0 10px;">
<table class="flexible" width="100%" align="center" style="margin:0 auto;max-width:550px;" cellpadding="0" cellspacing="0">
<!-- header -->
<tr>
<td class="header" bgcolor="#ffffff" style="padding:11px 25px 13px;">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td style="padding:0 0 10px;">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td style="vertical-align:middle;line-height:16px;font:10px/12px Helvetica, Arial, sans-serif; color:#000;">
<span style="line-height:16px; vertical-align:top;">
Share on: <a href="%SHAREON_FACEBOOK_URL%" target="_blank"><img width="16" height="16" src="%COMMON_IMAGES_BASE_URL%/social_media/facebook_circle_grey_32x32.png" alt="Facebook" /></a>
&nbsp;<a href="%SHAREON_TWITTER_URL%" target="_blank"><img width="16" height="16" src="%COMMON_IMAGES_BASE_URL%/social_media/twitter_circle_grey_32x32.png" alt="Twitter" /></a>
&nbsp;<a href="%SHAREON_REDDIT_URL%" target="_blank"><img width="16" height="16" src="%COMMON_IMAGES_BASE_URL%/social_media/reddit_circle_grey_32x32.png" alt="Reddit" /></a>
</span>
</td>
<td align="right" style="font:10px/12px Helvetica, Arial, sans-serif; color:#000;">
View this email in your <a href="%VIEWIN_BROWSER_URL%" target="_blank" style="color:#850530; text-decoration:underline;">browser</a>
</td>
</tr>
</table>
</td>
</tr>
<!--
<tr>
<td align="center">
<a href="http://www.nysenate.gov/" target="_blank"><img src="%COMMON_IMAGES_BASE_URL%/nyss_text_logo_bw.png" border="0" style="vertical-align:top; max-width:275px; width:100%; height:auto;" alt="The New York State Senate" /></a>
</td>
</tr>
-->
</table>
</td>
</tr>
<!-- promo -->
<tr>
<td class="two-column" style="padding:5px 0 19px;text-align:center;font-size:0;">
<!--[if (gte mso 9)|(IE)]>
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="50%" valign="top" style="padding:0;">
<![endif]-->
<div class="column" style="width:100%;max-width:275px;display:inline-block;vertical-align:top;">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td class="img-flex">
<a href="{{$senator.url}}"><img src="{{$senator.hero_img}}" style="vertical-align:top; width:100%; height:auto;" alt="{{$senator.full_name}}" /></a>
</td>
</tr>
</table>
</div>
<!--[if (gte mso 9)|(IE)]>
</td>
<td width="50%" height="206" valign="top" style="padding:0;" bgcolor="#850530">
<![endif]-->
<div class="column" style="width:100%;max-width:275px;display:inline-block;vertical-align:top;height:206px;background:#850530;">
<table width="100%" cellpadding="0" cellspacing="0" bgcolor="#850530">
<tr>
<td align="left" class="box" style="padding:17px 10px 17px 20px;">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td valign="top" height="150">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td align="left" style="font:14px/17px Arial, Helvetica, sans-serif; color:#fff; text-transform:uppercase; padding:0 0 10px;">NEW YORK STATE SENATOR</td>
</tr>
<tr>
<td align="left" style="font:27px/31px Times New Roman, Times, serif; color:#fff; padding:0 0 5px;">{{$senator.full_name|upper}}</td>
</tr>
<tr>
<td align="left" valign="top" height="41" style="font:13px/16px Arial, Helvetica, sans-serif; color:#fff;">{{$senator.role}}</td>
</tr>
<tr>
<td align="left" valign="top" style="font:14px/17px Arial, Helvetica, sans-serif; color:#fff; text-transform:uppercase; letter-spacing:0.1px;">({{', '|implode:$senator.party}}) {{$senator.senate_district_ordinal}} SENATE DISTRICT</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table cellpadding="0" cellspacing="0">
<tr>
{{foreach from=$senator.social_media item=smsite name=socialicons}}
{{if !$smarty.foreach.socialicons.first}}
<td width="20"></td>
{{/if}}
<td valign="bottom" style="line-height:17px; font-size:16px; mso-line-height-rule:at-least;">
<a href="{{$smsite->url}}" target="_blank"><img src="%COMMON_IMAGES_BASE_URL%/social_media/{{$smsite->name}}_48x48.png" style="vertical-align:top; width:11px; height:17px;" border="0" width="11" height="17" alt="{{$smsite->name}}" /></a>
</td>
{{/foreach}}
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
</td>
</tr>
<!-- copy -->
<tr>
<td style="background-color: white; padding: 20px;">

0 comments on commit e9fffe2

Please sign in to comment.