From e28fb6d8dfd7dbf04785511b8e6928601c3a6353 Mon Sep 17 00:00:00 2001 From: Emil Widlund Date: Fri, 22 Nov 2024 17:29:21 +0100 Subject: [PATCH] server: adjust layout in emails --- server/polar/email/email_templates/base.html | 83 +++++++++++++------ .../order/email_templates/confirmation.html | 26 ++++-- server/polar/order/service.py | 6 +- .../email_templates/cancellation.html | 2 +- .../email_templates/confirmation.html | 26 ++++-- server/polar/subscription/service.py | 1 + 6 files changed, 102 insertions(+), 42 deletions(-) diff --git a/server/polar/email/email_templates/base.html b/server/polar/email/email_templates/base.html index b0a82dc1ae..268f5e3369 100644 --- a/server/polar/email/email_templates/base.html +++ b/server/polar/email/email_templates/base.html @@ -116,16 +116,16 @@ /* Buttons ------------------------------ */ .button { - background-color: #4872c8; - border-top: 10px solid #4872c8; - border-right: 18px solid #4872c8; - border-bottom: 10px solid #4872c8; - border-left: 18px solid #4872c8; + background-color: #0062FF; + border-top: 10px solid #0062FF; + border-right: 18px solid #0062FF; + border-bottom: 10px solid #0062FF; + border-left: 18px solid #0062FF; display: inline-block; color: #FFF !important; font-weight: bold; text-decoration: none; - border-radius: 8px; + border-radius: 99px; -webkit-text-size-adjust: none; box-sizing: border-box; } @@ -326,9 +326,21 @@ /* Masthead ----------------------- */ .email-masthead { - padding: 25px 0; - text-align: center; - height: 30px; + width: 100%; + margin: 0; + padding: 0; + -premailer-width: 100%; + -premailer-cellpadding: 0; + -premailer-cellspacing: 0; + } + + .email-masthead_inner { + width: 570px; + margin: 0 auto; + padding: 0; + -premailer-width: 570px; + -premailer-cellpadding: 0; + -premailer-cellspacing: 0; } .email-masthead a { @@ -359,11 +371,11 @@ .email-masthead_feat { display: inline-block; - height: 30px; font-size: 18px; text-decoration: none; text-shadow: none; vertical-align: super; + padding-left: 45px; } .email-masthead_feat_plus { @@ -418,13 +430,27 @@ .body-sub { margin-top: 25px; padding-top: 25px; - border-top: 1px solid #EAEAEC; } .content-cell { padding: 45px; } + .order-summary { + padding-top: 25px; + padding-bottom: 25px; + } + + .product-image { + padding-top: 25px; + padding-bottom: 25px; + } + + .order-summary .product-name { + font-weight: bold; + font-size: 18px; + } + /*Media Queries ------------------------------ */ @media only screen and (max-width: 600px) { @@ -501,19 +527,28 @@ - diff --git a/server/polar/order/email_templates/confirmation.html b/server/polar/order/email_templates/confirmation.html index 6e66a8e7fd..01ff9ec8d2 100644 --- a/server/polar/order/email_templates/confirmation.html +++ b/server/polar/order/email_templates/confirmation.html @@ -2,13 +2,23 @@ {% block body %}

Thank you for your order!

-

Your order of {{ product.name }} is now processed. As part of your purchase, you have access to the following benefits:

- -

You can access them right away from Polar by clicking on the button below:

+ +{% if product.medias is defined and product.medias[0] is defined and product.medias[0].public_url is defined %} +Product Image +{% endif %} + + + + + + + {% for benefit in product.benefits %} + + + + {% endfor %} + + @@ -18,7 +28,7 @@

Thank you for your order!

- Access my benefits + Access Purchase
diff --git a/server/polar/order/service.py b/server/polar/order/service.py index 22af0c2172..4e1ba4e2a4 100644 --- a/server/polar/order/service.py +++ b/server/polar/order/service.py @@ -65,6 +65,8 @@ from polar.webhook.webhooks import WebhookTypeObject from polar.worker import enqueue_job +from ..product.service.product import product as product_service + log: Logger = structlog.get_logger() @@ -489,7 +491,8 @@ async def send_confirmation_email( email_renderer = get_email_renderer({"order": "polar.order"}) email_sender = get_email_sender() - product = order.product + product = await product_service.get_loaded(session, order.product_id) + user = order.user subject, body = email_renderer.render_from_template( "Your {{ product.name }} order confirmation", @@ -497,6 +500,7 @@ async def send_confirmation_email( { "featured_organization": organization, "product": product, + "order": order, "url": f"{settings.FRONTEND_BASE_URL}/purchases/products/{order.id}", "current_year": datetime.now().year, }, diff --git a/server/polar/subscription/email_templates/cancellation.html b/server/polar/subscription/email_templates/cancellation.html index d7f9eb76a1..f993d25625 100644 --- a/server/polar/subscription/email_templates/cancellation.html +++ b/server/polar/subscription/email_templates/cancellation.html @@ -18,7 +18,7 @@

Your subscription has been canceled

- Manage my subscription + Manage my subscription
diff --git a/server/polar/subscription/email_templates/confirmation.html b/server/polar/subscription/email_templates/confirmation.html index e8bff4d644..99b4afe2a8 100644 --- a/server/polar/subscription/email_templates/confirmation.html +++ b/server/polar/subscription/email_templates/confirmation.html @@ -2,13 +2,23 @@ {% block body %}

Thank you for your subscription!

-

Your subscription to {{ product.name }} is now active. As part of it, you have access to the following benefits:

- -

You can access them right away from Polar by clicking on the button below:

+ +{% if product.medias is defined and product.medias[0] is defined and product.medias[0].public_url is defined %} +Product Image +{% endif %} + + + + + + + {% for benefit in product.benefits %} + + + + {% endfor %} + + @@ -18,7 +28,7 @@

Thank you for your subscription!

- Access my benefits + Access Subscription
diff --git a/server/polar/subscription/service.py b/server/polar/subscription/service.py index 36efa89114..40ea323067 100644 --- a/server/polar/subscription/service.py +++ b/server/polar/subscription/service.py @@ -722,6 +722,7 @@ async def send_confirmation_email( { "featured_organization": featured_organization, "product": product, + "subscription": subscription, "url": ( f"{settings.FRONTEND_BASE_URL}" f"/purchases/subscriptions/{subscription.id}"