Skip to content

Instantly share code, notes, and snippets.

@henare
Created November 27, 2014 05:12
Show Gist options
  • Save henare/19d1345d08cbb814074c to your computer and use it in GitHub Desktop.
Save henare/19d1345d08cbb814074c to your computer and use it in GitHub Desktop.
Date: Thu, 27 Nov 2014 16:03:12 +1100
From: They Vote For You <[email protected]>
To: [email protected]
Message-ID: <[email protected]>
Subject: =?UTF-8?Q?Policy_=E2=80=9Cfor_dusty_ponies_that_are_covered_in?=
=?UTF-8?Q?_pony_dust=E2=80=9D_updated_on_They_Vote_For_You?=
Mime-Version: 1.0
Content-Type: multipart/alternative;
boundary="--==_mimepart_5476b0907d055_5e57743e986328";
charset=UTF-8
Content-Transfer-Encoding: 7bit
----==_mimepart_5476b0907d055_5e57743e986328
Content-Type: text/plain;
charset=UTF-8
Content-Transfer-Encoding: quoted-printable
For dusty ponies that are covered in pony dust
http://localhost:3000/policies/1
* Changed description from =E2=80=9CPony dust is magical and dusty ponies=
are dusty=E2=80=9D to =E2=80=9CPony dust is magical and dusty ponies are=
dusty and also UTF-8 is the shit=E2=80=9D.
By Matthew Landauer at 04:03PM - 27 Nov 2014
http://localhost:3000/users/1
------------------------------------------------------
Visit the policy page to unsubscribe from this policy:
http://localhost:3000/policies/1
View all your subscriptions:
http://localhost:3000/users/1/subscriptions
----==_mimepart_5476b0907d055_5e57743e986328
Content-Type: text/html;
charset=UTF-8
Content-Transfer-Encoding: quoted-printable
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww=
w.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns=3D"http://www.w3.org/1999/xhtml">
<head>
<meta content=3D"width=3Ddevice-width" name=3D"viewport" />
<meta content=3D"text/html; charset=3DUTF-8" http-equiv=3D"Content-Ty=
pe" />
<title></title>
<style>
/* -------------------------------------
GLOBAL
A very basic CSS reset
------------------------------------- */
=
* {
margin: 0;
padding: 0;
font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, san=
s-serif;
box-sizing: border-box;
font-size: 16px;
}
=
img {
max-width: 100%;
}
=
body {
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust: none;
width: 100% !important;
height: 100%;
line-height: 1.6;
}
=
/* Let's make sure all tables have defaults */
table td {
vertical-align: top;
}
=
/* -------------------------------------
BODY & CONTAINER
------------------------------------- */
body {
background-color: #f6f6f6;
}
=
.body-wrap {
background-color: #f6f6f6;
width: 100%;
}
=
.container {
display: block !important;
max-width: 600px !important;
margin: 0 auto !important;
/* makes it centered */
clear: both !important;
}
=
.content {
max-width: 600px;
margin: 0 auto;
display: block;
padding: 20px;
}
=
/* -------------------------------------
HEADER, FOOTER, MAIN
------------------------------------- */
.main {
background: #fff;
border: 1px solid #e9e9e9;
border-radius: 3px;
}
=
.content-wrap {
padding: 20px;
}
=
.content-block {
padding: 0 0 20px;
}
=
.header {
width: 100%;
margin-bottom: 20px;
}
=
.footer {
width: 100%;
clear: both;
color: #999;
padding: 20px;
}
.footer a {
color: #999;
}
.footer p, .footer a, .footer unsubscribe, .footer td {
font-size: 12px;
}
=
/* -------------------------------------
TYPOGRAPHY
------------------------------------- */
h1, h2, h3 {
font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande",=
sans-serif;
color: #000;
margin: 40px 0 0;
line-height: 1.2;
font-weight: 400;
}
=
h1 {
font-size: 32px;
font-weight: 500;
}
=
h2 {
font-size: 24px;
}
=
h3 {
font-size: 18px;
}
=
h4 {
font-size: 16px;
font-weight: 600;
}
=
.unstyled-heading {
font-size: 16px;
margin: 0 0 10px;
font-weight: normal;
}
=
.heading-object-link {
text-decoration: none;
}
=
p, ul, ol {
margin-bottom: 10px;
font-weight: normal;
}
p li, ul li, ol li {
margin-left: 5px;
list-style-position: inside;
}
=
.small {
font-size: 14px;
}
=
/* -------------------------------------
LINKS & BUTTONS
------------------------------------- */
a {
color: #348eda;
text-decoration: underline;
}
=
.btn-primary {
text-decoration: none;
color: #FFF;
background-color: #348eda;
border: solid #348eda;
border-width: 10px 20px;
line-height: 2;
font-weight: bold;
text-align: center;
cursor: pointer;
display: inline-block;
border-radius: 5px;
text-transform: capitalize;
}
=
/* -------------------------------------
OTHER STYLES THAT MIGHT BE USEFUL
------------------------------------- */
.last {
margin-bottom: 0;
}
=
.first {
margin-top: 0;
}
=
.aligncenter {
text-align: center;
}
=
.alignright {
text-align: right;
}
=
.alignleft {
text-align: left;
}
=
.clear {
clear: both;
}
=
.text-muted {
color: #666666;
}
=
/* -------------------------------------
ALERTS
Change the class depending on warning email, good email or bad =
email
------------------------------------- */
.alert {
font-size: 16px;
color: #fff;
font-weight: 500;
padding: 20px;
text-align: center;
border-radius: 3px 3px 0 0;
}
.alert a {
color: #fff;
text-decoration: none;
font-weight: 500;
font-size: 16px;
}
.alert.alert-warning {
background: #ff9f00;
}
.alert.alert-bad {
background: #d0021b;
}
.alert.alert-good {
background: #68b90f;
}
=
/* -------------------------------------
INVOICE
Styles for the billing table
------------------------------------- */
.invoice {
margin: 40px auto;
text-align: left;
width: 80%;
}
.invoice td {
padding: 5px 0;
}
.invoice .invoice-items {
width: 100%;
}
.invoice .invoice-items td {
border-top: #eee 1px solid;
}
.invoice .invoice-items .total td {
border-top: 2px solid #333;
border-bottom: 2px solid #333;
font-weight: 700;
}
=
/* -------------------------------------
RESPONSIVE AND MOBILE FRIENDLY STYLES
------------------------------------- */
@media only screen and (max-width: 640px) {
h1, h2, h3, h4 {
font-weight: 600 !important;
margin: 20px 0 5px !important;
}
=
h1 {
font-size: 22px !important;
}
=
h2 {
font-size: 18px !important;
}
=
h3 {
font-size: 16px !important;
}
=
.container {
width: 100% !important;
}
=
.content, .content-wrap {
padding: 10px !important;
}
=
.invoice {
width: 100% !important;
}
}
</style>
</head>
<body>
<table class=3D"body-wrap">
<tr>
<td></td>
<td class=3D"container" width=3D"600">
<div class=3D"content">
<table cellpadding=3D"0" cellspacing=3D"0" class=3D"main" wid=
th=3D"100%">
<tr>
<td class=3D"content-wrap">
<table cellpadding=3D"0" cellspacing=3D"0" width=3D"100=
%">
<h1 class=3D"unstyled-heading">
<strong>
<a class=3D"heading-object-link" href=3D"http://l=
ocalhost:3000/policies/1">For dusty ponies that are covered in pony dust<=
/a>
</strong>
</h1>
<p class=3D"change-action">Description changed from =E2=
=80=9CPony dust is magical and dusty ponies are dusty=E2=80=9D to =E2=80=9C=
Pony dust is magical and dusty ponies are dusty and also UTF-8 is the shi=
t=E2=80=9D.</p>
<p class=3D"small object-primary">
<a href=3D"http://localhost:3000/users/1">Matthew L=
andauer</a>
<span class=3D"text-muted small">
4:03PM - 27 Nov 2014
</span>
</p>
<br />
<div class=3D"text-muted">
<p class=3D"small">
Visit the
<a class=3D"small" href=3D"http://localhost:3000/=
policies/1">policy page</a>
to unsubscribe from this policy.
</p>
<p class=3D"small">
<a class=3D"small" href=3D"http://localhost:3000/=
users/1/subscriptions">View all your subscriptions.</a>
</p>
</div>
</table>
</td>
</tr>
</table>
<div class=3D"footer">
<table width=3D"100%">
<tr>
<td class=3D"aligncenter content-block">
Follow
<a href=3D"http://twitter.com/TheyVote4You">@TheyVote=
4You</a>
on Twitter.
</td>
</tr>
</table>
</div>
</div>
</td>
<td></td>
</tr>
</table>
</body>
</html>
----==_mimepart_5476b0907d055_5e57743e986328--
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment