nfg_ui 0.14.6.3 → 0.15.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 070500f7b7f69f086db555b9360f4595253e09eee2ed5ba40d1172d29a769bc3
-  data.tar.gz: fe8fcbbc2533e246c48ad07c5e1594c81b5a131dba991c6f9c49f88c98a41b07
+  metadata.gz: 9b354ba900a6e46b2eda8601e69b7de3f58e05656328c7e28892bf892fbc8dc2
+  data.tar.gz: f02ffac702d1686da3d6552e950a40cbb5b83c8e42aec255fb137ce74c6ef0be
 SHA512:
-  metadata.gz: 9212b6b7cf44c324e03404703d1bc4107d08a42ca579f95459cb92fb547c36f8084df6390ac5fdec7da2c4cb971f1874d02d87eaa33ed12b6b30c324902ca534
-  data.tar.gz: ba33f2fe53328addcc063e588c763fad7f36801830b93c08683dde1e3ec106aca09f22da57135320abf77853f89f42ab6e50297a06b7d6dddfc1493cb361dd3c
+  metadata.gz: ad68314c9bdb5faf2afda14487120d9f4927b50bc1d1944b22acaa9b8b3d669141b831119a327003543b6880abd2359205937c70b0a97026ef07a355ccddb959
+  data.tar.gz: '0972a216ccd1eacb2d43386cc0a574d94a6de43c2037711eb1228adf384c0891302efa40c11a782899d8e7d82713de1b70aa6a1d669d43f0d7c4bc12bb7aef4c'

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

@@ -3,6 +3,7 @@
 @import 'custom/bee';
 @import 'custom/builder_layout';
 @import 'custom/campaign_card';
+@import 'custom/check_in';
 @import 'custom/content_section';
 @import 'custom/custom_questions_questionnaire';
 @import 'custom/custom_receipt_language';

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

@@ -0,0 +1,39 @@
+$check-in-header-height: ($spacer * 2.25);
+
+// Contains the header fixed to the top of the browser on all devices
+.check-in-header {
+  position: fixed;
+  top: 0;
+  right: 0;
+  left: 0;
+  z-index: $zindex-fixed + 1;
+  border-bottom: $border-width solid $blue-800;
+}
+
+// Shared styles between header and title
+.check-in-header, .check-in-title {
+  padding: ($spacer * .5);
+  background-color: $blue-700;
+}
+
+// Container that provides padding to the top of the page to move content below header and above the footer (small devices only)
+.check-in-container {
+  padding-top: $check-in-header-height;
+  @include media-breakpoint-down(sm) {
+    padding-bottom: ($spacer * 5);
+  }
+}
+
+// Shows the CTAs fixed to the bottom of the browser on small devices
+.check-in-footer {
+  @include media-breakpoint-down(sm) {
+    position: fixed;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: $zindex-fixed + 1;
+    padding: ($spacer * .5);
+    border-top: $border-width solid $border-color;
+    background-color: $white;
+  }
+}

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

@@ -1,3 +1,9 @@
+//**********
+// NOTE:
+// if $white, $gray-800, or any of the $yiq-* variables are updated,
+// update them here as well: /app/views/nfg_ui/_entity_branding_styles.html.haml
+//**********
+
 // Variables
 //
 // Variables should follow the `$component-state-property-size` formula for

data/app/assets/stylesheets/nfg_ui/network_for_good/core/entity_branding/application.scss

@@ -4,13 +4,13 @@
 @import 'nfg_ui/network_for_good/core/variables';
 
 // NFG Theme - listed individually because we need functions and reboot first
-@import 'nfg_theme/functions';
 @import 'nfg_theme/reboot';
 @import 'nfg_theme/badge';
 @import 'nfg_theme/buttons';
 @import 'nfg_theme/custom-forms';
 @import 'nfg_theme/custom';
 @import 'nfg_theme/forms';
+@import 'nfg_theme/functions';
 @import 'nfg_theme/nav';
 @import 'nfg_theme/navbar';
 @import 'nfg_theme/type';

data/app/assets/stylesheets/nfg_ui/network_for_good/core/entity_branding/nfg_theme/_badge.scss

@@ -1,5 +1,5 @@
 // Specific styles for entity branding
 .badge-primary {
-  background: scale-color($primary, $lightness: 80%);
-  border-color: $primary;
+  background: var(--brand-primary-scale-light);
+  border-color: var(--brand-primary);
 }

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

@@ -1,54 +1,55 @@
 // Specific styles for entity branding
