nfg_ui 0.10.5 → 0.10.6

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 7e6fb7eaae723d2726e41b01347417d802c085b5e47ed58446b7051f3d0cf55b
-  data.tar.gz: d65dcb67b6a57ac37503717c69a8cd5963dec852a95beb46ee17933f2b14c5d8
+  metadata.gz: 01a76c6faab975ddfc09854c5d444ed19e4b5d7be26fcda75aa2cdc51ea202b5
+  data.tar.gz: 3ac42aa0bc08ea79061855b822b0e0c0d59f6e1c0f7e977284cb1dab150f08b6
 SHA512:
-  metadata.gz: bb9925852e4f5daf3ef6d42bac3ba4e4b1fc2580a139ff12458b822439832a8ed19a8fb69509d06fd6667513fb3569b2248bbb599479754d0f8cf0f5cbe8af2d
-  data.tar.gz: ef6aecf55597415d8dd1c4e3e9137dbd782ddef98c1511867e5fd7777d6e3bf8fc2c741d3877d4f6a61ea3e97837da853de6bf994d96bdddcf6c539f8bf7fda6
+  metadata.gz: bbf3b10543ba1920e656cdc3ea6a88d3ba880f51977743c76f196b2302d24bc4136a5d7c8096cd72f0a6f686e58748c3f1db0e8213b9e5132048a4a7899867e5
+  data.tar.gz: f689e701c3eb39745f027ae0eb2cd1ffa4cc8762df626f4f2049c15b7f7978e4f218617d13c75b045472921ee4346203d1616bd8f1b2520458c5fc01a609975e

data/app/assets/fonts/product_icons/IcoMoon-product-icons.svg

