foundation_emails 2.1.0

data/vendor/assets/stylesheets/foundation-emails/components/_callout.scss

@@ -0,0 +1,85 @@
+// Foundation for Emails by ZURB
+// zurb.com/ink/
+// Licensed under MIT Open Source
+
+////
+/// @group callout
+////
+
+/// Background color of a callout.
+/// @type Color
+$callout-background: $white !default;
+
+/// Fade value for callout backgrounds.
+/// @type Number
+$callout-background-fade: 85% !default;
+
+/// Padding inside a callout.
+/// @type Length
+$callout-padding: 10px !default;
+
+/// Bottom margin of a callout.
+/// @type Length
+$callout-margin-bottom: $global-margin !default;
+
+/// Border around a callout.
+/// @type Border
+$callout-border: 1px solid darken($callout-background, 20%) !default;
+
+/// Border around a callout with the `.success` class.
+/// @type Border
+$callout-border-secondary: 1px solid darken($secondary-color, 20%) !default;
+
+/// Border around a callout with the `.success` class.
+/// @type Border
+$callout-border-success: 1px solid darken($success-color, 20%) !default;
+
+/// Border around a callout with the `.warning` class.
+/// @type Border
+$callout-border-warning: 1px solid darken($warning-color, 20%) !default;
+
+/// Border around a callout with the `.alert` class.
+/// @type Border
+$callout-border-alert: 1px solid darken($alert-color, 20%) !default;
+
+table.callout {
+  margin-bottom: $callout-margin-bottom;
+  Margin-bottom: $callout-margin-bottom;
+}
+
+th.callout-inner {
+  width: 100%;
+  border: $callout-border;
+  padding: $callout-padding;
+  background: $callout-background;
+
+  &.primary {
+    background: scale-color($primary-color, $lightness: $callout-background-fade);
+    border: $callout-border-secondary;
+    color: $black;
+  }
+
+  &.secondary {
+    background: scale-color($secondary-color, $lightness: $callout-background-fade);
+    border: $callout-border-secondary;
+    color: $black;
+  }
+
+  &.success {
+    background: scale-color($success-color, $lightness: $callout-background-fade);
+    border: $callout-border-success;
+    color: $white;
+  }
+
+  &.warning {
+    background: scale-color($warning-color, $lightness: $callout-background-fade);
+    border: $callout-border-warning;
+    color: $white;
+  }
+
+  &.alert {
+    background: scale-color($alert-color, $lightness: $callout-background-fade);
+    border: $callout-border-alert;
+    color: $white;
+  }
+}

data/vendor/assets/stylesheets/foundation-emails/components/_media-query.scss

@@ -0,0 +1,117 @@
+// Foundation for Emails by ZURB
+// zurb.com/ink/
+// Licensed under MIT Open Source
+
+////
+/// @group media-query
+////
+
+@media only screen and (max-width: #{$global-breakpoint}) {
+  table.body img {
+    width: auto !important;
+    height: auto !important;
+  }
+
+  table.body center {
+    min-width: 0 !important;
+  }
+
+  table.body .container {
+    width: $global-width-small !important;
+  }
+
+  //If it supports border-box, why not? Am I right?
+  //Also, by default pad that to the global-gutter variable
+  table.body .columns,
+  table.body .column {
+    height: auto !important;
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    padding-left: $global-gutter !important;
+    padding-right: $global-gutter !important;
+    
+    // Nested columns won't double the padding
+    .column,
+    .columns {
+      padding-left: 0 !important;
+      padding-right: 0 !important;
+    }
+  }
+
+  // Collpased columns have no gutter.
+  .collapse {
+    table.body & .columns,
+    table.body & .column {
+      padding-left: 0 !important;
+      padding-right: 0 !important;
+    }
+  }
+
+  // Basic grid rules
+  @for $i from 1 through $grid-column-count {
+    td.small-#{$i},
+    th.small-#{$i} {
+      display: inline-block !important;
+      width: -zf-grid-calc-pct($i, $grid-column-count) !important;
+    }
+  }
+
+  //If it's the last column in column count (12 by default),
+  //give it block and 100% width to knock down the wimpy columns to their own row.
+  .columns td.small-#{$grid-column-count},
+  .column td.small-#{$grid-column-count},
+  .columns th.small-#{$grid-column-count},
+  .column th.small-#{$grid-column-count} {
+    display: block !important;
+    width: 100% !important;
+  }
+
+  @for $i from 1 through ($grid-column-count - 1) {
+    table.body td.small-offset-#{$i},
+    table.body th.small-offset-#{$i} {
+    //1.5 takes in effect a whole empty cell.
+      margin-left: -zf-grid-calc-pct($i, $grid-column-count) !important;
+      Margin-left: -zf-grid-calc-pct($i, $grid-column-count) !important;
+    }
+  }
+
+  table.body table.columns td.expander,
+  table.body table.columns th.expander {
+    display: none !important;
+  }
+
+  table.body .right-text-pad,
+  table.body .text-pad-right {
+    padding-left: $text-padding !important;
+  }
+
+  table.body .left-text-pad,
+  table.body .text-pad-left {
+    padding-right: $text-padding !important;
+  }
+
+  //menu
+  table.menu {
+    width: 100% !important;
+    
+    td,
+    th {
+      width: auto !important;
+      display: inline-block !important;
+    }
+
+    &.vertical, &.small-vertical {
+      td,
+      th {
+        display: block !important;
+      }
+    }
+  }
+
+  // Centers the menus!
+  table.menu[align="center"] {
+    width: auto !important;
+  }
+}
+

