locomotivecms_wagon 2.4.0.rc2 → 2.4.0

data/generators/foundation/public/stylesheets/foundation6/util/_selector.scss

@@ -7,8 +7,10 @@
 ////
 
 /// 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:
@@ -27,12 +29,12 @@
     url
     color;
 
-  @if not(hasvalue($types)) {
+  @if not has-value($types) {
     $types: $all-types;
   }
 
   @each $type in $types {
-    $return: append($return, unquote('[type="#{$type}"]'), comma);
+    $return: append($return, unquote('[type=\'#{$type}\']#{$modifier}'), comma);
   }
 
   @return $return;

data/generators/foundation/public/stylesheets/foundation6/util/_typography.scss

@@ -0,0 +1,26 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+
+////
+/// @group functions
+////
+
+$-zf-font-stack: (
+  'georgia': (Georgia, "URW Bookman L", serif),
+  'helvetica': (Helvetica, Arial, "Nimbus Sans L", sans-serif),
+  'lucida-grande': ("Lucida Grande", "Lucida Sans Unicode", "Bitstream Vera Sans", sans-serif),
+  'monospace': ("Courier New", Courier, "Nimbus Sans L", monospace),
+  'system': (-apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Helvetica Neue", Helvetica, Arial, sans-serif),
+  'verdana': (Verdana, Geneva, "DejaVu Sans", sans-serif),
+);
+
+/// Return a font stack list from a map. Equivalent to `map-safe-get($name, $-zf-font-stack)`.
+///
+/// @param {String} $stack - Name of the font stack.
+/// @param {Map} $map [$-zf-font-stack] - Map of font stacks to retrieve a list from.
+///
+/// @returns {List} Found font stack.
+@function font-stack($stack, $map: $-zf-font-stack) {
+  @return map-safe-get($map, $stack);
+}

data/generators/foundation/public/stylesheets/foundation6/util/_unit.scss

@@ -6,30 +6,41 @@
 /// @group functions
 ////
 
-// scss-lint:disable ZeroUnit
-
-/// Defines the base font size of the page, which is the value `1rem` is equal to.
-/// @type Number
-/// @group global
-$rem-base: 16px !default;
+$global-font-size: 100% !default;
 
 /// Removes the unit (e.g. px, em, rem) from a value, returning the number only.
+///
 /// @param {Number} $num - Number to strip unit from.
+///
 /// @returns {Number} The same number, sans unit.
 @function strip-unit($num) {
   @return $num / ($num * 0 + 1);
 }
 
 /// Converts one or more pixel values into matching rem values.
+///
 /// @param {Number|List} $values - One or more values to convert. Be sure to separate them with spaces and not commas. If you need to convert a comma-separated list, wrap the list in parentheses.
-/// @param {Number} $base [$rem-base] - The base value to use when calculating the `rem`. If you're using Foundation out of the box, this is 16px.
+/// @param {Number} $base [null] - The base value to use when calculating the `rem`. If you're using Foundation out of the box, this is 16px. If this parameter is `null`, the function will reference the `$base-font-size` variable as the base.
+///
 /// @returns {List} A list of converted values.
-@function rem-calc($values, $base: $rem-base) {
+@function rem-calc($values, $base: null) {
   $rem-values: ();
   $count: length($values);
 
+  // If no base is defined, defer to the global font size
   @if $base == null {
-    $base: $rem-base;
+    $base: $global-font-size;
+  }
+
+  // If the base font size is a %, then multiply it by 16px
+  // This is because 100% font size = 16px in most all browsers
+  @if unit($base) == '%' {
+    $base: ($base / 100%) * 16px;
+  }
+
+  // Using rem as base allows correct scaling
+  @if unit($base) == 'rem' {
+    $base: strip-unit($base) * 16px;
   }
 
   @if $count == 1 {
@@ -46,24 +57,96 @@ $rem-base: 16px !default;
 // Converts a unitless, pixel, or rem value to em, for use in breakpoints.
 @function -zf-bp-to-em($value) {
   // Pixel and unitless values are converted to rems
-  @if unit($value) == 'px' or unit($value) == '' {
-    $value: rem-calc($value);
+  @if unit($value) == 'px' or unitless($value) {
+    $value: rem-calc($value, $base: 16px);
   }
 
   // Then the value is converted to ems
   @return strip-unit($value) * 1em;
 }
 
-/// Converts a pixel value to matching rem value. *Any* value passed, regardless of unit, is assumed to be a pixel value. By default, the base pixel value used to calculate the rem value is taken from the `$rem-base` variable.
+/// Converts a pixel value to matching rem value. *Any* value passed, regardless of unit, is assumed to be a pixel value. By default, the base pixel value used to calculate the rem value is taken from the `$global-font-size` variable.
+/// @access private
+///
 /// @param {Number} $value - Pixel value to convert.
+/// @param {Number} $base [null] - Base for pixel conversion.
+///
 /// @returns {Number} A number in rems, calculated based on the given value and the base pixel value. rem values are passed through as is.
-/// @access private
-@function -zf-to-rem($value, $base: $rem-base) {
-  // Calculate rem if units for $value is not rem
-  @if (unit($value) != 'rem') {
+@function -zf-to-rem($value, $base: null) {
+  // Check if the value is a number
+  @if type-of($value) != 'number' {
+    @warn inspect($value) + ' was passed to rem-calc(), which is not a number.';
+    @return $value;
+  }
+
+  // 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;
   }
+
   // Turn 0rem into 0
-  @if ($value == 0rem) { $value: 0; }
+  @if $value == 0rem {
+    $value: 0;
+  }
+
+  @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/generators/foundation/public/stylesheets/foundation6/util/_util.scss

@@ -2,14 +2,13 @@
 // foundation.zurb.com
 // Licensed under MIT Open Source
 
-// Utilities
+@import 'math';
 @import 'unit';
 @import 'value';
+@import 'direction';
 @import 'color';
 @import 'selector';
-
-// Libraries
+@import 'flex';
 @import 'breakpoint';
-
-// Mixins
 @import 'mixins';
+@import 'typography';

data/generators/foundation/public/stylesheets/foundation6/util/_value.scss

@@ -7,9 +7,11 @@
 ////
 
 /// Determine if a value is not falsey, in CSS terms. Falsey values are `null`, `none`, `0` with any unit, or an empty list.
-/// @param $val - Value to check.
+///
+/// @param {Mixed} $val - Value to check.
+///
 /// @returns {Boolean} `true` if `$val` is not falsey.
-@function hasvalue($val) {
+@function has-value($val) {
   @if $val == null or $val == none {
     @return false;
   }
@@ -23,8 +25,10 @@
 }
 
 /// Determine a top/right/bottom/right value on a padding, margin, etc. property, no matter how many values were passed in. Use this function if you need to know the specific side of a value, but don't know if the value is using a shorthand format.
+///
 /// @param {List|Number} $val - Value to analyze. Should be a shorthand sizing property, e.g. "1em 2em 1em"
 /// @param {Keyword} $side - Side to return. Should be `top`, `right`, `bottom`, or `left`.
+///
 /// @returns {Number} A single value based on `$val` and `$side`.
 @function get-side($val, $side) {
   $length: length($val);
@@ -59,8 +63,10 @@
 }
 
 /// Given border $val, find a specific element of the border, which is $elem. The possible values for $elem are width, style, and color.
+///
 /// @param {List} $val - Border value to find a value in.
 /// @param {Keyword} $elem - Border component to extract.
+///
 /// @returns {Mixed} If the value exists, returns the value. If the value is not in the border definition, the function will return a 0px width, solid style, or black border.
 @function get-border-value($val, $elem) {
   // Find the width, style, or color and return it
@@ -83,35 +89,72 @@
     style: solid,
     color: #000,
   );
+
   @return map-get($defaults, $elem);
 }
 
-/// Calculates x^y, where x is `$base` and y is `$power`.
-/// @access private
-/// @param {Number} $base - Base number (x).
-/// @param {Number} $power - Exponent (y).
-@function pow($base, $power) {
-  @if $power == 0 { @return 1; }
-  @return $base * pow($base, $power - 1);
+/// Finds a value in a nested map.
+/// @link https://css-tricks.com/snippets/sass/deep-getset-maps/ Deep Get/Set in Maps
+///
+/// @param {Map} $map - Map to pull a value from.
+/// @param {String} $keys... - Keys to use when looking for a value.
+/// @returns {Mixed} The value found in the map.
+@function map-deep-get($map, $keys...) {
+  @each $key in $keys {
+    $map: map-get($map, $key);
+  }
+  @return $map;
 }
 
-// TODO: Remove this (it's used by the grid but is overkill)
-/// Given a user-defined list of keywords and a list of possible keywords, find the ones that were passed in.
-/// @param {List} $opts - List of values to find keywords in.
-/// @param {List} $seeking - List of all possible keywords.
-/// @access private
-/// @returns {Map} A map of all keywords in $seeking. If a keyword was found in $opts, its value is true, otherwise false.
-@function -zf-get-options($opts, $seeking) {
-  @if type-of($opts) != 'list' {
-    $opts: ($opts);
-  }
+/// 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: ();
 
-  $map: ();
-  @each $keyword in $seeking {
-    $val: if(index($opts, $keyword) != null, true, false);
-    $item: ($keyword: $val);
-    $map: map-merge($map, $item);
+    @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 $map;
+  @return if(type-of($map) != 'list', ($value,), $map);
+
+}
+
+/// Safely return a value from a map.
+///
+/// @param {Map} $map - Map to retrieve a value from.
+/// @param {String} $key - Name of the map key.
+///
+/// @returns {List} Found value.
+@function map-safe-get($map, $key) {
+  @if (type-of($map) == 'map' or (type-of($map) == 'list' and length($map) == 0)) {
+    @if (map-has-key($map, $key)) {
+      @return map-get($map, $key);
+    }
+    @else {
+      @error 'Key: `#{$key}` is not available in `#{$map}`';
+    }
+  }
+  @else {
+    @error '`#{$map}` is not a valid map';
+  }
 }

data/generators/foundation/public/stylesheets/foundation6/vendor/normalize-scss/sass/_normalize.scss

@@ -0,0 +1,3 @@
+@import 'normalize/variables';
+@import 'normalize/vertical-rhythm';
+@import 'normalize/normalize-mixin';

data/generators/foundation/public/stylesheets/foundation6/vendor/normalize-scss/sass/normalize/_import-now.scss

@@ -0,0 +1,11 @@
+// Import Now
+//
+// If you import this module directly, it will immediately output all the CSS
+// needed to normalize default HTML elements across all browsers.
+//
+// ```
+// @import "normalize/import-now";
+// ```
+
+@import '../normalize';
+@include normalize();

data/generators/foundation/public/stylesheets/foundation6/vendor/normalize-scss/sass/normalize/_normalize-mixin.scss

@@ -0,0 +1,676 @@
+// Helper function for the normalize() mixin.
+@function _normalize-include($section, $exclude: null) {
+  // Initialize the global variables needed by this function.
+  @if not global_variable_exists(_normalize-include) {
+    $_normalize-include: () !global;
+    $_normalize-exclude: () !global;
+  }
+  // Since we are given 2 parameters, set the global variables.
+  @if $exclude != null {
+    $include: $section;
+    // Sass doesn't have static variables, so the work-around is to stuff these
+    // values into global variables so we can access them in future calls.
+    $_normalize-include: if(type-of($include) == 'list', $include, ($include)) !global;
+    $_normalize-exclude: if(type-of($exclude) == 'list', $exclude, ($exclude)) !global;
+    @return true;
+  }
+
+  // Check if $section is in the $include list.
+  @if index($_normalize-include, $section) {
+    @return true;
+  }
+  // If $include is set to (all), make sure $section is not in $exclude.
+  @else if not index($_normalize-exclude, $section) and index($_normalize-include, all) {
+    @return true;
+  }
+  @return false;
+}
+
+@mixin normalize($include: (all), $exclude: ()) {
+  // Initialize the helper function by passing it this mixin's parameters.
+  $init: _normalize-include($include, $exclude);
+
+  // If we've customized any font variables, we'll need extra properties.
+  @if $base-font-size != 16px
+    or $base-line-height != 24px
+    or $base-unit != 'em'
+    or $h1-font-size != 2    * $base-font-size
+    or $h2-font-size != 1.5  * $base-font-size
+    or $h3-font-size != 1.17 * $base-font-size
+    or $h4-font-size != 1    * $base-font-size
+    or $h5-font-size != 0.83 * $base-font-size
+    or $h6-font-size != 0.67 * $base-font-size {
+    $normalize-vertical-rhythm: true !global;
+  }
+
+  /*! normalize-scss | MIT/GPLv2 License | bit.ly/normalize-scss */
+
+  @if _normalize-include(document) {
+    /* Document
+       ========================================================================== */
+
+    /**
+     * 1. Change the default font family in all browsers (opinionated).
+     * 2. Correct the line height in all browsers.
+     * 3. Prevent adjustments of font size after orientation changes in
+     *    IE on Windows Phone and in iOS.
+     */
+
+    html {
+      font-family: $base-font-family; /* 1 */
+      @if $normalize-vertical-rhythm {
+        // Correct old browser bug that prevented accessible resizing of text
+        // when root font-size is set with px or em.
+        font-size: ($base-font-size / 16px) * 100%;
+        line-height: ($base-line-height / $base-font-size) * 1em; /* 2 */
+      }
+      @else {
+        line-height: 1.15; /* 2 */
+      }
+      -ms-text-size-adjust: 100%; /* 3 */
+      -webkit-text-size-adjust: 100%; /* 3 */
+    }
+  }
+
+  @if _normalize-include(sections) {
+    /* Sections
+       ========================================================================== */
+
+    /**
+     * Remove the margin in all browsers (opinionated).
+     */
+
+    body {
+      margin: 0;
+    }
+
+    /**
+     * Add the correct display in IE 9-.
+     */
+
+    article,
+    aside,
+    footer,
+    header,
+    nav,
+    section {
+      display: block;
+    }
+
+    /**
+     * Correct the font size and margin on `h1` elements within `section` and
+     * `article` contexts in Chrome, Firefox, and Safari.
+     */
+
+    h1 {
+      @include normalize-font-size($h1-font-size);
+      @if $normalize-vertical-rhythm {
+        @include normalize-line-height($h1-font-size);
+      }
+
+      @if $normalize-vertical-rhythm {
+        /* Set 1 unit of vertical rhythm on the top and bottom margins. */
+        @include normalize-margin(1 0, $h1-font-size);
+      }
+      @else {
+        margin: 0.67em 0;
+      }
+    }
+
+    @if $normalize-vertical-rhythm {
+      h2 {
+        @include normalize-font-size($h2-font-size);
+        @include normalize-line-height($h2-font-size);
+        @include normalize-margin(1 0, $h2-font-size);
+      }
+
+      h3 {
+        @include normalize-font-size($h3-font-size);
+        @include normalize-line-height($h3-font-size);
+        @include normalize-margin(1 0, $h3-font-size);
+      }
+
+      h4 {
+        @include normalize-font-size($h4-font-size);
+        @include normalize-line-height($h4-font-size);
+        @include normalize-margin(1 0, $h4-font-size);
+      }
+
+      h5 {
+        @include normalize-font-size($h5-font-size);
+        @include normalize-line-height($h5-font-size);
+        @include normalize-margin(1 0, $h5-font-size);
+      }
+
+      h6 {
+        @include normalize-font-size($h6-font-size);
+        @include normalize-line-height($h6-font-size);
+        @include normalize-margin(1 0, $h6-font-size);
+      }
+    }
+  }
+
+  @if _normalize-include(grouping) {
+    /* Grouping content
+       ========================================================================== */
+
+    @if $normalize-vertical-rhythm {
+      /**
+       * Set 1 unit of vertical rhythm on the top and bottom margin.
+       */
+
+      blockquote {
+        @include normalize-margin(1 $indent-amount);
+      }
+
+      dl,
+      ol,
+      ul {
+        @include normalize-margin(1 0);
+      }
+
+      /**
+       * Turn off margins on nested lists.
+       */
+
+      ol,
+      ul {
+        ol,
+        ul {
+          margin: 0;
+        }
+      }
+
+      dd {
+        margin: 0 0 0 $indent-amount;
+      }
+
+      ol,
+      ul {
+        padding: 0 0 0 $indent-amount;
+      }
+    }
+
+    /**
+     * Add the correct display in IE 9-.
+     */
+
+    figcaption,
+    figure {
+      display: block;
+    }
+
+    /**
+     * Add the correct margin in IE 8.
+     */
+
+    figure {
+      @if $normalize-vertical-rhythm {
+        @include normalize-margin(1 $indent-amount);
+      }
+      @else {
+        margin: 1em $indent-amount;
+      }
+    }
+
+    /**
+     * 1. Add the correct box sizing in Firefox.
+     * 2. Show the overflow in Edge and IE.
+     */
+
+    hr {
+      box-sizing: content-box; /* 1 */
+      height: 0; /* 1 */
+      overflow: visible; /* 2 */
+    }
+
+    /**
+     * Add the correct display in IE.
+     */
+
+    main {
+      display: block;
+    }
+
+    @if $normalize-vertical-rhythm {
+      /**
+       * Set 1 unit of vertical rhythm on the top and bottom margin.
+       */
+
+      p,
+      pre {
+        @include normalize-margin(1 0);
+      }
+    }
+
+    /**
+     * 1. Correct the inheritance and scaling of font size in all browsers.
+     * 2. Correct the odd `em` font sizing in all browsers.
+     */
+
+    pre {
+      font-family: monospace, monospace; /* 1 */
+      font-size: 1em; /* 2 */
+    }
+  }
+
+  @if _normalize-include(links) {
+    /* Links
+       ========================================================================== */
+
+    /**
+     * 1. Remove the gray background on active links in IE 10.
+     * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
+     */
+
+    a {
+      background-color: transparent; /* 1 */
+      -webkit-text-decoration-skip: objects; /* 2 */
+    }
+
+    /**
+     * Remove the outline on focused links when they are also active or hovered
+     * in all browsers (opinionated).
+     */
+
+    a:active,
+    a:hover {
+      outline-width: 0;
+    }
+  }
+
+  @if _normalize-include(text) {
+    /* Text-level semantics
+       ========================================================================== */
+
+    /**
+     * 1. Remove the bottom border in Firefox 39-.
+     * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+     */
+
+    abbr[title] {
+      border-bottom: none; /* 1 */
+      text-decoration: underline; /* 2 */
+      text-decoration: underline dotted; /* 2 */
+    }
+
+    /**
+     * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
+     */
+
+    b,
+    strong {
+      font-weight: inherit;
+    }
+
+    /**
+     * Add the correct font weight in Chrome, Edge, and Safari.
+     */
+
+    b,
+    strong {
+      font-weight: bolder;
+    }
+
+    /**
+     * 1. Correct the inheritance and scaling of font size in all browsers.
+     * 2. Correct the odd `em` font sizing in all browsers.
+     */
+
+    code,
+    kbd,
+    samp {
+      font-family: monospace, monospace; /* 1 */
+      font-size: 1em; /* 2 */
+    }
+
+    /**
+     * Add the correct font style in Android 4.3-.
+     */
+
+    dfn {
+      font-style: italic;
+    }
+
+    /**
+     * Add the correct background and color in IE 9-.
+     */
+
+    mark {
+      background-color: #ff0;
+      color: #000;
+    }
+
+    /**
+     * Add the correct font size in all browsers.
+     */
+
+    small {
+      font-size: 80%;
+    }
+
+    /**
+     * Prevent `sub` and `sup` elements from affecting the line height in
+     * all browsers.
+     */
+
+    sub,
+    sup {
+      font-size: 75%;
+      line-height: 0;
+      position: relative;
+      vertical-align: baseline;
+    }
+
+    sub {
+      bottom: -0.25em;
+    }
+
+    sup {
+      top: -0.5em;
+    }
+  }
+
+  @if _normalize-include(embedded) {
+    /* Embedded content
+       ========================================================================== */
+
+    /**
+     * Add the correct display in IE 9-.
+     */
+
+    audio,
+    video {
+      display: inline-block;
+    }
+
+    /**
+     * Add the correct display in iOS 4-7.
+     */
+
+    audio:not([controls]) {
+      display: none;
+      height: 0;
+    }
+
+    /**
+     * Remove the border on images inside links in IE 10-.
+     */
+
+    img {
+      border-style: none;
+    }
+
+    /**
+     * Hide the overflow in IE.
+     */
+
+    svg:not(:root) {
+      overflow: hidden;
+    }
+  }
+
+  @if _normalize-include(forms) {
+    /* Forms
+       ========================================================================== */
+
+    /**
+     * 1. Change the font styles in all browsers (opinionated).
+     * 2. Remove the margin in Firefox and Safari.
+     */
+
+    button,
+    input,
+    optgroup,
+    select,
+    textarea {
+      font-family: $base-font-family; /* 1 */
+      font-size: 100%; /* 1 */
+      @if $normalize-vertical-rhythm {
+        line-height: ($base-line-height / $base-font-size) * 1em; /* 1 */
+      }
+      @else {
+        line-height: 1.15; /* 1 */
+      }
+      margin: 0; /* 2 */
+    }
+
+    /**
+     * Show the overflow in IE.
+     */
+
+    button {
+      overflow: visible;
+    }
+
+    /**
+     * Remove the inheritance of text transform in Edge, Firefox, and IE.
+     * 1. Remove the inheritance of text transform in Firefox.
+     */
+
+    button,
+    select { /* 1 */
+      text-transform: none;
+    }
+
+    /**
+     * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
+     *    controls in Android 4.
+     * 2. Correct the inability to style clickable types in iOS and Safari.
+     */
+
+    button,
+    html [type="button"], /* 1 */
+    [type="reset"],
+    [type="submit"] {
+      -webkit-appearance: button; /* 2 */
+    }
+
+    button,
+    [type="button"],
+    [type="reset"],
+    [type="submit"] {
+
+      /**
+       * Remove the inner border and padding in Firefox.
+       */
+
+      &::-moz-focus-inner {
+        border-style: none;
+        padding: 0;
+      }
+
+      /**
+       * Restore the focus styles unset by the previous rule.
+       */
+
+      &:-moz-focusring {
+        outline: 1px dotted ButtonText;
+      }
+    }
+
+    /**
+     * Show the overflow in Edge.
+     */
+
+    input {
+      overflow: visible;
+    }
+
+    /**
+     * 1. Add the correct box sizing in IE 10-.
+     * 2. Remove the padding in IE 10-.
+     */
+
+    [type="checkbox"],
+    [type="radio"] {
+      box-sizing: border-box; /* 1 */
+      padding: 0; /* 2 */
+    }
+
+    /**
+     * Correct the cursor style of increment and decrement buttons in Chrome.
+     */
+
+    [type="number"]::-webkit-inner-spin-button,
+    [type="number"]::-webkit-outer-spin-button {
+      height: auto;
+    }
+
+    /**
+     * 1. Correct the odd appearance in Chrome and Safari.
+     * 2. Correct the outline style in Safari.
+     */
+
+    [type="search"] {
+      -webkit-appearance: textfield; /* 1 */
+      outline-offset: -2px; /* 2 */
+
+      /**
+       * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
+       */
+
+      &::-webkit-search-cancel-button,
+      &::-webkit-search-decoration {
+        -webkit-appearance: none;
+      }
+    }
+
+    /**
+     * 1. Correct the inability to style clickable types in iOS and Safari.
+     * 2. Change font properties to `inherit` in Safari.
+     */
+
+    ::-webkit-file-upload-button {
+      -webkit-appearance: button; /* 1 */
+      font: inherit; /* 2 */
+    }
+
+    /**
+     * Change the border, margin, and padding in all browsers (opinionated).
+     */
+
+    fieldset {
+      border: 1px solid #c0c0c0;
+      margin: 0 2px;
+      padding: 0.35em 0.625em 0.75em;
+    }
+
+    /**
+     * 1. Correct the text wrapping in Edge and IE.
+     * 2. Correct the color inheritance from `fieldset` elements in IE.
+     * 3. Remove the padding so developers are not caught out when they zero out
+     *    `fieldset` elements in all browsers.
+     */
+
+    legend {
+      box-sizing: border-box; /* 1 */
+      display: table; /* 1 */
+      max-width: 100%; /* 1 */
+      padding: 0; /* 3 */
+      color: inherit; /* 2 */
+      white-space: normal; /* 1 */
+    }
+
+    /**
+     * 1. Add the correct display in IE 9-.
+     * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
+     */
+
+    progress {
+      display: inline-block; /* 1 */
+      vertical-align: baseline; /* 2 */
+    }
+
+    /**
+     * Remove the default vertical scrollbar in IE.
+     */
+
+    textarea {
+      overflow: auto;
+    }
+  }
+
+  @if _normalize-include(interactive) {
+    /* Interactive
+       ========================================================================== */
+
+    /*
+     * Add the correct display in Edge, IE, and Firefox.
+     */
+
+    details {
+      display: block;
+    }
+
+    /*
+     * Add the correct display in all browsers.
+     */
+
+    summary {
+      display: list-item;
+    }
+
+    /*
+     * Add the correct display in IE 9-.
+     */
+
+    menu {
+      display: block;
+
+      @if $normalize-vertical-rhythm {
+        /*
+         * 1. Set 1 unit of vertical rhythm on the top and bottom margin.
+         * 2. Set consistent space for the list style image.
+         */
+
+        @include normalize-margin(1 0); /* 1 */
+        padding: 0 0 0 $indent-amount; /* 2 */
+
+        /**
+         * Turn off margins on nested lists.
+         */
+
+        menu &,
+        ol &,
+        ul & {
+          margin: 0;
+        }
+      }
+    }
+  }
+
+  @if _normalize-include(scripting) {
+    /* Scripting
+       ========================================================================== */
+
+    /**
+     * Add the correct display in IE 9-.
+     */
+
+    canvas {
+      display: inline-block;
+    }
+
+    /**
+     * Add the correct display in IE.
+     */
+
+    template {
+      display: none;
+    }
+  }
+
+  @if _normalize-include(hidden) {
+    /* Hidden
+       ========================================================================== */
+
+    /**
+     * Add the correct display in IE 10-.
+     */
+
+    [hidden] {
+      display: none;
+    }
+  }
+}