Last active
August 16, 2022 12:29
-
-
Save timezest/f9bdb7034277aa7af4b3759ee73bcb91 to your computer and use it in GitHub Desktop.
TimeZest Appointment Reminder
This file contains 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="viewport" content="width=device-width"> | |
| <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> | |
| <title>Simple Transactional Email</title> | |
| <style> | |
| @media only screen and (max-width: 620px) { | |
| table[class=body] h1 { | |
| font-size: 28px !important; | |
| margin-bottom: 10px !important; | |
| } | |
| table[class=body] p, | |
| table[class=body] ul, | |
| table[class=body] ol, | |
| table[class=body] td, | |
| table[class=body] span, | |
| table[class=body] a { | |
| font-size: 16px !important; | |
| } | |
| table[class=body] .wrapper, | |
| table[class=body] .article { | |
| padding: 10px !important; | |
| } | |
| table[class=body] .content { | |
| padding: 0 !important; | |
| } | |
| table[class=body] .container { | |
| padding: 0 !important; | |
| width: 100% !important; | |
| } | |
| table[class=body] .main { | |
| border-left-width: 0 !important; | |
| border-radius: 0 !important; | |
| border-right-width: 0 !important; | |
| } | |
| table[class=body] .btn table { | |
| width: 100% !important; | |
| } | |
| table[class=body] .btn a { | |
| width: 100% !important; | |
| } | |
| table[class=body] .img-responsive { | |
| height: auto !important; | |
| max-width: 100% !important; | |
| width: auto !important; | |
| } | |
| } | |
| @media all { | |
| .ExternalClass { | |
| width: 100%; | |
| } | |
| .ExternalClass, | |
| .ExternalClass p, | |
| .ExternalClass span, | |
| .ExternalClass font, | |
| .ExternalClass td, | |
| .ExternalClass div { | |
| line-height: 100%; | |
| } | |
| .apple-link a { | |
| color: inherit !important; | |
| font-family: inherit !important; | |
| font-size: inherit !important; | |
| font-weight: inherit !important; | |
| line-height: inherit !important; | |
| text-decoration: none !important; | |
| } | |
| .btn-primary table td:hover { | |
| background-color: #34495e !important; | |
| } | |
| .btn-primary a:hover { | |
| background-color: #34495e !important; | |
| border-color: #34495e !important; | |
| } | |
| } | |
| </style> | |
| </head> | |
| <body class="" style="background-color: #f6f6f6; font-family: sans-serif; -webkit-font-smoothing: antialiased; font-size: 14px; line-height: 1.4; margin: 0; padding: 0; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;"> | |
| <table border="0" cellpadding="0" cellspacing="0" class="body" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; width: 100%; background-color: #f6f6f6;"> | |
| <tr> | |
| <td style="font-family: sans-serif; font-size: 14px; vertical-align: top;"> </td> | |
| <td class="container" style="font-family: sans-serif; font-size: 14px; vertical-align: top; display: block; Margin: 0 auto; max-width: 580px; padding: 10px; width: 580px;"> | |
| <div class="content" style="box-sizing: border-box; display: block; Margin: 0 auto; max-width: 580px; padding: 10px;"> | |
| <!-- START CENTERED WHITE CONTAINER --> | |
| <table class="main" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; width: 100%; background: #ffffff; border-radius: 3px;"> | |
| <!-- START MAIN CONTENT AREA --> | |
| <tr> | |
| <td class="wrapper" style="font-family: sans-serif; font-size: 14px; vertical-align: top; box-sizing: border-box; padding: 20px;"> | |
| <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; width: 100%;"> | |
| <tr> | |
| <td style="font-family: sans-serif; font-size: 14px; vertical-align: top;"> | |
| <!-- START LOGO - Only included if one is configured in your account --> | |
| {% if account.logo_url != '' %} | |
| <p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0; Margin-bottom: 15px; text-align: center"> | |
| <img src="{{ account.logo_url }}" /> | |
| </p> | |
| {% endif %} | |
| <!-- END LOGO --> | |
| <!-- START SALUTATION - the initial greeting which opens the email --> | |
| <p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0; Margin-bottom: 15px;"> | |
| Hi {{ appointment.client_first_name }}, | |
| </p> | |
| <!-- END SALUTATION --> | |
| <!-- START ACTUAL CONTENT - a paragraph (or paragraphs) with the actual content of the email--> | |
| <p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0; Margin-bottom: 15px;"> | |
| This is a reminder for your {{ appointment.duration_as_adjective }} {{ appointment_type.name }} | |
| regarding the following ticket, which will start in approximately 10 minutes. | |
| </p> | |
| <p style="font-family: sans-serif; font-size: 14px; font-weight: bold; margin: 0; Margin-bottom: 15px;"> | |
| {{ ticket.number }} - {{ ticket.summary }} | |
| </p> | |
| <!-- END ACTUAL CONTENT --> | |
| <!-- START ONLINE MEETING BUTTON - when there is an online meeting for the appointment, include a "join" button --> | |
| {% if appointment.online_meeting_url %} | |
| <p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0; Margin-bottom: 15px;"> | |
| This {{ appointment_type.name }} will take place as a {{ appointment.online_meeting_type }} online meeting. | |
| </p> | |
| <table border="0" cellpadding="0" cellspacing="0" class="btn btn-primary" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; width: 100%; box-sizing: border-box;"> | |
| <tbody> | |
| <tr> | |
| <td align="left" style="font-family: sans-serif; font-size: 14px; vertical-align: top; padding-bottom: 15px;"> | |
| <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; width: auto;"> | |
| <tbody> | |
| <tr> | |
| <td style="font-family: sans-serif; font-size: 14px; vertical-align: top; background-color: #3498db; border-radius: 5px; text-align: center;"> | |
| <a href="{{ appointment.online_meeting_url }}" target="_blank" style="display: inline-block; color: #ffffff; background-color: #3498db; border: solid 1px #3498db; border-radius: 5px; box-sizing: border-box; cursor: pointer; text-decoration: none; font-size: 14px; font-weight: bold; margin: 0; padding: 12px 25px; text-transform: capitalize; border-color: #3498db;">Join {{ appointment.online_meeting_type }} Meeting</a> | |
| </td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| </td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| {% endif %} | |
| <!-- END ONLINE MEETING BUTTON --> | |
| <!-- START CLOSING - the polite way to finish an email to your clients --> | |
| <p> | |
| Kind regards, | |
| </p> | |
| <p> | |
| {{ account.name }} | |
| </p> | |
| <!-- END CLOSING --> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| <!-- END MAIN CONTENT AREA --> | |
| </table> | |
| <!-- START FOOTER --> | |
| <div class="footer" style="clear: both; Margin-top: 10px; text-align: center; width: 100%;"> | |
| <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; width: 100%;"> | |
| <tr> | |
| <td class="content-block" style="font-family: sans-serif; vertical-align: top; padding-bottom: 10px; padding-top: 10px; font-size: 12px; color: #999999; text-align: center;"> | |
| <span class="apple-link" style="color: #999999; font-size: 12px; text-align: center;">This email was sent by TimeZest Inc</span> | |
| </td> | |
| </tr> | |
| </table> | |
| </div> | |
| <!-- END FOOTER --> | |
| </div> | |
| <!-- END CENTERED WHITE CONTAINER --> | |
| </td> | |
| <td style="font-family: sans-serif; font-size: 14px; vertical-align: top;"> </td> | |
| </tr> | |
| </table> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment