nfg_ui 0.9.8.15

data/app/assets/stylesheets/nfg_ui/network_for_good/email/settings/_settings.scss

@@ -0,0 +1,148 @@
+//  Foundation for Emails Settings
+//  ------------------------------
+//
+//  Table of Contents:
+//
+//   1. Global
+//   2. Grid
+//   3. Block Grid
+//   4. Typography
+//   5. Button
+//   6. Callout
+//   7. Menu
+//   8. Thumbnail
+
+
+// 1. Global
+// ---------
+
+$primary-color: #25aceb;
+$secondary-color: #9A9A9A;
+$success-color: #59bf22;
+$warning-color: #ffaa00;
+$alert-color: #ff6d33;
+$light-gray: #F7F7F7;
+$medium-gray: #D8D8D8;
+$dark-gray: #4D4D4D;
+$black: #000000;
+$white: #ffffff;
+$pre-color: #ff6908;
+$global-width: 580px;
+$global-width-small: 100%;
+$global-gutter: 24px;
+$body-background: $light-gray;
+$container-background: $white;
+$global-padding: 12px;
+$global-margin: 12px;
+$global-radius: 3px;
+$global-rounded: 500px;
+$global-breakpoint: $global-width + $global-gutter;
+
+// 2. Grid
+// -------
+
+$grid-column-count: 12;
+$column-padding-bottom: 0;
+$container-radius: 0;
+
+// 3. Block Grid
+// -------------
+
+$block-grid-max: 8;
+$block-grid-gutter: $global-gutter;
+
+// 4. Typography
+// -------------
+
+$global-font-color: $dark-gray;
+$body-font-family: Helvetica, Arial, sans-serif;
+$global-font-weight: normal;
+$bold-font-weight: 500;
+$header-color: inherit;
+$global-line-height: 1.5;
+$global-font-size: 14px;
+$body-line-height: $global-line-height;
+$header-font-family: Helvetica, Arial, sans-serif;
+$header-font-weight: $bold-font-weight;
+$h1-font-size: 30px;
+$h2-font-size: 27px;
+$h3-font-size: 24px;
+$h4-font-size: 20px;
+$h5-font-size: 17px;
+$h6-font-size: 14px;
+$header-margin-bottom: 12px;
+$paragraph-margin-bottom: 12px;
+$small-font-size: 80%;
+$small-font-color: $secondary-color;
+$lead-font-size: $global-font-size * 1.25;
+$lead-line-height: 1.6;
+$text-padding: 12px;
+$subheader-lineheight: 1.4;
+$subheader-color: $secondary-color;
+$subheader-font-weight: $global-font-weight;
+$subheader-margin-top: 4px;
+$subheader-margin-bottom: 8px;
+$hr-width: $global-width;
+$hr-border: 1px solid $medium-gray;
+$hr-margin: 24px auto;
+$anchor-text-decoration: underline;
+$anchor-color: $primary-color;
+$anchor-color-visited: $anchor-color;
+$anchor-color-hover: darken($primary-color, 10%);
+$anchor-color-active: $anchor-color-hover;
+$stat-font-size: 40px;
+
+// 5. Button
+// ---------
+
+$button-padding: (
+  tiny: 2px 3px 2px 3px,
+  small: 5px 6px 5px 6px,
+  default: 7px 9px 7px 9px,
+  large: 10px 12px 10px 12px,
+);
+$button-font-size: (
+  tiny: 12px,
+  small: 14px,
+  default: 15px,
+  large: 17px,
+);
+$button-color: $white;
+$button-color-alt: $medium-gray;
+$button-font-weight: bold;
+$button-margin: 0 0 $global-margin 0;
+$button-background: $primary-color;
+$button-border: 0px solid transparent;
+$button-radius: $global-radius;
+$button-rounded: $global-rounded;
+
+// 6. Callout
+// ----------
+
+$callout-background: $white;
+$callout-background-fade: 85%;
+$callout-padding: 12px;
+$callout-margin-bottom: $global-margin;
+$callout-border: 1px solid darken($callout-background, 20%);
+$callout-border-secondary: 1px solid darken($secondary-color, 20%);
+$callout-border-success: 1px solid darken($success-color, 20%);
+$callout-border-warning: 1px solid darken($warning-color, 20%);
+$callout-border-alert: 1px solid darken($alert-color, 20%);
+
+// 7. Menu
+// -------
+
+$menu-item-padding: 12px;
+$menu-item-gutter: 12px;
+$menu-item-color: $primary-color;
+
+// 8. Thumbnail
+// ------------
+
+$thumbnail-border: solid 6px $white;
+$thumbnail-margin-bottom: $global-margin;
+$thumbnail-shadow: 0 0 0 1px rgba($black, 0.2);
+$thumbnail-shadow-hover: 0 0 6px 1px rgba($primary-color, 0.5);
+$thumbnail-transition: box-shadow 200ms ease-out;
+$thumbnail-radius: $global-radius;
+