@seliseblocks/mailcraft 0.2.16 → 0.2.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (78) hide show
  1. package/CHANGELOG.md +47 -0
  2. package/DOCS.md +70 -67
  3. package/README.md +8 -8
  4. package/README.md.txt +8 -8
  5. package/dist/mailcraft-editor.bundle.js +89 -76
  6. package/dist/mailcraft-editor.bundle.js.map +3 -3
  7. package/examples/templates/activate-your-account.html +1 -1
  8. package/examples/templates/back-in-stock.html +4 -4
  9. package/examples/templates/cart-left-behind.html +3 -3
  10. package/examples/templates/community-giveaway.html +3 -3
  11. package/examples/templates/frontend-futures-invite.html +3 -3
  12. package/examples/templates/give-25-get-25.html +2 -2
  13. package/examples/templates/invoice-paid.html +3 -3
  14. package/examples/templates/meet-nova-launch.html +7 -7
  15. package/examples/templates/mega-weekend-sale.html +1 -1
  16. package/examples/templates/order-confirmed.html +6 -6
  17. package/examples/templates/rate-your-headphones.html +3 -3
  18. package/examples/templates/reset-your-password.html +1 -1
  19. package/examples/templates/thankyou-promo-code.html +3 -3
  20. package/examples/templates/the-sunday-brief.html +4 -4
  21. package/examples/templates/welcome-to-your-workspace.html +4 -4
  22. package/examples/templates/your-order-shipped.html +2 -2
  23. package/examples/templates/your-password-was-changed.html +2 -2
  24. package/examples/templates/your-signin-code.html +1 -1
  25. package/examples/vanilla.html +66 -66
  26. package/package.json +1 -1
  27. package/src/core/binder.js +10 -0
  28. package/src/core/blocks.js +3 -3
  29. package/src/core/editor-core.js +195 -6
  30. package/src/core/export.js +311 -22
  31. package/src/core/i18n/ar.js +2 -0
  32. package/src/core/i18n/bg.js +2 -0
  33. package/src/core/i18n/bn.js +2 -0
  34. package/src/core/i18n/ca.js +2 -0
  35. package/src/core/i18n/cs.js +2 -0
  36. package/src/core/i18n/da.js +2 -0
  37. package/src/core/i18n/de-CH.js +2 -0
  38. package/src/core/i18n/de.js +2 -0
  39. package/src/core/i18n/dz.js +2 -0
  40. package/src/core/i18n/el.js +2 -0
  41. package/src/core/i18n/en.js +2 -0
  42. package/src/core/i18n/es.js +2 -0
  43. package/src/core/i18n/et.js +2 -0
  44. package/src/core/i18n/fi.js +2 -0
  45. package/src/core/i18n/fr.js +2 -0
  46. package/src/core/i18n/hr.js +2 -0
  47. package/src/core/i18n/hu.js +2 -0
  48. package/src/core/i18n/index.js +83 -83
  49. package/src/core/i18n/it.js +2 -0
  50. package/src/core/i18n/lt.js +2 -0
  51. package/src/core/i18n/lv.js +2 -0
  52. package/src/core/i18n/nb.js +2 -0
  53. package/src/core/i18n/nl.js +2 -0
  54. package/src/core/i18n/pl.js +2 -0
  55. package/src/core/i18n/pt.js +2 -0
  56. package/src/core/i18n/ro.js +2 -0
  57. package/src/core/i18n/ru.js +2 -0
  58. package/src/core/i18n/sk.js +2 -0
  59. package/src/core/i18n/sl.js +2 -0
  60. package/src/core/i18n/sv.js +2 -0
  61. package/src/core/i18n/tr.js +2 -0
  62. package/src/core/i18n/uk.js +2 -0
  63. package/src/core/icons.js +17 -43
  64. package/src/core/ids.js +1 -1
  65. package/src/core/import-html.js +390 -20
  66. package/src/core/layout-style.js +25 -0
  67. package/src/core/parse.js +10 -10
  68. package/src/core/placeholder.js +15 -15
  69. package/src/core/sanitize.js +4 -1
  70. package/src/core/theme.js +22 -1
  71. package/src/core/variables.js +11 -11
  72. package/src/mailcraft-editor.js +11 -1
  73. package/src/render/block-body.js +129 -17
  74. package/src/render/canvas.js +35 -6
  75. package/src/render/fields.js +19 -0
  76. package/src/render/focus-preserve.js +158 -158
  77. package/src/render/screenshot.js +26 -3
  78. package/src/render/style.js +6 -1
@@ -18,7 +18,7 @@
18
18
  <td align="center" style="padding:34px 36px 8px;">
19
19
  <p style="margin:0 0 12px; font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; letter-spacing:0.2em; text-transform:uppercase; color:#0065b3;">Account activation</p>
20
20
  <h1 style="margin:0 0 12px; font-family:Arial, Helvetica, sans-serif; font-size:26px; line-height:1.25; color:#10243c;">One last step, {{ first_name }}</h1>
21
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:15px; line-height:1.65; color:#3f5063;">Welcome to {{ company }}. Tap the button below to activate your account &mdash; it takes less than ten seconds.</p>
21
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:15px; line-height:1.65; color:#3f5063;">Welcome to {{ company }}. Tap the button below to activate your account; it takes less than ten seconds.</p>
22
22
  </td>
23
23
  </tr>
24
24
  <tr>
@@ -2,7 +2,7 @@
2
2
  <html>
3
3
  <head>
4
4
  <meta charset="utf-8" />
5
- <title>Back in stock the one you wanted</title>
5
+ <title>Back in stock: the one you wanted</title>
6
6
  </head>
7
7
  <body style="margin:0; padding:0; background-color:#faf7f2;">
8
8
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background-color:#faf7f2;">
@@ -13,7 +13,7 @@
13
13
  <td align="center" style="padding:36px 36px 8px;">
14
14
  <p style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; letter-spacing:0.2em; text-transform:uppercase; color:#b85c38;">Back in stock</p>
15
15
  <h1 style="margin:0 0 10px; font-family:Georgia, 'Times New Roman', serif; font-size:28px; line-height:1.25; color:#29241d;">Good news, {{ first_name }}</h1>
16
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14.5px; line-height:1.65; color:#5d574c;">The Terracotta Trainer in your size is back &mdash; and your watchlist held your place in line.</p>
16
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14.5px; line-height:1.65; color:#5d574c;">The Terracotta Trainer in your size is back, and your watchlist held your place in line.</p>
17
17
  </td>
18
18
  </tr>
19
19
  <tr>