+
 .btn-primary {
-  color: color-yiq($primary);
-  background-color: $primary;
-  border-color: $primary;
+  color: var(--brand-primary-yiq);
+  background-color: var(--brand-primary);
+  border-color: var(--brand-primary);
   &:hover {
-    color: color-yiq(darken($primary, 10%));
-    background-color: darken($primary, 10%);
-    border-color: darken($primary, 10%);
+    color: var(--brand-primary-dark-yiq);
+    background-color: var(--brand-primary-dark);
+    border-color: var(--brand-primary-dark);
   }
   &:focus,
   &.focus {
-    box-shadow: 0 0 0 $input-btn-focus-width transparentize($primary, 0.8);
+    box-shadow: 0 0 0 $input-btn-focus-width var(--brand-primary-transparent);
   }
   &.disabled, &:disabled {
-    color: color-yiq($primary);
-    background-color: $primary;
-    border-color: $primary;
+    color: var(--brand-primary-yiq);
+    background-color: var(--brand-primary);
+    border-color: var(--brand-primary);
   }
   &:not(:disabled):not(.disabled):active,
   &:not(:disabled):not(.disabled).active,
   .show > &.dropdown-toggle {
-    color: color-yiq($primary);
-    background-color: $primary;
-    border-color: $primary;
-    box-shadow: 0 0 0 $input-btn-focus-width transparentize($primary, 0.8);
-    &:focus { box-shadow: 0 0 0 $input-btn-focus-width transparentize($primary, 0.8); }
+    color: var(--brand-primary-yiq);
+    background-color: var(--brand-primary);
+    border-color: var(--brand-primary);
+    box-shadow: 0 0 0 $input-btn-focus-width var(--brand-primary-transparent);
+    &:focus { box-shadow: 0 0 0 $input-btn-focus-width var(--brand-primary-transparent); }
   }
 }
 
 .btn-secondary, .btn-outline-secondary {
-  color: color-yiq($primary, $yiq-text-dark, $primary);
-  &:hover { color: color-yiq($primary, $yiq-text-dark, $primary) !important; }
+  color: var(--brand-primary-yiq-text-dark);
+  &:hover { color: var(--brand-primary-yiq-text-dark) !important; }
   &:not(:disabled):not(.disabled):active,
   &:not(:disabled):not(.disabled).active,
   .show > &.dropdown-toggle {
-    color: color-yiq($primary, $yiq-text-dark, $primary) !important;
+    color: var(--brand-primary-yiq-text-dark) !important;
   }
 }
 
 .btn-link {
-  color: color-yiq($primary, $yiq-text-dark, $primary);
-  &:hover { color: color-yiq(darken($primary, 15%), $yiq-text-dark, darken($primary, 15%)); }
-  &:focus { box-shadow: 0 0 0 $input-btn-focus-width transparentize($primary, 0.8); }
+  color: var(--brand-primary-yiq-text-dark);
+  &:hover { color: var(--brand-primary-yiq-text-darkest); }
+  &:focus { box-shadow: 0 0 0 $input-btn-focus-width var(--brand-primary-transparent); }
 }
 
 .bg-dark {
   .btn-primary {
-    h1, h2, h3, h4, h5, h6, p, label { color: color-yiq($primary); }
+    h1, h2, h3, h4, h5, h6, p, label { color: var(--brand-primary-yiq); }
   }
   .btn-outline-secondary {
-    h1, h2, h3, h4, h5, h6, p, label { color: color-yiq($primary, $yiq-text-dark, $primary); }
+    h1, h2, h3, h4, h5, h6, p, label { color: var(--brand-primary-yiq-text-dark); }
   }
 }

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

