Inline mailer CSS using premailer.

Gemfile

@@ -222,6 +222,8 @@ gem 'net-ssh',            '~> 3.0.1'
 # Sentry integration
 gem 'sentry-raven', '~> 0.15'
 
+gem 'premailer-rails', '~> 1.9.0'
+
 # Metrics
 group :metrics do
   gem 'allocations', '~> 1.0', require: false, platform: :mri

Gemfile.lock

@@ -150,6 +150,8 @@ GEM
     crack (0.4.3)
       safe_yaml (~> 1.0.0)
     creole (0.5.0)
+    css_parser (1.3.7)
+      addressable
     d3_rails (3.5.11)
       railties (>= 3.1.0)
     daemons (1.2.3)
@@ -423,6 +425,7 @@ GEM
       haml (~> 4.0.0)
       nokogiri (~> 1.6.0)
       ruby_parser (~> 3.5)
+    htmlentities (4.3.4)
     http-cookie (1.0.2)
       domain_name (~> 0.5)
     http_parser.rb (0.5.3)
@@ -564,6 +567,12 @@ GEM
       websocket-driver (>= 0.2.0)
     posix-spawn (0.3.11)
     powerpack (0.1.1)
+    premailer (1.8.6)
+      css_parser (>= 1.3.6)
+      htmlentities (>= 4.0.0)
+    premailer-rails (1.9.0)
+      actionmailer (>= 3, < 5)
+      premailer (~> 1.7, >= 1.7.9)
     pry (0.10.3)
       coderay (~> 1.1.0)
       method_source (~> 0.8.1)
@@ -992,6 +1001,7 @@ DEPENDENCIES
   paranoia (~> 2.0)
   pg (~> 0.18.2)
   poltergeist (~> 1.9.0)
+  premailer-rails (~> 1.9.0)
   pry-rails
   quiet_assets (~> 1.0.2)
   rack-attack (~> 4.3.1)

app/assets/stylesheets/notify.scss

+img {
+  max-width: 100%;
+  height: auto;
+}
+p.details {
+  font-style:italic;
+  color:#777
+}
+.footer p {
+  font-size:small;
+  color:#777
+}
+pre.commit-message {
+  white-space: pre-wrap;
+}
+.file-stats a {
+  text-decoration: none;
+}
+.file-stats .new-file {
+  color: #090;
+}
+.file-stats .deleted-file {
+  color: #B00;
+}

app/views/layouts/notify.html.haml

@@ -3,31 +3,7 @@
     %meta{content: "text/html; charset=utf-8", "http-equiv" => "Content-Type"}
     %title
       GitLab
-  :css
-    img {
-      max-width: 100%;
-      height: auto;
-    }
-    p.details {
-      font-style:italic;
-      color:#777
-    }
-    .footer p {
-      font-size:small;
-      color:#777
-    }
-    pre.commit-message {
-      white-space: pre-wrap;
-    }
-    .file-stats a {
-      text-decoration: none;
-    }
-    .file-stats .new-file {
-      color: #090;
-    }
-    .file-stats .deleted-file {
-      color: #B00;
-    }
+    = stylesheet_link_tag 'notify'
   %body
     %div.content
       = yield

config/application.rb

@@ -49,6 +49,7 @@ module Gitlab
     config.assets.paths << Gemojione.index.images_path
     config.assets.precompile << "*.png"
     config.assets.precompile << "print.css"
+    config.assets.precompile << "notify.css"
 
     # Version of your assets, change this if you want to expire all your assets
     config.assets.version = '1.0'

config/initializers/premailer.rb

+# See https://github.com/fphilipe/premailer-rails#configuration
+Premailer::Rails.config.merge!(
+  generate_text_part: false,
+  preserve_styles: true,
+  remove_comments: true,
+  remove_ids: true
+)