@@ -21,7 +21,7 @@
21
21
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background-color:#f6f1e9; ">
22
22
  <tr>
23
23
  <td width="38%" valign="middle" align="center" style="padding:22px 18px;">
24
- <img src="data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22340%22%20height%3D%22340%22%20viewBox%3D%220%200%20340%20340%22%3E%20%3Crect%20width%3D%22340%22%20height%3D%22340%22%20fill%3D%22%23b85c38%22%2F%3E%20%3Ccircle%20cx%3D%22264%22%20cy%3D%2272%22%20r%3D%2242%22%20fill%3D%22%23c96f4a%22%2F%3E%20%3Ccircle%20cx%3D%2256%22%20cy%3D%22290%22%20r%3D%2254%22%20fill%3D%22%23a9502e%22%2F%3E%20%3Cellipse%20cx%3D%22172%22%20cy%3D%22252%22%20rx%3D%22120%22%20ry%3D%2213%22%20fill%3D%22%238f4526%22%2F%3E%20%3Cpath%20d%3D%22M52%20222%20Q52%20242%2076%20242%20L268%20242%20Q288%20242%20288%20224%20L288%20216%20Q288%20208%20278%20206%20L62%20206%20Q52%20208%2052%20222%20Z%22%20fill%3D%22%23f3e9dc%22%2F%3E%20%3Cpath%20d%3D%22M62%20208%20Q60%20152%2096%20140%20Q128%20130%20148%20150%20Q170%20172%20210%20178%20L262%20188%20Q286%20194%20286%20208%20Z%22%20fill%3D%22%23e8d9c4%22%2F%3E%20%3Cpath%20d%3D%22M148%20150%20Q170%20172%20210%20178%20L262%20188%20Q286%20194%20286%20208%20L196%20208%20Q170%20198%20156%20174%20Z%22%20fill%3D%22%23caa27f%22%2F%3E%20%3Cpath%20d%3D%22M62%20208%20Q61%20170%2082%20152%20Q68%20172%2070%20208%20Z%22%20fill%3D%22%23d9c3a6%22%2F%3E%20%3Cg%20stroke%3D%22%238f5a3a%22%20stroke-width%3D%226%22%20stroke-linecap%3D%22round%22%3E%20%3Cline%20x1%3D%22112%22%20y1%3D%22152%22%20x2%3D%22140%22%20y2%3D%22166%22%2F%3E%20%3Cline%20x1%3D%22106%22%20y1%3D%22168%22%20x2%3D%22136%22%20y2%3D%22182%22%2F%3E%20%3Cline%20x1%3D%22102%22%20y1%3D%22184%22%20x2%3D%22132%22%20y2%3D%22198%22%2F%3E%20%3C%2Fg%3E%20%3Crect%20x%3D%2258%22%20y%3D%22230%22%20width%3D%22224%22%20height%3D%226%22%20rx%3D%223%22%20fill%3D%22%23d9c3a6%22%2F%3E%20%3C%2Fsvg%3E" width="170" alt="Terracotta Trainer suede and canvas sneaker" style="display:block; width:170px; max-width:100%; height:auto;" />
24
+ <img src="data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22340%22%20height%3D%22340%22%20viewBox%3D%220%200%20340%20340%22%3E%20%3Crect%20width%3D%22340%22%20height%3D%22340%22%20fill%3D%22%23b85c38%22%2F%3E%20%3Ccircle%20cx%3D%22264%22%20cy%3D%2272%22%20r%3D%2242%22%20fill%3D%22%23c96f4a%22%2F%3E%20%3Ccircle%20cx%3D%2256%22%20cy%3D%22290%22%20r%3D%2254%22%20fill%3D%22%23a9502e%22%2F%3E%20%3Cellipse%20cx%3D%22172%22%20cy%3D%22252%22%20rx%3D%22120%22%20ry%3D%2213%22%20fill%3D%22%238f4526%22%2F%3E%20%3Cpath%20d%3D%22M52%20222%20Q52%20242%2076%20242%20L268%20242%20Q288%20242%20288%20224%20L288%20216%20Q288%20208%20278%20206%20L62%20206%20Q52%20208%2052%20222%20Z%22%20fill%3D%22%23f3e9dc%22%2F%3E%20%3Cpath%20d%3D%22M62%20208%20Q60%20152%2096%20140%20Q128%20130%20148%20150%20Q170%20172%20210%20178%20L262%20188%20Q286%20194%20286%20208%20Z%22%20fill%3D%22%23e8d9c4%22%2F%3E%20%3Cpath%20d%3D%22M148%20150%20Q170%20172%20210%20178%20L262%20188%20Q286%20194%20286%20208%20L196%20208%20Q170%20198%20156%20174%20Z%22%20fill%3D%22%23caa27f%22%2F%3E%20%3Cpath%20d%3D%22M62%20208%20Q61%20170%2082%20152%20Q68%20172%2070%20208%20Z%22%20fill%3D%22%23d9c3a6%22%2F%3E%20%3Cg%20stroke%3D%22%238f5a3a%22%20stroke-width%3D%226%22%20stroke-linecap%3D%22round%22%3E%20%3Cline%20x1%3D%22112%22%20y1%3D%22152%22%20x2%3D%22140%22%20y2%3D%22166%22%2F%3E%20%3Cline%20x1%3D%22106%22%20y1%3D%22168%22%20x2%3D%22136%22%20y2%3D%22182%22%2F%3E%20%3Cline%20x1%3D%22102%22%20y1%3D%22184%22%20x2%3D%22132%22%20y2%3D%22198%22%2F%3E%20%3C%2Fg%3E%20%3Crect%20x%3D%2258%22%20y%3D%22230%22%20width%3D%22224%22%20height%3D%226%22%20rx%3D%223%22%20fill%3D%22%23d9c3a6%22%2F%3E%20%3C%2Fsvg%3E" width="170" alt="Terracotta Trainer, suede and canvas sneaker" style="display:block; width:170px; max-width:100%; height:auto;" />
25
25
  </td>
26
26
  <td width="62%" valign="middle" style="padding:18px 18px 18px 6px;">
27
27
  <h2 style="margin:0 0 6px; font-family:Georgia, serif; font-size:19px; color:#29241d;">Terracotta Trainer</h2>
@@ -35,7 +35,7 @@
35
35
  </tr>
36
36
  <tr>
37
37
  <td align="center" style="padding:20px 36px 8px;">
38
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#8b8271;">Last restock sold out in 4 days &mdash; sizes go first, pairs follow.</p>
38
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#8b8271;">Last restock sold out in 4 days; sizes go first, pairs follow.</p>
39
39
  </td>
