feat: email theme

[paulwer]

closes https://github.com/lukin/keywind/issues/47 references https://github.com/lukin/keywind/issues/6

Hey folks, ive managed a mailwind integration.

From my pov it may not be perfect, but it works as intended (for me). any thoughts on this?

I've created this theme based on the mailwind front-website example.

emails should be tested for visibility on the most used e-mail clients (help wanted):

• [x] Apple
• [X] GMAIL
• [x] Outlook
• [x] Thunderbird
• [x] Yahoo Mail
• [x] WEB.de
• [x] Outlook.com

[paulwer]

did someone want to check/help and give feedback for a client? @CHE1RON @lukin

[paulwer]

display on gmail

known issues:

• fallback to background color, because background div is not displayed properly on gmail (position: fixed ignored) => update 29.9.14:24: fixed, also works with background image now

[CHE1RON]

Looks promising! Never heard of Mailwind before, thanks!

[paulwer]

display on web.de known issues:

• fallback to background color -> reason: not checked => update 29.9.14:24: fixed, also works with background image now

[paulwer]

@CHE1RON @lukin any other providers needed / wished / to be checked?

[CHE1RON]

I guess Gmail as de-facto standard is all that needs to be checked really 😅

[CHE1RON]

Don't get me wrong, privately I don't have a Gmail account - but nearly everyone I know has one ..

[paulwer]

outlook still doesnt looks great, i guess exspecialy for companies, this would be great to optimize at least -_-

[CHE1RON]

As far as my scarce experience with Outlook goes, fixing it is out of scope for keywind 😂

[paulwer]

i think checking on apple should be also a prio:

(wold usage of mail clients from 2023 according to: Website

[CHE1RON]

Feel free to send emails to folkers [at] codefy [dot] de and I'll post screenshots 😉

[paulwer]

@CHE1RON you should have recieved an email yesterday :)

[CHE1RON]

looks good 👍

[paulwer]

yahoo

known issues:

• no background at all => I guess we can ignore this

[paulwer]

as mentioned outlook still looks not good, i will try to come up with some changes to change this:

[CHE1RON]

@paulwer I mean it says right there in your screenshot: if it looks shitty, please view it in your browser 😂

[paulwer]

@CHE1RON I've sended you another e-mail, please check the formatting, outlook looks now better and the other platforms are still optical the same:

i changed the usage of div's to the table syntax for old email clients. i will commit, if this looks also good on apple :)

[paulwer]

outlook.com works like a charm

background images are now present on all platforms i tested. <3 (only outlook destop does not display it xD)

[paulwer]

thunderbird also works great <3

android gmail and outlook tested as well and worked great. gmail does display it as dark mode variant, but its readable and approved from my pov.

[paulwer]

@lukin any test files needed for this PR?

[CHE1RON]

macOS Mail:

[paulwer]

@lukin this pr is ready to be merged

[paulwer]

within this PR, I used the mailwind logo as default logo. should we replace it with a keycloak logo to match a more "default" - alike look or remove the logo by default, to be fit with plain installation and maybe display just the realm name, if nothing is defined... I could also imagine a customization behavior within theme.properties, like mentioned in: #59

any opinions on that? @lukin @CHE1RON

[CHE1RON]

I see no apparent reason why keywind should propagate Mailwind by using its logo by default 🤔

No logo imho 👍

[paulwer]

@CHE1RON is right, the logo should be optional. Therefore i will push a commit with the mentioned themeLogoUrl as property of the theme shortly. if no url is provided the realmName as heading is used accordingly.

@lukin PR is ready again :)

[paulwer]

closed in favor for: https://github.com/lukin/keywind/pull/96