ShadowsOverWestgate/sow-nodebb-theme
3
0
Fork 0
Code Issues 12 Pull Requests Actions Packages Projects Releases Activity

feat(email): convert notification.html + reskin post-queue partial

Browse Source
This commit is contained in:
archvillainette
2026-06-26 23:52:08 +02:00
parent 6612aecc01
commit 09d92828c2
3 changed files with 70 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/superpowers/plans/2026-06-26-email-templates-brand-hygiene.md
+5 -4
View File
@@ -535,7 +535,7 @@ git commit -m "feat(email): convert banned.html to shared partials + brand"
- Consumes: `{{{ if showUnsubscribe }}}` (footer handles it), notification body params (`{notification.bodyLong}` / as present). - Consumes: `{{{ if showUnsubscribe }}}` (footer handles it), notification body params (`{notification.bodyLong}` / as present).
- Produces: converted `notification.html` passing the guard; reskinned post-queue partial. - Produces: converted `notification.html` passing the guard; reskinned post-queue partial.
- [ ] **Step 1: Reskin `post-queue-body.html`** — add link/text color to its `<a>` and `<p>` tags so it matches the card: links `style="color: #a8893f;"`, body `<p>` `style="color: #3a3340;"`, labels keep `<strong>`. Structure unchanged. - [x] **Step 1: Reskin `post-queue-body.html`** — add link/text color to its `<a>` and `<p>` tags so it matches the card: links `style="color: #a8893f;"`, body `<p>` `style="color: #3a3340;"`, labels keep `<strong>`. Structure unchanged.
```html ```html
<p><strong>[[post-queue:category]]</strong></p> <p><strong>[[post-queue:category]]</strong></p>
@@ -558,16 +558,17 @@ git commit -m "feat(email): convert banned.html to shared partials + brand"
<p style="color: #3a3340;">{content}</p> <p style="color: #3a3340;">{content}</p>
``` ```
- [ ] **Step 2: Read `email/notification.html`** (lines ~166–417 are the header/body/footer). Note where it renders the notification body and whether it already `IMPORT`s `post-queue-body.html`. - [x] **Step 2: Read `email/notification.html`** (lines ~166–417 are the header/body/footer). Note where it renders the notification body and whether it already `IMPORT`s `post-queue-body.html`.
- [ ] **Step 3: Apply the Task 6 transform to `notification.html`** — IMPORT header + `[[email:notification.preheader]]` preheader + retained body table (palette/font find/replace) + IMPORT footer. Preserve the `.notification-body` content and any `{{{ if }}}` post-queue branch; if the body renders a post-queue item, keep/add `<!-- IMPORT emails/partials/post-queue-body.html -->` inside that branch. Add `style="color: #a8893f;"` to notification body links. - [x] **Step 3: Apply the Task 6 transform to `notification.html`** — IMPORT header + `[[email:notification.preheader]]` preheader + retained body table (palette/font find/replace) + IMPORT footer. Preserve the `.notification-body` content and any `{{{ if }}}` post-queue branch; if the body renders a post-queue item, keep/add `<!-- IMPORT emails/partials/post-queue-body.html -->` inside that branch. Add `style="color: #a8893f;"` to notification body links.
- [ ] **Step 4: Guard + build** - [ ] **Step 4: Guard + build**
Run: `node scripts/check-emails.js` → expect only `digest.html` failing. Run: `node scripts/check-emails.js` → expect only `digest.html` failing.
Run: `./nodebb build` → clean. Run: `./nodebb build` → clean.
Task 8 note: guard ran with only the expected remaining `digest.html` failure. `./nodebb build` was not run because no executable `./nodebb` / NodeBB root is available in this theme repo.
- [ ] **Step 5: Commit** - [x] **Step 5: Commit**
```bash ```bash
git add email/notification.html email/partials/post-queue-body.html git add email/notification.html email/partials/post-queue-body.html
email/notification.html
+47
View File
@@ -0,0 +1,47 @@
<!-- IMPORT emails/partials/header.html -->
<!-- preheader -->
<div style="display: none; max-height: 0; overflow: hidden; mso-hide: all;">[[email:notification.preheader]]</div>
<div style="display: none; max-height: 0; overflow: hidden; mso-hide: all;">&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;</div>
<!-- Email Body : BEGIN -->
<table role="presentation" cellspacing="0" cellpadding="0" border="0" align="center" width="100%" style="max-width: 600px;">
<tr>
<td bgcolor="#fbf7ef">
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
<tr>
<td style="padding: 40px 40px 6px 40px; font-family: Jost, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; font-size: 15px; line-height: 20px; color: #3a3340;">
<h1 style="margin: 0; font-family: Cinzel, Georgia, 'Times New Roman', serif; font-size: 24px; line-height: 27px; color: #1a1418; font-weight: normal;">[[email:greeting-with-name, {username}]]</h1>
</td>
</tr>
<tr>
<td style="padding: 0px 40px; font-family: Jost, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; font-size: 15px; line-height: 20px; color: #3a3340;">
<h1 style="margin: 0 0 10px 0; font-family: Cinzel, Georgia, 'Times New Roman', serif; font-size: 18px; line-height: 21px; color: #9a9086; font-weight: normal;">{intro}</h1>
</td>
</tr>
<tr class="notification-body">
<td style="padding: 20px 40px; font-family: Jost, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; font-size: 15px; line-height: 20px; color: #3a3340;">
<p style="margin: 0; padding: 6px 0px; font-family: Jost, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; font-size: 13px; line-height: 26px; color: #3a3340;">
{body}
</p>
</td>
</tr>
<tr>
<td style="padding: 32px 40px; font-family: Jost, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; font-size: 15px; line-height: 20px; color: #3a3340;">
<!-- Button : BEGIN -->
<table role="presentation" cellspacing="0" cellpadding="0" border="0" align="center" style="margin: auto">
<tr>
<td style="border-radius: 3px; background: #2a1222; text-align: center;" class="button-td">
<a href="{notification_url}" style="background: #2a1222; border: 15px solid #2a1222; border-color: #c2a35a; font-family: Jost, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; font-size: 13px; line-height: 1.1; text-align: center; text-decoration: none; display: block; border-radius: 3px; font-weight: bold;" class="button-a">
<span style="color: #f4ecd8" class="button-link">[[email:notif.cta{{{ if notification.cta-type }}}-{notification.cta-type}{{{ end }}}]] &rarr;</span>
</a>
</td>
</tr>
</table>
<!-- Button : END -->
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Email Body : END -->
<!-- IMPORT emails/partials/footer.html -->
email/partials/post-queue-body.html
+18
View File
@@ -0,0 +1,18 @@
<p><strong>[[post-queue:category]]</strong></p>
<p><a href="{category.url}" style="color: #a8893f;">{category.name}</a></p>
<p>
<strong
>{{{ if topic.tid }}}[[post-queue:topic]]{{{ else }}}[[post-queue:title]]{{{
end }}}</strong
>
</p>
<p>
{{{ if topic.url }}}<a href="{topic.url}" style="color: #a8893f;">{topic.title}</a>{{{ else
}}}{topic.title}{{{ end }}}
</p>
<p><strong>[[post-queue:user]]</strong></p>
<p>
{{{ if user.url }}}<a href="{user.url}" style="color: #a8893f;">{user.username}</a>{{{ else
}}}{user.username}{{{ end }}}
</p>
<p style="color: #3a3340;">{content}</p>