40
40
  </tr>
41
41
  <tr>
@@ -21,7 +21,7 @@
21
21
  <tr>
22
22
  <td align="center" style="padding:16px 36px 6px;">
23
23
  <h1 style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:25px; line-height:1.3; color:#241b3a;">Still thinking it over, {{ first_name }}?</h1>
24
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14.5px; line-height:1.65; color:#574d70;">Your bag is being held for the next 48 hours &mdash; with a little thank-you for coming back.</p>
24
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14.5px; line-height:1.65; color:#574d70;">Your bag is being held for the next 48 hours, with a little thank-you for coming back.</p>
25
25
  </td>
26
26
  </tr>
27
27
  <tr>
@@ -38,7 +38,7 @@
38
38
  </td>
39
39
  </tr>
40
40
  <tr>
41
- <td colspan="2" style="padding:14px 16px; background-color:#faf8fd; border-top:1px solid #e7e3f2; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#574d70;">Come-back code <strong style="font-family:'Courier New', Courier, monospace; color:#7048b8;">COMEBACK15</strong> applied at checkout &mdash; 15% off this bag.</td>
41
+ <td colspan="2" style="padding:14px 16px; background-color:#faf8fd; border-top:1px solid #e7e3f2; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#574d70;">Come-back code <strong style="font-family:'Courier New', Courier, monospace; color:#7048b8;">COMEBACK15</strong> applied at checkout: 15% off this bag.</td>
42
42
  </tr>
43
43
  </table>
44
44
  </td>
@@ -46,7 +46,7 @@
46
46
  <tr>
47
47
  <td align="center" style="padding:22px 36px 6px;">
48
48
  <a href="https://example.com/cart" style="display:inline-block; background-color:#7048b8; color:#ffffff; font-family:Arial, Helvetica, sans-serif; font-size:15px; font-weight:bold; text-decoration:none; padding:14px 40px; ">Finish my order</a>
49
- <p style="margin:12px 0 0; font-family:Arial, Helvetica, sans-serif; font-size:12.5px; color:#9c92b8;">Held until Friday, 18:00 &mdash; after that the bag returns to the shelf.</p>
49
+ <p style="margin:12px 0 0; font-family:Arial, Helvetica, sans-serif; font-size:12.5px; color:#9c92b8;">Held until Friday, 18:00; after that the bag returns to the shelf.</p>
50
50
  </td>
51
51
  </tr>
52
52
  <tr>
@@ -2,7 +2,7 @@
2
2
  <html>
3
3
  <head>
4
4
  <meta charset="utf-8" />
5
- <title>You&rsquo;re in the community giveaway</title>
5
+ <title>You&rsquo;re in: the community giveaway</title>
6
6
  </head>
7
7
  <body style="margin:0; padding:0; background-color:#0c1226;">
8
8
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background-color:#0c1226;">
@@ -25,8 +25,8 @@
25
25
  <tr>
26
26
  <td align="center" style="padding:36px 36px 8px;">
27
27
  <p style="margin:0 0 12px; font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; letter-spacing:0.22em; text-transform:uppercase; color:#38bdf8;">The community giveaway</p>
28
- <h1 style="margin:0 0 12px; font-family:Arial, Helvetica, sans-serif; font-size:34px; line-height:1.15; color:#ffffff;">One year free &mdash;<br />for you and a friend</h1>
29
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:15px; line-height:1.65; color:#aeb8d8;">We turned five this month. To celebrate, five lucky members win a free year &mdash; and each brings a friend along. Entry takes one click, {{ first_name }}.</p>
28
+ <h1 style="margin:0 0 12px; font-family:Arial, Helvetica, sans-serif; font-size:34px; line-height:1.15; color:#ffffff;">One year free,<br />for you and a friend</h1>
29
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:15px; line-height:1.65; color:#aeb8d8;">We turned five this month. To celebrate, five lucky members win a free year, and each brings a friend along. Entry takes one click, {{ first_name }}.</p>
30
30
  </td>
31
31
  </tr>
32
32
  <tr>
@@ -2,7 +2,7 @@
2
2
  <html>
3
3
  <head>
4
4
  <meta charset="utf-8" />
5
- <title>You&rsquo;re invited Frontend Futures, 24 Sept</title>
5
+ <title>You&rsquo;re invited: Frontend Futures, 24 Sept</title>
6
6
  </head>
7
7
  <body style="margin:0; padding:0; background-color:#0e0c1a;">
8
8
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background-color:#0e0c1a;">
@@ -42,12 +42,12 @@
42
42
  </tr>
43
43
  <tr>
44
44
  <td style="padding:26px 44px 6px;">
45
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14.5px; line-height:1.7; color:#b3a9d6;">{{ first_name }}, one evening, seven short talks, zero sales pitches &mdash; view transitions, state machines, and what accessibility looks like from the inside. Followed by drinks and argumentative dessert.</p>
45
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14.5px; line-height:1.7; color:#b3a9d6;">{{ first_name }}, one evening, seven short talks, zero sales pitches: view transitions, state machines, and what accessibility looks like from the inside. Followed by drinks and argumentative dessert.</p>
46
46
  </td>
47
47
  </tr>
48
48
  <tr>
49
49
  <td align="center" style="padding:24px 36px 8px;">
50
- <a href="https://example.com/events/frontend-futures" style="display:inline-block; background-color:#a48ef0; color:#171332; font-family:Arial, Helvetica, sans-serif; font-size:15px; font-weight:bold; text-decoration:none; padding:14px 44px; ">Reserve a seat &mdash; free</a>
50
+ <a href="https://example.com/events/frontend-futures" style="display:inline-block; background-color:#a48ef0; color:#171332; font-family:Arial, Helvetica, sans-serif; font-size:15px; font-weight:bold; text-decoration:none; padding:14px 44px; ">Reserve a seat (free)</a>
51
51
  <p style="margin:12px 0 0; font-family:Arial, Helvetica, sans-serif; font-size:12.5px; color:#8f83b8;">The Atrium, 4 Harbour Lane &middot; seats are first come, first served</p>
52
52
  </td>
53
53
  </tr>
@@ -13,7 +13,7 @@
13
13
  <td align="center" style="background-color:#1e7a4f; padding:30px 32px 26px; ">
14
14
  <p style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; letter-spacing:0.22em; text-transform:uppercase; color:#cdeeda;">The {{ company }} referral programme</p>
15
15
  <h1 style="margin:0 0 8px; font-family:Arial, Helvetica, sans-serif; font-size:36px; line-height:1.1; color:#ffffff;">Give $25 &middot; Get $25</h1>
