emailTemplate.html 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  5. <!-- Facebook sharing information tags -->
  6. <meta property="og:title" content="*|MC:SUBJECT|*" />
  7. <style type="text/css">
  8. #outlook a{padding:0;} /* Force Outlook to provide a "view in browser" button. */
  9. body{width:100% !important;} .ReadMsgBody{width:100%;} .ExternalClass{width:100%;} /* Force Hotmail to display emails at full width */
  10. body{-webkit-text-size-adjust:none;} /* Prevent Webkit platforms from changing default text sizes. */
  11. body{margin:0; padding:0;}
  12. img{border:0; height:auto; line-height:100%; outline:none; text-decoration:none;}
  13. table td{border-collapse:collapse;}
  14. #backgroundTable{height:100% !important; margin:0; padding:0; width:100% !important;}
  15. body, #backgroundTable{
  16. /*@editable*/ background-color:#FAFAFA;
  17. }
  18. #templateContainer{
  19. /*@editable*/ border: 1px solid #DDDDDD;
  20. }
  21. h1, .h1{
  22. /*@editable*/ color:#202020;
  23. display:block;
  24. /*@editable*/ font-family:Arial;
  25. /*@editable*/ font-size:34px;
  26. /*@editable*/ font-weight:bold;
  27. /*@editable*/ line-height:100%;
  28. margin-top:0;
  29. margin-right:0;
  30. margin-bottom:10px;
  31. margin-left:0;
  32. /*@editable*/ text-align:left;
  33. }
  34. h2, .h2{
  35. /*@editable*/ color:#202020;
  36. display:block;
  37. /*@editable*/ font-family:Arial;
  38. /*@editable*/ font-size:30px;
  39. /*@editable*/ font-weight:bold;
  40. /*@editable*/ line-height:100%;
  41. margin-top:0;
  42. margin-right:0;
  43. margin-bottom:10px;
  44. margin-left:0;
  45. /*@editable*/ text-align:left;
  46. }
  47. h3, .h3{
  48. /*@editable*/ color:#202020;
  49. display:block;
  50. /*@editable*/ font-family:Arial;
  51. /*@editable*/ font-size:26px;
  52. /*@editable*/ font-weight:bold;
  53. /*@editable*/ line-height:100%;
  54. margin-top:0;
  55. margin-right:0;
  56. margin-bottom:10px;
  57. margin-left:0;
  58. /*@editable*/ text-align:left;
  59. }
  60. /**
  61. * @tab Page
  62. * @section heading 4
  63. * @tip Set the styling for all fourth-level headings in your emails. These should be the smallest of your headings.
  64. * @style heading 4
  65. */
  66. h4, .h4{
  67. /*@editable*/ color:#202020;
  68. display:block;
  69. /*@editable*/ font-family:Arial;
  70. /*@editable*/ font-size:22px;
  71. /*@editable*/ font-weight:bold;
  72. /*@editable*/ line-height:100%;
  73. margin-top:0;
  74. margin-right:0;
  75. margin-bottom:10px;
  76. margin-left:0;
  77. /*@editable*/ text-align:left;
  78. }
  79. /* /\/\/\/\/\/\/\/\/\/\ STANDARD STYLING: PREHEADER /\/\/\/\/\/\/\/\/\/\ */
  80. /**
  81. * @tab Header
  82. * @section preheader style
  83. * @tip Set the background color for your email's preheader area.
  84. * @theme page
  85. */
  86. #templatePreheader{
  87. /*@editable*/ background-color:#FAFAFA;
  88. }
  89. /**
  90. * @tab Header
  91. * @section preheader text
  92. * @tip Set the styling for your email's preheader text. Choose a size and color that is easy to read.
  93. */
  94. .preheaderContent div{
  95. /*@editable*/ color:#505050;
  96. /*@editable*/ font-family:Arial;
  97. /*@editable*/ font-size:10px;
  98. /*@editable*/ line-height:100%;
  99. /*@editable*/ text-align:left;
  100. }
  101. /**
  102. * @tab Header
  103. * @section preheader link
  104. * @tip Set the styling for your email's preheader links. Choose a color that helps them stand out from your text.
  105. */
  106. .preheaderContent div a:link, .preheaderContent div a:visited, /* Yahoo! Mail Override */ .preheaderContent div a .yshortcuts /* Yahoo! Mail Override */{
  107. /*@editable*/ color:#336699;
  108. /*@editable*/ font-weight:normal;
  109. /*@editable*/ text-decoration:underline;
  110. }
  111. /* /\/\/\/\/\/\/\/\/\/\ STANDARD STYLING: HEADER /\/\/\/\/\/\/\/\/\/\ */
  112. /**
  113. * @tab Header
  114. * @section header style
  115. * @tip Set the background color and border for your email's header area.
  116. * @theme header
  117. */
  118. #templateHeader{
  119. /*@editable*/ background-color:#FFFFFF;
  120. /*@editable*/ border-bottom:0;
  121. }
  122. /**
  123. * @tab Header
  124. * @section header text
  125. * @tip Set the styling for your email's header text. Choose a size and color that is easy to read.
  126. */
  127. .headerContent{
  128. /*@editable*/ color:#202020;
  129. /*@editable*/ font-family:Arial;
  130. /*@editable*/ font-size:34px;
  131. /*@editable*/ font-weight:bold;
  132. /*@editable*/ line-height:100%;
  133. /*@editable*/ padding:0;
  134. /*@editable*/ text-align:center;
  135. /*@editable*/ vertical-align:middle;
  136. }
  137. /**
  138. * @tab Header
  139. * @section header link
  140. * @tip Set the styling for your email's header links. Choose a color that helps them stand out from your text.
  141. */
  142. .headerContent a:link, .headerContent a:visited, /* Yahoo! Mail Override */ .headerContent a .yshortcuts /* Yahoo! Mail Override */{
  143. /*@editable*/ color:#336699;
  144. /*@editable*/ font-weight:normal;
  145. /*@editable*/ text-decoration:underline;
  146. }
  147. #headerImage{
  148. height:auto;
  149. max-width:600px !important;
  150. }
  151. /* /\/\/\/\/\/\/\/\/\/\ STANDARD STYLING: MAIN BODY /\/\/\/\/\/\/\/\/\/\ */
  152. /**
  153. * @tab Body
  154. * @section body style
  155. * @tip Set the background color for your email's body area.
  156. */
  157. #templateContainer, .bodyContent{
  158. /*@editable*/ background-color:#FFFFFF;
  159. }
  160. /**
  161. * @tab Body
  162. * @section body text
  163. * @tip Set the styling for your email's main content text. Choose a size and color that is easy to read.
  164. * @theme main
  165. */
  166. .bodyContent div{
  167. /*@editable*/ color:#505050;
  168. /*@editable*/ font-family:Arial;
  169. /*@editable*/ font-size:14px;
  170. /*@editable*/ line-height:150%;
  171. /*@editable*/ text-align:left;
  172. }
  173. /**
  174. * @tab Body
  175. * @section body link
  176. * @tip Set the styling for your email's main content links. Choose a color that helps them stand out from your text.
  177. */
  178. .bodyContent div a:link, .bodyContent div a:visited, /* Yahoo! Mail Override */ .bodyContent div a .yshortcuts /* Yahoo! Mail Override */{
  179. /*@editable*/ color:#336699;
  180. /*@editable*/ font-weight:normal;
  181. /*@editable*/ text-decoration:underline;
  182. }
  183. .bodyContent img{
  184. display:inline;
  185. height:auto;
  186. }
  187. /* /\/\/\/\/\/\/\/\/\/\ STANDARD STYLING: FOOTER /\/\/\/\/\/\/\/\/\/\ */
  188. /**
  189. * @tab Footer
  190. * @section footer style
  191. * @tip Set the background color and top border for your email's footer area.
  192. * @theme footer
  193. */
  194. #templateFooter{
  195. /*@editable*/ background-color:#FFFFFF;
  196. /*@editable*/ border-top:0;
  197. }
  198. /**
  199. * @tab Footer
  200. * @section footer text
  201. * @tip Set the styling for your email's footer text. Choose a size and color that is easy to read.
  202. * @theme footer
  203. */
  204. .footerContent div{
  205. /*@editable*/ color:#707070;
  206. /*@editable*/ font-family:Arial;
  207. /*@editable*/ font-size:12px;
  208. /*@editable*/ line-height:125%;
  209. /*@editable*/ text-align:left;
  210. }
  211. /**
  212. * @tab Footer
  213. * @section footer link
  214. * @tip Set the styling for your email's footer links. Choose a color that helps them stand out from your text.
  215. */
  216. .footerContent div a:link, .footerContent div a:visited, /* Yahoo! Mail Override */ .footerContent div a .yshortcuts /* Yahoo! Mail Override */{
  217. /*@editable*/ color:#336699;
  218. /*@editable*/ font-weight:normal;
  219. /*@editable*/ text-decoration:underline;
  220. }
  221. .footerContent img{
  222. display:inline;
  223. }
  224. /**
  225. * @tab Footer
  226. * @section social bar style
  227. * @tip Set the background color and border for your email's footer social bar.
  228. * @theme footer
  229. */
  230. #social{
  231. /*@editable*/ background-color:#FAFAFA;
  232. /*@editable*/ border:0;
  233. }
  234. /**
  235. * @tab Footer
  236. * @section social bar style
  237. * @tip Set the background color and border for your email's footer social bar.
  238. */
  239. #social div{
  240. /*@editable*/ text-align:center;
  241. }
  242. /**
  243. * @tab Footer
  244. * @section utility bar style
  245. * @tip Set the background color and border for your email's footer utility bar.
  246. * @theme footer
  247. */
  248. #utility{
  249. /*@editable*/ background-color:#FFFFFF;
  250. /*@editable*/ border:0;
  251. }
  252. /**
  253. * @tab Footer
  254. * @section utility bar style
  255. * @tip Set the background color and border for your email's footer utility bar.
  256. */
  257. #utility div{
  258. /*@editable*/ text-align:center;
  259. }
  260. #monkeyRewards img{
  261. max-width:190px;
  262. }
  263. </style>
  264. </head>
  265. <body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0">
  266. <center>
  267. <table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%" id="backgroundTable">
  268. <tr>
  269. <td align="center" valign="top">
  270. <!-- // Begin Template Preheader \\ -->
  271. <table border="0" cellpadding="10" cellspacing="0" width="600" id="templatePreheader">
  272. <tr>
  273. <td valign="top" class="preheaderContent">
  274. <!-- // Begin Module: Standard Preheader \ -->
  275. <table border="0" cellpadding="10" cellspacing="0" width="100%">
  276. <tr>
  277. <td valign="top">
  278. <div mc:edit="std_preheader_content">
  279. <%= previewMessage %>
  280. </div>
  281. </td>
  282. <!-- *|IFNOT:ARCHIVE_PAGE|* -->
  283. <td valign="top" width="190">
  284. <!-- <div mc:edit="std_preheader_links">
  285. Is this email not displaying correctly?<br /><a href="*|ARCHIVE|*" target="_blank">View it in your browser</a>.
  286. </div> -->
  287. </td>
  288. <!-- *|END:IF|* -->
  289. </tr>
  290. </table>
  291. <!-- // End Module: Standard Preheader \ -->
  292. </td>
  293. </tr>
  294. </table>
  295. <!-- // End Template Preheader \\ -->
  296. <table border="0" cellpadding="0" cellspacing="0" width="600" id="templateContainer">
  297. <tr>
  298. <td align="center" valign="top">
  299. <!-- // Begin Template Header \\ -->
  300. <table border="0" cellpadding="0" cellspacing="0" width="600" id="templateHeader">
  301. <tr>
  302. <td class="headerContent">
  303. <!-- // Begin Module: Standard Header Image \\ -->
  304. <img src="https://www.sharelatex.com/brand/logo/banner-plain.png" style="max-width:600px;" id="headerImage campaign-icon" mc:label="header_image" mc:edit="header_image" mc:allowdesigner mc:allowtext />
  305. <!-- // End Module: Standard Header Image \\ -->
  306. </td>
  307. </tr>
  308. </table>
  309. <!-- // End Template Header \\ -->
  310. </td>
  311. </tr>
  312. <tr>
  313. <td align="center" valign="top">
  314. <!-- // Begin Template Body \\ -->
  315. <table border="0" cellpadding="0" cellspacing="0" width="600" id="templateBody">
  316. <tr>
  317. <td valign="top" class="bodyContent">
  318. <!-- // Begin Module: Standard Content \\ -->
  319. <table border="0" cellpadding="20" cellspacing="0" width="100%">
  320. <tr>
  321. <td valign="top">
  322. <div mc:edit="std_content00">
  323. <h1 class="h1"><%= heading %></h1>
  324. <p> <%= message %> </p>
  325. <p> Thank you</p>
  326. <p> <a href="https://www.sharelatex.com"> ShareLatex.com </a></p>
  327. </div>
  328. </td>
  329. </tr>
  330. </table>
  331. <!-- // End Module: Standard Content \\ -->
  332. </td>
  333. </tr>
  334. </table>
  335. <!-- // End Template Body \\ -->
  336. </td>
  337. </tr>
  338. <tr>
  339. <td align="center" valign="top">
  340. <!-- // Begin Template Footer \\ -->
  341. <table border="0" cellpadding="10" cellspacing="0" width="600" id="templateFooter">
  342. <tr>
  343. <td valign="top" class="footerContent">
  344. <!-- // Begin Module: Standard Footer \\ -->
  345. <table border="0" cellpadding="10" cellspacing="0" width="100%">
  346. <tr>
  347. <td colspan="2" valign="middle" id="social">
  348. <div mc:edit="std_social">
  349. &nbsp;<a href="http://twitter.com/#!/sharelatex">follow on Twitter</a> | <a href="http://www.facebook.com/pages/ShareLaTeX/301671376556660">friend on Facebook</a>;
  350. </div>
  351. </td>
  352. </tr>
  353. </table>
  354. <!-- // End Module: Standard Footer \\ -->
  355. </td>
  356. </tr>
  357. </table>
  358. <!-- // End Template Footer \\ -->
  359. </td>
  360. </tr>
  361. </table>
  362. <br />
  363. </td>
  364. </tr>
  365. </table>
  366. </center>
  367. </body>
  368. </html>