@@ -0,0 +1,35 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata>
+<json>
+<![CDATA[
+{
+	"fontFamily": "IcoMoon---Ultimate",
+	"fontURL": "http://icomoon.io/#icons",
+	"designer": "Keyamoon",
+	"designerURL": "http://keyamoon.com",
+	"license": "Custom",
+	"licenseURL": "http://icomoon.io/#icons#license",
+	"version": "Version 1.0",
+	"majorVersion": 0,
+	"fontId": "IcoMoon---Ultimate",
+	"psName": "IcoMoon---Ultimate",
+	"subFamily": "Regular",
+	"fullName": "IcoMoon---Ultimate",
+	"description": "Font generated by IcoMoon."
+}
+]]>
+</json>
+</metadata>
+<defs>
+<font id="IcoMoon---Ultimate" horiz-adv-x="1024">
+<font-face units-per-em="1024" ascent="960" descent="-64" />
+<missing-glyph horiz-adv-x="1024" />
+<glyph unicode="&#x20;" d="" />
+<glyph unicode="&#xe199;" glyph-name="product-fundraising-coach" data-tags="user, profile, avatar, person, talk, member, employee, job, official" d="M320 768c0 106.039 85.961 192 192 192s192-85.961 192-192c0-106.039-85.961-192-192-192s-192 85.961-192 192zM768.078 512h-35.424l-199.104-404.244 74.45 372.244-96 96-96-96 74.45-372.244-199.102 404.244h-35.424c-127.924 0-127.924-85.986-127.924-192v-320h768v320c0 106.014 0 192-127.922 192z" />
+<glyph unicode="&#xe466;" glyph-name="sso-disbursements" data-tags="table, wysiwyg" d="M0 896v-896h1024v896h-1024zM384 320v192h256v-192h-256zM640 256v-192h-256v192h256zM640 768v-192h-256v192h256zM320 768v-192h-256v192h256zM64 512h256v-192h-256v192zM704 512h256v-192h-256v192zM704 576v192h256v-192h-256zM64 256h256v-192h-256v192zM704 64v192h256v-192h-256z" />
+<glyph unicode="&#xe683;" glyph-name="sso-donation-pages" data-tags="cash, money, payment" d="M947.2-51.2h-921.6c-14.138 0-25.6 11.461-25.6 25.6v512c0 14.138 11.462 25.6 25.6 25.6h921.6c14.139 0 25.6-11.462 25.6-25.6v-512c0-14.139-11.461-25.6-25.6-25.6zM51.2 0h870.4v460.8h-870.4v-460.8zM588.8 256h-179.2v51.2h179.2c14.139 0 25.6 11.461 25.6 25.6s-11.461 25.6-25.6 25.6h-76.8v25.6c0 14.139-11.462 25.6-25.6 25.6s-25.6-11.461-25.6-25.6v-25.6h-76.8c-14.138 0-25.6-11.461-25.6-25.6v-102.4c0-14.139 11.462-25.6 25.6-25.6h179.2v-51.2h-179.2c-14.138 0-25.6-11.461-25.6-25.6s11.462-25.6 25.6-25.6h76.8v-25.6c0-14.139 11.462-25.6 25.6-25.6s25.6 11.461 25.6 25.6v25.6h76.8c14.139 0 25.6 11.461 25.6 25.6v102.4c0 14.139-11.461 25.6-25.6 25.6zM896 563.2h-819.2c-14.138 0-25.6 11.462-25.6 25.6s11.462 25.6 25.6 25.6h819.2c14.139 0 25.6-11.462 25.6-25.6s-11.461-25.6-25.6-25.6zM844.8 665.6h-716.8c-14.138 0-25.6 11.462-25.6 25.6s11.462 25.6 25.6 25.6h716.8c14.139 0 25.6-11.462 25.6-25.6s-11.461-25.6-25.6-25.6z" />
+<glyph unicode="&#xe6ba;" glyph-name="sso-dms" data-tags="pie-chart, statistics" d="M435.2-51.2c-116.246 0-225.534 45.269-307.733 127.467s-127.467 191.488-127.467 307.733c0 116.246 45.269 225.534 127.467 307.733s191.486 127.467 307.733 127.467c14.138 0 25.6-11.462 25.6-25.6v-384h384c14.139 0 25.6-11.461 25.6-25.6 0-116.245-45.269-225.534-127.467-307.733s-191.488-127.467-307.733-127.467zM409.6 767.157c-199.842-13.226-358.4-180.026-358.4-383.157 0-211.739 172.262-384 384-384 203.131 0 369.931 158.558 383.157 358.4h-383.157c-14.138 0-25.6 11.461-25.6 25.6v383.157zM947.2 460.8h-409.6c-14.139 0-25.6 11.462-25.6 25.6v409.6c0 14.138 11.461 25.6 25.6 25.6 116.245 0 225.534-45.269 307.733-127.467s127.467-191.486 127.467-307.733c0-14.138-11.461-25.6-25.6-25.6zM563.2 512h357.557c-12.664 191.374-166.184 344.891-357.557 357.557v-357.557z" />
+<glyph unicode="&#xe900;" glyph-name="sso-donatenow" data-tags="money" horiz-adv-x="1097" d="M438.857 292.571h219.429v54.857h-73.143v256h-65.143l-84.571-78.286 44-45.714c13.714 12 22.286 18.286 31.429 32.571h1.143v-164.571h-73.143v-54.857zM731.429 438.857c0-104-62.857-237.714-182.857-237.714s-182.857 133.714-182.857 237.714 62.857 237.714 182.857 237.714 182.857-133.714 182.857-237.714zM1024 292.571v292.571c-80.571 0-146.286 65.714-146.286 146.286h-658.286c0-80.571-65.714-146.286-146.286-146.286v-292.571c80.571 0 146.286-65.714 146.286-146.286h658.286c0 80.571 65.714 146.286 146.286 146.286zM1097.143 768v-658.286c0-20-16.571-36.571-36.571-36.571h-1024c-20 0-36.571 16.571-36.571 36.571v658.286c0 20 16.571 36.571 36.571 36.571h1024c20 0 36.571-16.571 36.571-36.571z" />
+</font></defs></svg>

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/_variables.scss

@@ -700,9 +700,9 @@ $nav-tabs-link-active-color:        $body-color;
 $nav-tabs-link-active-bg:           transparent;
 $nav-tabs-link-active-border-color: $primary;
 
-// $nav-pills-border-radius:           $border-radius !default;
-// $nav-pills-link-active-color:       $component-active-color !default;
-// $nav-pills-link-active-bg:          $component-active-bg !default;
+$nav-pills-border-radius:           0;
+$nav-pills-link-active-color:       $white;
+$nav-pills-link-active-bg:          darken(#006D9D, 10%);
 
 $nav-divider-color:                 $border-color;
 $nav-divider-margin-y:              0;

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/application.scss

@@ -18,8 +18,10 @@
 @import 'nfg_ui/network_for_good/public/plugins/datepicker';
 @import 'nfg_ui/network_for_good/public/plugins/datetimepicker';
 @import 'nfg_ui/network_for_good/public/plugins/intercom'; // only in admin layouts
-@import 'nfg_ui/network_for_good/public/plugins/sticky_div';
 @import 'nfg_ui/network_for_good/public/plugins/select2';
+@import 'nfg_ui/network_for_good/public/plugins/sticky_div';
+@import 'nfg_ui/network_for_good/public/plugins/turbolinks';
+@import 'nfg_ui/network_for_good/public/plugins/twitter_typeahead';
 
 // Legacy browser support
 @import 'nfg_ui/network_for_good/public/legacy_browser_support/application';

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_alert.scss

@@ -1,2 +1,18 @@
 // Custom type color
-.alert { color: $body-color; }
+.alert {
+  color: $body-color;
+  a {
+    text-decoration: underline;
+    &:hover, &:active { text-decoration: none; }
+  }
+}
+.alert-success a { color: $success; }
+.alert-info a { color: $info; }
+.alert-warning a { color: $warning; }
+.alert-danger, .alert-error {
+  a { color: $danger; }
+}
+.alert-gray, .alert-notice,
+.alert-light, .alert-dark {
+  a { color: inherit; }
+}

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_button-group.scss

@@ -20,3 +20,24 @@
   > .btn:not(:first-child),
   > .btn-group:not(:first-child) > .btn { @include border-top-radius($btn-border-radius); }
 }