16
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14.5px; line-height:1.5; color:#d9efe2;">You both win &mdash; they save on their first order, you get credit when it ships.</p>
16
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14.5px; line-height:1.5; color:#d9efe2;">You both win: they save on their first order, you get credit when it ships.</p>
17
17
  </td>
18
18
  </tr>
19
19
  <tr>
@@ -58,7 +58,7 @@
58
58
  </tr>
59
59
  <tr>
60
60
  <td align="center" style="padding:12px 36px 32px;">
61
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:11.5px; line-height:1.6; color:#6f9784;">No cap on rewards &mdash; refer three friends, get $75. Sent to {{ email }}.<br /><a href="{{ unsubscribe_url }}" style="color:#6f9784;">Unsubscribe</a> &middot; <a href="https://example.com/preferences" style="color:#6f9784;">Preferences</a></p>
61
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:11.5px; line-height:1.6; color:#6f9784;">No cap on rewards; refer three friends, get $75. Sent to {{ email }}.<br /><a href="{{ unsubscribe_url }}" style="color:#6f9784;">Unsubscribe</a> &middot; <a href="https://example.com/preferences" style="color:#6f9784;">Preferences</a></p>
62
62
  </td>
63
63
  </tr>
64
64
  </table>
@@ -2,7 +2,7 @@
2
2
  <html>
3
3
  <head>
4
4
  <meta charset="utf-8" />
5
- <title>Invoice paid #INV-2051</title>
5
+ <title>Invoice paid: #INV-2051</title>
6
6
  </head>
7
7
  <body style="margin:0; padding:0; background-color:#f4f6f9;">
8
8
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background-color:#f4f6f9;">
@@ -23,7 +23,7 @@
23
23
  <td style="padding:18px 36px 8px;">
24
24
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background-color:#e9f7ee; ">
25
25
  <tr>
26
- <td style="padding:14px 18px; font-family:Arial, Helvetica, sans-serif; font-size:14px; font-weight:bold; color:#1e7a3c;">&#10004; &nbsp;Paid in full &mdash; thank you, {{ first_name }}</td>
26
+ <td style="padding:14px 18px; font-family:Arial, Helvetica, sans-serif; font-size:14px; font-weight:bold; color:#1e7a3c;">&#10004; &nbsp;Paid in full. Thank you, {{ first_name }}</td>
27
27
  </tr>
28
28
  </table>
29
29
  </td>
@@ -36,7 +36,7 @@
36
36
  <td align="right" style="padding:12px 18px; border-bottom:1px solid #e2e8f0; font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; letter-spacing:0.12em; text-transform:uppercase; color:#8194a7;">Amount</td>
37
37
  </tr>
38
38
  <tr>
39
- <td style="padding:14px 18px; border-bottom:1px solid #e2e8f0; font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#14324f;">Pro plan &mdash; monthly</td>
39
+ <td style="padding:14px 18px; border-bottom:1px solid #e2e8f0; font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#14324f;">Pro plan, monthly</td>
40
40
  <td align="right" style="padding:14px 18px; border-bottom:1px solid #e2e8f0; font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#14324f;">$49.00</td>
41
41
  </tr>
42
42
  <tr>
@@ -2,7 +2,7 @@
2
2
  <html>
3
3
  <head>
4
4
  <meta charset="utf-8" />
5
- <title>Meet Nova our biggest release yet</title>
5
+ <title>Meet Nova: our biggest release yet</title>
6
6
  </head>
7
7
  <body style="margin:0; padding:0; background-color:#0b1020;">
8
8
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background-color:#0b1020;">
@@ -13,18 +13,18 @@
13
13
  <td align="center" style="background-color:#0065b3; padding:34px 32px 30px; ">
14
14
  <p style="margin:0 0 12px; font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; letter-spacing:0.22em; text-transform:uppercase; color:#bfdbfe;">New from {{ company }}</p>
15
15
  <h1 style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:38px; line-height:1.1; color:#ffffff;">Meet Nova</h1>
16
- <p style="margin:10px 0 0; font-family:Arial, Helvetica, sans-serif; font-size:15px; line-height:1.5; color:#dbeafe;">Our biggest release yet &mdash; and it&rsquo;s already in your account.</p>
16
+ <p style="margin:10px 0 0; font-family:Arial, Helvetica, sans-serif; font-size:15px; line-height:1.5; color:#dbeafe;">Our biggest release yet, and it&rsquo;s already in your account.</p>
17
17
  </td>
18
18
  </tr>
19
19
  <tr>
20
20
  <td style="padding:0;">
