foundation-rails 5.4.5.0 → 5.5.0.0

data/vendor/assets/javascripts/foundation/foundation.tab.js

@@ -4,7 +4,7 @@
   Foundation.libs.tab = {
     name : 'tab',
 
-    version : '5.4.5',
+    version : '5.5.0',
 
     settings : {
       active_class: 'active',
@@ -82,7 +82,7 @@
             // Check whether the location hash references a tab content div or
             // another element on the page (inside or outside the tab content div)
             var hash_element = S(hash);
-            if (hash_element.hasClass('content') && hash_element.parent().hasClass('tab-content')) {
+            if (hash_element.hasClass('content') && hash_element.parent().hasClass('tabs-content')) {
               // Tab content div
               self.toggle_active_tab($('[' + self.attr_name() + '] > * > a[href=' + hash + ']').parent());
             } else {
@@ -95,7 +95,7 @@
             }
           } else {
             // Reference the default tab hashes which were initialized in the init function
-            for (var ind in self.default_tab_hashes) {
+            for (var ind = 0; ind < self.default_tab_hashes.length; ind++) {
               self.toggle_active_tab($('[' + self.attr_name() + '] > * > a[href=' + self.default_tab_hashes[ind] + ']').parent());
             }
           }
@@ -113,7 +113,7 @@
           siblings = tab.siblings(),
           settings = tabs.data(this.attr_name(true) + '-init'),
           interpret_keyup_action = function(e) {
-            // Light modification of Heydon Pickering's Practical ARIA Examples: http://heydonworks.com/practical_aria_examples/js/a11y.js 
+            // Light modification of Heydon Pickering's Practical ARIA Examples: http://heydonworks.com/practical_aria_examples/js/a11y.js
 
             // define current, previous and next (possible) tabs
 
@@ -190,16 +190,16 @@
       // window (notably in Chrome).
       // Clean up multiple attr instances to done once
       tab.addClass(settings.active_class).triggerHandler('opened');
-      tab_link.attr({"aria-selected": "true",  tabindex: 0});
+      tab_link.attr({'aria-selected': 'true',  tabindex: 0});
       siblings.removeClass(settings.active_class)
-      siblings.find('a').attr({"aria-selected": "false",  tabindex: -1});
-      target.siblings().removeClass(settings.active_class).attr({"aria-hidden": "true",  tabindex: -1}).end().addClass(settings.active_class).attr('aria-hidden', 'false').find(':first-child').attr('tabindex', 0);
+      siblings.find('a').attr({'aria-selected': 'false',  tabindex: -1});
+      target.siblings().removeClass(settings.active_class).attr({'aria-hidden': 'true',  tabindex: -1});
+      target.addClass(settings.active_class).attr('aria-hidden', 'false').removeAttr('tabindex');
       settings.callback(tab);
-      target.children().attr('tab-index', 0);
       target.triggerHandler('toggled', [tab]);
       tabs.triggerHandler('toggled', [target]);
 
-      tab_link.on('keydown', interpret_keyup_action );
+      tab_link.off('keydown').on('keydown', interpret_keyup_action );
     },
 
     data_attr: function (str) {

data/vendor/assets/javascripts/foundation/foundation.tooltip.js

@@ -4,7 +4,7 @@
   Foundation.libs.tooltip = {
     name : 'tooltip',
 
-    version : '5.4.5',
+    version : '5.5.0',
 
     settings : {
       additional_inheritable_classes : [],

data/vendor/assets/javascripts/foundation/foundation.topbar.js

@@ -4,7 +4,7 @@
   Foundation.libs.topbar = {
     name : 'topbar',
 
-    version: '5.4.5',
+    version: '5.5.0',
 
     settings : {
       index : 0,
@@ -229,11 +229,11 @@
           }
         });
 
-      S(window).off(".topbar").on("resize.fndtn.topbar", self.throttle(function() {
+      S(window).off('.topbar').on('resize.fndtn.topbar', self.throttle(function() {
           self.resize.call(self);
-      }, 50)).trigger("resize").trigger("resize.fndtn.topbar").load(function(){
+      }, 50)).trigger('resize').trigger('resize.fndtn.topbar').load(function(){
           // Ensure that the offset is calculated after all of the pages resources have loaded
-          S(this).trigger("resize.fndtn.topbar");
+          S(this).trigger('resize.fndtn.topbar');
       });
 
       S('body').off('.topbar').on('click.fndtn.topbar', function (e) {
@@ -365,7 +365,7 @@
         if (!$dropdown.find('.title.back').length) {
 
           if (settings.mobile_show_parent_link == true && url) {
-            $titleLi = $('<li class="title back js-generated"><h5><a href="javascript:void(0)"></a></h5></li><li class="parent-link show-for-small"><a class="parent-link js-generated" href="' + url + '">' + $link.html() +'</a></li>');
+            $titleLi = $('<li class="title back js-generated"><h5><a href="javascript:void(0)"></a></h5></li><li class="parent-link show-for-small-only"><a class="parent-link js-generated" href="' + url + '">' + $link.html() +'</a></li>');
           } else {
             $titleLi = $('<li class="title back js-generated"><h5><a href="javascript:void(0)"></a></h5>');
           }

data/vendor/assets/stylesheets/foundation/_functions.scss

@@ -6,11 +6,15 @@
 $rem-base: 16px !default;
 
 // IMPORT ONCE
-// We use this to prevent styles from being loaded multiple times for compenents that rely on other components. 
+// We use this to prevent styles from being loaded multiple times for compenents that rely on other components.
 $modules: () !default;
 @mixin exports($name) {
-  @if(not index($modules, $name)) {
-    $modules: append($modules, $name);
+  // Import from global scope
+  $modules: $modules !global;
+  // Check if a module is already on the list
+  $module_index: index($modules, $name);
+  @if (($module_index == null) or ($module_index == false)) {
+    $modules: append($modules, $name) !global;
     @content;
   }
 }
@@ -21,7 +25,7 @@ $modules: () !default;
 
 
 // RANGES
-// We use these functions to define ranges for various things, like media queries. 
+// We use these functions to define ranges for various things, like media queries.
 @function lower-bound($range){
   @if length($range) <= 0 {
     @return 0;
@@ -42,6 +46,47 @@ $modules: () !default;
   @return $num / ($num * 0 + 1);
 }
 
+// TEXT INPUT TYPES
+
+@function text-inputs( $types: all, $selector: input ) {
+
+    $return: ();
+
+    $all-text-input-types:
+      text
+      password
+      date
+      datetime
+      datetime-local
+      month
+      week
+      email
+      number
+      search
+      tel
+      time
+      url
+      color
+      textarea;
+
+    @if $types == all { $types: $all-text-input-types; }
+
+    @each $type in $types {
+        @if $type == textarea {
+            @if $selector == input {
+              $return: append($return, unquote('#{$type}'), comma)
+            } @else {
+              $return: append($return, unquote('#{$type}#{$selector}'), comma)
+            }
+        } @else {
+            $return: append($return, unquote('#{$selector}[type="#{$type}"]'), comma)
+        }
+    }
+
+    @return $return;
+
+}
+
 // CONVERT TO REM
 @function convert-to-rem($value, $base-value: $rem-base)  {
   $value: strip-unit($value) / strip-unit($base-value) * 1rem;
@@ -57,23 +102,23 @@ $modules: () !default;
   @return '[data-' + $attr + ']';
 }
 
-// REM CALC 
+// REM CALC
 
 // New Syntax, allows to optionally calculate on a different base value to counter compounding effect of rem's.
 // Call with 1, 2, 3 or 4 parameters, 'px' is not required but supported:
-// 
+//
 //   rem-calc(10 20 30px 40);
-// 
+//
 // Space delimited, if you want to delimit using comma's, wrap it in another pair of brackets
-// 
+//
 //   rem-calc((10, 20, 30, 40px));
-// 
+//
 // Optionally call with a different base (eg: 8px) to calculate rem.
-// 
+//
 //   rem-calc(16px 32px 48px, 8px);
-// 
+//
 // If you require to comma separate your list
-// 
+//
 //   rem-calc((16px, 32px, 48), 8px);
 
 @function rem-calc($values, $base-value: $rem-base) {

data/vendor/assets/stylesheets/foundation/_settings.scss

@@ -95,14 +95,6 @@ $include-html-global-classes: $include-html-classes;
 // $font-weight-normal: normal !default;
 // $font-weight-bold: bold !default;
 
-// We use these as default colors throughout
-// $primary-color: #008CBA;
-// $secondary-color: #e7e7e7;
-// $alert-color: #f04124;
-// $success-color: #43AC6A;
-// $warning-color: #f08a24;
-// $info-color: #a0d3e8;
-
 // $white       : #FFFFFF;
 // $ghost       : #FAFAFA;
 // $snow        : #F9F9F9;
@@ -123,6 +115,14 @@ $include-html-global-classes: $include-html-classes;
 // $jet         : #222222;
 // $black       : #000000;
 
+// We use these as default colors throughout
+// $primary-color: #008CBA;
+// $secondary-color: #e7e7e7;
+// $alert-color: #f04124;
+// $success-color: #43AC6A;
+// $warning-color: #f08a24;
+// $info-color: #a0d3e8;
+
 // We use these to control various global styles
 // $body-bg: $white;
 // $body-font-color: $jet;
@@ -318,14 +318,14 @@ $include-html-global-classes: $include-html-classes;
 // $include-html-accordion-classes: $include-html-classes;
 
 // $accordion-navigation-padding: rem-calc(16);
-// $accordion-navigation-bg-color: $silver  ;
+// $accordion-navigation-bg-color: $silver;
 // $accordion-navigation-hover-bg-color: scale-color($accordion-navigation-bg-color, $lightness: -5%);
 // $accordion-navigation-active-bg-color: scale-color($accordion-navigation-bg-color, $lightness: -3%);
 // $accordion-navigation-font-color: $jet;
 // $accordion-navigation-font-size: rem-calc(16);
 // $accordion-navigation-font-family: $body-font-family;
 
-// $accordion-content-padding: $column-gutter/2;
+// $accordion-content-padding: ($column-gutter/2);
 // $accordion-content-active-bg-color: $white;
 
 // 02. Alert Boxes
@@ -545,7 +545,7 @@ $include-html-global-classes: $include-html-classes;
 // $f-dropdown-font-size: rem-calc(14);
 // $f-dropdown-list-padding: rem-calc(5, 10);
 // $f-dropdown-line-height: rem-calc(18);
-// $f-dropdown-list-hover-bg: $smoke  ;
+// $f-dropdown-list-hover-bg: $smoke;
 // $dropdown-mobile-default-float: 0;
 
 // We use this to control the styles for when the dropdown has custom content.
@@ -573,25 +573,25 @@ $include-html-global-classes: $include-html-classes;
 // $dropdown-button-padding-tny: $button-pip-tny * 7;
 // $dropdown-button-pip-size-tny: $button-pip-tny;
 // $dropdown-button-pip-opposite-tny: $button-pip-tny * 3;
-// $dropdown-button-pip-top-tny: -$button-pip-tny / 2 + rem-calc(1);
+// $dropdown-button-pip-top-tny: (-$button-pip-tny / 2) + rem-calc(1);
 
 // We use these to style small dropdown buttons
 // $dropdown-button-padding-sml: $button-pip-sml * 7;
 // $dropdown-button-pip-size-sml: $button-pip-sml;
 // $dropdown-button-pip-opposite-sml: $button-pip-sml * 3;
-// $dropdown-button-pip-top-sml: -$button-pip-sml / 2 + rem-calc(1);
+// $dropdown-button-pip-top-sml: (-$button-pip-sml / 2) + rem-calc(1);
 
 // We use these to style medium dropdown buttons
 // $dropdown-button-padding-med: $button-pip-med * 6 + rem-calc(3);
 // $dropdown-button-pip-size-med: $button-pip-med - rem-calc(3);
 // $dropdown-button-pip-opposite-med: $button-pip-med * 2.5;
-// $dropdown-button-pip-top-med: -$button-pip-med / 2 + rem-calc(2);
+// $dropdown-button-pip-top-med: (-$button-pip-med / 2) + rem-calc(2);
 
 // We use these to style large dropdown buttons
 // $dropdown-button-padding-lrg: $button-pip-lrg * 5 + rem-calc(3);
 // $dropdown-button-pip-size-lrg: $button-pip-lrg - rem-calc(6);
 // $dropdown-button-pip-opposite-lrg: $button-pip-lrg * 2.5;
-// $dropdown-button-pip-top-lrg: -$button-pip-lrg / 2 + rem-calc(3);
+// $dropdown-button-pip-top-lrg: (-$button-pip-lrg / 2) + rem-calc(3);
 
 // 10. Flex Video
 // - - - - - - - - - - - - - - - - - - - - - - - - -
@@ -667,6 +667,7 @@ $include-html-global-classes: $include-html-classes;
 // $input-error-message-font-weight: $font-weight-normal;
 // $input-error-message-font-style: italic;
 // $input-error-message-font-color: $white;
+// $input-error-message-bg-color: $alert-color;
 // $input-error-message-font-color-alt: $oil;
 
 // We use this to style the glowing effect of inputs when focused
@@ -685,9 +686,11 @@ $include-html-global-classes: $include-html-classes;
 // $include-html-icon-bar-classes: $include-html-classes;
 // $icon-bar-bg: $oil;
 // $icon-bar-font-color: $white;
+// $icon-bar-font-color-hover: $icon-bar-font-color;
 // $icon-bar-font-size: 1rem;
 // $icon-bar-hover-color: $primary-color;
 // $icon-bar-icon-color: $white;
+// $icon-bar-icon-color-hover: $icon-bar-icon-color;
 // $icon-bar-icon-size: 1.875rem;
 // $icon-bar-image-width: 1.875rem;
 // $icon-bar-image-height: 1.875rem;
@@ -991,7 +994,7 @@ $include-html-global-classes: $include-html-classes;
 // $price-title-font-family: $body-font-family;
 
 // We use these to control the price styles
-// $price-money-bg: $vapor  ;
+// $price-money-bg: $vapor;
 // $price-money-padding: rem-calc(15 20);
 // $price-money-align: center;
 // $price-money-color: $oil;
@@ -1268,7 +1271,7 @@ $include-html-global-classes: $include-html-classes;
 
 // These control the background color for the table and even rows
 // $table-bg: $white;
-// $table-even-row-bg: $snow  ;
+// $table-even-row-bg: $snow;
 
 // These control the table cell border style
 // $table-border-style: solid;
@@ -1308,7 +1311,7 @@ $include-html-global-classes: $include-html-classes;
 // $tabs-navigation-font-family: $body-font-family;
 
 // $tabs-content-margin-bottom: rem-calc(24);
-// $tabs-content-padding: $column-gutter/2;
+// $tabs-content-padding: ($column-gutter/2);
 
 // $tabs-vertical-navigation-margin-bottom: 1.25rem;
 
@@ -1365,7 +1368,7 @@ $include-html-global-classes: $include-html-classes;
 // $topbar-bg: $topbar-bg-color;
 
 // Height and margin
-// $topbar-height: 45px;
+// $topbar-height: rem-calc(45);
 // $topbar-margin-bottom: 0;
 
 // Controlling the styles for the title in the top bar
@@ -1376,6 +1379,7 @@ $include-html-global-classes: $include-html-classes;
 // $topbar-dropdown-bg: $oil;
 // $topbar-dropdown-link-color: $white;
 // $topbar-dropdown-link-bg: $oil;
+// $topbar-dropdown-link-bg-hover: $oil;
 // $topbar-dropdown-link-weight: $font-weight-normal;
 // $topbar-dropdown-toggle-size: 5px;
 // $topbar-dropdown-toggle-color: $white;
@@ -1391,12 +1395,12 @@ $include-html-global-classes: $include-html-classes;
 // $topbar-link-hover-lightness: -10%; // Darken by 10%
 // $topbar-link-bg: $topbar-bg;
 // $topbar-link-bg-color-hover: $charcoal;
-// $topbar-link-bg-hover: #272727;
+// $topbar-link-bg-hover: $oil;
 // $topbar-link-bg-active: $primary-color;
 // $topbar-link-bg-active-hover: scale-color($primary-color, $lightness: -14%);
 // $topbar-link-font-family: $body-font-family;
 // $topbar-link-text-transform: none;
-// $topbar-link-padding: $topbar-height / 3;
+// $topbar-link-padding: ($topbar-height / 3);
 // $topbar-back-link-size: $h5-font-size;
 // $topbar-link-dropdown-padding: 20px;
 

data/vendor/assets/stylesheets/foundation/components/_accordion.scss

@@ -18,7 +18,7 @@ $accordion-navigation-font-color: $jet !default;
 $accordion-navigation-font-size: rem-calc(16) !default;
 $accordion-navigation-font-family: $body-font-family !default;
 
-$accordion-content-padding: $column-gutter/2 !default;
+$accordion-content-padding: ($column-gutter/2) !default;
 $accordion-content-active-bg-color: $white !default;
 
 

data/vendor/assets/stylesheets/foundation/components/_alert-boxes.scss

@@ -38,6 +38,7 @@ $alert-close-font-size: rem-calc(22) !default;
 $alert-close-opacity: 0.3 !default;
 $alert-close-opacity-hover: 0.5 !default;
 $alert-close-padding: 9px 6px 4px !default;
+$alert-close-background: inherit !default;
 
 // We use this to control border radius
 $alert-radius: $global-radius !default;
@@ -91,6 +92,7 @@ $alert-transition-ease: ease-out !default;
   #{$opposite-direction}: $alert-close-position;
   color: $alert-close-color;
   opacity: $alert-close-opacity;
+  background: $alert-close-background;
   &:hover,
   &:focus { opacity: $alert-close-opacity-hover; }
 }

data/vendor/assets/stylesheets/foundation/components/_button-groups.scss

@@ -57,7 +57,6 @@ $button-group-border-width: 1px !default;
   }
   @else {
     margin: 0 -2px;
-    float: $default-float;
     display: inline-block;
   }
 
@@ -67,7 +66,7 @@ $button-group-border-width: 1px !default;
     > button, .button {
       border-top: $button-group-border-width solid;
       border-color: rgba(255, 255, 255, 0.5);
-      border-left-width: 0px;
+      border-left-width: 0;
       margin:0;
       display: block;
     }

data/vendor/assets/stylesheets/foundation/components/_buttons.scss

@@ -34,7 +34,7 @@ $button-font-align: center !default;
 $button-function-factor: -20% !default;
 
 // We use these to control button border styles.
-$button-border-width: 0px !default;
+$button-border-width: 0 !default;
 $button-border-style: solid !default;
 $button-bg-color: $primary-color !default;
 $button-bg-hover: scale-color($button-bg-color, $lightness: $button-function-factor) !default;
@@ -80,7 +80,7 @@ $button-disabled-cursor: $cursor-default-value !default;
     text-decoration: none;
     text-align: $button-font-align;
     -webkit-appearance: none;
-    -webkit-border-radius:0;
+    border-radius:0;
   }
   @if $display { display: $display; }
 }
@@ -133,7 +133,7 @@ $button-disabled-cursor: $cursor-default-value !default;
 //
 // We use this mixin to add button color styles
 //
-// $bg - Primary color set in settings file. Default: $button-bg.
+// $bg - Background color. We can set $bg:false for a transparent background. Default: $primary-color.
 // $radius - If true, set to button radius which is $global-radius || explicitly set radius amount in px (ex. $radius:10px). Default: true
 // $disabled - We can set $disabled:true to create a disabled transparent button. Default: false
 // $bg-hover - Button Hover Background Color. Default: $button-bg-hover
@@ -194,12 +194,11 @@ $button-disabled-cursor: $cursor-default-value !default;
 // $radius - If true, set to button radius which is $global-radius || explicitly set radius amount in px (ex. $radius:10px). Default:false.
 // $full-width - We can set $full-width:true to remove side padding extend width. Default:false.
 // $disabled - We can set $disabled:true to create a disabled transparent button. Default:false.
-// $is-input - <input>'s and <button>'s take on strange padding. We added this to help fix that. Default:false.
 // $is-prefix - Not used? Default:false.
 // $bg-hover - Button Hover Color - Default null - see button-style mixin
 // $border-color - Button Border Color - Default null - see button-style mixin
 // $transition - We can control whether or not to include the background-color transition property - Default:true.
-@mixin button($padding:$button-med, $bg:$button-bg-color, $radius:false, $full-width:false, $disabled:false, $is-input:false, $is-prefix:false, $bg-hover:null, $border-color:null, $transition: true) {
+@mixin button($padding:$button-med, $bg:$button-bg-color, $radius:false, $full-width:false, $disabled:false, $is-prefix:false, $bg-hover:null, $border-color:null, $transition: true) {
   @include button-base;
   @include button-size($padding, $full-width);
   @include button-style($bg, $radius, $disabled, $bg-hover, $border-color);