feat(email): replace unicode checkmark with inline PNG image#172
Conversation
The signer-verified circle previously rendered a unicode `✓` glyph which is styled inconsistently across mail clients. Embed a PNG of the PostGuard checkmark via `cid:pg-check` to match the shape used in the download page UI.
|
Dobby has received the request! Routing to the right specialist now... |
There was a problem hiding this comment.
Code review
Inline PNG checkmark via cid:pg-check cleanly mirrors the existing pg-logo attachment pattern; build, clippy, and the email test suite (27/27) all pass.
Rule compliance
[WCAG 2.2 AA] alt="" marks the checkmark as decorative — the previous unicode glyph was announced as "check mark" by some screen readers. Defensible because the surrounding files_from/sender_email copy carries the "verified signer" meaning, but alt="verified" would preserve the signal more cleanly. Non-blocking.
| <div style="margin-bottom:12px;"> | ||
| <span style="display:inline-block;width:32px;height:32px;line-height:32px;border-radius:50%;border:2px solid #5F7381;text-align:center;font-size:16px;color:#5F7381;box-sizing:border-box;">✓</span> | ||
| <span style="display:inline-block;width:32px;height:32px;line-height:32px;border-radius:50%;border:2px solid #5F7381;text-align:center;box-sizing:border-box;"> | ||
| <img src="cid:pg-check" alt="" width="16" height="13" style="display:inline-block;vertical-align:middle;" /> |
There was a problem hiding this comment.
[Code review] [Rule: wcag-aa-compliance] alt="" makes the checkmark decorative; the previous ✓ was announced as "check mark" by some screen readers. Consider alt="verified" to preserve the signer-verified signal. Defensible as-is since the surrounding copy carries the meaning.
| <div style="margin-bottom:12px;"> | ||
| <span style="display:inline-block;width:32px;height:32px;line-height:32px;border-radius:50%;border:2px solid #5F7381;text-align:center;font-size:16px;color:#5F7381;box-sizing:border-box;">✓</span> | ||
| <span style="display:inline-block;width:32px;height:32px;line-height:32px;border-radius:50%;border:2px solid #5F7381;text-align:center;box-sizing:border-box;"> | ||
| <img src="cid:pg-check" alt="" width="16" height="13" style="display:inline-block;vertical-align:middle;" /> |
There was a problem hiding this comment.
[Code review] Source PNG is 128×107 (~1.196) but rendered at 16×13 (~1.231) — minor horizontal stretch. Either render at 16×14 or crop the source. Sub-pixel at display size, likely imperceptible.
Summary
✓glyph inside the signer-verified circle with an inline PNG attachment referenced viacid:pg-checktemplates/email/check.png(matches the checkmark used on the download page) into themultipart/relatedbody alongside the existingpg-logoTest plan
cargo check/cargo buildsucceeds