21
- <img src="data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22600%22%20height%3D%22230%22%20viewBox%3D%220%200%20600%20230%22%3E%20%3Crect%20width%3D%22600%22%20height%3D%22230%22%20fill%3D%22%230b1020%22%2F%3E%20%3Ccircle%20cx%3D%22524%22%20cy%3D%2230%22%20r%3D%2296%22%20fill%3D%22%23111832%22%2F%3E%20%3Ccircle%20cx%3D%2260%22%20cy%3D%22216%22%20r%3D%2280%22%20fill%3D%22%23111832%22%2F%3E%20%3Crect%20x%3D%22150%22%20y%3D%2240%22%20width%3D%22300%22%20height%3D%22172%22%20rx%3D%2212%22%20fill%3D%22%2316203c%22%2F%3E%20%3Cpath%20d%3D%22M150%2052%20Q150%2040%20162%2040%20L438%2040%20Q450%2040%20450%2052%20L450%2072%20L150%2072%20Z%22%20fill%3D%22%231c2848%22%2F%3E%20%3Ccircle%20cx%3D%22172%22%20cy%3D%2256%22%20r%3D%225%22%20fill%3D%22%2358a8e3%22%2F%3E%20%3Ccircle%20cx%3D%22190%22%20cy%3D%2256%22%20r%3D%225%22%20fill%3D%22%233b6ea5%22%2F%3E%20%3Ccircle%20cx%3D%22208%22%20cy%3D%2256%22%20r%3D%225%22%20fill%3D%22%2328497a%22%2F%3E%20%3Crect%20x%3D%22168%22%20y%3D%2290%22%20width%3D%22122%22%20height%3D%2214%22%20rx%3D%227%22%20fill%3D%22%232b3d69%22%2F%3E%20%3Crect%20x%3D%22168%22%20y%3D%22118%22%20width%3D%22264%22%20height%3D%2210%22%20rx%3D%225%22%20fill%3D%22%2322335c%22%2F%3E%20%3Crect%20x%3D%22168%22%20y%3D%22136%22%20width%3D%22236%22%20height%3D%2210%22%20rx%3D%225%22%20fill%3D%22%2322335c%22%2F%3E%20%3Crect%20x%3D%22168%22%20y%3D%22154%22%20width%3D%22250%22%20height%3D%2210%22%20rx%3D%225%22%20fill%3D%22%2322335c%22%2F%3E%20%3Crect%20x%3D%22168%22%20y%3D%22180%22%20width%3D%2298%22%20height%3D%2220%22%20rx%3D%2210%22%20fill%3D%22%2358a8e3%22%2F%3E%20%3Cpath%20d%3D%22M470%2084%20L479%20108%20L502%20117%20L479%20126%20L470%20150%20L461%20126%20L438%20117%20L461%20108%20Z%22%20fill%3D%22%23d9e9f9%22%2F%3E%20%3Cpath%20d%3D%22M502%2056%20L506%2067%20L517%2071%20L506%2075%20L502%2086%20L498%2075%20L487%2071%20L498%2067%20Z%22%20fill%3D%22%2358a8e3%22%2F%3E%20%3C%2Fsvg%3E" width="600" alt="Nova the new workspace" style="display:block; width:100%; max-width:600px; height:auto;" />
21
+ <img src="data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22600%22%20height%3D%22230%22%20viewBox%3D%220%200%20600%20230%22%3E%20%3Crect%20width%3D%22600%22%20height%3D%22230%22%20fill%3D%22%230b1020%22%2F%3E%20%3Ccircle%20cx%3D%22524%22%20cy%3D%2230%22%20r%3D%2296%22%20fill%3D%22%23111832%22%2F%3E%20%3Ccircle%20cx%3D%2260%22%20cy%3D%22216%22%20r%3D%2280%22%20fill%3D%22%23111832%22%2F%3E%20%3Crect%20x%3D%22150%22%20y%3D%2240%22%20width%3D%22300%22%20height%3D%22172%22%20rx%3D%2212%22%20fill%3D%22%2316203c%22%2F%3E%20%3Cpath%20d%3D%22M150%2052%20Q150%2040%20162%2040%20L438%2040%20Q450%2040%20450%2052%20L450%2072%20L150%2072%20Z%22%20fill%3D%22%231c2848%22%2F%3E%20%3Ccircle%20cx%3D%22172%22%20cy%3D%2256%22%20r%3D%225%22%20fill%3D%22%2358a8e3%22%2F%3E%20%3Ccircle%20cx%3D%22190%22%20cy%3D%2256%22%20r%3D%225%22%20fill%3D%22%233b6ea5%22%2F%3E%20%3Ccircle%20cx%3D%22208%22%20cy%3D%2256%22%20r%3D%225%22%20fill%3D%22%2328497a%22%2F%3E%20%3Crect%20x%3D%22168%22%20y%3D%2290%22%20width%3D%22122%22%20height%3D%2214%22%20rx%3D%227%22%20fill%3D%22%232b3d69%22%2F%3E%20%3Crect%20x%3D%22168%22%20y%3D%22118%22%20width%3D%22264%22%20height%3D%2210%22%20rx%3D%225%22%20fill%3D%22%2322335c%22%2F%3E%20%3Crect%20x%3D%22168%22%20y%3D%22136%22%20width%3D%22236%22%20height%3D%2210%22%20rx%3D%225%22%20fill%3D%22%2322335c%22%2F%3E%20%3Crect%20x%3D%22168%22%20y%3D%22154%22%20width%3D%22250%22%20height%3D%2210%22%20rx%3D%225%22%20fill%3D%22%2322335c%22%2F%3E%20%3Crect%20x%3D%22168%22%20y%3D%22180%22%20width%3D%2298%22%20height%3D%2220%22%20rx%3D%2210%22%20fill%3D%22%2358a8e3%22%2F%3E%20%3Cpath%20d%3D%22M470%2084%20L479%20108%20L502%20117%20L479%20126%20L470%20150%20L461%20126%20L438%20117%20L461%20108%20Z%22%20fill%3D%22%23d9e9f9%22%2F%3E%20%3Cpath%20d%3D%22M502%2056%20L506%2067%20L517%2071%20L506%2075%20L502%2086%20L498%2075%20L487%2071%20L498%2067%20Z%22%20fill%3D%22%2358a8e3%22%2F%3E%20%3C%2Fsvg%3E" width="600" alt="Nova, the new workspace" style="display:block; width:100%; max-width:600px; height:auto;" />
22
22
  </td>
23
23
  </tr>
24
24
  <tr>
25
25
  <td align="center" style="padding:32px 36px 6px;">
26
26
  <h2 style="margin:0 0 12px; font-family:Arial, Helvetica, sans-serif; font-size:21px; line-height:1.3; color:#ffffff;">Everything you asked for, in one update</h2>
27
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14.5px; line-height:1.7; color:#aebad6;">Hi {{ first_name }} &mdash; over 4,000 of you shaped this release. Nova rebuilds the parts that slowed you down and adds the three things you asked for most.</p>
27
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14.5px; line-height:1.7; color:#aebad6;">Hi {{ first_name }}: over 4,000 of you shaped this release. Nova rebuilds the parts that slowed you down and adds the three things you asked for most.</p>
28
28
  </td>
29
29
  </tr>
30
30
  <tr>
@@ -34,7 +34,7 @@
34
34
  <td width="33%" valign="top" align="center" style="padding:0 8px;">
35
35
  <table role="presentation" cellpadding="0" cellspacing="0" style="background-color:#1c2848; "><tr><td align="center" style="padding:12px 16px; font-family:Arial, Helvetica, sans-serif; font-size:15px; font-weight:bold; color:#58a8e3;">2&times;</td></tr></table>
36
36
  <h3 style="margin:10px 0 6px; font-family:Arial, Helvetica, sans-serif; font-size:14.5px; color:#ffffff;">Faster</h3>
37
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:12.5px; line-height:1.55; color:#8f9cbd;">A new engine under the hood &mdash; big projects open instantly.</p>
37
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:12.5px; line-height:1.55; color:#8f9cbd;">A new engine under the hood; big projects open instantly.</p>
38
38
  </td>
39
39
  <td width="34%" valign="top" align="center" style="padding:0 8px;">
40
40
  <table role="presentation" cellpadding="0" cellspacing="0" style="background-color:#1c2848; "><tr><td align="center" style="padding:12px 16px; font-family:Arial, Helvetica, sans-serif; font-size:15px; font-weight:bold; color:#58a8e3;">Smart</td></tr></table>
@@ -44,7 +44,7 @@
44
44
  <td width="33%" valign="top" align="center" style="padding:0 8px;">
