bootstrap-email 0.2.2 → 0.2.3

data/core/sass/_container.scss

@@ -0,0 +1,18 @@
+.container {
+  width: 100%;
+  & > tbody > tr > td {
+    padding: 0 $font-size-base;
+    & > table {
+      width: 100%;
+      max-width: 600px;
+    }
+  }
+}
+
+.container-fluid {
+  width: 100%;
+  & > tbody > tr > td {
+    padding: 0 $font-size-base;
+    width: 100%;
+  }
+}

data/core/sass/_display.scss

@@ -0,0 +1,7 @@
+.d-mobile {
+  display: none;
+}
+
+.d-desktop {
+  display: block;
+}

data/core/sass/_functions.scss

@@ -0,0 +1,14 @@
+// Color contrast
+@mixin color-yiq($color) {
+  $r: red($color);
+  $g: green($color);
+  $b: blue($color);
+
+  $yiq: (($r * 299) + ($g * 587) + ($b * 114)) / 1000;
+
+  @if ($yiq >= 150) {
+    color: #111111;
+  } @else {
+    color: $white;
+  }
+}

data/core/sass/_grid.scss

@@ -0,0 +1,131 @@
+table.row {
+  margin-right: -15px;
+  margin-left: -15px;
+  table-layout: fixed;
+  width: 100%;
+}
+
+th.col-1,
+th.col-lg-1,
+th.col-2,
+th.col-lg-2,
+th.col-3,
+th.col-lg-3,
+th.col-4,
+th.col-lg-4,
+th.col-5,
+th.col-lg-5,
+th.col-6,
+th.col-lg-6,
+th.col-7,
+th.col-lg-7,
+th.col-8,
+th.col-lg-8,
+th.col-9,
+th.col-lg-9,
+th.col-10,
+th.col-lg-10,
+th.col-11,
+th.col-lg-11,
+th.col-12,
+th.col-lg-12 {
+  min-height: 1px;
+  padding-right: 15px;
+  padding-left: 15px;
+  font-weight: normal;
+}
+
+table.no-gutters {
+  margin-right: 0;
+  margin-left: 0;
+}
+
+.no-gutters > thead > tr {
+  & > th.col-1,
+  & > th.col-lg-1,
+  & > th.col-2,
+  & > th.col-lg-2,
+  & > th.col-3,
+  & > th.col-lg-3,
+  & > th.col-4,
+  & > th.col-lg-4,
+  & > th.col-5,
+  & > th.col-lg-5,
+  & > th.col-6,
+  & > th.col-lg-6,
+  & > th.col-7,
+  & > th.col-lg-7,
+  & > th.col-8,
+  & > th.col-lg-8,
+  & > th.col-9,
+  & > th.col-lg-9,
+  & > th.col-10,
+  & > th.col-lg-10,
+  & > th.col-11,
+  & > th.col-lg-11,
+  & > th.col-12,
+  & > th.col-lg-12{
+    padding-right: 0;
+    padding-left: 0;
+  }
+}
+
+th.col-1,
+th.col-lg-1 {
+  width: 8.333333%;
+}
+
+th.col-2,
+th.col-lg-2 {
+  width: 16.666667%;
+}
+
+th.col-3,
+th.col-lg-3 {
+  width: 25%;
+}
+
+th.col-4,
+th.col-lg-4 {
+  width: 33.333333%;
+}
+
+th.col-5,
+th.col-lg-5 {
+  width: 41.666667%;
+}
+
+th.col-6,
+th.col-lg-6 {
+  width: 50%;
+}
+
+th.col-7,
+th.col-lg-7 {
+  width: 58.333333%;
+}
+
+th.col-8,
+th.col-lg-8 {
+  width: 66.666667%;
+}
+
+th.col-9,
+th.col-lg-9 {
+  width: 75%;
+}
+
+th.col-10,
+th.col-lg-10 {
+  width: 83.333333%;
+}
+
+th.col-11,
+th.col-lg-11 {
+  width: 91.666667%;
+}
+
+th.col-12,
+th.col-lg-12 {
+  width: 100%;
+}

