Skip to content

Commit

Permalink
feat: Add billing email templates (#835)
Browse files Browse the repository at this point in the history
  • Loading branch information
spalmurray-codecov authored Oct 30, 2024
1 parent d9d195c commit f153619
Show file tree
Hide file tree
Showing 5 changed files with 375 additions and 0 deletions.
23 changes: 23 additions & 0 deletions templates/auto-refund.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
{% extends "base.html" %} {% block main %}
<h2>Sorry to see you go, {{ name }}</h2>
<div class="success-banner">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9 12L11 14L15 10M21 12C21 13.1819 20.7672 14.3522 20.3149 15.4442C19.8626 16.5361 19.1997 17.5282 18.364 18.364C17.5282 19.1997 16.5361 19.8626 15.4442 20.3149C14.3522 20.7672 13.1819 21 12 21C10.8181 21 9.64778 20.7672 8.55585 20.3149C7.46392 19.8626 6.47177 19.1997 5.63604 18.364C4.80031 17.5282 4.13738 16.5361 3.68508 15.4442C3.23279 14.3522 3 13.1819 3 12C3 9.61305 3.94821 7.32387 5.63604 5.63604C7.32387 3.94821 9.61305 3 12 3C14.3869 3 16.6761 3.94821 18.364 5.63604C20.0518 7.32387 21 9.61305 21 12Z" stroke="#429F49" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>

<p>
A ${{ amount }} auto refund has been processed and will be credited to your {% if card_type %}{{ card_type | capitalize }}{% else %}card{% endif %}{% if last_four %} ending in {{ last_four }}{% endif %} shortly.
</p>
</div>
<p>
Your subscription has been successfully canceled. Your account has been returned to our one-seat developer plan. We appreciate your business and welcome you back anytime.
</p>
<a href="{{ cta_link }}" class="primary-cta">View invoice</a>
<p>
If you have any questions or need help, please contact us at
<a href="mailto:[email protected]">[email protected]</a>
</p>
{% endblock %} {% block aside %}
<p>Total: USD <span class="green-money-text">${{ amount }}</span></p>
<p>{{ date }}</p>
{% endblock %}
5 changes: 5 additions & 0 deletions templates/auto-refund.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
Your subscription has been successfully canceled. Your account has been returned to our one-seat developer plan. We appreciate your business and welcome you back anytime.

A ${{ amount }} auto refund has been processed and will be credited to your {% if card_type %}{{ card_type | capitalize }}{% else %}card{% endif %}{% if last_four %} ending in {{ last_four }}{% endif %} shortly.

If you have any questions or need help, please contact us at [email protected]
291 changes: 291 additions & 0 deletions templates/base.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,291 @@
<!doctype html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Poppins:wght@100;300;400;500;600;700;800;900&family=Source+Code+Pro:wght@200;300;400;500;600;700;800;900&display=swap"
/>
<style>
body {
height: 100vh;
font-family: "Poppins";
margin: 0;
padding: 0 5%;
}

h1 {
font-size: 60px;
font-weight: 700;
margin: 0;
}

h2 {
font-size: 50px;
font-weight: 300;
line-height: 55px;
margin: 0;
}

h3 {
font-size: 18px;
font-weight: 600;
line-height: 27px;
margin: 0;
}

header {
display: flex;
gap: 20px;
align-items: center;
padding: 20px 0;
max-width: 900px;
margin: auto auto;
}

@media only screen and (max-width: 400px) {
header h1 {
font-size: 48px;
}
}

div.layout {
display: flex;
flex-direction: row;
max-width: 900px;
margin: auto auto;
}

@media only screen and (max-width: 767px) {
div.layout {
flex-direction: column-reverse;
}
}

main {
flex-basis: 75%;
padding: 20px 0;
display: flex;
flex-direction: column;
gap: 30px;
}

aside {
flex-basis: 25%;
padding: 20px 0;
text-align: end;
}

footer {
border-top: solid 1px rgba(216, 220, 226, 1);
padding: 20px 0 0 0;
margin: 32px 64px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 25px;
}

@media only screen and (max-width: 767px) {
footer {
flex-direction: column;
align-items: flex-start;
margin: 32px 0;
}
}

footer h1 {
font-size: 30px;
font-weight: 700;
line-height: 45px;
color: rgba(57, 71, 84, 1);
}

p {
font-weight: 400;
font-size: 18px;
line-height: 27px;
margin: 0;
}

a {
color: rgba(0, 113, 194, 1);
font-weight: 500;
text-decoration: none;
}

a:visited {
color: rgba(0, 113, 194, 1);
font-weight: 500;
text-decoration: none;
}

ul {
padding-left: 25px;
}

svg {
flex: none;
}

.red-money-text {
color: rgba(245, 32, 32, 1);
font-weight: 700;
}

.green-money-text {
color: rgba(33, 181, 119, 1);
font-weight: 700;
}

div.error-banner {
background-color: rgba(255, 247, 247, 1);
padding: 15px 20px;
width: calc(100% - 43) px;
display: flex;
align-items: flex-start;
gap: 8px;
border-left: solid 3px rgba(245, 32, 32, 1);
}

.error-banner p {
font-size: 14px;
line-height: 21px;
font-weight: 400;
color: rgba(14, 27, 41, 1);
}

div.success-banner {
background-color: rgba(242, 252, 243, 1);
padding: 15px 20px;
width: calc(100% - 43) px;
display: flex;
align-items: flex-start;
gap: 8px;
border-left: solid 3px rgba(66, 159, 73, 1);
}

.success-banner p {
font-size: 14px;
line-height: 21px;
font-weight: 400;
color: rgba(14, 27, 41, 1);
}

a.primary-cta {
background-color: rgba(0, 113, 194, 1);
color: white;
font-size: 16px;
font-weight: 600;
line-height: 24px;
text-align: center;
width: calc(100% - 50) px;
padding: 25px;
border-radius: 8px;
border: none;
cursor: pointer;
}

a.primary-cta:hover {
background-color: rgba(0, 84, 145, 1);
}

div.card {
background-color: rgba(247, 248, 251, 1);
border-radius: 8px;
padding: 35px;
display: flex;
gap: 8px;
flex-direction: column;
}
</style>
</head>
<body>
<header>
<svg
width="80"
height="80"
viewBox="0 0 80 80"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<rect width="80" height="80" fill="#F01F7A" />
<path
d="M40.0713 9.40002C22.3964 9.40002 8 23.6539 8 41.0437V41.1862L13.4165 44.3221H13.559C16.98 42.0415 21.1136 41.1862 25.2472 41.8989C28.098 42.4691 30.8062 43.7519 32.9443 45.7475L33.9421 46.6027L34.5123 45.4624C35.0824 44.3221 35.6526 43.3243 36.2227 42.3265C36.5078 41.8989 36.7929 41.6138 37.078 41.1862L37.6481 40.4735L36.9354 39.9034C33.9421 37.4802 30.3786 35.7697 26.5301 35.057C22.8241 34.3443 19.118 34.4869 15.6971 35.6272C18.2628 24.3666 28.2405 16.3844 40.0713 16.3844C46.7706 16.3844 53.0423 18.9501 57.7461 23.6539C61.167 26.9323 63.4477 31.066 64.4454 35.6272C62.3074 34.9145 60.0267 34.6294 57.7461 34.6294H57.3185C56.4633 34.6294 55.608 34.772 54.6102 34.772H54.4677C54.1826 34.772 53.755 34.9145 53.4699 34.9145C52.8998 35.057 52.4722 35.057 51.902 35.1996L51.4744 35.3421C51.0468 35.4847 50.6192 35.6272 50.1915 35.7697H50.049C49.0512 36.0548 48.196 36.4824 47.1982 36.91C46.7706 37.0526 46.343 37.3377 45.9154 37.6227H45.7728C43.6347 38.9056 41.6392 40.4735 40.0713 42.4691L39.9287 42.7541C39.5011 43.3243 39.216 43.7519 38.931 44.037C38.6459 44.3221 38.5033 44.7497 38.2183 45.1773L38.0757 45.4624C37.7906 45.89 37.6481 46.3176 37.5056 46.6027V46.7452C37.0779 47.6005 36.6503 48.5982 36.3653 49.596V49.7386C35.6526 52.0192 35.2249 54.4423 35.2249 57.008V57.2931C35.2249 57.5782 35.2249 58.0058 35.2249 58.2909C35.2249 58.4334 35.2249 58.576 35.2249 58.7185C35.2249 58.861 35.2249 59.1461 35.2249 59.2887V59.4312V59.7163C35.2249 60.0014 35.3675 60.429 35.3675 60.7141C36.0802 64.135 37.6481 67.4134 40.0713 70.4067L40.2138 70.5492L40.3563 70.4067C41.3541 69.2664 43.6347 65.7029 43.9198 63.5648C42.7795 61.4268 42.2094 59.0036 42.2094 56.723C42.2094 48.7408 48.4811 42.0415 56.6058 41.6138H57.1759C60.4543 41.4713 63.7327 42.4691 66.441 44.3221H66.5835L72 41.1862V41.0437C72 32.6339 68.7216 24.6517 62.5924 18.6651C56.6058 12.6784 48.6236 9.40002 40.0713 9.40002Z"
fill="white"
/>
</svg>
<h1>Codecov</h1>
</header>
{% block layout %}
<div class="layout">
<main>{% block main %}{% endblock %}</main>
<aside>{% block aside %}{% endblock %}</aside>
</div>
{% endblock %}
<footer>
<div>
<h1>Codecov</h1>
<p style="color: rgba(57, 71, 84, 1)">
Functional Software, dba Sentry
</p>
<p style="color: rgba(153, 159, 167, 1)">
45 Fremont St. 8th Floor, San Francisco, CA 94105
</p>
</div>
<div style="display: flex; gap: 50px">
<a href="https://sentry.io">
<svg
width="40"
height="40"
viewBox="0 0 40 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<rect width="40" height="40" fill="#999FA7" />
<path
d="M22.4281 9.74794C22.2153 9.37597 21.9094 9.06711 21.541 8.85237C21.1727 8.63764 20.7549 8.5246 20.3296 8.5246C19.9044 8.5246 19.4866 8.63764 19.1183 8.85237C18.7499 9.06711 18.444 9.37597 18.2312 9.74794L14.7765 15.7934L15.6578 16.3044C18.0803 17.7199 20.1181 19.7194 21.5892 22.1244C23.0603 24.5293 23.919 27.265 24.0885 30.0869H21.6631C21.4952 27.6929 20.7485 25.377 19.4886 23.3423C18.2286 21.3076 16.4938 19.6162 14.4363 18.4163L13.555 17.907L10.3364 23.5607L11.2177 24.0718C12.2858 24.7056 13.1973 25.5765 13.8831 26.6186C14.569 27.6607 15.0113 28.8467 15.1766 30.0869H9.63663C9.56575 30.0881 9.49585 30.0702 9.43405 30.0352C9.37226 30.0001 9.3208 29.949 9.28494 29.8873C9.24908 29.8255 9.2301 29.7552 9.22996 29.6836C9.22981 29.612 9.24849 29.5416 9.2841 29.4797L10.8282 26.7784C10.3066 26.3342 9.70932 25.9896 9.06553 25.7616L7.53733 28.4576C7.32482 28.8298 7.21301 29.252 7.21313 29.6817C7.21326 30.1114 7.32532 30.5335 7.53806 30.9055C7.7508 31.2776 8.05672 31.5866 8.42508 31.8014C8.79345 32.0162 9.21129 32.1294 9.63663 32.1294H17.26V31.109C17.2605 29.4956 16.8814 27.9052 16.1538 26.469C15.4263 25.0327 14.3712 23.7918 13.0755 22.8484L14.2882 20.7259C15.9487 21.887 17.306 23.4373 18.2441 25.2439C19.1822 27.0506 19.6731 29.06 19.6748 31.1001V32.1223H26.1349V31.1019C26.132 27.9169 25.3433 24.7829 23.8402 21.9832C22.3372 19.1835 20.1671 16.8064 17.5262 15.0668L19.978 10.7701C20.0131 10.7087 20.0636 10.6577 20.1244 10.6223C20.1852 10.5869 20.2542 10.5682 20.3244 10.5682C20.3945 10.5682 20.4635 10.5869 20.5243 10.6223C20.5851 10.6577 20.6356 10.7087 20.6707 10.7701L31.3629 29.4797C31.3985 29.5416 31.4172 29.612 31.417 29.6836C31.4169 29.7552 31.3979 29.8255 31.362 29.8873C31.3262 29.949 31.2747 30.0001 31.2129 30.0352C31.1511 30.0702 31.0812 30.0881 31.0103 30.0869H28.5092C28.5409 30.7689 28.5444 31.4509 28.5092 32.1312H31.0191C31.4445 32.1311 31.8623 32.018 32.2307 31.8032C32.5991 31.5884 32.905 31.2794 33.1177 30.9073C33.3305 30.5352 33.4425 30.1131 33.4426 29.6834C33.4428 29.2538 33.331 28.8316 33.1184 28.4594L22.4281 9.74794Z"
fill="white"
/>
</svg>
</a>
<a href="https://x.com/codecov"
><svg
width="41"
height="40"
viewBox="0 0 41 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M8.20749 8.16591C8.28806 8.28087 10.1539 10.9967 12.3538 14.201C14.5537 17.4053 16.5884 20.3686 16.8754 20.7861C17.1624 21.2037 17.3972 21.5537 17.3972 21.5639C17.3972 21.5742 17.2903 21.7059 17.1597 21.8567C17.0291 22.0075 16.6612 22.4343 16.3423 22.8052C16.0233 23.176 15.4855 23.8011 15.1473 24.1942C14.809 24.5873 14.214 25.2792 13.8249 25.7316C13.4358 26.1841 12.7362 26.9976 12.2701 27.5393C10.8287 29.215 10.6207 29.457 9.52345 30.735C8.93755 31.4174 8.37572 32.0699 8.27495 32.1849C8.17418 32.3 8.09173 32.4062 8.09173 32.4209C8.09173 32.4382 8.45974 32.4478 9.12857 32.4478H10.1654L11.3053 31.1194C11.9322 30.3887 12.5507 29.6696 12.6796 29.5213C12.9584 29.2005 15.0846 26.7265 15.2633 26.5149C15.3318 26.4339 15.4312 26.3186 15.4842 26.2587C15.5373 26.1988 15.9556 25.7128 16.4138 25.1787C16.872 24.6447 17.2595 24.1946 17.2748 24.1786C17.2902 24.1627 17.5328 23.8805 17.8139 23.5515C18.095 23.2226 18.3337 22.9535 18.3443 22.9535C18.3549 22.9535 19.7989 25.0442 21.5532 27.5995C23.3075 30.1548 24.7741 32.2907 24.8124 32.346L24.882 32.4466L28.4385 32.4472C31.3632 32.4477 31.9926 32.4415 31.9814 32.4123C31.9695 32.3814 30.2656 29.896 25.8941 23.5334C22.7472 18.9531 22.3288 18.3376 22.3408 18.3063C22.3524 18.276 22.7811 17.7746 25.5991 14.4954C26.0825 13.933 26.7488 13.1571 27.0798 12.7714C27.4109 12.3857 27.7451 11.9973 27.8226 11.9083C27.9 11.8193 28.3074 11.346 28.7278 10.8564C29.1481 10.3669 29.8628 9.53503 30.3159 9.00791C30.7689 8.48079 31.1563 8.02868 31.1766 8.00319C31.2115 7.95958 31.1522 7.95688 30.1605 7.95688H29.1073L28.6389 8.50307C28.0155 9.22997 26.8886 10.5408 26.5686 10.9112C26.4272 11.0749 26.2509 11.2806 26.1767 11.3683C26.1025 11.456 25.9562 11.6255 25.8515 11.745C25.7468 11.8645 25.2192 12.4781 24.6791 13.1086C24.139 13.7391 23.6897 14.261 23.6807 14.2684C23.6716 14.2758 23.5559 14.4101 23.4235 14.5667C23.1919 14.8408 22.9562 15.1151 21.8753 16.3686C21.4009 16.9188 21.3765 16.9425 21.3365 16.8919C21.3135 16.8628 19.9231 14.8406 18.2468 12.3982L15.1989 7.95744L11.63 7.95715L8.06104 7.95688L8.20749 8.16591ZM10.993 9.6222C11.0198 9.66312 11.6866 10.619 12.4748 11.7465C13.9697 13.8848 19.844 22.2923 23.6219 27.7006C24.8291 29.4289 25.8316 30.8582 25.8496 30.8768C25.8753 30.9035 26.2268 30.9093 27.492 30.9038L29.1017 30.8969L24.8895 24.8685C22.5727 21.553 19.2184 16.7526 17.4354 14.201L14.1937 9.56173L12.569 9.55477L10.9443 9.54782L10.993 9.6222Z"
fill="white"
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M0 20V40L20.0067 39.9933L40.0135 39.9865L40.0202 19.9932L40.027 0H20.0135H0V20ZM0.0134052 20.0135C0.0134052 31.0135 0.0164801 35.5135 0.0202293 30.0135C0.0239784 24.5135 0.0239784 15.5135 0.0202293 10.0135C0.0164801 4.51347 0.0134052 9.01348 0.0134052 20.0135ZM8.20747 8.16587C8.28803 8.28083 10.1539 10.9966 12.3538 14.2009C14.5537 17.4052 16.5884 20.3686 16.8754 20.7861C17.1624 21.2036 17.3972 21.5536 17.3972 21.5639C17.3972 21.5741 17.2903 21.7059 17.1597 21.8567C17.0291 22.0074 16.6612 22.4342 16.3422 22.8051C16.0232 23.176 15.4855 23.8011 15.1472 24.1942C14.809 24.5873 14.2139 25.2791 13.8249 25.7316C13.4358 26.1841 12.7362 26.9975 12.2701 27.5393C10.8287 29.215 10.6207 29.457 9.52342 30.735C8.93752 31.4174 8.37569 32.0698 8.27492 32.1849C8.17415 32.3 8.0917 32.4062 8.0917 32.4209C8.0917 32.4382 8.45971 32.4477 9.12854 32.4477H10.1654L11.3052 31.1193C11.9322 30.3887 12.5506 29.6696 12.6796 29.5212C12.9584 29.2005 15.0846 26.7265 15.2633 26.5149C15.3317 26.4339 15.4311 26.3186 15.4842 26.2586C15.5373 26.1987 15.9556 25.7127 16.4138 25.1787C16.872 24.6446 17.2595 24.1946 17.2748 24.1786C17.2902 24.1626 17.5327 23.8804 17.8139 23.5515C18.095 23.2226 18.3336 22.9535 18.3442 22.9535C18.3549 22.9535 19.7989 25.0442 21.5532 27.5994C23.3074 30.1547 24.7741 32.2907 24.8124 32.346L24.882 32.4466L28.4385 32.4472C31.3632 32.4476 31.9926 32.4414 31.9814 32.4123C31.9695 32.3813 30.2656 29.896 25.8941 23.5334C22.7472 18.953 22.3287 18.3375 22.3407 18.3063C22.3524 18.2759 22.781 17.7746 25.599 14.4954C26.0824 13.9329 26.7488 13.1571 27.0798 12.7714C27.4108 12.3857 27.7451 11.9973 27.8226 11.9083C27.9 11.8193 28.3074 11.3459 28.7277 10.8564C29.1481 10.3668 29.8627 9.53499 30.3158 9.00787C30.7689 8.48075 31.1562 8.02864 31.1766 8.00315C31.2114 7.95954 31.1522 7.95684 30.1604 7.95684H29.1073L28.6389 8.50303C28.0155 9.22993 26.8886 10.5408 26.5686 10.9112C26.4272 11.0748 26.2508 11.2805 26.1767 11.3682C26.1025 11.456 25.9561 11.6255 25.8514 11.745C25.7468 11.8645 25.2192 12.4781 24.6791 13.1086C24.139 13.739 23.6897 14.2609 23.6806 14.2684C23.6716 14.2758 23.5559 14.41 23.4235 14.5667C23.1919 14.8407 22.9562 15.1151 21.8753 16.3686C21.4008 16.9188 21.3765 16.9424 21.3365 16.8919C21.3135 16.8627 19.9231 14.8405 18.2468 12.3981L15.1989 7.95741L11.63 7.95711L8.061 7.95684L8.20747 8.16587ZM10.993 9.62216C11.0198 9.66308 11.6866 10.619 12.4748 11.7465C13.9697 13.8847 19.844 22.2923 23.6219 27.7006C24.8291 29.4288 25.8315 30.8581 25.8496 30.8768C25.8753 30.9035 26.2268 30.9092 27.492 30.9038L29.1017 30.8968L24.8894 24.8685C22.5726 21.5529 19.2183 16.7525 17.4354 14.2009L14.1937 9.56169L12.569 9.55473L10.9443 9.54778L10.993 9.62216Z"
fill="#999FA7"
/>
</svg>
</a>
<a href="https://www.linkedin.com/company/codecov">
<svg
width="41"
height="40"
viewBox="0 0 41 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M21.6556 17.9562C21.6706 17.9375 21.6844 17.9175 21.6944 17.8962V17.9562H21.6556ZM40.0269 0V40H0.0268555V0H40.0269ZM12.4331 15.3562H6.46811V33.2988H12.4331V15.3562ZM12.8231 9.80875C12.7856 8.04625 11.5294 6.70625 9.4881 6.70625C7.44936 6.70625 6.11561 8.04625 6.11561 9.80875C6.11561 11.5275 7.40936 12.9075 9.41061 12.9075H9.44936C11.5294 12.9075 12.8231 11.5275 12.8231 9.80875ZM33.9381 23.01C33.9381 17.5 30.9944 14.9363 27.0706 14.9363C23.9069 14.9363 22.4906 16.675 21.6944 17.8962V15.3562H15.7319C15.8081 17.0387 15.7319 33.2988 15.7319 33.2988H21.6944V23.2787C21.6944 22.7362 21.7331 22.21 21.8906 21.8237C22.3231 20.7563 23.3056 19.6413 24.9506 19.6413C27.1119 19.6413 27.9731 21.2837 27.9731 23.6987V33.2988H33.9369L33.9381 23.01Z"
fill="#999FA7"
/>
</svg>
</a>
</div>
</footer>
</body>
</html>
Loading

0 comments on commit f153619

Please sign in to comment.