+
+// Buttons on quick add modal in DMS
+.btn-group-quick-add {
+  .col-4 {
+    &:nth-child(1n) { border-left: $border-width solid $border-color; }
+    @include media-breakpoint-down(sm) {
+      &:first-child { border-left: none; }
+    }
+    @include media-breakpoint-up(sm) {
+      &:nth-child(3n+1) { border-left: none; }
+      &:nth-child(1n+4) { border-top: $border-width solid $border-color; }
+    }
+    .btn-link {
+      padding-top: $spacer;
+      padding-bottom: $spacer;
+      width: 100%;
+      height: 100%;
+      @include hover-focus { background-color: $body-bg; }
+    }
+  }
+}

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_custom.scss

@@ -8,13 +8,14 @@
 @import 'custom/custom_receipt_language';
 @import 'custom/device_preview';
 @import 'custom/email_preview';
+@import 'custom/free_trial';
+@import 'custom/icomoon';
 @import 'custom/illustration';
 @import 'custom/interaction';
 @import 'custom/mobile';
 @import 'custom/nav_step';
 @import 'custom/overlay_blocker';
 @import 'custom/page_header';
-@import 'custom/product_icons';
 @import 'custom/redactor';
 @import 'custom/share_dropdown';
 @import 'custom/social_share';

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_dropdown.scss

@@ -21,4 +21,17 @@
 
 
 // Sizing
-.dropdown-menu-md { min-width: ($spacer * 12); }
+.dropdown-menu-md { min-width: ($spacer * 12); }
+
+
+// Styles for wider "My Tools" dropdown in top nav
+#my_tools_dropdown {
+  @include media-breakpoint-down(sm) { max-width: 100vw; }
+  .media {
+    div {
+      &:first-child { width: 60px; }
+      &:last-child { width: 38px; }
+    }
+    .media-body { width: 240px; }
+  }
+}

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_forms.scss

@@ -1,3 +1,7 @@
+.form-control {
+  &[readonly] { background-color: $input-bg; }
+}
+
 // Required styles
 label {
   font-weight: $font-weight-bold;
@@ -10,6 +14,11 @@ label {
       padding-right: ($spacer * .25);
     }
   }
+  .required, abbr[title='required'] {
+    color: $danger;
+    cursor: default;
+    border-bottom: none;
+  }
 }
 
 textarea.form-control { min-height: ($spacer * 6); }

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_grid.scss

@@ -0,0 +1,52 @@
+// Specific container styles for DMS
+.container-wrap {
+  position: relative;
+  z-index: 0;
+  @include media-breakpoint-down(lg) {
+    padding-bottom: ($spacer * 2);
+    &.nav-slide {
+      .site-navbar { left: 200px; }
+      .container-main { margin-left: 200px; }
+    }
+  }
+  @include media-breakpoint-up(xl) {
+    padding-top: ($spacer * 2);
+    padding-left: 200px;
+  }
+}
+
+// Wraps main page content
+.container-main {
+  margin-left: 0;
+  padding-right: ($grid-gutter-width / 2);
+  padding-left: ($grid-gutter-width / 2);
+  width: 100%;
+  @include transition(margin-left .2s ease-in-out);
+  @include media-breakpoint-up(xl) {
+    padding-right: $grid-gutter-width;
+    padding-left: $grid-gutter-width;
+  }
+
+  // Used in DMS to make the tiles the width of device on mobile size
+  > .container-fluid:not(.page-header) {
+    @include media-breakpoint-down(sm) {
+      margin-right: -($grid-gutter-width / 2);
+      margin-left: -($grid-gutter-width / 2);
+      width: auto;
+    }
+  }
+}
+
+// Used in banners at the top of the app (ex: engagement banner)
+.container-flush {
+  margin-left: -$spacer;
+  margin-right: -$spacer;
+}
+
+// Used in page header for most situations
+.container-narrow {
+  @include media-breakpoint-down(sm) {
+    padding-right: ($grid-gutter-width / 2);
+    padding-left: ($grid-gutter-width / 2);
+  }
+}

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_modal.scss

@@ -0,0 +1,6 @@
+// Hides #quick-add-modal modal if task modal is enabled in DMS
+#task-modal.show {
+  z-index: $zindex-modal + 1;
+  + #quick-add-modal { display: none !important; }
+  ~ .modal-backdrop.show ~ .modal-backdrop.show { display: none !important; }
+}

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_nav.scss

@@ -20,3 +20,85 @@
     }
   }
 }
+
+// Top navigation bar in DMS
+.site-nav {
+  position: fixed;
+  top: 0;
+  width: 200px;
+  height: 100%;
+  background-color: #006D9D;
+  overflow-y: auto;
+  -webkit-overflow-scrolling: touch;
+  @include transition(all .2s ease-in-out);
+  @include media-breakpoint-down(lg) {
+    left: -200px;
+    opacity: 0;
+    z-index: 10;
+    overflow-x: hidden;
+  }
+  @include media-breakpoint-up(xl) {
+    left: 0;
+    z-index: 30;
+  }
+
+  // Slide styles
+  &.nav-slide {
+    @include media-breakpoint-down(lg) {
+      left: 0;
+      opacity: 1;
+      z-index: 30;
+      overflow-x: visible;
+      overflow-y: auto;
+    }
+  }
+  .nav-pills {
+    .nav-item {
+      font-weight: $font-weight-bold;
+      line-height: $line-height-sm;
+    }
+    .nav-link {
+      padding: ($spacer * .75) ($spacer * .5);
+      @include border-radius($nav-pills-border-radius);
+      color: $white;
+      vertical-align: middle;
+      background-color: transparent;
+      border-left: 4px solid transparent;
+      @include clearfix();
+      @include transition($btn-transition);
+      &:hover, &.active, &[aria-expanded="true"] {
+        color: $nav-pills-link-active-color;
+        cursor: pointer;
+        background-color: $nav-pills-link-active-bg;
+      }
+      .fa {
+        width: 1em;
+        min-width: 14px;
+        line-height: 18px;
+      }
+    }
+    &.nav-sub-menu {
+      .nav-link {
+        padding-top: ($spacer * .5);
+        padding-bottom: ($spacer * .5);
+        font-size: ($font-size-base * .75);
+        line-height: $line-height-base;
+        background-color: darken(#006D9D, 13%);
+        &:hover, &:focus, &.active {
+          background-color: darken(#006D9D, 17%);
+        }
+      }
+    }
+  }
+}
+
+// Color variations for border
+@each $color in $colors {
+  .site-nav {
+    .nav-item.#{nth($color, 1)} {
+      .nav-link {
+        &:hover, &.active, &[aria-expanded="true"] { border-color: nth($color, 2); }
+      }
+    }
+  }
+}

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_navbar.scss

@@ -1,4 +1,4 @@
-// Styles that replicate the legacy top navs
+// Styles that replicate the legacy top navs in EVO
 #admin-nav {
   background-color: #444444;
   .navbar {
@@ -130,3 +130,96 @@
     }
   }
 }
+
+// Main navigation bar (left) in DMS
+.site-navbar {
+  position: fixed;
+  right: 0;
+  left: 0;
+  z-index: $zindex-fixed;
+  @include transition(left .2s ease-in-out);
+  @include media-breakpoint-down(lg) {
+    bottom: 0;
+    width: 100%;
+    border-top: $border-width solid $nav-divider-color;
+  }
+  @include media-breakpoint-up(xl) {
+    top: 0;
+    left: 200px;
+    border-bottom: $border-width solid $nav-divider-color;
+  }
+  .navbar-brand {
+    font-size: ($font-size-base * .75);
+    @include media-breakpoint-down(lg) { display: none !important; }
+  }
+  .nav {
+    @include media-breakpoint-down(lg) { width: 100%; }
+    .nav-item {
+      position: relative;
+      font-size: ($font-size-base * .75);
+      font-weight: $font-weight-bold;
+      line-height: 1;
+      text-align: center;
+      border-left: $border-width solid $border-color;
+      @include media-breakpoint-down(lg) {
+        width: 20%;
+        &:first-child { border-left: none; }
+      }
+      .nav-alert {
+        position: absolute;
+        top: -4px;
+        right: -4px;
+        width: 8px;
+        height: 8px;
+        background-color: $primary;
+        @include border-radius(50%);
+        box-shadow: 0 0 0 2px rgba(255,255,255,1);
+        &.nav-alert-danger { background-color: $danger; }
+      }
+      .nav-link {
+        color: $text-muted;
+        outline: none !important;
+        @include transition(background-color .2s ease-in-out);
+        @include media-breakpoint-down(sm) { padding: ($spacer * .5); }
+        @include media-breakpoint-up(md) { padding: 18px $spacer; }
+        @include hover() { background-color: $body-bg; }
+        &[aria-expanded="true"],
+        &:not(:disabled):not(.disabled).active { background-color: $body-bg; }
+        &.disabled {
+          cursor: disabled;
+          pointer-events: none;
+          opacity: .4;
+        }
+        &.dropdown-toggle {
+          @include media-breakpoint-down(lg) {
+            + .dropdown-menu {
+              top: auto;
+              bottom: 100%;
+              margin-bottom: 2px;
+            }
+          }
+        }
+        &.has-label {
+          @include media-breakpoint-up(xl) {
+            padding-top: 15px;
+            height: ($spacer * 2);
+          }
+        }
+        .nav-text {
+          &.visible {
+            @include media-breakpoint-up(xl) { display: inline-block; }
+          }
+          @include media-breakpoint-down(sm) {
+            display: block;
+            margin-top: 2px;
+            font-weight: $font-weight-bold;
+            font-size: 10px;
+          }
+          @include media-breakpoint-up(md) { margin-left: ($spacer * .25); }
+          @include media-breakpoint-up(xl) { display: none; }
+        }
+        + .nav-link { margin-left: 0; }
+      }
+    }
+  }
+}

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_free_trial.scss

@@ -0,0 +1,52 @@
+// Free trial styles for DMS
+
+// Height of banner
+$free_trial_banner_height: 6.2rem;
+
+// Styles for container elements when body tag is using .has-free-trial
+body.has-free-trial.nfg_ui {
+  padding-top: 0;
+
+  // For Top Banner
+  @include media-breakpoint-down(lg) {
+    .site-nav { padding-top: $free_trial_banner_height; }
+    .page-wrap { padding-top: $free_trial_banner_height; }
+  }
+  @include media-breakpoint-up(xl) {
+    .site-nav {
+      top: $free_trial_banner_height;
+      height: calc(100% - 62px);
+    }
+    .full_width_layout { padding-top: ($spacer * 3); }
+    .container-wrap { padding-top: ($spacer * 2) + $free_trial_banner_height; }
+    .site-navbar, .email-navbar { top: $free_trial_banner_height; }
+
+    .page-wrap { padding-top: ($spacer * 2) + ($spacer * .5) + $free_trial_banner_height; }
+    .builder-container { padding-top: 110px !important; }
+    .sidebar { padding-top: $free_trial_banner_height; }
+
+    .builder-header { top: $free_trial_banner_height; }
+    .builder-wrap { padding-top: ($spacer * 2) + $free_trial_banner_height; }
+    .builder-options { padding-top: ($spacer * 3) + $spacer + $free_trial_banner_height; }
+
+    // Sticky redactor to render above the free trial banner
+    #email-layout .cs-html-editor-overlay,
+    .cs-html-editor-overlay { z-index: $zindex-fixed + 2; }
+  }
+  @include media-breakpoint-up(xl) {
+    .sidebar { height: 100%; }
+  }
+
+  // Free trial banner specific styles
+  .free-trial-alert {
+    z-index: $zindex-fixed + 1;
+    @include media-breakpoint-up(xl) {
+      position: fixed !important;
+      top: 0;
+      left: 0;
+      right: 0;
+      width: 100%;
+    }
+  }
+}
+

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_icomoon.scss