data/core/sass/_hr.scss

@@ -0,0 +1,14 @@
+div.hr {
+  width: 100%;
+  border: 0;
+  margin: $font-size-base*1.25 0;
+  & > table {
+    width: 100%;
+    & > tbody > tr > td {
+      width: 100%;
+      border-top: 1px solid #dddddd;
+      height: 1px;
+      width: 100%;
+    }
+  }
+}

data/core/sass/_image.scss

@@ -0,0 +1,5 @@
+.img-fluid {
+  height: auto;
+  width: 100%;
+  max-width: 100%;
+}

data/core/sass/_preview.scss

@@ -0,0 +1,5 @@
+.preview {
+  display: none;
+  max-height: 0px;
+  overflow: hidden;
+}

data/core/sass/_reboot_email.scss

@@ -0,0 +1,63 @@
+/* Based on https://templates.mailchimp.com/development/css/reset-styles/ by Mailchimp */
+body, .body {
+  margin: 0;
+  Margin: 0;
+  padding: 0;
+  border: 0;
+  outline: 0;
+  width: 100%;
+  min-width: 100%;
+  height: 100%;
+  -webkit-text-size-adjust: 100%;
+  -ms-text-size-adjust: 100%;
+  font-family: $font-family-sans-serif;
+  line-height: $line-height-base * $font-size-base;
+  font-weight: normal;
+  font-size: $font-size-base;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+img {
+  border: 0 none;
+  height: auto;
+  line-height: 100%;
+  outline: none;
+  text-decoration: none;
+}
+
+a img {
+  border: 0 none;
+}
+
+// don't apply to spacers
+table:not([class^=s-]) {
+  font-family: $font-family-sans-serif;
+  mso-table-lspace: 0pt;
+  mso-table-rspace: 0pt;
+}
+
+table:not([class^=s-]) {
+  border-spacing: 0px;
+  border-collapse: collapse;
+  td {
+    border-spacing: 0px;
+    border-collapse: collapse;
+  }
+}
+
+// to fix centering in yahoo
+table[align=center] {
+  margin: 0 auto;
+}
+
+th,
+td,
+p {
+  text-align: left;
+  line-height: $line-height-base * $font-size-base;
+  font-size: $font-size-base;
+  margin: 0;
+}
+

data/core/sass/_spacing.scss

@@ -0,0 +1,100 @@
+// Width Helper
+@each $size, $percentage in $widths {
+  .w-#{$size} {
+    width: $percentage;
+    & > tbody > tr > td {
+      width: $percentage;
+    }
+  }
+}
+
+@each $size, $percentage in $widths {
+  .w-lg-#{$size} {
+    width: $percentage;
+    & > tbody > tr > td {
+      width: $percentage;
+    }
+  }
+}
+
+// Padding Helper
+@each $size, $length in $spacers {
+  .p-#{$size} {
+    & > tbody > tr > td {
+      padding: $length;
+    }
+  }
+  .pt-#{$size},
+  .py-#{$size} {
+    & > tbody > tr > td {
+      padding-top: $length;
+    }
+  }
+  .pr-#{$size},
+  .px-#{$size} {
+    & > tbody > tr > td {
+      padding-right: $length;
+    }
+  }
+  .pb-#{$size},
+  .py-#{$size} {
+    & > tbody > tr > td {
+      padding-bottom: $length;
+    }
+  }
+  .pl-#{$size},
+  .px-#{$size} {
+    & > tbody > tr > td {
+      padding-left: $length;
+    }
+  }
+}
+
+@each $size, $length in $spacers {
+  .p-lg-#{$size} {
+    & > tbody > tr > td {
+      padding: $length;
+    }
+  }
+  .pt-lg-#{$size},
+  .py-lg-#{$size} {
+    & > tbody > tr > td {
+      padding-top: $length;
+    }
+  }
+  .pr-lg-#{$size},
+  .px-lg-#{$size} {
+    & > tbody > tr > td {
+      padding-right: $length;
+    }
+  }
+  .pb-lg-#{$size},
+  .py-lg-#{$size} {
+    & > tbody > tr > td {
+      padding-bottom: $length;
+    }
+  }
+  .pl-lg-#{$size},
+  .px-lg-#{$size} {
+    & > tbody > tr > td {
+      padding-left: $length;
+    }
+  }
+}
+
+// Spacing Helper
+@each $size, $length in $spacers {
+  .s-#{$size} > tbody > tr > td {
+    font-size: $length;
+    line-height: $length;
+    height: $length;
+  }
+}
+
+@each $size, $length in $spacers {
+  .s-lg-#{$size} > tbody > tr > td {
+    font-size: $length;
+    line-height: $length;
+    height: $length;
+  }
+}

