foundation-rails 6.2.4.0 → 6.3.0.0

data/vendor/assets/scss/util/_flex.scss

@@ -13,6 +13,13 @@ $-zf-flex-align: (
   'stretch': stretch,
 );
 
+$-zf-flex-direction: (
+  'row': row,
+  'row-reverse': row-reverse,
+  'column': column,
+  'column-reverse': column-reverse,
+);
+
 /// Enables flexbox by adding `display: flex` to the element.
 @mixin flex {
   display: flex;
@@ -28,7 +35,7 @@ $-zf-flex-align: (
       $x: map-get($-zf-flex-justify, $x);
     }
     @else {
-      @warn 'flex-grid-row-align(): #{$x} is not a valid value for horizontal alignment. Use left, right, center, justify, or spaced.'
+      @warn 'flex-grid-row-align(): #{$x} is not a valid value for horizontal alignment. Use left, right, center, justify, or spaced.';
     }
   }
 
@@ -37,7 +44,7 @@ $-zf-flex-align: (
       $y: map-get($-zf-flex-align, $y);
     }
     @else {
-      @warn 'flex-grid-row-align(): #{$y} is not a valid value for vertical alignment. Use top, bottom, middle, or stretch.'
+      @warn 'flex-grid-row-align(): #{$y} is not a valid value for vertical alignment. Use top, bottom, middle, or stretch.';
     }
   }
 
@@ -54,7 +61,7 @@ $-zf-flex-align: (
       $y: map-get($-zf-flex-align, $y);
     }
     @else {
-      @warn 'flex-grid-column-align(): #{$y} is not a valid value for alignment. Use top, bottom, middle, or stretch.'
+      @warn 'flex-grid-column-align(): #{$y} is not a valid value for alignment. Use top, bottom, middle, or stretch.';
     }
   }
 
@@ -66,3 +73,13 @@ $-zf-flex-align: (
 @mixin flex-order($order: 0) {
   order: $order;
 }
+
+/// Change flex-direction
+/// @param {Keyword} $direction [row] - Flex direction to use. Can be
+///   - row (default): same as text direction
+///   - row-reverse: opposite to text direction
+///   - column: same as row but top to bottom
+///   - column-reverse: same as row-reverse top to bottom
+@mixin flex-direction($direction: row) {
+  flex-direction: $direction;
+}

data/vendor/assets/scss/util/_math.scss

@@ -0,0 +1,72 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+
+////
+/// @group functions
+////
+
+/// Finds the greatest common divisor of two integers.
+///
+/// @param {Number} $a - First number to compare.
+/// @param {Number} $b - Second number to compare.
+///
+/// @returns {Number} The greatest common divisor.
+@function gcd($a, $b) {
+  // From: http://rosettacode.org/wiki/Greatest_common_divisor#JavaScript
+  @if ($b != 0) {
+    @return gcd($b, $a % $b);
+  }
+  @else {
+    @return abs($a);
+  }
+}
+
+/// Handles decimal exponents by trying to convert them into a fraction and then use a nth-root-algorithm for parts of the calculation
+///
+/// @param {Number} $base - The base number.
+/// @param {Number} $exponent - The exponent.
+///
+/// @returns {Number} The product of the exponentiation.
+@function pow($base, $exponent, $prec: 12) {
+  @if (floor($exponent) != $exponent) {
+    $prec2 : pow(10, $prec);
+    $exponent: round($exponent * $prec2);
+    $denominator: gcd($exponent, $prec2);
+    @return nth-root(pow($base, $exponent / $denominator), $prec2 / $denominator, $prec);
+  }
+
+  $value: $base;
+  @if $exponent > 1 {
+    @for $i from 2 through $exponent {
+      $value: $value * $base;
+    }
+  }
+  @else if $exponent < 1 {
+    @for $i from 0 through -$exponent {
+      $value: $value / $base;
+    }
+  }
+
+  @return $value;
+}
+
+@function nth-root($num, $n: 2, $prec: 12) {
+  // From: http://rosettacode.org/wiki/Nth_root#JavaScript
+  $x: 1;
+
+  @for $i from 0 through $prec {
+    $x: 1 / $n * (($n - 1) * $x + ($num / pow($x, $n - 1)));
+  }
+
+  @return $x;
+}
+
+/// Calculates the height as a percentage of the width for a given ratio.
+/// @param {List} $ratio - Ratio to use to calculate the height, formatted as `x by y`.
+/// @return {Number} A percentage value for the height relative to the width of a responsive container.
+@function ratio-to-percentage($ratio) {
+  $w: nth($ratio, 1);
+  $h: nth($ratio, 3);
+  @return $h / $w * 100%;
+}

data/vendor/assets/scss/util/_mixins.scss

@@ -16,31 +16,33 @@
   $triangle-color,
   $triangle-direction
 ) {
-  content: '';
   display: block;
   width: 0;
   height: 0;
+
   border: inset $triangle-size;
 
+  content: '';
+
   @if ($triangle-direction == down) {
-    border-color: $triangle-color transparent transparent;
-    border-top-style: solid;
     border-bottom-width: 0;
+    border-top-style: solid;
+    border-color: $triangle-color transparent transparent;
   }
   @if ($triangle-direction == up) {
-    border-color: transparent transparent $triangle-color;
-    border-bottom-style: solid;
     border-top-width: 0;
+    border-bottom-style: solid;
+    border-color: transparent transparent $triangle-color;
   }
   @if ($triangle-direction == right) {
-    border-color: transparent transparent transparent $triangle-color;
-    border-left-style: solid;
     border-right-width: 0;
+    border-left-style: solid;
+    border-color: transparent transparent transparent $triangle-color;
   }
   @if ($triangle-direction == left) {
-    border-color: transparent $triangle-color transparent transparent;
-    border-right-style: solid;
     border-left-width: 0;
+    border-right-style: solid;
+    border-color: transparent $triangle-color transparent transparent;
   }
 }
 