@@ -0,0 +1,33 @@
+// Product icons
+@font-face {
+  font-family: 'IcoMoon-product-icons';
+  src:  font-url('product_icons/IcoMoon-product-icons.eot?b2y89i');
+  src:  font-url('product_icons/IcoMoon-product-icons.eot?b2y89i#iefix') format('embedded-opentype'),
+    font-url('product_icons/IcoMoon-product-icons.ttf?b2y89i') format('truetype'),
+    font-url('product_icons/IcoMoon-product-icons.woff?b2y89i') format('woff'),
+    font-url('product_icons/IcoMoon-product-icons.svg?b2y89i#IcoMoon-product-icons') format('svg');
+  font-weight: normal;
+  font-style: normal;
+}
+[class^="icon-sso-"], [class*=" icon-sso-"] {
+  /* use !important to prevent issues with browser extensions that change fonts */
+  font-family: 'IcoMoon-product-icons' !important;
+  speak: none;
+  font-style: normal;
+  font-weight: normal;
+  font-variant: normal;
+  text-transform: none;
+  line-height: 1;
+
+  /* Better Font Rendering =========== */
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+.icon-sso-donatenow:before { content: "\e900"; }
+.icon-sso-donation-pages:before { content: "\e683"; }
+.icon-sso-dms:before { content: "\e6ba"; }
+.icon-sso-product-fundraising-coach:before,
+.fa-icon-sso-product-fundraising-coach:before {
+  content: "\e199";
+  font-family: 'IcoMoon-product-icons' !important; } // allows use as a resource icon
+.icon-sso-disbursements:before { content: "\e466"; }

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_interaction.scss

@@ -1,2 +1,2 @@
 // Sort
-[class*='sort'] { cursor: move; }
+[class*='sort']:not(.sort_link) { cursor: move; }

data/app/assets/stylesheets/nfg_ui/network_for_good/public/legacy_browser_support/nfg_theme/_nav.scss

@@ -3,6 +3,11 @@
 .nav {
   display: -ms-flexbox;
   -ms-flex-wrap: wrap;
+  // override because flexbox displays incorrect in <= IE10
+  &.site-nav {
+    display: block !important;
+    .nav-sub-menu { display: block !important; }
+  }
 }
 
 // Justified variants
@@ -19,3 +24,5 @@
     -ms-flex-positive: 1;
   }
 }
+
+

data/app/assets/stylesheets/nfg_ui/network_for_good/public/plugins/_datetimepicker.scss

@@ -52,6 +52,9 @@
     }
   }
 
