CSS inlining

[Roman Lelek]

Hi Lee,

let me first thank you for this awesome email workflow, you have already saved me a huge amount of time.
I am just wondering about inlining the CSS style: In saas:dist the whole css file (main.css) which contains all global resets, external classes etc. is build. Then "assemble" creates html but when you run grunt task "juice", only media queries are actually inserted (to the head) and the rest is of course inlined. But there is no global resets, external classes. Or I have something overlooked?

[Lee Munroe]

You're right. What I've done for other projects (and should probably update this repo) is added another SCSS file for styles that I wanted preserved, and put them in an "all" media query e.g.

@media all {

  // External class fix for Outlook.com
  .ExternalClass {
    width: 100%;
  }

  .ExternalClass,
  .ExternalClass p,
  .ExternalClass span,
  .ExternalClass font,
  .ExternalClass td,
  .ExternalClass div {
    line-height: 100%;
  }

  // Blue link fix for iOS
  .apple-link a {
    color: inherit !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    text-decoration: none !important;
  }
}

[Roman Lelek]

Ok, thank you for this quick fix. I originally thought that I need to have all styles in head even if they are inlined.