45
45
  <table role="presentation" cellpadding="0" cellspacing="0" style="background-color:#1c2848; "><tr><td align="center" style="padding:12px 16px; font-family:Arial, Helvetica, sans-serif; font-size:15px; font-weight:bold; color:#58a8e3;">100%</td></tr></table>
46
46
  <h3 style="margin:10px 0 6px; font-family:Arial, Helvetica, sans-serif; font-size:14.5px; color:#ffffff;">Private</h3>
47
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:12.5px; line-height:1.55; color:#8f9cbd;">Your data stays yours &mdash; encrypted, never trained on.</p>
47
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:12.5px; line-height:1.55; color:#8f9cbd;">Your data stays yours: encrypted, never trained on.</p>
48
48
  </td>
49
49
  </tr>
50
50
  </table>
@@ -53,7 +53,7 @@
53
53
  <tr>
54
54
  <td align="center" style="padding:28px 36px 8px;">
55
55
  <a href="https://example.com/nova" style="display:inline-block; background-color:#58a8e3; color:#0b1020; font-family:Arial, Helvetica, sans-serif; font-size:15px; font-weight:bold; text-decoration:none; padding:14px 40px; ">Try Nova today</a>
56
- <p style="margin:12px 0 0; font-family:Arial, Helvetica, sans-serif; font-size:12.5px; color:#8f9cbd;">Free for every current customer &mdash; nothing to buy, nothing to migrate.</p>
56
+ <p style="margin:12px 0 0; font-family:Arial, Helvetica, sans-serif; font-size:12.5px; color:#8f9cbd;">Free for every current customer: nothing to buy, nothing to migrate.</p>
57
57
  </td>
58
58
  </tr>
59
59
  <tr>
@@ -2,7 +2,7 @@
2
2
  <html>
3
3
  <head>
4
4
  <meta charset="utf-8" />
5
- <title>MEGA weekend 50% off everything</title>
5
+ <title>MEGA weekend: 50% off everything</title>
6
6
  </head>
7
7
  <body style="margin:0; padding:0; background-color:#ffffff;">
8
8
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background-color:#ffffff;">
@@ -12,8 +12,8 @@
12
12
  <tr>
13
13
  <td style="padding:32px 36px 6px;">
14
14
  <p style="margin:0 0 8px; font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; letter-spacing:0.16em; text-transform:uppercase; color:#2f9e44;">Order confirmed</p>
15
- <h1 style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:24px; line-height:1.25; color:#1a1a1a;">Thanks, {{ first_name }} &mdash; it&rsquo;s on its way</h1>
16
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:1.6; color:#4a4a4a;">Order <strong>#48213</strong>, placed today. We&rsquo;ll email tracking as soon as the courier scans it &mdash; usually within one business day.</p>
15
+ <h1 style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:24px; line-height:1.25; color:#1a1a1a;">Thanks, {{ first_name }}: it&rsquo;s on its way</h1>
16
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:1.6; color:#4a4a4a;">Order <strong>#48213</strong>, placed today. We&rsquo;ll email tracking as soon as the courier scans it, usually within one business day.</p>
17
17
  </td>
18
18
  </tr>
19
19
  <tr>
@@ -23,7 +23,7 @@
23
23
  <td style="padding:14px 18px; border-bottom:1px solid #e6e6e2;">
24
24
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0">
25
25
  <tr>
26
- <td style="font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#1a1a1a;">Field jacket &mdash; olive, M</td>
26
+ <td style="font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#1a1a1a;">Field jacket, olive, M</td>
27
27
  <td align="right" style="font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#1a1a1a;">$148.00</td>
28
28
  </tr>
29
29
  </table>
@@ -33,7 +33,7 @@
33
33
  <td style="padding:14px 18px; border-bottom:1px solid #e6e6e2;">
34
34
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0">
35
35
  <tr>
36
- <td style="font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#1a1a1a;">Merino crew &mdash; charcoal, M</td>
36
+ <td style="font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#1a1a1a;">Merino crew, charcoal, M</td>
37
37
  <td align="right" style="font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#1a1a1a;">$85.00</td>
38
38
  </tr>
39
39
  </table>
@@ -68,8 +68,8 @@
68
68
  </tr>
69
69
  <tr>
70
70
  <td style="padding:10px 36px 30px;">
71
- <p style="margin:0 0 8px; font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:1.6; color:#4a4a4a;">Need a different size? Exchanges are free for 30 days &mdash; start one from the order page above.</p>
72
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:11.5px; line-height:1.6; color:#9a9a94;">This receipt was sent to {{ email }}. <a href="{{ unsubscribe_url }}" style="color:#9a9a94;">Unsubscribe from marketing</a> &mdash; you will still receive order emails.</p>
71
+ <p style="margin:0 0 8px; font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:1.6; color:#4a4a4a;">Need a different size? Exchanges are free for 30 days; start one from the order page above.</p>
72
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:11.5px; line-height:1.6; color:#9a9a94;">This receipt was sent to {{ email }}. <a href="{{ unsubscribe_url }}" style="color:#9a9a94;">Unsubscribe from marketing</a>; you will still receive order emails.</p>
73
73
  </td>
74
74
  </tr>
75
75
  </table>
@@ -12,7 +12,7 @@
12
12
  <tr>
13
13
  <td align="center" style="padding:36px 36px 10px;">
14
14
  <p style="margin:0 0 14px; font-family:Arial, Helvetica, sans-serif; font-size:26px; letter-spacing:0.1em; color:#e6b93c;">&#9733; &#9733; &#9733; &#9733; &#9733;</p>
15
- <h1 style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:24px; line-height:1.3; color:#16233a;">Two weeks with your headphones &mdash; how is it going?</h1>
15
+ <h1 style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:24px; line-height:1.3; color:#16233a;">Two weeks with your headphones: how is it going?</h1>
16
16
  <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14.5px; line-height:1.65; color:#435d80;">Hi {{ first_name }}, a quick one: your thoughts help the next buyer decide. It takes about a minute, and we&rsquo;d really appreciate it.</p>
17
17
  </td>
18
18
  </tr>
@@ -27,7 +27,7 @@
27
27
  <td align="center" style="padding:0 6px;"><a href="https://example.com/review/1" style="display:block; width:52px; height:52px; background-color:#f6f9fd; border:1px solid #dbe5f2; font-family:Arial, Helvetica, sans-serif; font-size:22px; line-height:52px; text-decoration:none; color:#e6b93c;">&#9733;</a></td>
28
28
  </tr>
29
29
  </table>