@@ -3,42 +3,42 @@
 .custom-control {
   .custom-control-input {
     &:checked {
-      ~ .custom-control-label, ~ .custom-control-label::before { border-color: $primary; }
+      ~ .custom-control-label, ~ .custom-control-label::before { border-color: var(--brand-primary); }
       ~ .custom-control-label::before {
-        background-color: $primary;
-        box-shadow: 0 0 0 ($spacer * .125) transparentize($primary, 0.8);
+        background-color: var(--brand-primary);
+        box-shadow: 0 0 0 ($spacer * .125) var(--brand-primary-transparent);
       }
     }
     &:not(:disabled):active ~ .custom-control-label::before {
-      background-color: lighten($primary, 35%);
-      border-color: lighten($primary, 35%);
+      background-color: var(--brand-primary-light);
+      border-color: var(--brand-primary-light);
     }
   }
   &.custom-control-block {
-    .custom-control-input:checked ~ .custom-control-label { box-shadow: 0 0 0 ($spacer * .125) transparentize($primary, 0.8); }
+    .custom-control-input:checked ~ .custom-control-label { box-shadow: 0 0 0 ($spacer * .125) var(--brand-primary-transparent); }
   }
 }
 
 .custom-select {
   &:active, &:focus {
-    border-color: $primary;
-    box-shadow: 0 0 0 ($spacer * .125) transparentize($primary, 0.8);
+    border-color: var(--brand-primary);
+    box-shadow: 0 0 0 ($spacer * .125) var(--brand-primary-transparent);
   }
 }
 
 .custom-file-input {
   &:focus ~ .custom-file-label {
-    border-color: $primary;
-    &::after { border-color: $primary; }
+    border-color: var(--brand-primary);
+    &::after { border-color: var(--brand-primary); }
   }
 }
 
 .custom-switch {
   .custom-control-input:checked ~ .custom-control-label {
-    &::after { border-color: $primary; }
+    &::after { border-color: var(--brand-primary); }
     &::before {
-      background-color: $primary;
-      border-color: $primary;
+      background-color: var(--brand-primary);
+      border-color: var(--brand-primary);
     }
   }
 }
@@ -48,7 +48,7 @@
 .custom-control-input {
   .was-validated &:valid {
     &:checked {
-      ~ .custom-control-label::before { background-color: $primary; }
+      ~ .custom-control-label::before { background-color: var(--brand-primary); }
     }
   }
 }

data/app/assets/stylesheets/nfg_ui/network_for_good/core/entity_branding/nfg_theme/_forms.scss

@@ -1,8 +1,8 @@
 // Specific styles for entity branding
 .form-control {
   &:focus {
-    border-color: $primary;
-    box-shadow: 0 0 0 ($spacer * .125) transparentize($primary, 0.8);
+    border-color: var(--brand-primary);
+    box-shadow: 0 0 0 ($spacer * .125) var(--brand-primary-transparent);
   }
 }
 
@@ -11,6 +11,6 @@
 .form-control,
 .custom-select {
   .was-validated &:valid {
-    &:focus { border-color: $primary; }
+    &:focus { border-color: var(--brand-primary); }
   }
 }

data/app/assets/stylesheets/nfg_ui/network_for_good/core/entity_branding/nfg_theme/_functions.scss

@@ -14,16 +14,3 @@
     @return $light;
   }
 }
-
-// This function replaces the hex color code with proper URL-encoding for color in SVG paths
-@function encodecolor($string) {
-  @if type-of($string) == 'color' {
-    $hex: str-slice(ie-hex-str($string), 4);
-    $string:unquote("#{$hex}");
-  }
-  $string: '%23' + $string;
-  @return $string;
-}
-
-// Entity variable for custom select and select2 arrow icons
-$custom-select-indicator: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='#{encodecolor($primary)}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E");

data/app/assets/stylesheets/nfg_ui/network_for_good/core/entity_branding/nfg_theme/_nav.scss

@@ -3,7 +3,7 @@
   &.flex-column {
     .nav-link {
       &:hover, &.active {
-        &:after { background: $primary; }
+        &:after { background: var(--brand-primary); }
       }
     }
   }
@@ -11,7 +11,7 @@
 .nav-tabs {
   .nav-link {
     &:hover, &.active {
-      &:after { background: $primary; }
+      &:after { background: var(--brand-primary); }
     }
   }
 }

data/app/assets/stylesheets/nfg_ui/network_for_good/core/entity_branding/nfg_theme/_navbar.scss

@@ -3,16 +3,16 @@
 .navbar-light {
   .navbar-brand,
   .navbar-toggler {
-    color: color-yiq($primary, $yiq-text-dark, $primary);
-    &:hover, &:focus { color: color-yiq($primary, $yiq-text-dark, $primary); }
+    color: var(--brand-primary-yiq-text-dark);
+    &:hover, &:focus { color: var(--brand-primary-yiq-text-dark); }
   }
   .navbar-nav {
     .nav-link {
-      &:hover, &:focus { color: color-yiq($primary, darken($primary, 10%), $primary); }
+      &:hover, &:focus { color: var(--brand-primary-yiq-text-darker); }
     }
     .open > .nav-link,
     .active > .nav-link,
     .nav-link.open,
-    .nav-link.active { color: color-yiq($primary, darken($primary, 10%), $primary); }
+    .nav-link.active { color: var(--brand-primary-yiq-text-darker); }
   }
 }

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

