rails_email_preview 0.2.31 → 1.0.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 90e5262b6ef9d3bf7b55df8ca3bb46004103bd9b
-  data.tar.gz: 1d96c1d2a68c9602040875d45557d50d55d03d00
+  metadata.gz: 02bcd4fe9bb7401449acd3b44245c93f8d5ab360
+  data.tar.gz: 5b7c64b281650e047e113cb020f83c4050156e20
 SHA512:
-  metadata.gz: 188be5c4b3ce2c18818b83766abcd008b28704f66aefc8c45861f8f8b81dfcbc16efcbb0f9167655d52c2666e8c110719e33f9fd9004c6223229402731c1501b
-  data.tar.gz: 8f8c7888f0c9681d02f0f65b4df9d113e6da8203ee8c969d487d7f212770f2c05747d0e363d3420b9ea1eaa38f30d152878aab91e941d20d6cf3c5b0d488d0bf
+  metadata.gz: 081630f21830afb463670897d4517670bc890a9ff47b927e0a035dbec1f0baf5866bec0ac4ef99d7d27527996a79d9cbf744c476f7ccd76fa82a19acc18c642f
+  data.tar.gz: 26f7398c358fa2b9041ba6a9bb0af737b87397c5ed2ce81f769d0d63bd6ccbe73fe922476e81464e4bf395b789a447ed64992290916366e0830fed3e0b1131f6

data/README.md

@@ -2,21 +2,22 @@
 
 Preview email in the browser with this Rails engine. Compatible with Rails 3 and 4.
 
-Preview:
+An email review:
+
 ![screenshot][rep-show-screenshot]
 
-List:
+The list of all email previews:
+
 ![screenshot][rep-nav-screenshot]
 
-REP can use your application styles, markup is compatible with [bootstrap 3][rep-show-default-screenshot] by default.
-*These screenshots are using a custom Bootstrap theme*
+REP comes with two themes: a simple standalone theme, and a theme that uses [Bootstrap 3][rep-show-default-screenshot].
 
 ## Installation
 
 Add [![Gem Version][gem-badge]][gem] to Gemfile:
 
 ```ruby
-gem 'rails_email_preview', '~> 0.2.31'
+gem 'rails_email_preview', '~> 1.0.0'
 ```
 
 Add an initializer and the routes:
@@ -154,7 +155,9 @@ RailsEmailPreview.locale = :de
 
 ### Views
 
-You can render all REP views inside your app layout (this will need styling to look nice if you don't use bootstrap):
+By default REP views will render inside its own layout.
+
+To render all REP views inside your app layout, first set the layout to use in the initializer:
 
 ```ruby
 Rails.application.config.to_prepare do
@@ -163,9 +166,28 @@ Rails.application.config.to_prepare do
 end
 ```
 
-You can `//= require 'rails_email_preview/layout'` REP-specific styles (`@import 'rails_email_preview/layout'` for SASS).
+Then, import REP styles into your `application.css.scss`:
+
+```scss
+@import "rails_email_preview/application";
+```
+
+Alternatively, if you are using Bootstrap 3, `@import "rails_email_preview/application"`, and add the following
+to the initializer:
 
-REP also allows you to customize some of the element classes via [`RailsEmailPreview.style`](/lib/rails_email_preview.rb#L34).
+```ruby
+config.style.merge!(
+    btn_active_class_modifier: 'active',
+    btn_danger_class:          'btn btn-danger',
+    btn_default_class:         'btn btn-default',
+    btn_group_class:           'btn-group btn-group-sm',
+    btn_primary_class:         'btn btn-primary',
+    form_control_class:        'form-control',
+    list_group_class:          'list-group',
+    list_group_item_class:     'list-group-item',
+    row_class:                 'row',
+)
+```
 
 You can also override any individual view by placing a file with the same path in your project's `app/views`,
 e.g. `app/views/rails_email_preview/emails/index.html.slim`.

data/app/assets/stylesheets/rails_email_preview/application.css.sass

@@ -1,3 +1,228 @@
-@import 'rails_email_preview/bootstrap'
-@import 'rails_email_preview/bootstrap_theme'
-@import 'rails_email_preview/layout'
+// A standalone theme for Rails Email Preview
+
+$rep-brand-color: #4a90e2 !default
+$rep-link-color: $rep-brand-color !default
+$rep-gray: #818a91 !default
+$rep-gray-light: #a6b2bb !default
+$rep-gray-lighter: #f1f3f4 !default
+
+$rep-breadcrumb-bg: $rep-gray-lighter !default
+
+$rep-grid-gutter: 30px !default
+$rep-grid-breakpoint-sm: 768px !default
+$rep-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif !default
+$rep-font-size-nav: 1.15em !default
+$rep-text-color-secondary: #263238
+
+=rep--media-sm-plus
+  @media (min-width: $rep-grid-breakpoint-sm)
+    @content
+
+=clearfix
+  &::after
+    content: ""
+    display: table
+    clear: both
+
+%rep--link
+  color: $rep-link-color
+  text-decoration: none
+  transition: color 0.1s linear
+  &:active, &:focus, &:hover
+    color: darken($rep-link-color, 15%)
+  &:active
+    outline: none
+  &:focus
+    outline: thin dotted
+    outline: 5px auto -webkit-focus-ring-color
+    outline-offset: -2px
+
+%rep--hr
+  margin-top: 20px
+  margin-bottom: 20px
+  border: 0
+  border-top: 1px solid $rep-gray-lighter
+
+.rep--main-container
+  font-family: $rep-font-family
+  box-sizing: border-box
+  *, *::before, *::after
+    box-sizing: inherit
+  a
+    @extend %rep--link
+  hr
+    @extend %rep--hr
+
+.rep--row
+  margin-left: ($rep-grid-gutter / -2)
+  margin-right: ($rep-grid-gutter / -2)
+  +clearfix
+
+%rep--row__col
+  position: relative
+  min-height: 1px
+  padding-right: ($rep-grid-gutter / 2)
+  padding-left: ($rep-grid-gutter / 2)
+
+@each $col in (4, 6, 8)
+  %rep--row__col-#{$col}
+    @extend %rep--row__col
+    +rep--media-sm-plus
+      float: left
+      width: percentage($col / 12)
+
+.rep--email-headers
+  @extend %rep--row__col-8
+
+.rep--email-nav-container
+  @extend %rep--row__col-4
+
+.rep--email-list-half
+  @extend %rep--row__col-6
+
+.rep--breadcrumbs
+  padding: 0.75rem 1rem
+  margin-bottom: 1rem
+  font-size: $rep-font-size-nav
+  list-style: none
+  background-color: $rep-breadcrumb-bg
+.rep--breadcrumbs__breadcrumb
+  display: inline-block
+  + ::before
+    display: inline-block
+    padding: 0 0.5em
+    color: $rep-gray-light
+    content: "/"
+.rep--breadcrumbs__breadcrumb-active
+  display: inline-block
+
+.rep--headers-list
+  margin: 0
+  dt
+    color: $rep-text-color-secondary
+    font-weight: bold
+    +rep--media-sm-plus
+      float: left
+      clear: left
+      margin-right: 0.4em
+      text-align: right
+      width: 4.8em
+  dd
+    width: auto
+    margin-left: 0
+    margin-bottom: 0.2em
+
+.rep--btn
+  appearance: none
+  -webkit-font-smoothing: antialiased
+  border: 1px solid
+  cursor: pointer
+  display: inline-block
+  font-weight: 600
+  padding: 0.75em 1em
+  text-decoration: none
+  user-select: none
+  vertical-align: middle
+  text-align: center
+  white-space: nowrap
+  transition: all .2s ease-in-out
+  &:active, &.rep--btn-active
+    background-image: none
+    outline: 0
+    box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125)
+  &:focus
+    outline: none
+
+=rep--btn($color, $background, $border-color: darken($background, 5%))
+  color: $color
+  background: $background
+  border-color: $border-color
+  &:hover
+    background: darken($background, 10%)
+    border-color: darken($border-color, 12%)
+  &:focus
+    box-shadow: 0 0 3px $background
+    background-color: darken($background, 17%)
+    border-color: darken($border-color, 25%)
+
+.rep--btn-default
+  +rep--btn(#111, $rep-gray-lighter)
+
+.rep--btn-primary
+  +rep--btn(#fff, $rep-brand-color)
+
+.rep--btn-danger
+  +rep--btn(#fff, #d9534f)
+
+.rep--btn-group
+  .rep--btn + .rep--btn
+    margin-left: -1px
+  .rep--btn
+    z-index: 1
+    &.rep--btn-active
+      z-index: 2
+    &:focus, &:hover
+      z-index: 3
+
+.rep--list-group
+  font-size: $rep-font-size-nav
+
+.rep--list-group__item
+  display: block
+  padding: 1rem 1.5rem
+  &:hover
+    background-color: $rep-gray-lighter
+    transition: background-color ease-in-out 0.15s, background-color ease-in-out 0.15s
+  + .rep--list-group__item
+    border-top: 1px solid $rep-gray-light
+
+.rep--panel
+  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .125)
+  padding: 1.25rem
+  margin-bottom: 1rem
+
+.rep--email-options
+  font-size: 0.875rem
+  text-align: left
+  p
+    margin-top: 0
+  +rep--media-sm-plus
+    text-align: right
+
+.rep--send-to-form
+  display: block
+  white-space: nowrap
+  padding-bottom: 4px
+  button, [type="email"]
+    display: inline-block
+    &:focus, &:active
+      z-index: 2
+  button
+    line-height: 1.25
+    padding: 0.5rem
+  [type="email"]
+    max-width: 135px
+    padding: 0.5rem
+    border-top-left-radius: 0
+    border-bottom-left-radius: 0
+
+.rep--form-control
+  padding: 0.5rem 0.75rem
+  line-height: 1.25
+  background-image: none
+  background-clip: padding-box
+  border: 1px solid rgba(0, 0, 0, 0.15)
+  border-radius: 0.25rem
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075)
+  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s
+  &::placeholder
+    color: #999
+    opacity: 1
+  &:focus
+    border-color: lighten($rep-brand-color, 20%)
+    outline: none
+    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6)
+
+.rep--footer
+  text-align: center
+  color: $rep-gray

data/app/assets/stylesheets/rails_email_preview/bootstrap3.css.sass

@@ -0,0 +1,68 @@
+// Bootstrap 3 theme for Rails Email Preview
+
+.rep--email-headers
+  @extend .col-md-8
+
+.rep--email-nav-container
+  @extend .col-md-4
+
+.rep--email-list-half
+  @extend .col-md-6
+
+.rep--headers-list
+  dt
+    color: $gray-dark
+    @media (min-width: $screen-sm-min)
+      float: left
+      clear: left
+      margin-right: 0.45em
+      text-align: right
+      width: 100px
+      &::after
+        content: ":"
+  dd
+    width: auto
+    margin-left: 0
+    margin-bottom: 0.3em
+
+.rep--email-options
+  text-align: right
+
+.rep--breadcrumbs
+  @extend .breadcrumb
+
+.rep--breadcrumbs__breadcrumb-active
+  color: $breadcrumb-active-color
+
+.rep--panel
+  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .125)
+  padding: 15px
+  margin-bottom: 20px
+
+.rep--send-to-form
+  display: block
+  white-space: nowrap
+  padding-bottom: 4px
+  button, [type="email"]
+    display: inline-block
+    &:focus, &:active
+      z-index: 2
+  button
+    line-height: 1.3
+    border-top-right-radius: 0
+    border-bottom-right-radius: 0
+  [type="email"]
+    max-width: 140px
+    border-top-left-radius: 0
+    border-bottom-left-radius: 0
+
+.rep--footer
+  text-align: center
+  color: $state-info-text
+
+.rep--email-headers
+  +make-sm-column(8)
+.rep--email-nav-container
+  +make-sm-column(4)
+.rep--email-list-half
+  +make-sm-column(6)

data/app/controllers/rails_email_preview/emails_controller.rb

@@ -5,6 +5,7 @@ module RailsEmailPreview
     around_filter :set_locale
     before_filter :set_email_preview_locale
     helper_method :with_email_locale
+    helper_method :preview_params
 
     # List of emails
     def index
@@ -19,7 +20,7 @@ module RailsEmailPreview
       with_email_locale do
         if @preview.respond_to?(:preview_mail)
           @mail, body     = mail_and_body
-          @mail_body_html = render_to_string inline: body, layout: 'rails_email_preview/email'
+          @mail_body_html = render_to_string(inline: body, layout: 'rails_email_preview/email')
         else
           raise ArgumentError.new("#{@preview} is not a preview class, does not respond_to?(:preview_mail)")
         end
@@ -47,14 +48,17 @@ module RailsEmailPreview
 
     # Download attachment
     def show_attachment
-      filename   = "#{params[:filename]}.#{params[:format]}"
-      attachment = preview_mail(false).attachments.find { |a| a.filename == filename }
-      send_data attachment.body.raw_source, filename: filename
+      with_email_locale do
+        filename   = "#{params[:filename]}.#{params[:format]}"
+        attachment = preview_mail(false).attachments.find { |a| a.filename == filename }
+        send_data attachment.body.raw_source, filename: filename
+      end
     end
 
     # Render headers partial. Used by the CMS integration to refetch headers after editing.
     def show_headers