data/vendor/assets/stylesheets/foundation-emails/components/_menu.scss

@@ -0,0 +1,68 @@
+// Foundation for Emails by ZURB
+// zurb.com/ink/
+// Licensed under MIT Open Source
+
+////
+/// @group menu
+////
+
+/// Padding inside a menu item.
+/// @type Length
+$menu-item-padding: 10px !default;
+
+/// Right-hand spacing of items in menus with the `.simple` class.
+/// @type Length
+$menu-item-gutter: 10px !default;
+
+/// This is the color of the menu item links.
+/// @type Color
+$menu-item-color: $primary-color !default;
+
+
+table.menu {
+  width: $global-width;
+
+  td.menu-item,
+  th.menu-item{
+    padding: $menu-item-padding;
+    padding-right: $menu-item-gutter;
+
+    a {
+      color: $menu-item-color; 
+    }
+  }
+}
+
+// Doesn't work on the pesky ESPs like outlook 2000
+table.menu.vertical {
+  td.menu-item,
+  th.menu-item {
+    padding: $menu-item-padding;
+    padding-right: 0;
+    display: block;
+
+    a {
+      width: 100%;
+    }
+  }
+
+  // Nested lists need some more padding to the left
+  td.menu-item,
+  th.menu-item {
+    table.menu.vertical {
+      td.menu-item,
+      th.menu-item {
+        padding-left: $menu-item-padding;
+      }
+    }
+  }
+}
+
+table.menu.text-center a {
+  text-align: center;
+}
+
+//Centers the menus!
+.menu[align="center"] {
+  width: auto !important;
+}

data/vendor/assets/stylesheets/foundation-emails/components/_normalize.scss

@@ -0,0 +1,90 @@
+// Foundation for Emails by ZURB
+// zurb.com/ink/
+// Licensed under MIT Open Source
+
+////
+/// @group normalize
+////
+
+$paragraph-margin-bottom: 10px !default;
+
+#outlook a {
+  padding: 0;
+}
+
+body {
+  width: 100% !important;
+  min-width: 100%;
+  -webkit-text-size-adjust: 100%;
+  -ms-text-size-adjust: 100%;
+  margin: 0;
+  Margin: 0;
+  padding: 0;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+.ExternalClass {
+  width: 100%;
+
+  &,
+  p,
+  span,
+  font,
+  td,
+  div {
+    line-height: 100%;
+  }
+}
+
+#backgroundTable {
+  margin: 0;
+  Margin: 0;
+  padding: 0;
+  width: 100% !important;
+  line-height: 100% !important;
+}
+
+img {
+  outline: none;
+  text-decoration: none;
+  -ms-interpolation-mode: bicubic;
+  width: auto;
+  max-width: 100%;
+  clear: both;
+  display: block;
+}
+
+center {
+  width: 100%;
+  min-width: $global-width;
+}
+
+a img {
+  border: none;
+}
+
+p {
+  margin: 0 0 0 $paragraph-margin-bottom;
+  Margin: 0 0 0 $paragraph-margin-bottom;
+}
+
+table {
+  border-spacing: 0;
+  border-collapse: collapse;
+}
+
+td {
+  word-wrap: break-word;
+  -webkit-hyphens: auto;
+  -moz-hyphens: auto;
+  hyphens: auto;
+  border-collapse: collapse !important;
+}
+
+table, tr, td {
+  padding: 0;
+  vertical-align: top;
+  text-align: left;
+}

data/vendor/assets/stylesheets/foundation-emails/components/_outlook-first.scss

@@ -0,0 +1,11 @@
+// Foundation for Emails by ZURB
+// zurb.com/ink/
+// Licensed under MIT Open Source
+
+////
+/// @group outlook
+////
+
+body.outlook p {
+  display: inline !important;
+}

data/vendor/assets/stylesheets/foundation-emails/components/_thumbnail.scss

@@ -0,0 +1,49 @@
+// Foundation for Emails by ZURB
+// zurb.com/ink/
+// Licensed under MIT Open Source
+
+////
+/// @group thumbnail
+////
+
+/// Border around thumbnail images.
+/// @type Border
+$thumbnail-border: solid 4px $white !default;
+
+/// Bottom margin for thumbnail images.
+/// @type Length
+$thumbnail-margin-bottom: $global-margin !default;
+
+/// Box shadow under thumbnail images.
+/// @type Shadow
+$thumbnail-shadow: 0 0 0 1px rgba($black, 0.2) !default;
+
+/// Box shadow under thumbnail images.
+/// @type Shadow
+$thumbnail-shadow-hover: 0 0 6px 1px rgba($primary-color, 0.5) !default;
+
+/// Transition proprties for thumbnail images.
+/// @type Transition
+$thumbnail-transition: box-shadow 200ms ease-out !default;
+
+/// Default radius for thumbnail images.
+/// @type Number
+$thumbnail-radius: $global-radius !default;
+
+/// Adds thumbnail styles to an element.
+.thumbnail {
+  border: $thumbnail-border;
+  box-shadow: $thumbnail-shadow;
+  display: inline-block;
+  line-height: 0;
+  max-width: 100%;
+  transition: $thumbnail-transition;
+  border-radius: $thumbnail-radius;
+  margin-bottom: $thumbnail-margin-bottom;
+
+  &:hover,
+  &:focus {
+    box-shadow: $thumbnail-shadow-hover;
+  }
+}
+

data/vendor/assets/stylesheets/foundation-emails/components/_typography.scss

@@ -0,0 +1,324 @@
+// Foundation for Emails by ZURB
+// zurb.com/ink/
+// Licensed under MIT Open Source
+
+////
+/// @group typography
+////
+
+/// Global font color.
+/// @type Color
+$global-font-color: $black !default;
+
+/// Global font family.
+/// @type Font
+$body-font-family: Helvetica, Arial, sans-serif !default;
+
+/// Global font weight.
+/// @type Keyword
+$global-font-weight: normal !default;
+
+/// Global font weight.
+/// @type Keyword
+$header-color: inherit !default;
+
+/// Global line height.
+/// @type Number
+$global-line-height: 1.3 !default;
+
+/// Font size of body text.
+/// @type Number
+$global-font-size: 16px !default;
+
+/// Line height of body text.
+/// @type Number
+$body-line-height: $global-line-height !default;
+
+/// Font family of headings.
+/// @type List
+$header-font-family: $body-font-family !default;
+
+/// Font family of headings.
+/// @type List
+$header-font-weight: $global-font-weight !default;
+
+/// Font size of `<h1>` elements.
+/// @type Number
+$h1-font-size: 34px !default;
+
+/// Font size of `<h2>` elements.
+/// @type Number
+$h2-font-size: 30px !default;
+
+/// Font size of `<h3>` elements.
+/// @type Number
+$h3-font-size: 28px !default;
+
+/// Font size of `<h4>` elements.
+/// @type Number
+$h4-font-size: 24px !default;
+
+/// Font size of `<h5>` elements.
+/// @type Number
+$h5-font-size: 20px !default;
+
+/// Font size of `<h6>` elements.
+/// @type Number
+$h6-font-size: 18px !default;
+
+/// Margin bottom of `<h1>` through `<h6>` elements.
+/// @type Number
+$header-margin-bottom: 10px !default;
+
+/// Margin bottom of paragraphs.
+/// @type Number
+$paragraph-margin-bottom: 10px !default;
+
+/// Default font size for `<small>`.
+/// @type Number
+$small-font-size: 80% !default;
+
+/// Color of `<small>` elements when placed inside headers.
+/// @type Color
+$small-font-color: $medium-gray !default;
+
+/// Font size of lead paragraphs.
+/// @type Number
+$lead-font-size: $global-font-size * 1.25 !default;
+
+/// Line height of lead paragraphs.
+/// @type Number
+$lead-line-height: 1.6 !default;
+
+/// Padding inside paragraphs.
+/// @type Number
+$text-padding: 10px !default;
+
+/// Default line height for subheaders.
+/// @type Number
+$subheader-lineheight: 1.4 !default;
+
+/// Default font color for subheaders.
+/// @type Color
+$subheader-color: $dark-gray !default;
+
+/// Default font weight for subheaders.
+/// @type String
+$subheader-font-weight: $global-font-weight !default;
+
+/// Default top margin for subhheaders.
+/// @type Number
+$subheader-margin-top: 4px !default;
+
+/// Default bottom margin for subheaders.
+/// @type Number
+$subheader-margin-bottom: 8px !default;
+
+/// Maximum width of a divider.
+/// @type Number
+$hr-width: $global-width !default;
+
+/// Default border for a divider.
+/// @type List
+$hr-border: 1px solid $medium-gray !default;
+
+/// Default margin for a divider.
+/// @type Number | List
+$hr-margin: 20px auto !default;
+
+/// Text decoration for anchors.
+/// @type Keyword
+$anchor-text-decoration: none !default;
+
+/// Text color of anchors.
+/// @type Color
+$anchor-color: $primary-color !default;
+
+/// Text color of anchors to visited links.
+/// @type Color
+$anchor-color-visited: $anchor-color !default;
+
+/// Text color of anchors on hover.
+/// @type Color
+$anchor-color-hover: darken($primary-color, 10%) !default;
+
+/// Text color of active anchors.
+/// @type Color
+$anchor-color-active: $anchor-color-hover !default;
+
+/// Default font size for statistic numbers.
+/// @type Number
+$stat-font-size: 40px !default;
+
+body,
+table.body,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+td,
+th,
+a {
+  color: $global-font-color;
+  font-family: $body-font-family;
+  font-weight: $global-font-weight;
+  padding: 0;
+  margin: 0;
+  Margin: 0;
+  text-align: left;
+  line-height: $global-line-height;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  color: $header-color;
+  word-wrap: normal;
+  font-family: $header-font-family;
+  font-weight: $header-font-weight;
+  margin-bottom: $header-margin-bottom;
+  Margin-bottom: $header-margin-bottom;
+}
+
+h1 {
+  font-size: $h1-font-size;
+}
+
+h2 {
+  font-size: $h2-font-size;
+}
+
+h3 {
+  font-size: $h3-font-size;
+}
+
+h4 {
+  font-size: $h4-font-size;
+}
+
+h5 {
+  font-size: $h5-font-size;
+}
+
+h6 {
+  font-size: $h6-font-size;
+}
+
+body,
+table.body,
+p,
+td,
+th {
+  font-size: $global-font-size;
+  line-height: $body-line-height;
+}
+
+p {
+  margin-bottom: $paragraph-margin-bottom;
+  Margin-bottom: $paragraph-margin-bottom;
+
+  &.lead {
+    font-size: $lead-font-size;
+    line-height: $lead-line-height;
+  }
+
+  &.subheader {
+    margin-top: $subheader-margin-top;
+    margin-bottom: $subheader-margin-bottom;
+    Margin-top: $subheader-margin-top;
+    Margin-bottom: $subheader-margin-bottom;
+    font-weight: $subheader-font-weight;
+    line-height: $subheader-lineheight;
+    color: $subheader-color;
+  }
+}
+
+small {
+  font-size: $small-font-size;
+  color: $small-font-color;
+}
+
+a {
+  color: $anchor-color;
+  text-decoration: $anchor-text-decoration;
+
+  &:hover {
+    color: $anchor-color-hover;
+  }
+
+  &:active {
+    color: $anchor-color-active;
+  }
+
+  &:visited {
+    color: $anchor-color-visited;
+  }
+}
+
+h1 a,
+h1 a:visited,
+h2 a,
+h2 a:visited,
+h3 a,
+h3 a:visited,
+h4 a,
+h4 a:visited,
+h5 a,
+h5 a:visited,
+h6 a,
+h6 a:visited {
+  color: $anchor-color;
+}
+
+pre {
+  background: $light-gray;
+  margin: 30px 0;
+  Margin: 30px 0;
+
+  code {
+    color: $medium-gray;
+
+    span.callout {
+      color: $dark-gray;
+      font-weight: bold;
+    }
+
+    span.callout-strong {
+      color: $pre-color;
+      font-weight: bold;
+    }
+  }
+}
+
+// Horizontal rule
+
+hr {
+  max-width: $hr-width;
+  height: 0;
+  border-right: 0;
+  border-top: 0;
+  border-bottom: $hr-border;
+  border-left: 0;
+  margin: $hr-margin;
+  Margin: $hr-margin;
+  clear: both;
+}
+
+// Use to style a large number to display a statistic
+.stat {
+  font-size: $stat-font-size;
+  line-height: 1;
+
+  p + & {
+    margin-top: -16px;
+    Margin-top: -16px;
+  }
+}
+
+