@@ -1,6 +1,16 @@
 // Specific styles for entity branding
 
 a {
-  color: color-yiq($primary, $yiq-text-dark, $primary);
-  &:not(.btn):hover, &:not(.btn):focus { color: darken($primary, 15%) !important; }
+  color: var(--brand-primary-yiq-text-dark);
+  &:not([class*="btn"], [class*="nav"]) {
+    color: var(--brand-primary-yiq-text-dark);
+    text-decoration: underline;
+    &:hover, &:focus {
+      text-decoration: none;
+    }
+  }
+  .bg-dark & {
+    color: $white;
+    &:hover, &:focus { color: $white; }
+  }
 }

data/app/assets/stylesheets/nfg_ui/network_for_good/core/entity_branding/nfg_theme/_type.scss

@@ -1,16 +1,16 @@
 // Specific styles for entity branding
 
 a.no-link-color {
-  &:hover, &:active, &:focus { color: $primary !important; }
+  &:hover, &:active, &:focus { color: var(--brand-primary) !important; }
 }
 
-.text-primary { color: color-yiq($primary, $yiq-text-dark, $primary) !important; }
+.text-primary { color: var(--brand-primary-yiq-text-dark) !important; }
 
 a.text-primary {
-  color: color-yiq($primary, darken($primary, 15%), $primary) !important;
-  &:hover, &:focus { color: darken($primary, 15%) !important; }
+  color: var(--brand-primary-yiq-text-darker) !important;
+  &:hover, &:focus { color: var(--brand-primary-dark) !important; }
 }
 
 .bg-dark {
-  .text-primary { color: color-yiq($primary, $primary, $yiq-text-light) !important; }
+  .text-primary { color: var(--brand-primary-yiq-text-light) !important; }
 }

data/app/assets/stylesheets/nfg_ui/network_for_good/core/entity_branding/nfg_theme/_utilities.scss

@@ -1,8 +1,8 @@
 // Specific styles for entity branding
 
 .bg-primary {
-  color: color-yiq($primary) !important;
-  background-color: $primary !important;
+  color: var(--brand-primary-yiq) !important;
+  background-color: var(--brand-primary) !important;
 }
 
-.border-primary { border-color: $primary !important; }
+.border-primary { border-color: var(--brand-primary) !important; }

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

@@ -5,16 +5,16 @@
   .nav-item {
 
     &.visited, &.active {
-      &::before { background-color: $primary; }
+      &::before { background-color: var(--brand-primary); }
       .step-indicator {
-        color: color-yiq($primary);
-        background-color: $primary;
-        border-color: $primary;
+        color: var(--brand-primary-yiq);
+        background-color: var(--brand-primary);
+        border-color: var(--brand-primary);
       }
     }
 
     .step-indicator {
-      &::after { box-shadow: 0 0 0 ($spacer * .25) transparentize($primary, 0.8); }
+      &::after { box-shadow: 0 0 0 ($spacer * .25) var(--brand-primary-transparent); }
     }
   }
 }

data/app/assets/stylesheets/nfg_ui/network_for_good/core/entity_branding/plugins/_datetimepicker.scss

@@ -8,8 +8,8 @@
   .next,
   .timepicker-picker a.btn {
     &:hover, &:active, &.active {
-      color: color-yiq($primary) !important;
-      background-color: $primary !important;
+      color: var(--brand-primary-yiq) !important;
+      background-color: var(--brand-primary) !important;
     }
   }
 
@@ -17,8 +17,8 @@
   .today {
     &.active {
       &:hover, &:active {
-        color: color-yiq($primary) !important;
-        background-color: $primary !important;
+        color: var(--brand-primary-yiq) !important;
+        background-color: var(--brand-primary) !important;
       }
     }
   }
@@ -26,19 +26,19 @@
 
 //** Datepicker specific
 .datepicker {
-  .prev, .next { color: color-yiq($primary, $yiq-text-dark, $primary); }
+  .prev, .next { color: var(--brand-primary-yiq-text-dark); }
 }
 
 //** Timepicker picker section
-.timepicker-picker td a { color: color-yiq($primary, $yiq-text-dark, $primary); }
+.timepicker-picker td a { color: var(--brand-primary-yiq-text-dark); }
 
 //** Time/Date Toggle
 .picker-switch.accordion-toggle {
   a {
-    color: color-yiq($primary, $yiq-text-dark, $primary);
+    color: var(--brand-primary-yiq-text-dark);
     &:hover, &:active {
-      color: color-yiq($primary) !important;
-      background-color: $primary !important;
+      color: var(--brand-primary-yiq) !important;
+      background-color: var(--brand-primary) !important;
     }
   }
 }

data/app/assets/stylesheets/nfg_ui/network_for_good/core/entity_branding/plugins/_select2.scss