data/core/sass/_table.scss

@@ -0,0 +1,137 @@
+//
+// Basic Bootstrap table
+//
+
+.table {
+  width: 100%;
+  max-width: 100%;
+  // margin-bottom: $spacer;
+  background-color: $white; // Reset for nesting within parents with `background-color`.
+
+  & > thead > tr > th {
+    text-align: left;
+  }
+
+  & > thead > tr > th,
+  & > tbody > tr > td {
+    padding: 0.75 * $font-size-base;
+    vertical-align: top;
+    border-top: $table-border-width solid $table-border-color;
+  }
+
+  & > thead > th {
+    vertical-align: bottom;
+    border-bottom: (2 * $table-border-width) solid $table-border-color;
+  }
+}
+
+.table-unstyled{
+  width: 100%;
+  max-width: 100%;
+  background-color: transparent;
+  td, th{
+    border-top: 0;
+    border-bottom: 0;
+    text-align: left;
+  }
+}
+
+
+//
+// Condensed table w/ half padding
+//
+
+.table-sm {
+  & > thead > tr > th,
+  & > tbody > tr > td {
+    padding: 0.3 * $font-size-base;;
+  }
+}
+
+
+// Bordered version
+//
+// Add borders all around the table and between all the columns.
+
+.table-bordered {
+  border: $table-border-width solid $table-border-color;
+
+  & > thead > tr > th,
+  & > tbody > tr > td {
+    border: $table-border-width solid $table-border-color;
+  }
+
+  & > thead {
+    & > tr > th,
+    & > tr > td {
+      border-bottom-width: (2 * $table-border-width);
+    }
+  }
+}
+
+
+// Zebra-striping
+//
+// Default zebra-stripe styles (alternating gray and transparent backgrounds)
+
+.table-striped {
+  & > tbody > tr:nth-of-type(odd) {
+    background-color: #f2f2f2;
+  }
+}
+
+
+// Table backgrounds
+//
+// Exact selectors below required to override `.table-striped` and prevent
+// inheritance to nested tables.
+
+@each $color, $value in $theme-colors {
+  .table-#{$color} {
+    &,
+    > th,
+    > td {
+      background-color: lighten($value, 40%);
+    }
+  }
+}
+
+
+
+// Inverse styles
+//
+// Same table markup, but inverted color scheme: dark background and light text.
+
+.thead-inverse {
+  & > thead > tr > th {
+    color: $white;
+    background-color: $gray-900;
+  }
+}
+
+.thead-default {
+  & > thead > tr > th {
+    color: $gray-700;
+    background-color: $gray-200;
+  }
+}
+
+.table-inverse {
+  color: $white;
+  background-color: $gray-900;
+
+  & > thead > tr > th,
+  & > tbody > tr > td {
+    border-color: #32383e;
+  }
+
+  &.table-bordered {
+    border: 0;
+  }
+
+  &.table-striped {
+    & > tbody > tr:nth-of-type(odd) {
+      background-color: #2c3034;
+    }
+  }
+}