Created
October 28, 2016 10:42
-
-
Save TheGP/840fceec4d1beba526c9dd753d503e83 to your computer and use it in GitHub Desktop.
css inliner's mistake
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head><meta name="charset" content="utf-8"> | |
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600,700&subset=cyrillic" rel="stylesheet" /><meta name="viewport" content="width=device-width, initial-scale=1"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta charset="UTF-8"> | |
<style type="text/css">* { | |
font-size: 16px; | |
line-height: 150%; | |
} | |
body, a, p, h1, h2, h3, h4, span, div { | |
font-family: 'Open Sans', 'OpenSans', 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
} | |
body { | |
padding: 0; | |
margin: 0; | |
} | |
.main_div { | |
width: 100%; max-width: 500px; padding: 0 18px; | |
} | |
p, div { | |
box-sizing: border-box; | |
} | |
p { | |
padding-bottom: 1em; /* fuck you yahoo */ | |
} | |
a { | |
color: #5acc6a; | |
} | |
a.button { | |
font-weight: bold; | |
color: #ffffff; | |
text-decoration: none; | |
text-transform: uppercase; | |
background-color: #5acc6a; | |
border-top: 8px solid #5acc6a; | |
border-bottom: 8px solid #5acc6a; | |
border-left: 14px solid #5acc6a; | |
border-right: 14px solid #5acc6a; | |
border-radius: 5px; | |
-webkit-border-radius: 5px; | |
-moz-border-radius: 5px; | |
display: inline-block; | |
} | |
div.unsubscribe { | |
margin-top: 50px; | |
font-size: 12px; | |
color: grey; | |
} | |
div.unsubscribe a { | |
font-size: 12px; | |
color: grey; | |
} | |
.header a, .social a { | |
text-decoration: none; | |
} | |
.social img { | |
margin-top: 11px; | |
} | |
.forgot_me { | |
font-size: 12px; | |
border-radius: 5px; | |
color: #929292; | |
background: #f2fff2; | |
border-top: 5px solid #f2fff2; | |
border-bottom: 5px solid #f2fff2; | |
border-left: 9px solid #f2fff2; | |
border-right: 9px solid #f2fff2; | |
padding-bottom: 0; | |
} | |
.forgot_me a { | |
font-size: 12px; | |
color: #929292; | |
} | |
</style> | |
<!--[if gte mso 9]> | |
<style type="text/css"> | |
body, a, p, h1, h2, h3, h4, span, div { | |
font-family: Helvetica, Arial, sans-serif !important; | |
} | |
</style> | |
<![endif]--> | |
<title></title> | |
</head> | |
<body style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;padding:0;margin:0"><!--[if (gte mso 9)|(IE)]> | |
<table width="500" cellpadding="0" cellspacing="0" border="0"> | |
<tr> | |
<td> | |
<![endif]--> | |
<div class="main_div" style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;width:100%;max-width:500px;padding:0 18px;box-sizing:border-box"> | |
<p class="header" style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em"><a href="http://makedreamprofits.ru/?utm_source=email&utm_medium=link&utm_content=logo-link&utm_campaign=email" style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;color:#5acc6a;text-decoration:none" target="_blank"><img alt="MakeDreamProfits" src="http://makedreamprofits.ru/wp-includes/images/emails/mdp-logo.png" style="font-size:16px;line-height:150%" width="200" /></a></p> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em">Привет,</p> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em">Я очень благодарен вам, что вы решили присоединиться к нашей пробной версии JumpOut.</p> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em">Если вы не возражаете, я хочу задать вам один маленький вопрос: почему вы решили попробовать JumpOut?</p> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em">Я спрашиваю, потому что хочу убедиться, что делаю продукт, который хотят пользователи. Просто нажмите "ответить" и дайте мне знать, буду вам очень благодарен :)</p> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em"> </p> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em">У JumpOut есть куча интересных функций, и в этой серии писем я хочу вас с ними ознакомить, чтобы вы смогли использовать продукт по максимуму.</p> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em">Ссылка входа: <a href="http://jumpout.makedreamprofits.ru" style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;color:#5acc6a">jumpout.makedreamprofits.ru</a></p> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em">Сегодня у меня <strong style="font-size:16px;line-height:150%">2 совета</strong>:</p> | |
<h2 style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif">1. Спасательный круг</h2> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em"><img alt="" src="http://makedreamprofits.ru/wp-includes/images/emails/jo/jo-lifebuoy.png" style="width:250px;height:53px;font-size:16px;line-height:150%" /></p> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em">Сверху сайта, вы можете увидеть спасательный круг. Это раздел помощи. Там вы можете найти не только как использовать тот или иной функционал, но и написать нам.</p> | |
<h2 style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif">2. Ваши подписчики</h2> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em">У вас уже есть подписчики и вы хотите добавить себе на сайт попап сбора подписчиков?</p> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em">У нас есть легкий путь <strong style="font-size:16px;line-height:150%">отключить попап для тех</strong>, кто уже подписан. Какой смысл показывать попап тем, кто и так уже подписан, верно?</p> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em">После того, как вы создадите попап, в списке вы увидите иконку в форме цепи:</p> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em"><img alt="" src="http://makedreamprofits.ru/wp-includes/images/emails/jo/jo-chain-icon.png" style="width:450px;height:67px;font-size:16px;line-height:150%" /></p> | |
<p style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em">Нажмите на нее, и получите несколько вариантов ссылок отключения попапа. Потом вставьте ссылку в письмо и готово! :)</p> | |
<div style="color:#e6e6e6;font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box">____________</div> | |
<p class="ending" style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;padding-bottom:1em">Eugene Bos<br style="font-size:16px;line-height:150%" /> | |
<a href="http://makedreamprofits.ru" style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;color:#5acc6a">MakeDreamProfits</a><br style="font-size:16px;line-height:150%" /> | |
<span class="social" style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif"><a href="http://vk.com/makedreamprofits" style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;color:#5acc6a;text-decoration:none" target="_blank"><img alt="Vkontakte" src="http://makedreamprofits.ru/wp-includes/images/emails/vk.png" style="font-size:16px;line-height:150%;margin-top:11px" width="32" /></a> <a href="https://twitter.com/MakeDreamProfit" style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;color:#5acc6a;text-decoration:none" target="_blank"> <img alt="Twitter" src="http://makedreamprofits.ru/wp-includes/images/emails/tw.png" style="font-size:16px;line-height:150%;margin-top:11px" width="32" /></a> <a href="http://www.facebook.com/MakeDreamProfits" style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;color:#5acc6a;text-decoration:none" target="_blank"> <img alt="Facebook" src="http://makedreamprofits.ru/wp-includes/images/emails/fb.png" style="font-size:16px;line-height:150%;margin-top:11px" width="32" /></a> <a href="http://www.youtube.com/user/MakeDreamProfits" style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;color:#5acc6a;text-decoration:none" target="_blank"> <img alt="YouTube" src="http://makedreamprofits.ru/wp-includes/images/emails/yt.png" style="font-size:16px;line-height:150%;margin-top:11px" width="32" /></a> </span></p> | |
<div class="unsubscribe" style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;margin-top:50px;color:grey">Если вы хотите отписаться от рассылки, <a href="[UNSUBSCRIBE_URL]" style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;color:#5acc6a">нажмите сюда</a>.</div> | |
<div class="unsubscribe" style="font-size:16px;line-height:150%;font-family:'Open Sans','OpenSans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;box-sizing:border-box;margin-top:50px;color:grey">[COMPANY_FULL_ADDRESS]</div> | |
<!--[if (gte mso 9)|(IE)]> | |
</td> | |
</tr> | |
</table> | |
<![endif]--></div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment