nfg_ui 0.11.4 → 0.11.9

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: b74d360cda26e2c2761e08f2e7518801f4ff7b6748c47c8329c8201eda8ebc71
-  data.tar.gz: 114168053528379c43dfadcb54c4c3fdf73355c76013fcda368aa0b13748758e
+  metadata.gz: feeec19c011b520fc542365a94ae4c0def08850b8f3bb394376ea44cff7ef174
+  data.tar.gz: a7b77844b75d25c800c05707a4d21db8814a4cdcc82244f5eebce03a815f3908
 SHA512:
-  metadata.gz: 31bc70d2cc5e96ac4c8414d1d1c38cb8ff760e23b4e021c6ff4b2583b783e9f505cf39540e93a311b786629c03075286eca26af1d5846fc02ca502b60285cba7
-  data.tar.gz: 87c5a53d2f865c51d0af6c090d9b25166aee6c72d3215cafeb672b3d6aa605e509530dd7844c2dad1a59e12c77c13fd3271d1ef03f4ddba940fc0486c4748e41
+  metadata.gz: 07e73749f7feab579f0a8e9cc617850ce53f4311be7d7c08e7f30a6e9d32be4a5cf44d3797c71b69d78c018d41a400d77d9e36d32bb557810c2e6b69c1ae4c80
+  data.tar.gz: 8d8783f40d9454d708dd3923d66fad396f35d2fa7f5f3460bcc42e7c69c3cb55eadc90e6cc66ab0b10019225544bd32181bc45508f7cfc2e03ca54fac018085f

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_badge.scss

@@ -1,9 +1,8 @@
 @each $color, $value in $colors {
   .#{$color} {
-    .badge-primary { @include badge-variant($value); }
+    .badge-primary {
+      @include badge-variant($value);
+      color: $white !important;
+    }
   }
 }
-
-// temporary color fix for consistency on a white text on orange bg
-// overrides color contrast settings
-.orange .badge-primary { color: $white !important; }

data/app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_buttons.scss

@@ -1,6 +1,9 @@
 @each $color, $value in $colors {
   .#{$color} {
-    .btn-primary { @include button-variant($value, $value); }
+    .btn-primary {
+      @include button-variant($value, $value);
+      color: $white !important;
+    }
     .show > .btn-primary.dropdown-toggle {
       background-color: darken($value, 10%);
       border-color: darken($value, 10%);
@@ -8,7 +11,3 @@
     .btn-outline-secondary, .btn-link { color: $value; }
   }
 }
-
-// temporary color fix for consistency on a white text on orange bg
-// overrides color contrast settings
-.orange .btn-primary { color: $white !important; }

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

@@ -20,6 +20,9 @@
         }
       }
     }
-    .custom-select { color: $value; }
+    .custom-select {
+      color: $value;
+      &:focus { border-color: $value; }
+    }
   }
 }

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

@@ -1,3 +1,4 @@
 // Our custom styles
+@import 'custom/activity_feed';
 @import 'custom/icons';
 @import 'custom/nav_step';

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

@@ -0,0 +1,7 @@
+@each $color, $value in $colors {
+  .activity-feed-item {
+    &.#{nth($color, 1)} {
+      .activity-icon { background-color: $value; }
+    }
+  }
+}

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

@@ -1,4 +1,6 @@
 // Our custom styles
+@import 'custom/activity_feed';
+@import 'custom/bee';
 @import 'custom/builder_layout';
 @import 'custom/campaign_card';
 @import 'custom/campaign_preview';
@@ -12,7 +14,9 @@
 @import 'custom/interaction';
 @import 'custom/overlay_blocker';
 @import 'custom/page_header';
+@import 'custom/readmore';
 @import 'custom/share_dropdown';
+@import 'custom/sortable';
 @import 'custom/status_indicator';
 @import 'custom/tile';
 @import 'custom/video_countdown';

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

@@ -0,0 +1,34 @@
+// Activity feed list items
+.activity-feed-item {
+  position: relative;
+  padding: 0 0 $spacer ($spacer * 1.5);
+  border: none;
+  z-index: 0;
+  &::after {
+    position: absolute;
+    top: 0;
+    left: 12px;
+    bottom: 0;
+    z-index: 0;
+    border-left: $border-width solid $border-color;
+    content: "";
+  }
+  &:last-child {
+    padding-bottom: 0;
+    &::after { display: none; }
+  }
+  .activity-icon {
+    position: absolute;
+    top: 2px;
+    left: 0;
+    display: block;
+    width: $spacer;
+    height: $spacer;
+    font-size: $font-size-sm;
+    line-height: $spacer;
+    z-index: 1;
+    text-align: center;
+    @include border-radius(50%);
+    box-shadow: 0 0 0 2px rgba(255,255,255,1);
+  }
+}

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