30
- <p style="margin:12px 0 0; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#8194a7;">Tap a star to start &mdash; honest beats polite.</p>
30
+ <p style="margin:12px 0 0; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#8194a7;">Tap a star to start; honest beats polite.</p>
31
31
  </td>
32
32
  </tr>
33
33
  <tr>
@@ -40,7 +40,7 @@
40
40
  <td valign="middle" width="70%" style="padding:16px 16px 16px 4px;">
41
41
  <h2 style="margin:0 0 4px; font-family:Arial, Helvetica, sans-serif; font-size:15.5px; color:#16233a;">Studio Headphones MK II</h2>
42
42
  <p style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#435d80;">Order #47190 &middot; delivered 12 August</p>
43
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:1.55; color:#435d80;">Review in the next 7 days and shipping on your next order is on us &mdash; good or bad.</p>
43
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:1.55; color:#435d80;">Review in the next 7 days and shipping on your next order is on us, good or bad.</p>
44
44
  </td>
45
45
  </tr>
46
46
  </table>
@@ -36,7 +36,7 @@
36
36
  <td style="padding:28px 36px 8px;">
37
37
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background-color:#f4f8fc; ">
38
38
  <tr>
39
- <td style="padding:16px 20px; font-family:Arial, Helvetica, sans-serif; font-size:12.5px; line-height:1.65; color:#5b6d80;">This link works once and expires in 30 minutes. If you didn&rsquo;t ask for a reset, ignore this email &mdash; your current password keeps working.</td>
39
+ <td style="padding:16px 20px; font-family:Arial, Helvetica, sans-serif; font-size:12.5px; line-height:1.65; color:#5b6d80;">This link works once and expires in 30 minutes. If you didn&rsquo;t ask for a reset, ignore this email; your current password keeps working.</td>
40
40
  </tr>
41
41
  </table>
42
42
  </td>
@@ -2,7 +2,7 @@
2
2
  <html>
3
3
  <head>
4
4
  <meta charset="utf-8" />
5
- <title>A little thank-you 20% off</title>
5
+ <title>A little thank-you: 20% off</title>
6
6
  </head>
7
7
  <body style="margin:0; padding:0; background-color:#fdf8f3;">
8
8
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background-color:#fdf8f3;">
@@ -13,7 +13,7 @@
13
13
  <td align="center" style="padding:38px 36px 8px;">
14
14
  <p style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; letter-spacing:0.2em; text-transform:uppercase; color:#c2762d;">A small thank-you</p>
15
15
  <h1 style="margin:0 0 12px; font-family:Georgia, 'Times New Roman', serif; font-size:30px; line-height:1.2; color:#2d2a24;">Here&rsquo;s 20% off, {{ first_name }}</h1>
16
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:15px; line-height:1.65; color:#5d574c;">It&rsquo;s been a year since you joined us &mdash; and that&rsquo;s worth celebrating. Here&rsquo;s a little something to mark it.</p>
16
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:15px; line-height:1.65; color:#5d574c;">It&rsquo;s been a year since you joined us, and that&rsquo;s worth celebrating. Here&rsquo;s a little something to mark it.</p>
17
17
  </td>
18
18
  </tr>
19
19
  <tr>
@@ -44,7 +44,7 @@
44
44
  </td>
45
45
  <td width="50%" valign="top" style="padding:0 0 0 10px;">
46
46
  <h3 style="margin:0 0 6px; font-family:Arial, Helvetica, sans-serif; font-size:14.5px; color:#2d2a24;">Stack it with sales</h3>
47
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:1.55; color:#5d574c;">Already-marked-down pieces count too &mdash; yes, really.</p>
47
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:1.55; color:#5d574c;">Already-marked-down pieces count too. Yes, really.</p>
48
48
  </td>
49
49
  </tr>
50
50
  </table>
@@ -27,16 +27,16 @@
27
27
  <td align="center" style="background-color:#f6f4ee; padding:36px 40px 34px; border-bottom:1px solid #e3e0d8;">
28
28
  <p style="margin:0 0 10px; font-family:Georgia, serif; font-size:12px; letter-spacing:0.14em; text-transform:uppercase; color:#a06b2c;">Cover story</p>
29
29
  <h2 style="margin:0 0 12px; font-family:Georgia, 'Times New Roman', serif; font-size:28px; line-height:1.25; color:#1c1b18;">Why the best ideas arrive before nine</h2>
30
- <p style="margin:0 0 18px; font-family:Georgia, serif; font-size:15px; line-height:1.65; color:#3d3a33;">Hello {{ first_name }} &mdash; this week we sat down with three writers who guard their mornings like a vault. What they cut, what they kept, and the one ritual all three share.</p>
30
+ <p style="margin:0 0 18px; font-family:Georgia, serif; font-size:15px; line-height:1.65; color:#3d3a33;">Hello {{ first_name }}. This week we sat down with three writers who guard their mornings like a vault. What they cut, what they kept, and the one ritual all three share.</p>
31
31
  <a href="https://example.com/issue-214" style="display:inline-block; background-color:#1c1b18; color:#f5f2ea; font-family:Georgia, serif; font-size:14px; font-weight:bold; text-decoration:none; padding:12px 26px; ">Read the full story</a>
32
32
  </td>
33
33
  </tr>
34
34
  <tr>
35
35
  <td style="padding:26px 32px 4px;">
36
36
  <h3 style="margin:0 0 8px; font-family:Georgia, serif; font-size:17px; color:#1c1b18;">Also worth your time</h3>
37
- <p style="margin:0 0 10px; font-family:Georgia, serif; font-size:14px; line-height:1.6; color:#3d3a33;"><a href="https://example.com/reads/1" style="color:#a06b2c;">The quiet return of the personal website</a> &mdash; a ten-minute read on owning your corner of the internet.</p>
38
- <p style="margin:0 0 10px; font-family:Georgia, serif; font-size:14px; line-height:1.6; color:#3d3a33;"><a href="https://example.com/reads/2" style="color:#a06b2c;">Notes on a smaller inbox</a> &mdash; what happened when we unsubscribed from everything for a month.</p>
39
- <p style="margin:0 0 10px; font-family:Georgia, serif; font-size:14px; line-height:1.6; color:#3d3a33;"><a href="https://example.com/reads/3" style="color:#a06b2c;">Interview: the archivist of lost fonts</a> &mdash; rescuing typefaces from forgotten floppy disks.</p>
37
+ <p style="margin:0 0 10px; font-family:Georgia, serif; font-size:14px; line-height:1.6; color:#3d3a33;"><a href="https://example.com/reads/1" style="color:#a06b2c;">The quiet return of the personal website</a>: a ten-minute read on owning your corner of the internet.</p>
38
+ <p style="margin:0 0 10px; font-family:Georgia, serif; font-size:14px; line-height:1.6; color:#3d3a33;"><a href="https://example.com/reads/2" style="color:#a06b2c;">Notes on a smaller inbox</a>: what happened when we unsubscribed from everything for a month.</p>
39
+ <p style="margin:0 0 10px; font-family:Georgia, serif; font-size:14px; line-height:1.6; color:#3d3a33;"><a href="https://example.com/reads/3" style="color:#a06b2c;">Interview: the archivist of lost fonts</a>: rescuing typefaces from forgotten floppy disks.</p>
40
40
  </td>