-      render partial: 'rails_email_preview/emails/headers', locals: {mail: mail_and_body.first}
+      mail = with_email_locale { mail_and_body.first }
+      render partial: 'rails_email_preview/emails/headers', locals: {mail: mail}
     end
 
     # Render email body iframe HTML. Used by the CMS integration to provide a link back to Show from Edit.
@@ -69,6 +73,10 @@ module RailsEmailPreview
 
     private
 
+    def preview_params
+      params.except(*(request.path_parameters.keys - [:email_locale]))
+    end
+
     def deliver_email!(mail)
       if mail.respond_to?(:deliver_now!)
         # Rails 4.2+
@@ -92,7 +100,7 @@ module RailsEmailPreview
     # @param [Boolean] run_handlers whether to run the registered handlers for Mail object
     # @return [Mail]
     def preview_mail(run_handlers = true)
-      @preview.preview_mail(run_handlers, params.except(*request.path_parameters.keys))
+      @preview.preview_mail(run_handlers, preview_params)
     end
 
     # @param [Mail] mail

data/app/helpers/rails_email_preview/emails_helper.rb

@@ -57,27 +57,14 @@ module RailsEmailPreview::EmailsHelper
     RailsEmailPreview.style
   end
 
-  def preview_params
-    params.except(*request.path_parameters.keys)
-  end
-
   def rep_btn_class(active = false)
-    rep_style[:"btn_#{active ? 'active' : 'default'}_class"]
-  end
-
-  def rep_row_class
-    rep_style[:row_class]
-  end
-
-  def rep_col_class(n)
-    rep_style[:column_class] % {n: n}
+    [rep_style[:btn_default_class], (rep_style[:btn_active_class_modifier] if active)].compact * ' '
   end
 
   def rep_btn_group_class
     rep_style[:btn_group_class]
   end
 
-
   def with_index_hook(key, &block)
     render_hook key, list: @list, previews: @previews, &block
   end