@@ -0,0 +1,15 @@
+#bee_plugin_container {
+  height: 600px; // fallback value if calc() isn't supported
+  border-top: 1px solid $border-color;
+  border-bottom: 1px solid $border-color;
+}
+
+// Height if just the builder-header is present
+.builder-header + .builder-container {
+  #bee_plugin_container { height: calc(100vh - 72px); }
+}
+
+// Height if both builder-header and builder-nav are present (typical in onboarder)
+.builder-header + .builder-nav + .builder-container {
+  #bee_plugin_container { height: calc(100vh - 180px); }
+}

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

@@ -84,7 +84,7 @@ $builder-preview-padding: ($spacer * 2);
   padding: $builder-preview-padding ($builder-preview-padding / 2);
   @include media-breakpoint-up(lg) {
     float: left;
-    width: 67vw;
+    width: 67%;
     height: 100%;
     overflow-y: auto;
     > :last-child { margin-bottom: $builder-preview-padding; }
@@ -96,7 +96,7 @@ $builder-preview-padding: ($spacer * 2);
   @include media-breakpoint-down(md) { border-bottom: $border-width solid $border-color; }
   @include media-breakpoint-up(lg) {
     float: right;
-    width: 33vw;
+    width: 33%;
     height: 100%;
     border-left: $border-width solid $border-color;
     overflow-y: auto;

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

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

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

@@ -40,7 +40,7 @@ $redacted-font-family: "BLOKK";
   font-family: $font-family-base;
   letter-spacing: 0;
   word-spacing: 0;
-  background-color: rgba(255,255,255,0.9);
+  background-color: transparentize($white, 0.2);
 }
 .overlay-blur {
   transition: $transition-base;

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

@@ -0,0 +1,24 @@
+// Powers the readmore.js plugin
+.expandable,
+.readmore-js-section {
+  position: relative;
+  z-index: 10;
+  transition: $transition-collapse;
+  &.readmore-js-collapsed { overflow: hidden; }
+  &.readmore-js-expanded { overflow: visible; }
+}
+.readmore-js-collapsed:after {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: ($spacer * 1.5);
+  @include gradient-y(transparentize($white, 1), transparentize($white, 0));
+  content: '';
+  z-index: 20;
+}
+.readmore-js-toggle {
+  padding-top: ($spacer * .5);
+  padding-bottom: ($spacer * .5);
+  z-index: 30;
+}

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

@@ -0,0 +1,29 @@
+// Shared sorting styles
+.slat, .option {
+  &.ui-sortable-placeholder {
+    visibility: visible !important;
+    background: theme-color("light");
+    border: $border-width dashed $border-color;
+  }
+  &.ui-sortable-helper { opacity: .5; }
+}
+// Slat
+.slat {
+  &.ui-sortable-placeholder {
+    + .slat { border-top: none; }
+    + &.ui-sortable-helper {
+      border-top-style: dashed;
+      + &.slat { border-top: none; }
+    }
+  }
+  &.ui-sortable-helper {
+    border-top: none;
+    border-top: none;
+    + &.ui-sortable-placeholder { border-top: $border-width dashed $border-color; }
+  }
+}
+
+// Sortable options (used on form fields for checkboxes/radios/select options)
+.option {
+  &.ui-sortable-placeholder { margin-bottom: ($spacer * .25); }
+}

data/app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/_custom.scss

@@ -1,6 +1,7 @@
 // Our custom styles
 @import 'custom/avatar';
 @import 'custom/everyday_giving';
+@import 'custom/icon';
 @import 'custom/nav_step';
 @import 'custom/slat';
 @import 'custom/video_countdown';

data/app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_icon.scss

@@ -0,0 +1,5 @@
+.icon-circle {
+  display: -ms-inline-flexbox;
+  -ms-flex-align: center;
+  -ms-flex-pack: center;
+}

data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_buttons.scss

@@ -17,4 +17,4 @@
 .btn-link { font-weight: $btn-font-weight; }
 
 // overrides color contrast settings
-.btn-warning { color: $white !important; }
+.btn-warning { color: $white !important; }

data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_card.scss

@@ -13,6 +13,10 @@
 .card-footer { border-top: none; }
 
 // Card image
-.card-img-overlay { @include gradient-y(transparentize($black, 1), transparentize($black, .5)); }
+.card-img-overlay {
+  top: auto; // makes the overlay gradient and container "stick" to bottom of parent container
+  min-height: ($spacer * 2);
+  @include gradient-y(transparentize($black, 1), transparentize($black, .5));
+}
 
 .card-img { @include border-radius(0); }

data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_custom-forms.scss

@@ -3,6 +3,7 @@
 // Base class takes care of all the key behavioral aspects.
 
 .custom-control {
+  padding-left: 0;
   .custom-control-input {
     &:checked {
       ~ .custom-control-label,
@@ -10,18 +11,26 @@
     }
     &:focus:not(:checked) ~ .custom-control-label::before { border-color: $input-border-color; }
   }
+  + .custom-control:not(.custom-control-inline) { margin-top: ($spacer * .25); }
 }
+.custom-checkbox, .custom-radio { min-width: $custom-control-gutter + $custom-control-indicator-size; } // sets minimum width to have space even if custom-control-label isn't there
 
 // Custom control indicators
 //
 // Build the custom controls out of pseudo-elements.
 
 .custom-control-label {
+  padding-left: $custom-control-gutter + $custom-control-indicator-size;
+  min-width: $custom-control-gutter + $custom-control-indicator-size;
+  min-height: $custom-control-indicator-size;
   font-weight: $font-weight-normal;
   cursor: pointer;
 
   // Background-color and icon
-  &::before, &::after { top: .3rem; }
+  &::before, &::after {
+    top: .3rem;
+    left: 0;
+  }
   &::before { border: $border-width solid $border-color; }
   &::after { cursor: pointer; }
 }
@@ -41,6 +50,9 @@
 //
 
 .custom-select {
+  display: block;
+  width: auto;
+  max-width: 100%;
   font-weight: $btn-font-weight;
   cursor: pointer;
   box-shadow: none;
@@ -97,7 +109,10 @@
 // Tweak a few things for switches
 
 .custom-switch {
+  padding-left: 0;
   .custom-control-label {
+    padding-left: $custom-switch-width + $custom-control-gutter;
+    &::before, &::after { left: 0; }
     &::before {
       padding-left: 28px;
       font-size: 12px;
@@ -109,7 +124,6 @@
     }
     &::after {
       top: 0;
-      left: -($custom-switch-width + $custom-control-gutter);
       background-color: $white;
       border: $border-width solid $border-color;
       border-radius: 50%;

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

@@ -1,11 +1,13 @@
 // Our custom styles
 @import 'custom/avatar';
 @import 'custom/device_preview';
+@import 'custom/icon';
 @import 'custom/illustration';
 @import 'custom/mobile';
 @import 'custom/nav_step';
 @import 'custom/redactor';
 @import 'custom/social_share';
+@import 'custom/skeleton';
 @import 'custom/slat';
 @import 'custom/ticket';
 @import 'custom/tile';

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

@@ -9,6 +9,7 @@
     cursor: default;
     pointer-events: none;
   }
+  &:not(.text-danger) { color: inherit !important; }
 }
 
 
@@ -21,7 +22,14 @@
 
 
 // Sizing
-.dropdown-menu-md { min-width: ($spacer * 12); }
+.dropdown-menu-md, .dropdown-menu-lg { min-width: ($spacer * 10); }
+.dropdown-menu-md {
+  @include media-breakpoint-up(sm) { min-width: ($spacer * 12); }
+}
+.dropdown-menu-lg {
+  @include media-breakpoint-up(sm) { min-width: ($spacer * 24); }
+}
+
 
 
 // Styles for wider "My Tools" dropdown in top nav

data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_reboot.scss

@@ -18,6 +18,10 @@ body {
 
 div { position: relative; } // setting this as a base to avoid improper absolute positioning elements
 
+p {
+  &.disabled { opacity: .4; } // used on filter bars on list pages for bulk actions
+}
+
 ol,
 ul,
 dl {

data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_avatar.scss

@@ -21,7 +21,7 @@
   .avatar-text {
     font-weight: $font-weight-bold;
     font-size: $font-size-base;
-    line-height: 1;
+    line-height: 1.2;
     color: $body-color;
     text-align: center;
     white-space: nowrap;

data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_icon.scss

@@ -0,0 +1,34 @@
+// Custom icon styles
+// icons shouldn't be larger than the h1 font-size. use illustrations for larger visuals.
+// don't use icon circles for icons smaller than icon-circle-sm size. use just an icon.
+.icon-circle {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  vertical-align: middle;
+  width: ($spacer * 1.5);
+  height: ($spacer * 1.5);
+  font-size: $font-size-base;
+  background-color: $border-color;
+  border-radius: 50%;
+  &.icon-circle-outline {
+    background-color: $white;
+    border: $border-width solid $border-color;
+  }
+  &.icon-circle-sm {
+    width: $spacer;
+    height: $spacer;
+    font-size: $font-size-sm;
+  }
+  &.icon-circle-lg {
+    width: ($spacer * 2);
+    height: ($spacer * 2);
+    font-size: $font-size-lg;
+  }
+  &.icon-circle-xl {
+    width: ($spacer * 3);
+    height: ($spacer * 3);
+    font-size: $h1-font-size;
+  }
+}

data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_skeleton.scss

@@ -0,0 +1,50 @@
+// Skeleton styles for placheholder content
+.skeleton-avatar, .skeleton-heading, .skeleton-paragraph {
+  display: inline-block;
+  margin-bottom: ($spacer * .5);
+  background-color: $border-color;
+  overflow: hidden;
+  &::after {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: $body-bg;
+    animation: skeleton-sheen 1s linear infinite alternate;
+    content: '';
+
+    // any skeleton element inside a container with the the .loaded class removes the sheen animation.
+    .loaded & {
+      background-color: transparent;
+      animation: none;
+    }
+  }
+}
+.skeleton-avatar {
+  width: ($spacer * 1.5);
+  height: ($spacer * 1.5);
+  border-radius: 50%;
+}
+.skeleton-heading {
+  width: 70%;
+  height: $spacer;
+  border-radius: ($spacer * .5);
+  &:nth-child(even) { width: 45%; }
+}
+.skeleton-paragraph {
+  width: 100%;
+  height: ($spacer * .5);
+  border-radius: ($spacer * .25);
+  &:nth-child(2n+1) { width: 90%; }
+  &:nth-child(3n+1) { width: 75%; }
+  &:nth-child(4n+1) { width: 80%; }
+}
+
+// Sheen animation used on skeleton elements
+@keyframes skeleton-sheen {
+  0% { opacity: .45; }
+  to { opacity: .9; }
+}

data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_slat.scss

@@ -8,7 +8,7 @@ $slat-actions-lg-width: 108px;
   flex-flow: column nowrap;
 
   // Nowrap version -- used when the goal is to have all slat-item columns on the same line in smaller screens
-  :not(.slats-nowrap) { // noting the :not() psuedo-class meaning all slats that don't have this class get these styles
+  &:not(.slats-nowrap) { // noting the :not() psuedo-class meaning all slats that don't have this class get these styles
     .slat-body {
       @include media-breakpoint-down(sm) { flex-direction: column; }
     }
@@ -37,23 +37,8 @@ $slat-actions-lg-width: 108px;
     padding-bottom: ($spacer * 1.5);
   }
 
-  // Various states
-  &.ui-sortable-placeholder {
-    visibility: visible !important;
-    background: theme-color("light");
-    border: $border-width dashed $border-color;
-    + .slat { border-top: none; }
-    + &.ui-sortable-helper {
-      border-top-style: dashed;
-      + &.slat { border-top: none; }
-    }
-  }
-  &.ui-sortable-helper {
-    border-top: none;
-    opacity: .5;
-    border-top: none;
-    + &.ui-sortable-placeholder { border-top: $border-width dashed $border-color; }
-  }
+  // Status
+  &.pending { background-color: #fff5e0; }
 }
 
 

data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_tile.scss

@@ -22,13 +22,13 @@
   display: block;
   margin-right: auto;
   margin-left: auto;
-  @include media-breakpoint-down(sm) { padding-bottom: $grid-gutter-width; }
-  @include media-breakpoint-up(sm) { padding-bottom: ($grid-gutter-width * 1.5); }
+  @include media-breakpoint-down(sm) { padding-bottom: ($grid-gutter-width * 1.5); }
+  @include media-breakpoint-up(sm) { padding-bottom: ($grid-gutter-width * 2); }
   &:last-child { padding-bottom: 0; }
   + .tile-section {
     border-top: $border-width solid $border-color;
-    @include media-breakpoint-down(sm) { padding-top: $grid-gutter-width; }
-    @include media-breakpoint-up(sm) { padding-top: ($grid-gutter-width * 1.5); }
+    @include media-breakpoint-down(sm) { padding-top: ($grid-gutter-width * 1.5); }
+    @include media-breakpoint-up(sm) { padding-top: ($grid-gutter-width * 2); }
   }
 }
 

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

@@ -11,6 +11,10 @@ module NfgUi
         include NfgUi::Components::Traits::Size
         include NfgUi::Components::Traits::SlatItem
 
+        def caption
+          options.fetch(:caption, nil)
+        end
+
         def component_family
           :slats
         end
@@ -19,36 +23,56 @@ module NfgUi
           options.fetch(:slat_header, nil)
         end
 
-        def caption
-          options.fetch(:caption, nil)
+        # Leverage custom tooltip implementation
+        # so that tooltips are connected to slat item text
+        # and not the slat item containing div (resulting in better UI)
+        def tooltip
+          options.fetch(:tooltip, nil)
         end
 
         def render
           content_tag(base_element, slat_item_html_options) do
             if slat_header
-              concat(content_tag(:h6, slat_header, class: 'display-4 slat-column-header'))
+              concat(content_tag(:h6, slat_header, class: 'display-4 slat-column-header', **tooltip_html_options))
             end
             if heading
               if href
                 concat(content_tag(:a, href: view_context.url_for(href)) {
-                  NfgUi::Components::Foundations::Typeface.new({ subheading: heading }, view_context).render
+                  NfgUi::Components::Foundations::Typeface.new({ subheading: heading, tooltip: tooltip }, view_context).render
                 })
               else
-                concat(NfgUi::Components::Foundations::Typeface.new({ subheading: heading }, view_context).render)
+                concat(NfgUi::Components::Foundations::Typeface.new({ subheading: heading, tooltip: tooltip }, view_context).render)
               end
             end
             concat(block_given? ? yield : body)
             if caption
-              concat(NfgUi::Components::Foundations::Typeface.new({ caption: caption, class: 'mb-0' }, view_context).render)
+              concat(NfgUi::Components::Foundations::Typeface.new({ caption: caption, class: 'mb-0', tooltip: (tooltip unless heading) }, view_context).render)
             end
           end
         end
 
         private
 
+        def tooltip_html_options
+          return {} unless tooltip
+          { title: tooltip, data: options[:data].merge(tooltip_data_attributes) }
+        end
+
+        def tooltip_data_attributes
+          { toggle: 'tooltip',
+            placement: :top,
+            html: 'true' }
+        end
+
         # Strip the href from html_options and pass it to the header
         def slat_item_html_options
-          html_options.except(:href)
+          options = html_options.except(:href)
+
+          # merge in tooltip only if leveraging block body content
+          # tooltip_html_options will return {} if no tooltip so this is a safe merge
+          options.merge!(tooltip_html_options) unless (heading || caption || slat_header)
+
+          options
         end
 
         # :sm is the default size, and is not given
@@ -59,7 +83,7 @@ module NfgUi
         end
 
         def non_html_attribute_options
-          super.push(:slat_header, :caption)
+          super.push(:slat_header, :caption, :tooltip)
         end
       end
     end

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

@@ -10,7 +10,6 @@ module NfgUi
                     heading
                     subheading
                     title
-                    muted
                     truncate].freeze
 
         def body_trait

data/lib/nfg_ui/version.rb

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

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: nfg_ui
 version: !ruby/object:Gem::Version
-  version: 0.11.4
+  version: 0.11.9
 platform: ruby
 authors:
 - Jonathan Roehm
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2020-10-26 00:00:00.000000000 Z
+date: 2020-12-22 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bootstrap
@@ -407,6 +407,7 @@ files:
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_reboot.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_type.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_utilities.scss
+- app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/custom/_activity_feed.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/custom/_icons.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/custom/_nav_step.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/plugins/_datetimepicker.scss
@@ -419,6 +420,8 @@ files:
 - 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/_tables.scss
+- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_activity_feed.scss
+- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_bee.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_builder_layout.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_campaign_card.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_campaign_preview.scss
@@ -432,7 +435,9 @@ files:
 - 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/_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/_readmore.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/_sortable.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_status_indicator.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_tile.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_video_countdown.scss
@@ -476,6 +481,7 @@ files:
 - app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/_utilities.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_avatar.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_everyday_giving.scss
+- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_icon.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_nav_step.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_slat.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_video_countdown.scss
@@ -502,10 +508,12 @@ files:
 - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_type.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_avatar.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_device_preview.scss
+- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_icon.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_illustration.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_mobile.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_nav_step.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_redactor.scss
+- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_skeleton.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_slat.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_social_share.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_ticket.scss