41
41
  </tr>
42
42
  <tr>
@@ -33,9 +33,9 @@
33
33
  <tr>
34
34
  <td style="padding:26px 36px 4px;">
35
35
  <h2 style="margin:0 0 14px; font-family:Arial, Helvetica, sans-serif; font-size:17px; color:#10243c;">Get set up in five minutes</h2>
36
- <p style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:1.6; color:#3f5063;"><strong style="color:#0065b3;">1.</strong> &nbsp;Create your first project &mdash; a name is enough, everything else can change later.</p>
37
- <p style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:1.6; color:#3f5063;"><strong style="color:#0065b3;">2.</strong> &nbsp;Invite your team &mdash; anyone with a {{ company }} email joins without approval.</p>
38
- <p style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:1.6; color:#3f5063;"><strong style="color:#0065b3;">3.</strong> &nbsp;Connect your tools &mdash; two clicks each for calendar, storage and chat.</p>
36
+ <p style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:1.6; color:#3f5063;"><strong style="color:#0065b3;">1.</strong> &nbsp;Create your first project; a name is enough, everything else can change later.</p>
37
+ <p style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:1.6; color:#3f5063;"><strong style="color:#0065b3;">2.</strong> &nbsp;Invite your team: anyone with a {{ company }} email joins without approval.</p>
38
+ <p style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:1.6; color:#3f5063;"><strong style="color:#0065b3;">3.</strong> &nbsp;Connect your tools: two clicks each for calendar, storage and chat.</p>
39
39
  </td>
40
40
  </tr>
41
41
  <tr>
@@ -50,7 +50,7 @@
50
50
  </tr>
51
51
  <tr>
52
52
  <td style="padding:12px 36px 32px;">
53
- <p style="margin:0 0 8px; font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:1.6; color:#3f5063;">Stuck on anything? Reply to this email &mdash; a real person reads every message, usually within the hour.</p>
53
+ <p style="margin:0 0 8px; font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:1.6; color:#3f5063;">Stuck on anything? Reply to this email; a real person reads every message, usually within the hour.</p>
54
54
  <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:11.5px; line-height:1.6; color:#8194a7;"><a href="{{ unsubscribe_url }}" style="color:#8194a7;">Unsubscribe</a> &middot; <a href="https://example.com/preferences" style="color:#8194a7;">Notification settings</a></p>
55
55
  </td>
56
56
  </tr>
@@ -28,11 +28,11 @@
28
28
  <tr>
29
29
  <td style="padding:16px 18px; border-bottom:1px solid #e1e8ef;">
30
30
  <p style="margin:0 0 4px; font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; letter-spacing:0.12em; text-transform:uppercase; color:#8194a7;">Carrier</p>
31
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#10243c;">DHL Express</p>
31
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#10243c;">Express Courier</p>
32
32
  </td>
33
33
  <td style="padding:16px 18px; border-bottom:1px solid #e1e8ef;">
34
34
  <p style="margin:0 0 4px; font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; letter-spacing:0.12em; text-transform:uppercase; color:#8194a7;">Tracking number</p>
35
- <p style="margin:0; font-family:'Courier New', Courier, monospace; font-size:14px; color:#10243c;">JD014669321DE</p>
35
+ <p style="margin:0; font-family:'Courier New', Courier, monospace; font-size:14px; color:#10243c;">EC4821397205XX</p>
36
36
  </td>
37
37
  </tr>
38
38
  <tr>
@@ -18,7 +18,7 @@
18
18
  <td align="center" style="padding:34px 36px 8px;">
19
19
  <p style="margin:0 0 12px; font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; letter-spacing:0.2em; text-transform:uppercase; color:#2f9e44;">Security update</p>
20
20
  <h1 style="margin:0 0 12px; font-family:Arial, Helvetica, sans-serif; font-size:26px; line-height:1.25; color:#10243c;">Password updated</h1>
21
- <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:15px; line-height:1.65; color:#3f5063;">Hi {{ first_name }}, your {{ company }} password was just changed. Everything went through &mdash; no action is needed.</p>
21
+ <p style="margin:0; font-family:Arial, Helvetica, sans-serif; font-size:15px; line-height:1.65; color:#3f5063;">Hi {{ first_name }}, your {{ company }} password was just changed. Everything went through; no action is needed.</p>
22
22
  </td>
23
23
  </tr>
24
24
  <tr>
@@ -37,7 +37,7 @@
37
37
  </tr>
38
38
  <tr>
39
39
  <td style="padding:24px 36px 6px;">
40
- <p style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:1.65; color:#3f5063;"><strong style="color:#10243c;">Wasn&rsquo;t you?</strong> Reset your password right away and reply to this email &mdash; our team will lock the account while we look into it.</p>
40
+ <p style="margin:0 0 10px; font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:1.65; color:#3f5063;"><strong style="color:#10243c;">Wasn&rsquo;t you?</strong> Reset your password right away and reply to this email; our team will lock the account while we look into it.</p>
41
41
  </td>
42
42
  </tr>
43
43
  <tr>
@@ -40,7 +40,7 @@
40
40
  <td style="padding:26px 36px 8px;">
41
41
  <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background-color:#151a24; ">
42
42
  <tr>
43
- <td style="padding:16px 20px; font-family:Arial, Helvetica, sans-serif; font-size:12.5px; line-height:1.65; color:#7d8aa5;">Never share this code &mdash; not with support, not with anyone. {{ company }} will never ask for it by phone or email. If you didn&rsquo;t try to sign in, change your password right away.</td>
43
+ <td style="padding:16px 20px; font-family:Arial, Helvetica, sans-serif; font-size:12.5px; line-height:1.65; color:#7d8aa5;">Never share this code, not with support, not with anyone. {{ company }} will never ask for it by phone or email. If you didn&rsquo;t try to sign in, change your password right away.</td>
44
44
  </tr>
45
45
  </table>
46
46
  </td>