From 441d98a3ae3bb22308321f3c4d2b924f1a5f13a8 Mon Sep 17 00:00:00 2001 From: Vani Ramesh <53530682+share-a-byte@users.noreply.github.com> Date: Mon, 18 Aug 2025 23:22:20 -0500 Subject: [PATCH 1/7] Update templates.ts --- src/templates/templates.ts | 314 +++++++++++++++++++++++++++++++++++++ 1 file changed, 314 insertions(+) diff --git a/src/templates/templates.ts b/src/templates/templates.ts index e1d0ea45..ec6db651 100644 --- a/src/templates/templates.ts +++ b/src/templates/templates.ts @@ -2,6 +2,320 @@ import Config from "../config"; const templates = { REGISTRATION_CONFIRMATION: ` + + + + + + + +
+
+

R|P 2025 Registration Confirmed

+
+ +
+

+ Thank you for registering for R|P 2025. We have received your information and will be sending next steps shortly. +

+ +
+ Need to update your registration? + Return to the registration form + to edit your responses! +
+ +

Your Registration Details

+ +
+
+ Name: + {{name}} +
+ +
+ School: + {{school}} +
+ +
+ Education Level: + {{educationLevel}} +
+ +
+ Graduation Year: + {{graduationYear}} +
+ +
+ Majors: + {{majors}} +
+ +
+ Minors: + {{minors}} +
+ +
+ Dietary Restrictions: + {{dietaryRestrictions}} +
+ +
+ Allergies: + {{allergies}} +
+ +
+ Gender: + {{gender}} +
+ +
+ Race/Ethnicity: + {{ethnicity}} +
+ + {{#personalLinks.length}} +
+ Personal Links: + +
+ {{#personalLinks}}{{/personalLinks}} +
+ +
+ {{/personalLinks.length}} + +
+ Interested in MechMania: + + {{#isInterestedMechMania}}Yes{{/isInterestedMechMania}} + {{^isInterestedMechMania}}No{{/isInterestedMechMania}} + +
+ +
+ Interested in PuzzleBang: + + {{#isInterestedPuzzleBang}}Yes{{/isInterestedPuzzleBang}} + {{^isInterestedPuzzleBang}}No{{/isInterestedPuzzleBang}} + +
+ +
+ Interest Tags: + {{tags}} +
+ +
+ Opportunities Interest: + {{opportunities}} +
+ + {{#hasResume}} +
+ Resume: + + View Your Resume + +
+ {{/hasResume}} +
+
+ +
+

R|P 2025 • Reflections | Projections

+
+
+ +`, + REGISTRATION_CONFIRMATION_OLD: `
From 122103a94c8f3578673b95bd9d29ff78fb5a7b5a Mon Sep 17 00:00:00 2001 From: Vani Ramesh <53530682+share-a-byte@users.noreply.github.com> Date: Mon, 18 Aug 2025 23:52:08 -0500 Subject: [PATCH 2/7] Update templates.ts --- src/templates/templates.ts | 621 ++++++++++++++++++++++--------------- 1 file changed, 365 insertions(+), 256 deletions(-) diff --git a/src/templates/templates.ts b/src/templates/templates.ts index ec6db651..d8dcb9ac 100644 --- a/src/templates/templates.ts +++ b/src/templates/templates.ts @@ -6,313 +6,422 @@ const templates = { - -
-
-

R|P 2025 Registration Confirmed

-
- -
-

- Thank you for registering for R|P 2025. We have received your information and will be sending next steps shortly. -

- -
- Need to update your registration? - Return to the registration form - to edit your responses! -
- -

Your Registration Details

- -
-
- Name: - {{name}} -
- -
- School: - {{school}} -
- -
- Education Level: - {{educationLevel}} -
- -
- Graduation Year: - {{graduationYear}} -
- -
- Majors: - {{majors}} -
- -
- Minors: - {{minors}} -
- -
- Dietary Restrictions: - {{dietaryRestrictions}} -
- -
- Allergies: - {{allergies}} -
- -
- Gender: - {{gender}} -
- -
- Race/Ethnicity: - {{ethnicity}} -
- - {{#personalLinks.length}} -
- Personal Links: - -
- {{#personalLinks}}{{/personalLinks}} -
- -
- {{/personalLinks.length}} - -
- Interested in MechMania: - - {{#isInterestedMechMania}}Yes{{/isInterestedMechMania}} - {{^isInterestedMechMania}}No{{/isInterestedMechMania}} - -
- -
- Interested in PuzzleBang: - - {{#isInterestedPuzzleBang}}Yes{{/isInterestedPuzzleBang}} - {{^isInterestedPuzzleBang}}No{{/isInterestedPuzzleBang}} - -
- -
- Interest Tags: - {{tags}} -
- -
- Opportunities Interest: - {{opportunities}} -
- - {{#hasResume}} -
- Resume: - - View Your Resume - -
- {{/hasResume}} -
-
- -
-

R|P 2025 • Reflections | Projections

-
-
+ + + + +
+ + + + + + + + + + + + + +
`, REGISTRATION_CONFIRMATION_OLD: ` From 3c80af16296d027bd90dac5e905ec7de917417ab Mon Sep 17 00:00:00 2001 From: Jacob Date: Thu, 21 Aug 2025 03:02:38 -0500 Subject: [PATCH 3/7] use image for email header --- src/config.ts | 1 + .../registration/registration-router.ts | 2 +- src/templates/templates.ts | 17 ++++++++--------- 3 files changed, 10 insertions(+), 10 deletions(-) diff --git a/src/config.ts b/src/config.ts index 06940998..0005afc3 100644 --- a/src/config.ts +++ b/src/config.ts @@ -86,6 +86,7 @@ export const Config = { QR_HASH_SECRET: getEnv("QR_HASH_SECRET"), WEB_REGISTER_ROUTE: `${WEB_BASE}/register`, WEB_RESUME_ROUTE: `${WEB_BASE}/resume`, + EMAIL_HEADER_HREF: `https://rp-web-site.pages.dev/email_header.png`, OUTGOING_EMAIL_ADDRESSES: z.enum(["no-reply@reflectionsprojections.org"]), LOG_DIR: env === EnvironmentEnum.PRODUCTION ? "/home/ubuntu/logs" : "./logs", diff --git a/src/services/registration/registration-router.ts b/src/services/registration/registration-router.ts index 6dbeefa8..c2d38f10 100644 --- a/src/services/registration/registration-router.ts +++ b/src/services/registration/registration-router.ts @@ -137,7 +137,7 @@ registrationRouter.post("/submit", RoleChecker([]), async (req, res) => { await sendHTMLEmail( payload.email, - "Reflections Projections 2025 Confirmation!", + "Reflections | Projections 2025 Confirmation!", Mustache.render(templates.REGISTRATION_CONFIRMATION, substitution) ); } diff --git a/src/templates/templates.ts b/src/templates/templates.ts index d8dcb9ac..53466cf4 100644 --- a/src/templates/templates.ts +++ b/src/templates/templates.ts @@ -6,13 +6,6 @@ const templates = { - - - - - - - -
- - - - - - - - - - - - - -
- + font-weight: bold !important; + color: #ffffff !important; + width: 140px !important; + padding: 12px 15px !important; + vertical-align: top !important; + font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif !important; + font-size: 14px !important; + background-color: #2a2a2a !important; + border-right: 2px solid #ff0000 !important; + } + + .info-value { + color: #e0e0e0 !important; + padding: 12px 15px !important; + font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif !important; + font-size: 14px !important; + background-color: #1a1a1a !important; + } + + .nested-link { + color: #ff0000 !important; + text-decoration: none !important; + border-bottom: 1px solid #ff0000 !important; + font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif !important; + } + + .resume-table { + margin-top: 10px !important; + } + + .resume-button { + background: linear-gradient( + 135deg, + #ff0000, + #cc0000 + ) !important; + color: #ffffff !important; + padding: 12px 24px !important; + text-decoration: none !important; + display: inline-block !important; + font-weight: bold !important; + font-size: 14px !important; + font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif !important; + border: 2px solid #ff0000 !important; + text-transform: uppercase !important; + letter-spacing: 1px !important; + } + + .footer-table { + width: 100% !important; + border-collapse: collapse !important; + } + + .footer-area { + background-color: #0d0d0d !important; + padding: 20px !important; + text-align: center !important; + font-size: 14px !important; + color: #888888 !important; + font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif !important; + position: relative !important; + } + + /* Footer top border */ + .footer-top-border { + height: 2px !important; + background-color: #ff0000 !important; + position: relative !important; + } + + .footer-top-border::before { + content: "" !important; + position: absolute !important; + top: -2px !important; + left: 0 !important; + right: 0 !important; + height: 2px !important; + background: repeating-linear-gradient( + 90deg, + #ff0000 0px, + #ff0000 10px, + transparent 10px, + transparent 20px + ) !important; + } + + .fallback-no-transform { + padding: 40px 20px !important; + text-align: center !important; + } + + /* Mobile responsive */ + @media only screen and (max-width: 600px) { + .content-area { + padding: 20px 15px !important; + } + + .info-label, + .info-value { + display: block !important; + width: 100% !important; + padding: 8px 15px !important; + border-right: none !important; + } + + .info-label { + padding-bottom: 4px !important; + border-bottom: 1px solid #ff0000 !important; + } + + .header-title { + font-size: 22px !important; + letter-spacing: 2px !important; + } + + .header-image-container { + min-height: 100px !important; + } + + .header-fallback-outlook { + padding: 25px 15px !important; + } + + .year-badge { + font-size: 11px !important; + } + + .title-separator { + margin: 0 5px !important; + } + } + + + + + + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ `, REGISTRATION_CONFIRMATION_OLD: ` diff --git a/test.html b/test.html new file mode 100644 index 00000000..14a5408c --- /dev/null +++ b/test.html @@ -0,0 +1,991 @@ + + + + + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + \ No newline at end of file From 7b7b6b2e889314a93fc70ef1d6b6ad9aba9b7762 Mon Sep 17 00:00:00 2001 From: share-a-byte Date: Fri, 22 Aug 2025 20:03:04 -0500 Subject: [PATCH 6/7] more email updates --- src/templates/templates.ts | 9 +- test.html | 991 ------------------------------------- 2 files changed, 4 insertions(+), 996 deletions(-) delete mode 100644 test.html diff --git a/src/templates/templates.ts b/src/templates/templates.ts index e9fa841b..f8f00a09 100644 --- a/src/templates/templates.ts +++ b/src/templates/templates.ts @@ -1,7 +1,7 @@ import Config from "../config"; const templates = { - REGISTRATION_CONFIRMATION: ` + REGISTRATION_CONFIRMATION: ` @@ -653,12 +653,11 @@ const templates = { Need to update your registration? - + Return to the - registration form + registration form to edit your responses! @@ -930,7 +929,7 @@ const templates = { > - + View diff --git a/test.html b/test.html deleted file mode 100644 index 14a5408c..00000000 --- a/test.html +++ /dev/null @@ -1,991 +0,0 @@ - - - - - - - - - - - - -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - \ No newline at end of file From 5a0d625e009e6886c6830210f5af8def648bc81c Mon Sep 17 00:00:00 2001 From: share-a-byte Date: Thu, 28 Aug 2025 16:27:12 -0500 Subject: [PATCH 7/7] fixed overflow issues on email --- src/templates/templates.ts | 120 +++++++++++++++++++++---------------- 1 file changed, 68 insertions(+), 52 deletions(-) diff --git a/src/templates/templates.ts b/src/templates/templates.ts index f8f00a09..6cd43c70 100644 --- a/src/templates/templates.ts +++ b/src/templates/templates.ts @@ -401,19 +401,78 @@ const templates = { border-right: 2px solid #ff0000 !important; } + .nested-link { + color: #ff0000 !important; + text-decoration: none !important; + border-bottom: 1px solid #ff0000 !important; + font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif !important; + word-break: break-all !important; + overflow-wrap: break-word !important; + max-width: 100% !important; + display: inline-block !important; + } + .info-value { color: #e0e0e0 !important; padding: 12px 15px !important; font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif !important; font-size: 14px !important; background-color: #1a1a1a !important; + word-break: break-word !important; + overflow-wrap: break-word !important; + max-width: 0 !important; } - - .nested-link { - color: #ff0000 !important; - text-decoration: none !important; - border-bottom: 1px solid #ff0000 !important; - font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif !important; + + a { + word-break: break-all !important; + overflow-wrap: break-word !important; + max-width: 100% !important; + } + + @media only screen and (max-width: 600px) { + .content-area { + padding: 20px 15px !important; + } + + .info-label, + .info-value { + display: block !important; + width: 100% !important; + padding: 8px 15px !important; + border-right: none !important; + font-size: 12px !important; + } + + .info-label { + padding-bottom: 4px !important; + border-bottom: 1px solid #ff0000 !important; + } + + .header-title { + font-size: 22px !important; + letter-spacing: 2px !important; + } + + .header-image-container { + min-height: 100px !important; + } + + .header-fallback-outlook { + padding: 25px 15px !important; + } + + .year-badge { + font-size: 11px !important; + } + + .title-separator { + margin: 0 5px !important; + } + + .nested-link { + font-size: 12px !important; + word-break: break-all !important; + } } .resume-table { @@ -480,47 +539,6 @@ const templates = { padding: 40px 20px !important; text-align: center !important; } - - /* Mobile responsive */ - @media only screen and (max-width: 600px) { - .content-area { - padding: 20px 15px !important; - } - - .info-label, - .info-value { - display: block !important; - width: 100% !important; - padding: 8px 15px !important; - border-right: none !important; - } - - .info-label { - padding-bottom: 4px !important; - border-bottom: 1px solid #ff0000 !important; - } - - .header-title { - font-size: 22px !important; - letter-spacing: 2px !important; - } - - .header-image-container { - min-height: 100px !important; - } - - .header-fallback-outlook { - padding: 25px 15px !important; - } - - .year-badge { - font-size: 11px !important; - } - - .title-separator { - margin: 0 5px !important; - } - } @@ -837,11 +855,9 @@ const templates = { - {{#personalLinks}} - href="{{.}}" - class="nested-link" - >{{.}}
{{/personalLinks}} + {{#personalLinks}} + {{.}}
+ {{/personalLinks}} {{/personalLinks.length}}