@@ -71,31 +73,33 @@
     $spacing: floor($spacing);
   }
 
+  @for $i from 2 through $bars {
+    $offset: ($weight + $spacing) * ($i - 1);
+    $shadow: append($shadow, 0 $offset 0 $color, comma);
+  }
+
   // Icon container
   position: relative;
   display: inline-block;
   vertical-align: middle;
-  cursor: pointer;
   width: $width;
   height: $height;
+  cursor: pointer;
 
   // Icon bars
   &::after {
-    content: '';
     position: absolute;
-    display: block;
-    width: 100%;
-    height: $weight;
-    background: $color;
     top: 0;
     left: 0;
 
-    @for $i from 2 through $bars {
-      $offset: ($weight + $spacing) * ($i - 1);
-      $shadow: append($shadow, 0 $offset 0 $color, comma);
-    }
+    display: block;
+    width: 100%;
+    height: $weight;
 
+    background: $color;
     box-shadow: $shadow;
+
+    content: '';    
   }
 
   // Hover state
@@ -141,8 +145,9 @@
 @mixin clearfix {
   &::before,
   &::after {
-    content: ' ';
     display: table;
+    content: ' ';
+
     @if $global-flexbox {
       flex-basis: 0;
       order: 1;
@@ -188,8 +193,8 @@
 /// Reverses the CSS output created by the `element-invisible()` mixin.
 @mixin element-invisible-off {
   position: static !important;
-  height: auto;
   width: auto;
+  height: auto;
   overflow: visible;
   clip: auto;
 }
@@ -223,17 +228,49 @@
 ///
 /// @param {Boolean} $small [true] - If `false`, the mixin will skip the `small` breakpoint. Use this with components that don't prefix classes with `small-`, only `medium-` and up.
 @mixin -zf-each-breakpoint($small: true) {
-  $map: $breakpoint-classes;
+  $list: $breakpoint-classes;
 
   @if not $small {
-    $map: map-remove($map, $-zf-zero-breakpoint);
+    $list: sl-remove($list, $-zf-zero-breakpoint);
   }
 
-  @each $size in $map {
-    $-zf-size: $size !global;
+  @each $name in $list {
+    $-zf-size: $name !global;
 
-    @include breakpoint($size) {
+    @include breakpoint($name) {
       @content;
     }
   }
 }
+
+/// Generate the `@content` passed to the mixin with a value `$-zf-bp-value` related to a breakpoint, depending on the `$name` parameter:
+/// - For a single value, `$-zf-bp-value` is this value.
+/// - For a breakpoint name, `$-zf-bp-value` is the corresponding breakpoint value in `$map`.
+/// - For "auto", `$-zf-bp-value` is the corresponding breakpoint value in `$map` and is passed to `@content`, which is made responsive for each breakpoint of `$map`.
+/// @param {Number|Keyword} $name [auto] - Single value or breakpoint name to use. "auto" by default.
+/// @param {Number|Map} $map - Map of breakpoints and values or single value to use.
+@mixin -zf-breakpoint-value(
+  $name: auto,
+  $map: null
+) {
+  @if $name == auto and type-of($map) == 'map' {
+    // "auto"
+    @each $k, $v in $map {
+      @include breakpoint($k) {
+        @include -zf-breakpoint-value($v, $map) {
+          @content;
+        }
+      }
+    }
+  }
+  @else {
+    // breakpoint name
+    @if type-of($name) == 'string' {
+      $name: -zf-get-bp-val($map, $name);
+    }
+
+    // breakpoint value
+    $-zf-bp-value: $name !global;
+    @content;
+  }
+}

data/vendor/assets/scss/util/_selector.scss

@@ -9,7 +9,8 @@
 /// Generates a selector with every text input type. You can also filter the list to only output a subset of those selectors.
 ///
 /// @param {List|Keyword} $types [()] - A list of text input types to use. Leave blank to use all of them.
-@function text-inputs($types: ()) {
+/// @param {Keyword} $modifier [''] - A modifier to be applied to each text input type (e.g. a class or a pseudo-class). Leave blank to ignore.
+@function text-inputs($types: (), $modifier: '') {
   $return: ();
 
   $all-types:
@@ -33,7 +34,7 @@
   }
 
   @each $type in $types {
-    $return: append($return, unquote('[type=\'#{$type}\']'), comma);
+    $return: append($return, unquote('[type=\'#{$type}\']#{$modifier}'), comma);
   }
 
   @return $return;

data/vendor/assets/scss/util/_unit.scss

@@ -8,8 +8,6 @@
 
 $global-font-size: 100% !default;
 
-// scss-lint:disable ZeroUnit
-
 /// Removes the unit (e.g. px, em, rem) from a value, returning the number only.
 ///
 /// @param {Number} $num - Number to strip unit from.
@@ -39,7 +37,7 @@ $global-font-size: 100% !default;
   @if unit($base) == '%' {
     $base: ($base / 100%) * 16px;
   }
-  
+
   // Using rem as base allows correct scaling
   @if unit($base) == 'rem' {
     $base: strip-unit($base) * 16px;
@@ -81,7 +79,12 @@ $global-font-size: 100% !default;
     @return $value;
   }
 
-  // Calculate rem if units for $value is not rem
+  // Transform em into rem if someone hands over 'em's
+  @if unit($value) == 'em' {
+    $value: strip-unit($value) * 1rem;
+  }
+
+  // Calculate rem if units for $value is not rem or em
   @if unit($value) != 'rem' {
     $value: strip-unit($value) / strip-unit($base) * 1rem;
   }
@@ -93,3 +96,57 @@ $global-font-size: 100% !default;
 
   @return $value;
 }
+
+/// Converts a pixel, percentage, rem or em value to a unitless value based on a given font size. Ideal for working out unitless line heights.
+///
+/// @param {Number} $value - Value to convert to a unitless line height
+/// @param {Number} $base - The font size to use to work out the line height - defaults to $global-font-size
+///
+/// @return {Number} - Unitless number
+@function unitless-calc($value, $base: null) {
+
+  // If no base is defined, defer to the global font size
+  @if $base == null {
+    $base: $global-font-size;
+  }
+
+  // First, lets convert our $base to pixels
+
+  // If the base font size is a %, then multiply it by 16px
+  @if unit($base) == '%' {
+    $base: ($base / 100%) * 16px;
+  }
+
+  @if unit($base) == 'rem' {
+    $base: strip-unit($base) * 16px;
+  }
+
+  @if unit($base) == 'em' {
+    $base: strip-unit($base) * 16px;
+  }
+
+  // Now lets convert our value to pixels too
+  @if unit($value) == '%' {
+    $value: ($value / 100%) * $base;
+  }
+
+  @if unit($value) == 'rem' {
+    $value: strip-unit($value) * $base;
+  }
+
+  @if unit($value) == 'em' {
+    $value: strip-unit($value) * $base;
+  }
+
+  // 'px'
+  @if unit($value) == 'px' {
+    @return strip-unit($value) / strip-unit($base);
+  }
+
+  // assume that line-heights greatern then 10 are meant to be absolute in 'px'
+  @if unitless($value) and ($value > 10) {
+    @return $value / strip-unit($base);
+  }
+
+  @return $value;
+}

data/vendor/assets/scss/util/_util.scss

@@ -2,6 +2,7 @@
 // foundation.zurb.com
 // Licensed under MIT Open Source
 
+@import 'math';
 @import 'unit';
 @import 'value';
 @import 'color';

data/vendor/assets/scss/util/_value.scss

@@ -105,3 +105,36 @@
   }
   @return $map;
 }
+
+/// Casts a map into a list.
+/// @link http://hugogiraudel.com/2014/04/28/casting-map-into-list/
+///
+/// @param {Map} $map - Map to pull a value from.
+///
+/// @returns {List} Depending on the flag, returns either $keys or $values or both.
+@function map-to-list($map, $keep: 'both') {
+  $keep: if(index('keys' 'values', $keep), $keep, 'both');
+
+  @if type-of($map) == 'map' {
+    $keys: ();
+    $values: ();
+
+    @each $key, $val in $map {
+      $keys: append($keys, $key);
+      $values: append($values, $val);
+    }
+
+    @if $keep == 'keys' {
+      @return $keys;
+    }
+    @else if $keep == 'values' {
+      @return $values;
+    }
+    @else {
+      @return zip($keys, $values);
+    }
+  }
+
+  @return if(type-of($map) != 'list', ($value,), $map);
+
+}

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: foundation-rails
 version: !ruby/object:Gem::Version
-  version: 6.2.4.0
+  version: 6.3.0.0
 platform: ruby
 authors:
 - ZURB
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2016-10-21 00:00:00.000000000 Z
+date: 2016-12-15 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass
@@ -160,6 +160,17 @@ files:
 - spec/features/generator_spec.rb
 - spec/spec_helper.rb
 - spec/support/helpers.rb
+- vendor/assets/_vendor/normalize-scss/sass/_normalize.scss
+- vendor/assets/_vendor/normalize-scss/sass/normalize/_import-now.scss
+- vendor/assets/_vendor/normalize-scss/sass/normalize/_normalize-mixin.scss
+- vendor/assets/_vendor/normalize-scss/sass/normalize/_variables.scss
+- vendor/assets/_vendor/normalize-scss/sass/normalize/_vertical-rhythm.scss
+- vendor/assets/_vendor/sassy-lists/stylesheets/functions/_purge.scss
+- vendor/assets/_vendor/sassy-lists/stylesheets/functions/_remove.scss
+- vendor/assets/_vendor/sassy-lists/stylesheets/functions/_replace.scss
+- vendor/assets/_vendor/sassy-lists/stylesheets/functions/_to-list.scss
+- vendor/assets/_vendor/sassy-lists/stylesheets/helpers/_missing-dependencies.scss
+- vendor/assets/_vendor/sassy-lists/stylesheets/helpers/_true.scss
 - vendor/assets/js/foundation.abide.js.es6
 - vendor/assets/js/foundation.accordion.js.es6
 - vendor/assets/js/foundation.accordionMenu.js.es6
@@ -189,6 +200,7 @@ files:
 - vendor/assets/js/foundation.util.timerAndImageLoader.js.es6
 - vendor/assets/js/foundation.util.touch.js.es6
 - vendor/assets/js/foundation.util.triggers.js.es6
+- vendor/assets/js/foundation.zf.responsiveAccordionTabs.js.es6
 - vendor/assets/scss/_global.scss
 - vendor/assets/scss/components/_accordion-menu.scss
 - vendor/assets/scss/components/_accordion.scss
@@ -197,6 +209,7 @@ files:
 - vendor/assets/scss/components/_button-group.scss
 - vendor/assets/scss/components/_button.scss
 - vendor/assets/scss/components/_callout.scss
+- vendor/assets/scss/components/_card.scss
 - vendor/assets/scss/components/_close-button.scss
 - vendor/assets/scss/components/_drilldown.scss
 - vendor/assets/scss/components/_dropdown-menu.scss
@@ -212,6 +225,7 @@ files:
 - vendor/assets/scss/components/_orbit.scss
 - vendor/assets/scss/components/_pagination.scss
 - vendor/assets/scss/components/_progress-bar.scss
+- vendor/assets/scss/components/_responsive-embed.scss
 - vendor/assets/scss/components/_reveal.scss
 - vendor/assets/scss/components/_slider.scss
 - vendor/assets/scss/components/_sticky.scss
@@ -276,6 +290,7 @@ files:
 - vendor/assets/scss/util/_breakpoint.scss
 - vendor/assets/scss/util/_color.scss
 - vendor/assets/scss/util/_flex.scss
+- vendor/assets/scss/util/_math.scss
 - vendor/assets/scss/util/_mixins.scss
 - vendor/assets/scss/util/_selector.scss
 - vendor/assets/scss/util/_unit.scss