lookback/meteor-emails

media queries from layout.css not loaded into layout.html

tomyo opened this issue · 3 comments

tomyo commented

This seems to be because of Juice, wich inlines all style from layout.css, instead of adding it to the head (that's great, but as long as the final html behaves like the one with the separate .css file).

¿Is there a way to have a {{{css}}} tag in the layout.html, inside of <head>, where I load this media queries?, The only way I see from the docs, involves adding it in every template, using the extraCSS, wich is not the idea of a layout.

Thanks.
This package is great btw!

johanbrook commented

Hi! Thanks for the suggestion – it makes total sense. Feel free to file a PR with the approach and I'll have a look! ⚡️

tomyo commented

I looked at your code, seems to be something the preserveMediaQueries option for Juice should do. So, I asked them how to do it properly. Let's see how it goes.
As a last resource, the provided css could be appended into the layout's head before calling Juice, that would do the trick, but there should be a cleaner way. I'll post the updates.

johanbrook commented

Neat!

Regarding appending, it should probably be made in the layout option for the Mailer.init call, like here: https://github.com/lookback/meteor-emails/blob/master/example/server/server.js#L16-L22

Let it take a extraCSS option or similar. Same for when you wanna have another layout for a specific template, like here: https://github.com/lookback/meteor-emails/blob/master/lib/mailer.js#L113-L117