@@ -3,11 +3,11 @@
 .select2-container--default {
   &.select2-container--focus .select2-selection--multiple,
   &.select2-container--open .select2-selection--single {
-    border-color: $primary !important;
-    box-shadow: 0 0 0 ($spacer * .125) transparentize($primary, 0.8);
+    border-color: var(--brand-primary) !important;
+    box-shadow: 0 0 0 ($spacer * .125) var(--brand-primary-transparent);
   }
   .select2-search--dropdown .select2-search__field:focus {
-    border-color: $primary !important;
-    box-shadow: 0 0 0 ($spacer * .125) transparentize($primary, 0.8);
+    border-color: var(--brand-primary) !important;
+    box-shadow: 0 0 0 ($spacer * .125) var(--brand-primary-transparent);
   }
 }

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

@@ -18,3 +18,9 @@
     ul, ol, img { page-break-inside: avoid; }
   }
 }
+
+.page-break {
+  margin-top: ($spacer * 4);
+  margin-bottom: ($spacer * 4);
+  @media print { page-break-after: always; }
+}

data/app/views/nfg_ui/_entity_branding_styles.html.haml

@@ -0,0 +1,54 @@
+- brand_primary = local_assigns[:brand_primary]
+
+:scss
+
+  //**********
+  // NOTE:
+  // if $white, $gray-800, or any of the $yiq-* variables are updated,
+  // update them here as well: /app/assets/stylesheets/nfg_ui/network_for_good/core/_variables.scss
+  //**********
+
+  // Brings in core variables needed (ex: $yiq-text-dark) because @import doesn't work in auctions (rails_6 branch)
+  // @import 'nfg_ui/network_for_good/core/variables';
+  $yiq-contrasted-threshold:  147;
+  $yiq-text-dark:             #313A3E; // $gray-800
+  $yiq-text-light:            #FFFFFF; // $white
+
+  // Brings in color-yiq function for color contrasts because @import doesn't work in auctions (rails_6 branch)
+  // @import 'nfg_ui/network_for_good/core/entity_branding/nfg_theme/functions';
+  @function color-yiq($color, $dark: $yiq-text-dark, $light: $yiq-text-light) {
+    $r: red($color);
+    $g: green($color);
+    $b: blue($color);
+
+    $yiq: (($r * 299) + ($g * 587) + ($b * 114)) / 1000;
+
+    @if ($yiq >= $yiq-contrasted-threshold) {
+      @return $dark;
+    } @else {
+      @return $light;
+    }
+  }
+
+  // CSS variables that override bootstrap's default colors with the entity's colors
+  $brand-colors: (
+    brand-primary: #{brand_primary},
+    brand-primary-scale-light: scale-color(#{brand_primary}, $lightness: 80%),
+    brand-primary-light: lighten(#{brand_primary}, 35%),
+    brand-primary-dark: darken(#{brand_primary}, 10%),
+    brand-primary-dark-yiq: color-yiq(darken(#{brand_primary}, 10%)),
+    brand-primary-transparent: transparentize(#{brand_primary}, 0.8),
+    brand-primary-yiq: color-yiq(#{brand_primary}),
+    brand-primary-yiq-text-dark: color-yiq(#{brand_primary}, $yiq-text-dark, #{brand_primary}),
+    brand-primary-yiq-text-darker: color-yiq(#{brand_primary}, darken(#{brand_primary}, 10%), #{brand_primary}),
+    brand-primary-yiq-text-darkest: color-yiq(darken(#{brand_primary}, 15%), $yiq-text-dark, darken(#{brand_primary}, 15%)),
+    brand-primary-yiq-text-light: color-yiq(#{brand_primary}, #{brand_primary}, $yiq-text-light)
+  );
+
+  // CSS variables at root
+  :root {
+    // Loop over each name, color
+    @each $name, $color in $brand-colors {
+      --\#{$name}: \#{$color};
+    }
+  }

data/lib/nfg_ui/version.rb

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

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: nfg_ui
 version: !ruby/object:Gem::Version
-  version: 0.14.6.3
+  version: 0.15.1
 platform: ruby
 authors:
 - Jonathan Roehm
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2022-07-22 00:00:00.000000000 Z
+date: 2022-08-03 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bootstrap
@@ -435,6 +435,7 @@ files:
 - 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/_check_in.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_content_section.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_custom_questions_questionnaire.scss
 - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_custom_receipt_language.scss
@@ -596,6 +597,7 @@ files:
 - 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/views/nfg_ui/_entity_branding_styles.html.haml
 - 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