+  //** Needed to support legacy bs4 alpha collapse styles in DMS
+  .collapse.in { display: block; }
+
   //** Time/Date Toggle
   .collapse.show {
     .timepicker-picker {

data/app/assets/stylesheets/nfg_ui/network_for_good/public/plugins/_select2.scss

@@ -45,6 +45,7 @@ body:not(.modal-open) {
       height: $custom-select-height !important;
       transition: $transition-base;
     }
+    .select2-selection__placeholder { color: $primary; }
     .select2-selection__arrow { display: none; }
   }
 
@@ -65,7 +66,6 @@ body:not(.modal-open) {
       .select2-search__field {
         margin-top: 0;
         min-height: 18px;
-        border: $input-border-width solid $input-border-color;
       }
     }
     .select2-selection__rendered {
@@ -204,8 +204,7 @@ body:not(.modal-open) {
       top: 0;
       right: 0;
       width: 60px;
-      font-size: 10px;
-      line-height: 34px;
+      font-size: 12px;
       font-family: $font-family-sans-serif;
       color: $link-color;
       text-transform: uppercase;

data/app/assets/stylesheets/nfg_ui/network_for_good/public/plugins/_turbolinks.scss

@@ -0,0 +1,6 @@
+// Turbolink progress bar
+.turbolinks-progress-bar {
+  background-color: $success !important;
+  height: ($spacer * .25);
+  z-index: ($zindex-fixed + 1);
+}

data/app/assets/stylesheets/nfg_ui/network_for_good/public/plugins/_twitter_typeahead.scss

@@ -0,0 +1,44 @@
+//*****************************//
+// TWITTER TYPEAHEAD -- (ex. used on address type ahead)
+//*****************************//
+.twitter-typeahead { width: 100%; }
+.tt-query {
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+.tt-hint { color: $text-muted; }
+.tt-menu {
+  margin-top: 2px;
+  padding: ($spacer * .25) 0;
+  width: 100%;
+  max-width: 100%;
+  max-height: 350px;
+  font-size: $font-size-sm;
+  background-color: $dropdown-bg;
+  background-clip: padding-box;
+  border: $dropdown-border-width solid $dropdown-border-color;
+  @include border-radius($border-radius);
+  @include box-shadow(0 0 5px transparentize($black, 0.7));
+  overflow-y: auto;
+}
+.tt-suggestion {
+  padding: ($spacer * .5);
+  line-height: 1;
+  + .tt-suggestion { border-top: $dropdown-border-width solid $dropdown-border-color; }
+}
+.tt-selectable { cursor: pointer; }
+.tt-suggestion.tt-cursor, .tt-selectable:hover {
+  color: $dropdown-link-hover-color;
+  background-color: $dropdown-link-hover-bg;
+}
+
+.tt-highlight {
+  font-weight: $font-weight-bold;
+  background-color: $body-bg;
+}
+
+.tt-empty-template {
+  padding: ($spacer * .5);
+  line-height: 1;
+}

data/lib/nfg_ui/components/elements/nav_link.rb

@@ -5,16 +5,22 @@ module NfgUi
     module Elements
       # Nav doc coming soon
       class NavLink < NfgUi::Bootstrap::Components::NavLink
+        include Bootstrap::Utilities::CollapseToggleable
+        include Bootstrap::Utilities::Modalable
+
         include NfgUi::Components::Utilities::Traitable
         include NfgUi::Components::Utilities::Describable
         include NfgUi::Components::Utilities::Iconable
         include NfgUi::Components::Utilities::Renderable
 
         include NfgUi::Components::Traits::Active
-        include NfgUi::Components::Traits::Remote
         include NfgUi::Components::Traits::Disable
+        include NfgUi::Components::Traits::Remote
 
         def render
+          # Do NOT use :collapse while also using dropdown. That would be
+          # self-defeating. Since a dropdown menu is a more specific type
+          # of collapse component.
           if dropdown
             NfgUi::Components::Elements::DropdownToggle.new({ body: (block_given? ? yield : body), as: :a, **html_options, theme: nil, nav_link: true }, view_context).render
           else

data/lib/nfg_ui/components/patterns/page_header.rb

@@ -17,6 +17,15 @@ module NfgUi
           sticky ? super.merge!(toggle: 'sticky-div') : super
         end
 
+        # Supplies a slightly smaller design-system approved column structure
+        # when set to false (as used in Evo), by default.
+        # DMS, however requires a simple 'col' (full width) layout
+        # and will have :full_width set to true manually while both apps
+        # co-exist with slightly different page layouts.
+        def full_width
+          options.fetch(:full_width, false)
+        end
+
         def sticky
           return if Rails.env.test? || browser.mobile?
           options.fetch(:sticky, true)
@@ -41,7 +50,7 @@ module NfgUi
 
           content_tag(:div, html_options) do
             content_tag(:div, class: 'row') do
-              content_tag(:div, class: 'col col-xl-11 mx-auto') do
+              content_tag(:div, class: column_structure_css_classes) do
                 content_tag(:div, class: 'row align-items-center') do
                   concat(content_tag(:div, class: 'col py-2') {
                     NfgUi::Components::Patterns::Media.new({}, view_context).render do
@@ -80,8 +89,12 @@ module NfgUi
 
         private
 
+        def column_structure_css_classes
+          "col #{'col-xl-11 mx-auto' unless full_width}".squish
+        end
+
         def non_html_attribute_options
-          super.push(:subtitle)
+          super.push(:subtitle, :full_width, :sticky)
         end
       end
     end

data/lib/nfg_ui/components/traits/icon.rb

@@ -22,7 +22,19 @@ module NfgUi
           maybe_update_option(:theme, value: NfgUi::DEFAULT_TIP_THEME)
 
           if options[:text].present?
-            maybe_update_option(:right, value: true)
+            # We are unable to use #maybe_update_option method due to how traits
+            # are calculated when sub components are
+            # rendered within sub components (example: nav_link being rendered within a nav_item)...
+            #
+            # This will leave options[:right] alone unless
+            # there is a value stored in the component's options[:right]
+            #
+            # Example where options[:right] is left alone:
+            # ui.nfg(:icon, :tip, right: false, text: 'Tip icon is on the left')
+            #
+            # Example where options[:right] gets updated:
+            # ui.nfg(:icon, :tip, text: 'Tip icon is on the right')
+            options[:right] = true if options[:right].nil?
             options[:class] += ' fa-fw'
           end
         end

data/lib/nfg_ui/components/utilities/resource_themeable.rb

@@ -5,6 +5,8 @@ module NfgUi
     module Utilities
       # The library of dedicated theme resources in Evo & DMS
       module ResourceThemeable
+        FALLBACK_ICON = 'heart-o'
+        DEFAULT_THEME_COLOR = 'primary'
         # This method represents an existential question
         # for the UX team at NFG
         #
@@ -14,11 +16,11 @@ module NfgUi
         def resource_theme_color(object = nil)
           case resource_theme_name(object)
           when 'Project'
-            'primary'
+            DEFAULT_THEME_COLOR
           when 'Campaign'
-            'primary'
+            DEFAULT_THEME_COLOR
           else
-            'primary'
+            DEFAULT_THEME_COLOR
           end
         end
 
@@ -45,7 +47,7 @@ module NfgUi
           when 'RecurringDonation'
             'refresh'
           else
-            'heart-o'
+            FALLBACK_ICON
           end
         end
 

data/lib/nfg_ui/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module NfgUi
-  VERSION = '0.10.5'
+  VERSION = '0.10.6'
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: nfg_ui
 version: !ruby/object:Gem::Version
-  version: 0.10.5
+  version: 0.10.6
 platform: ruby
 authors:
 - Jonathan Roehm
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2020-01-28 00:00:00.000000000 Z
+date: 2020-03-30 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bootstrap
@@ -357,6 +357,11 @@ files:
 - README.md
 - Rakefile
 - app/assets/config/nfg_ui_manifest.js
+- app/assets/fonts/product_icons/IcoMoon-product-icons.eot
+- app/assets/fonts/product_icons/IcoMoon-product-icons.svg
+- app/assets/fonts/product_icons/IcoMoon-product-icons.ttf
+- app/assets/fonts/product_icons/IcoMoon-product-icons.woff
+- app/assets/fonts/product_icons/product-icons-icomoon.zip
 - app/assets/images/nfg_ui/app_icon/android-chrome-192x192.png
 - app/assets/images/nfg_ui/app_icon/android-chrome-384x384.png
 - app/assets/images/nfg_ui/app_icon/apple-touch-icon.png
@@ -395,7 +400,9 @@ files:
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_custom.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_dropdown.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_forms.scss
+- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_grid.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_media.scss
+- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_modal.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_nav.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_navbar.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_progress.scss
@@ -412,13 +419,14 @@ files:
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_custom_receipt_language.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_device_preview.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_email_preview.scss
+- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_free_trial.scss
+- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_icomoon.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_illustration.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_interaction.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_mobile.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_nav_step.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_overlay_blocker.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_page_header.scss
-- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_product_icons.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_redactor.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_share_dropdown.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_slat.scss
@@ -518,13 +526,14 @@ files:
 - app/assets/stylesheets/nfg_ui/network_for_good/public/plugins/_intercom.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/public/plugins/_select2.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/public/plugins/_sticky_div.scss
+- app/assets/stylesheets/nfg_ui/network_for_good/public/plugins/_turbolinks.scss
+- app/assets/stylesheets/nfg_ui/network_for_good/public/plugins/_twitter_typeahead.scss
 - app/controllers/nfg_ui/application_controller.rb
 - app/helpers/nfg_ui/application_helper.rb
 - app/helpers/nfg_ui/components/browser_helper.rb
 - app/helpers/nfg_ui/components/email_helpers.rb
 - app/helpers/nfg_ui/components/resource_themes_helper.rb
 - app/helpers/nfg_ui/components/tooltip_helper.rb
-- app/models/nfg_ui/application_record.rb
 - app/views/nfg_ui/app_icons/_icons.html.haml
 - app/views/nfg_ui/email/README.md
 - app/views/nfg_ui/email/_alert.html.inky-haml
@@ -782,7 +791,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.0.3
+rubygems_version: 3.0.8
 signing_key: 
 specification_version: 4
 summary: NFG UI front-end design system code for rapid product building

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_product_icons.scss

@@ -1,45 +0,0 @@
-// Product icons
-
-@font-face {
-  font-family: 'IcoMoon-product-icons';
-  src:  font-url('admin/nfg_product_icons/IcoMoon-product-icons.eot?b2y89i');
-  src:  font-url('admin/nfg_product_icons/IcoMoon-product-icons.eot?b2y89i#iefix') format('embedded-opentype'),
-    font-url('admin/nfg_product_icons/IcoMoon-product-icons.ttf?b2y89i') format('truetype'),
-    font-url('admin/nfg_product_icons/IcoMoon-product-icons.woff?b2y89i') format('woff'),
-    font-url('admin/nfg_product_icons/IcoMoon-product-icons.svg?b2y89i#IcoMoon-product-icons') format('svg');
-  font-weight: normal;
-  font-style: normal;
-}
-
-[class^="icon-sso-"], [class*=" icon-sso-"] {
-  /* use !important to prevent issues with browser extensions that change fonts */
-  font-family: 'IcoMoon-product-icons' !important;
-  speak: none;
-  font-style: normal;
-  font-weight: normal;
-  font-variant: normal;
-  text-transform: none;
-  line-height: 1;
-
-  /* Better Font Rendering =========== */
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-.icon-sso-donatenow:before {
-  content: "\e900";
-}
-.icon-sso-donation-pages:before {
-  content: "\e683";
-}
-.icon-sso-dms:before {
-  content: "\e6ba";
-}
-.icon-product-fundraising-coach:before {
-  content: "\e199";
-}
-.icon-sso-disbursements:before {
-  content: "\e466";
-}
-
-

data/app/models/nfg_ui/application_record.rb

@@ -1,5 +0,0 @@
-module NfgUi
-  class ApplicationRecord < ActiveRecord::Base
-    self.abstract_class = true
-  end
-end