premailer-plus 0.1.3
Sign up to get free protection for your applications and to get access to all the features.
- data/.document +5 -0
- data/.gitignore +8 -0
- data/LICENSE +42 -0
- data/README.textile +43 -0
- data/Rakefile +62 -0
- data/VERSION.yml +4 -0
- data/bin/premailer_plus +107 -0
- data/lib/html_to_plain_text.rb +61 -0
- data/lib/premailer.rb +401 -0
- data/misc/client_support.yaml +185 -0
- data/premailer-plus.gemspec +88 -0
- data/test/fixtures/client_support.html +10 -0
- data/test/fixtures/test-import.css +4 -0
- data/test/fixtures/test-with-folding.html +77 -0
- data/test/fixtures/test.css +90 -0
- data/test/fixtures/test.html +66 -0
- data/test/fixtures/test2.css +81 -0
- data/test/fixtures/test2.html +75 -0
- data/test/fixtures/test3-import.css +4 -0
- data/test/fixtures/test3-noimport.css +1 -0
- data/test/fixtures/test3-out.html +82 -0
- data/test/fixtures/test3.css +83 -0
- data/test/fixtures/test3.html +85 -0
- data/test/images/content_bg.jpg +0 -0
- data/test/images/inset.jpg +0 -0
- data/test/speed.rb +34 -0
- data/test/test_convert_to_plain_text.rb +30 -0
- data/test/test_helper.rb +6 -0
- data/test/test_link_resolver.rb +32 -0
- data/test/test_premailer.rb +22 -0
- data/test/test_premailer_download.rb +77 -0
- metadata +130 -0
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
2
|
+
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-ca" lang="en-ca">
|
|
3
|
+
<head>
|
|
4
|
+
<title>Premailer Test Page</title>
|
|
5
|
+
<link rel="schema.dc" href="http://www.purl.org/dc/elements/1.1/" />
|
|
6
|
+
<meta name="dc.creator" content="Alex Dunae - dunae.ca" />
|
|
7
|
+
<meta name="description" content="Premailer (http://code.dunae.ca/premailer.web/) test page" />
|
|
8
|
+
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
|
|
9
|
+
<link rel="stylesheet" type="text/css" href="test.css" />
|
|
10
|
+
</head>
|
|
11
|
+
<body>
|
|
12
|
+
<div id="container">
|
|
13
|
+
<table id="frame" width="740" cellpadding="10" cellspacing="0"><tr><td>
|
|
14
|
+
<table id="head" cellspacing="0" cellpadding="0" width="720">
|
|
15
|
+
<tr>
|
|
16
|
+
<td>
|
|
17
|
+
<p>Having trouble reading this email? You can <a href="#">read it on our web site</a>.</p>
|
|
18
|
+
</td>
|
|
19
|
+
</tr>
|
|
20
|
+
</table>
|
|
21
|
+
|
|
22
|
+
<table id="content" cellspacing="0" width="720">
|
|
23
|
+
<tr valign="top">
|
|
24
|
+
<td>
|
|
25
|
+
<!-- MAIN CONTENT BEGINS -->
|
|
26
|
+
|
|
27
|
+
<h1>Premailer Test Page</h1>
|
|
28
|
+
|
|
29
|
+
<img src="images/inset.jpg" alt="Inset image" class="feature right" />
|
|
30
|
+
|
|
31
|
+
<p class="intro">Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
|
|
32
|
+
|
|
33
|
+
<p>Sed quis justo ut velit mattis adipiscing. Sed in mauris et libero dapibus varius. Quisque quis neque sed neque tincidunt scelerisque. Praesent vitae velit sit amet libero pharetra rhoncus. Phasellus laoreet. Sed nibh. Integer venenatis odio vitae neque. Quisque et mi ac libero blandit interdum. Suspendisse vitae massa. Suspendisse purus ligula, egestas in, ultrices non, fermentum at, lorem.</p>
|
|
34
|
+
|
|
35
|
+
<h2>Links</h2>
|
|
36
|
+
|
|
37
|
+
<ul class="spacious">
|
|
38
|
+
<li><a href="/">Relative path to root</a></li>
|
|
39
|
+
<li><a href="http://code.dunae.ca/">Absolute path to root</a></li>
|
|
40
|
+
<li><a href="http://example.com/">Different domain</a></li>
|
|
41
|
+
<li><a href="images/">Relative path to sub-directory</a></li>
|
|
42
|
+
</ul>
|
|
43
|
+
|
|
44
|
+
<p>Vestibulum <strong>tristique adipiscing</strong> nisi. Suspendisse bibendum pretium justo. Vestibulum nec ante. Nulla mollis molestie nibh. Curabitur facilisis neque a risus. Curabitur aliquam gravida nisl. Sed consectetuer. Nullam interdum faucibus quam. Suspendisse pulvinar orci nec metus. Vivamus nonummy. Nam dignissim arcu a metus. Mauris leo. Nulla facilisi. Ut varius. Duis ultricies tristique magna. Vestibulum in lorem vitae diam pharetra vehicula. Suspendisse condimentum. Curabitur dictum magna eget tellus.</p>
|
|
45
|
+
<!-- MAIN CONTENT ENDS -->
|
|
46
|
+
</td>
|
|
47
|
+
</tr>
|
|
48
|
+
</table>
|
|
49
|
+
|
|
50
|
+
<table id="legal" cellspacing="0" cellpadding="0" width="720">
|
|
51
|
+
<tr>
|
|
52
|
+
<td class="left" width="50%" height="120" valign="top">
|
|
53
|
+
<p>This e-mail was sent to <b>test@example.com</b><br />
|
|
54
|
+
<a href="#">Click here</a> to <i>instantly</i> unsubscribe.</p>
|
|
55
|
+
</td>
|
|
56
|
+
<td class="right" width="50%" height="120" valign="top">
|
|
57
|
+
<p>Sent by <a href="http://example.com/" title="Test Co. web site">Test Co.</a><br />
|
|
58
|
+
Vancouver Island, BC, Canada</p>
|
|
59
|
+
</td>
|
|
60
|
+
</tr>
|
|
61
|
+
</table>
|
|
62
|
+
|
|
63
|
+
</td></tr></table><!-- / #frame -->
|
|
64
|
+
</div><!-- / #container -->
|
|
65
|
+
</body>
|
|
66
|
+
</html>
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
/*
|
|
2
|
+
Premailer (http://code.dunae.ca/premailer.web/) test stylesheet
|
|
3
|
+
*/
|
|
4
|
+
|
|
5
|
+
@import "test-import.css" screen;
|
|
6
|
+
|
|
7
|
+
#container {
|
|
8
|
+
margin: 0;
|
|
9
|
+
width: 100%;
|
|
10
|
+
font-size: 12px;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
#frame {
|
|
14
|
+
margin: 0 auto;
|
|
15
|
+
width: 740px;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
td {
|
|
19
|
+
font-family: Georgia, Times, serif;
|
|
20
|
+
line-height: 18px;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
#head td {
|
|
24
|
+
text-align: center;
|
|
25
|
+
font-size: 11px;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
#head td, #head a,
|
|
30
|
+
#legal td, #legal a{
|
|
31
|
+
color: #fff;
|
|
32
|
+
background: #1c2815 none;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
#head a, #legal a { text-decoration: underline; }
|
|
36
|
+
|
|
37
|
+
#content h1 {
|
|
38
|
+
font-style: italic;
|
|
39
|
+
font-size: 24px;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
#content td {
|
|
43
|
+
padding: 18px 0;
|
|
44
|
+
color: #666;
|
|
45
|
+
background: #deddc9 url("images/content_bg.jpg") repeat-y center top;
|
|
46
|
+
border-color: #fff;
|
|
47
|
+
border-style: solid;
|
|
48
|
+
border-width: 10px;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
.feature {
|
|
52
|
+
border: 3px solid #fff;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
img.right {
|
|
56
|
+
margin: 0 36px 27px;
|
|
57
|
+
float: right;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
|
|
61
|
+
#content a {
|
|
62
|
+
color: #900;
|
|
63
|
+
background-color: transparent;
|
|
64
|
+
font-weight: bold;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
#content h1,
|
|
68
|
+
#content td h2,
|
|
69
|
+
#content td p {
|
|
70
|
+
padding: 0 36px 9px;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
ul.spacious li {
|
|
74
|
+
margin: 18px;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
.intro {
|
|
78
|
+
font-size: 18px;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
2
|
+
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-ca" lang="en-ca">
|
|
3
|
+
<head>
|
|
4
|
+
<title>Premailer Test Page</title>
|
|
5
|
+
<link rel="schema.dc" href="http://www.purl.org/dc/elements/1.1/" />
|
|
6
|
+
<meta name="dc.creator" content="Alex Dunae - dunae.ca" />
|
|
7
|
+
<meta name="description" content="Premailer (http://code.dunae.ca/premailer.web/) test page" />
|
|
8
|
+
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
|
|
9
|
+
<link rel="stylesheet" type="text/css" href="test2.css" />
|
|
10
|
+
<style type="text/css">
|
|
11
|
+
#legal td { padding-top: 27px; }
|
|
12
|
+
|
|
13
|
+
#legal p { margin: 0 36px; font-size: 11px; }
|
|
14
|
+
|
|
15
|
+
#legal a { text-decoration: underline; }
|
|
16
|
+
|
|
17
|
+
#legal .right { text-align: right; }
|
|
18
|
+
</style>
|
|
19
|
+
</head>
|
|
20
|
+
<body>
|
|
21
|
+
<div id="container">
|
|
22
|
+
<table id="frame" width="740" cellpadding="10" cellspacing="0"><tr><td>
|
|
23
|
+
<table id="head" cellspacing="0" cellpadding="0" width="720">
|
|
24
|
+
<tr>
|
|
25
|
+
<td>
|
|
26
|
+
<p>Having trouble reading this email? You can <a href="#" style="color: #f00;">read it on our web site</a>.</p>
|
|
27
|
+
</td>
|
|
28
|
+
</tr>
|
|
29
|
+
</table>
|
|
30
|
+
|
|
31
|
+
<table id="content" cellspacing="0" width="720">
|
|
32
|
+
<tr valign="top">
|
|
33
|
+
<td>
|
|
34
|
+
<!-- MAIN CONTENT BEGINS -->
|
|
35
|
+
|
|
36
|
+
<h1>Premailer Test Page</h1>
|
|
37
|
+
|
|
38
|
+
<img src="images/inset.jpg" alt="Inset image" class="feature right" />
|
|
39
|
+
|
|
40
|
+
<p class="intro">Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
|
|
41
|
+
|
|
42
|
+
<p>Sed quis justo ut velit mattis adipiscing. Sed in mauris et libero dapibus varius. Quisque quis neque sed neque tincidunt scelerisque. Praesent vitae velit sit amet libero pharetra rhoncus. Phasellus laoreet. Sed nibh. Integer venenatis odio vitae neque. Quisque et mi ac libero blandit interdum. Suspendisse vitae massa. Suspendisse purus ligula, egestas in, ultrices non, fermentum at, lorem.</p>
|
|
43
|
+
|
|
44
|
+
<h2>Links</h2>
|
|
45
|
+
|
|
46
|
+
<ul class="spacious">
|
|
47
|
+
<li><a href="/">Relative path to root</a></li>
|
|
48
|
+
<li><a href="http://code.dunae.ca/">Absolute path to root</a></li>
|
|
49
|
+
<li><a href="http://example.com/">Different domain</a></li>
|
|
50
|
+
<li><a href="images/">Relative path to sub-directory</a></li>
|
|
51
|
+
</ul>
|
|
52
|
+
|
|
53
|
+
<p>Vestibulum <strong>tristique adipiscing</strong> nisi. Suspendisse bibendum pretium justo. Vestibulum nec ante. Nulla mollis molestie nibh. Curabitur facilisis neque a risus. Curabitur aliquam gravida nisl. Sed consectetuer. Nullam interdum faucibus quam. Suspendisse pulvinar orci nec metus. Vivamus nonummy. Nam dignissim arcu a metus. Mauris leo. Nulla facilisi. Ut varius. Duis ultricies tristique magna. Vestibulum in lorem vitae diam pharetra vehicula. Suspendisse condimentum. Curabitur dictum magna eget tellus.</p>
|
|
54
|
+
<!-- MAIN CONTENT ENDS -->
|
|
55
|
+
</td>
|
|
56
|
+
</tr>
|
|
57
|
+
</table>
|
|
58
|
+
|
|
59
|
+
<table id="legal" cellspacing="0" cellpadding="0" width="720">
|
|
60
|
+
<tr>
|
|
61
|
+
<td class="left" width="50%" height="120" valign="top">
|
|
62
|
+
<p>This e-mail was sent to <b>test@example.com</b><br />
|
|
63
|
+
<a href="#">Click here</a> to <i>instantly</i> unsubscribe.</p>
|
|
64
|
+
</td>
|
|
65
|
+
<td class="right" width="50%" height="120" valign="top">
|
|
66
|
+
<p>Sent by <a href="http://example.com/" title="Test Co. web site">Test Co.</a><br />
|
|
67
|
+
Vancouver Island, BC, Canada</p>
|
|
68
|
+
</td>
|
|
69
|
+
</tr>
|
|
70
|
+
</table>
|
|
71
|
+
|
|
72
|
+
</td></tr></table><!-- / #frame -->
|
|
73
|
+
</div><!-- / #container -->
|
|
74
|
+
</body>
|
|
75
|
+
</html>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
h1 { color: #f00 !important; }
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
2
|
+
<html xml:lang="en-ca" lang="en-ca" xmlns="http://www.w3.org/1999/xhtml">
|
|
3
|
+
<head>
|
|
4
|
+
<title>Premailer Test Page</title>
|
|
5
|
+
<link href="http://www.purl.org/dc/elements/1.1/" rel="schema.dc" />
|
|
6
|
+
<meta name="dc.creator" content="Alex Dunae - dunae.ca" />
|
|
7
|
+
<meta name="description" content="Premailer (http://code.dunae.ca/premailer.web/) test page" />
|
|
8
|
+
<meta content="text/html; charset=utf-8" http-equiv="Content-type" />
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
<style type="text/css">
|
|
13
|
+
@import "test3-import.css" screen;
|
|
14
|
+
@import "test3-noimport.css" print;
|
|
15
|
+
#container { font-size: 12px !important; margin: 0 !important; font: 300 normal 13px "Georgia", Times, serif !important; width: 100% !important; }
|
|
16
|
+
@import "test3-noimport.css" print;
|
|
17
|
+
#legal td { padding-top: 27px !important; }
|
|
18
|
+
a:hover { color: #fff !important; }
|
|
19
|
+
</style>
|
|
20
|
+
</head>
|
|
21
|
+
<body>
|
|
22
|
+
<div id="container">
|
|
23
|
+
<table cellspacing="0" id="frame" cellpadding="10" style="margin: 0 auto; width: 740px;" width="740"><tr><td style="line-height: 18px; font-family: Georgia, Times, serif;">
|
|
24
|
+
<table cellspacing="0" id="head" cellpadding="0" width="720">
|
|
25
|
+
<tr>
|
|
26
|
+
<td style="font-size: 11px; background: #1c2815 none; line-height: 18px; font-family: Georgia, Times, serif; color: #fff; text-align: center;">
|
|
27
|
+
<p>Having trouble reading this email? You can <a href="#" style="background: #1c2815 none; text-decoration: underline; color: #f00;">read it on our web site</a>.</p>
|
|
28
|
+
</td>
|
|
29
|
+
</tr>
|
|
30
|
+
</table>
|
|
31
|
+
|
|
32
|
+
<table cellspacing="0" id="content" width="720">
|
|
33
|
+
<tr valign="top">
|
|
34
|
+
<td style="border-color: #fff; background: #deddc9 url('images/content_bg.jpg') repeat-y center top; line-height: 18px; border-style: solid; border-width: 10px; padding: 18px 0; font-family: Georgia, Times, serif; color: #666;">
|
|
35
|
+
<!-- MAIN CONTENT BEGINS -->
|
|
36
|
+
|
|
37
|
+
<h1 style="font-size: 24px; padding: 0 36px 9px; font-style: italic;">Premailer Test Page</h1>
|
|
38
|
+
|
|
39
|
+
<img class="feature right" src="images/inset.jpg" alt="Inset image" style="margin: 0 36px 27px; border: 3px solid #fff; float: right;" />
|
|
40
|
+
|
|
41
|
+
<p class="intro" style="font-size: 18px; padding: 0 36px 9px;">Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
|
|
42
|
+
|
|
43
|
+
<p style="padding: 0 36px 9px;">Sed quis justo ut velit mattis adipiscing. Sed in mauris et libero dapibus varius. Quisque quis neque sed neque tincidunt scelerisque. Praesent vitae velit sit amet libero pharetra rhoncus. Phasellus laoreet. Sed nibh. Integer venenatis odio vitae neque. Quisque et mi ac libero blandit interdum. Suspendisse vitae massa. Suspendisse purus ligula, egestas in, ultrices non, fermentum at, lorem.</p>
|
|
44
|
+
|
|
45
|
+
<h2 style="padding: 0 36px 9px;">Links</h2>
|
|
46
|
+
|
|
47
|
+
<ul class="spacious">
|
|
48
|
+
<li style="margin: 18px;"><a href="/" style="font-weight: bold; background-color: transparent; color: #900;">Relative path to root</a></li>
|
|
49
|
+
<li style="margin: 18px;"><a href="http://code.dunae.ca/" style="font-weight: bold; background-color: transparent; color: #900;">Absolute path to root</a></li>
|
|
50
|
+
<li style="margin: 18px;"><a href="http://example.com/" style="font-weight: bold; background-color: transparent; color: #900;">Different domain</a></li>
|
|
51
|
+
<li style="margin: 18px;"><a href="images/" style="font-weight: bold; background-color: transparent; color: #900;">Relative path to sub-directory</a></li>
|
|
52
|
+
<li style="margin: 18px;"><a href="#relative" style="font-weight: bold; background-color: transparent; color: #900;">Link is not converted</a></li>
|
|
53
|
+
<li style="margin: 18px;"><a href="http://example.com/test.html?cn=tf&c=20&ord=%%RANDOM%%" style="font-weight: bold; background-color: transparent; color: #900;">Funky ASP URL</a></li>
|
|
54
|
+
<li style="margin: 18px;"><a href="?query=string" style="font-weight: bold; background-color: transparent; color: #900;">Appends tracking query string</a></li>
|
|
55
|
+
<li style="margin: 18px;"><a href="{DONOTCONVERT}" style="font-weight: bold; background-color: transparent; color: #900;">Link is not converted</a></li>
|
|
56
|
+
<li style="margin: 18px;"><a href="[DONOTCONVERT]" style="font-weight: bold; background-color: transparent; color: #900;">Link is not converted</a></li>
|
|
57
|
+
<li style="margin: 18px;"><a href="<DONOTCONVERT>" style="font-weight: bold; background-color: transparent; color: #900;">Link is not converted</a></li>
|
|
58
|
+
</ul>
|
|
59
|
+
|
|
60
|
+
<p style="padding: 0 36px 9px;">Vestibulum <strong>tristique adipiscing</strong> nisi. Suspendisse bibendum pretium justo. Vestibulum nec ante. Nulla mollis molestie nibh. Curabitur facilisis neque a risus. Curabitur aliquam gravida nisl. Sed consectetuer. Nullam interdum faucibus quam. Suspendisse pulvinar orci nec metus. Vivamus nonummy. Nam dignissim arcu a metus. Mauris leo. Nulla facilisi. Ut varius. Duis ultricies tristique magna. Vestibulum in lorem vitae diam pharetra vehicula. Suspendisse condimentum. Curabitur dictum magna eget tellus.</p>
|
|
61
|
+
<!-- MAIN CONTENT ENDS -->
|
|
62
|
+
</td>
|
|
63
|
+
</tr>
|
|
64
|
+
</table>
|
|
65
|
+
|
|
66
|
+
<table cellspacing="0" id="legal" cellpadding="0" width="720">
|
|
67
|
+
<tr>
|
|
68
|
+
<td class="left" height="120" valign="top" style="background: #1c2815 none; line-height: 18px; font-family: Georgia, Times, serif; color: #fff;" width="50%">
|
|
69
|
+
<p style="font-size: 11px; margin: 0 36px;">This e-mail was sent to <b>test@example.com</b><br />
|
|
70
|
+
<a href="#" style="background: #1c2815 none; text-decoration: underline; color: #fff;">Click here</a> to <i>instantly</i> unsubscribe.</p>
|
|
71
|
+
</td>
|
|
72
|
+
<td class="right" height="120" valign="top" style="background: #1c2815 none; line-height: 18px; font-family: Georgia, Times, serif; color: #fff; text-align: right;" width="50%">
|
|
73
|
+
<p style="font-size: 11px; margin: 0 36px;">Sent by <a href="http://example.com/" title="Test Co. web site" style="background: #1c2815 none; text-decoration: underline; color: #fff;">Test Co.</a><br />
|
|
74
|
+
Vancouver Island, BC, Canada</p>
|
|
75
|
+
</td>
|
|
76
|
+
</tr>
|
|
77
|
+
</table>
|
|
78
|
+
|
|
79
|
+
</td></tr></table><!-- / #frame -->
|
|
80
|
+
</div><!-- / #container -->
|
|
81
|
+
</body>
|
|
82
|
+
</html>
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
/*
|
|
2
|
+
Premailer (http://code.dunae.ca/premailer.web/) test stylesheet
|
|
3
|
+
*/
|
|
4
|
+
|
|
5
|
+
@import "test3-import.css" screen;
|
|
6
|
+
@import "test3-noimport.css" print;
|
|
7
|
+
|
|
8
|
+
#container {
|
|
9
|
+
margin: 0;
|
|
10
|
+
width: 100%;
|
|
11
|
+
font: 300 normal 13px "Georgia", Times, serif;
|
|
12
|
+
font-size: 12px;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
#frame {
|
|
16
|
+
margin: 0 auto;
|
|
17
|
+
width: 740px;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
td {
|
|
21
|
+
font-family: Georgia, Times, serif;
|
|
22
|
+
line-height: 18px;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
#head td {
|
|
26
|
+
text-align: center;
|
|
27
|
+
font-size: 11px;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
|
|
31
|
+
#head td, #head a,
|
|
32
|
+
#legal td, #legal a{
|
|
33
|
+
color: #fff;
|
|
34
|
+
background: #1c2815 none;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
#head a, #legal a { text-decoration: underline; }
|
|
38
|
+
|
|
39
|
+
#content h1 {
|
|
40
|
+
font-style: italic;
|
|
41
|
+
font-size: 24px;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
#content td {
|
|
45
|
+
padding: 18px 0;
|
|
46
|
+
color: #666;
|
|
47
|
+
background: #deddc9 url("images/content_bg.jpg") repeat-y center top;
|
|
48
|
+
border-color: #fff;
|
|
49
|
+
border-style: solid;
|
|
50
|
+
border-width: 10px;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.feature {
|
|
54
|
+
border: 3px solid #fff;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
img.right {
|
|
58
|
+
margin: 0 36px 27px;
|
|
59
|
+
float: right;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
|
|
63
|
+
#content a {
|
|
64
|
+
color: #900;
|
|
65
|
+
background-color: transparent;
|
|
66
|
+
font-weight: bold;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
#content h1,
|
|
70
|
+
#content td h2,
|
|
71
|
+
#content td p {
|
|
72
|
+
padding: 0 36px 9px;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
ul.spacious li {
|
|
76
|
+
margin: 18px;
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
.intro {
|
|
80
|
+
font-size: 18px;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
2
|
+
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-ca" lang="en-ca">
|
|
3
|
+
<head>
|
|
4
|
+
<title>Premailer Test Page</title>
|
|
5
|
+
<link rel="schema.dc" href="http://www.purl.org/dc/elements/1.1/" />
|
|
6
|
+
<meta name="dc.creator" content="Alex Dunae - dunae.ca" />
|
|
7
|
+
<meta name="description" content="Premailer (http://code.dunae.ca/premailer.web/) test page" />
|
|
8
|
+
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
|
|
9
|
+
<link rel="stylesheet" type="text/css" href="test3.css" />
|
|
10
|
+
<style type="text/css">
|
|
11
|
+
@import "test3-noimport.css" print;
|
|
12
|
+
|
|
13
|
+
#legal td { padding-top: 27px; }
|
|
14
|
+
|
|
15
|
+
#legal p { margin: 0 36px; font-size: 11px; }
|
|
16
|
+
|
|
17
|
+
#legal a { text-decoration: underline; }
|
|
18
|
+
|
|
19
|
+
#legal .right { text-align: right; }
|
|
20
|
+
|
|
21
|
+
a:hover { color: #fff !important; }
|
|
22
|
+
</style>
|
|
23
|
+
</head>
|
|
24
|
+
<body>
|
|
25
|
+
<div id="container">
|
|
26
|
+
<table id="frame" width="740" cellpadding="10" cellspacing="0"><tr><td>
|
|
27
|
+
<table id="head" cellspacing="0" cellpadding="0" width="720">
|
|
28
|
+
<tr>
|
|
29
|
+
<td>
|
|
30
|
+
<p>Having trouble reading this email? You can <a href="#" style="color: #f00;">read it on our web site</a>.</p>
|
|
31
|
+
</td>
|
|
32
|
+
</tr>
|
|
33
|
+
</table>
|
|
34
|
+
|
|
35
|
+
<table id="content" cellspacing="0" width="720">
|
|
36
|
+
<tr valign="top">
|
|
37
|
+
<td>
|
|
38
|
+
<!-- MAIN CONTENT BEGINS -->
|
|
39
|
+
|
|
40
|
+
<h1>Premailer Test Page</h1>
|
|
41
|
+
|
|
42
|
+
<img src="images/inset.jpg" alt="Inset image" class="feature right" />
|
|
43
|
+
|
|
44
|
+
<p class="intro">Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
|
|
45
|
+
|
|
46
|
+
<p>Sed quis justo ut velit mattis adipiscing. Sed in mauris et libero dapibus varius. Quisque quis neque sed neque tincidunt scelerisque. Praesent vitae velit sit amet libero pharetra rhoncus. Phasellus laoreet. Sed nibh. Integer venenatis odio vitae neque. Quisque et mi ac libero blandit interdum. Suspendisse vitae massa. Suspendisse purus ligula, egestas in, ultrices non, fermentum at, lorem.</p>
|
|
47
|
+
|
|
48
|
+
<h2>Links</h2>
|
|
49
|
+
|
|
50
|
+
<ul class="spacious">
|
|
51
|
+
<li><a href="/">Relative path to root</a></li>
|
|
52
|
+
<li><a href="http://code.dunae.ca/">Absolute path to root</a></li>
|
|
53
|
+
<li><a href="http://example.com/">Different domain</a></li>
|
|
54
|
+
<li><a href="images/">Relative path to sub-directory</a></li>
|
|
55
|
+
<li><a href="#relative">Link is not converted</a></li>
|
|
56
|
+
<li><a href="http://example.com/test.html?cn=tf&c=20&ord=%%RANDOM%%">Funky ASP URL</a></li>
|
|
57
|
+
<li><a href="?query=string">Appends tracking query string</a></li>
|
|
58
|
+
<li><a href="{DONOTCONVERT}">Link is not converted</a></li>
|
|
59
|
+
<li><a href="[DONOTCONVERT]">Link is not converted</a></li>
|
|
60
|
+
<li><a href="<DONOTCONVERT>">Link is not converted</a></li>
|
|
61
|
+
</ul>
|
|
62
|
+
|
|
63
|
+
<p>Vestibulum <strong>tristique adipiscing</strong> nisi. Suspendisse bibendum pretium justo. Vestibulum nec ante. Nulla mollis molestie nibh. Curabitur facilisis neque a risus. Curabitur aliquam gravida nisl. Sed consectetuer. Nullam interdum faucibus quam. Suspendisse pulvinar orci nec metus. Vivamus nonummy. Nam dignissim arcu a metus. Mauris leo. Nulla facilisi. Ut varius. Duis ultricies tristique magna. Vestibulum in lorem vitae diam pharetra vehicula. Suspendisse condimentum. Curabitur dictum magna eget tellus.</p>
|
|
64
|
+
<!-- MAIN CONTENT ENDS -->
|
|
65
|
+
</td>
|
|
66
|
+
</tr>
|
|
67
|
+
</table>
|
|
68
|
+
|
|
69
|
+
<table id="legal" cellspacing="0" cellpadding="0" width="720">
|
|
70
|
+
<tr>
|
|
71
|
+
<td class="left" width="50%" height="120" valign="top">
|
|
72
|
+
<p>This e-mail was sent to <b>test@example.com</b><br />
|
|
73
|
+
<a href="#">Click here</a> to <i>instantly</i> unsubscribe.</p>
|
|
74
|
+
</td>
|
|
75
|
+
<td class="right" width="50%" height="120" valign="top">
|
|
76
|
+
<p>Sent by <a href="http://example.com/" title="Test Co. web site">Test Co.</a><br />
|
|
77
|
+
Vancouver Island, BC, Canada</p>
|
|
78
|
+
</td>
|
|
79
|
+
</tr>
|
|
80
|
+
</table>
|
|
81
|
+
|
|
82
|
+
</td></tr></table><!-- / #frame -->
|
|
83
|
+
</div><!-- / #container -->
|
|
84
|
+
</body>
|
|
85
|
+
</html>
|