foundation-rails 6.6.2.0 → 6.9.0.0

data/vendor/assets/scss/settings/_settings.scss

@@ -58,8 +58,9 @@
 //  53. Title Bar
 //  54. Tooltip
 //  55. Top Bar
-//  56. Xy Grid
+//  57. Xy Grid
 
+@use "sass:color";
 @import 'util/util';
 
 // 1. Global
@@ -69,11 +70,11 @@ $global-font-size: 100%;
 $global-width: rem-calc(1200);
 $global-lineheight: 1.5;
 $foundation-palette: (
-  primary: #1779ba,
-  secondary: #767676,
-  success: #3adb76,
-  warning: #ffae00,
-  alert: #cc4b37,
+  "primary": #1779ba,
+  "secondary": #767676,
+  "success": #3adb76,
+  "warning": #ffae00,
+  "alert": #cc4b37,
 );
 $light-gray: #e6e6e6;
 $medium-gray: #cacaca;
@@ -83,6 +84,7 @@ $white: #fefefe;
 $body-background: $white;
 $body-font-color: $black;
 $body-font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif;
+$body-safe-padding: false;
 $body-antialiased: true;
 $global-margin: 1rem;
 $global-padding: 1rem;
@@ -105,19 +107,20 @@ $print-hrefs: true;
 // 2. Breakpoints
 // --------------
 
+$-zf-size: null;
 $breakpoints: (
-  small: 0,
-  medium: 640px,
-  large: 1024px,
-  xlarge: 1200px,
-  xxlarge: 1440px,
+  "small": 0,
+  "medium": 640px,
+  "large": 1024px,
+  "xlarge": 1200px,
+  "xxlarge": 1440px,
 );
 $breakpoints-hidpi: (
-  hidpi-1: 1,
-  hidpi-1-5: 1.5,
-  hidpi-2: 2,
-  retina: 2,
-  hidpi-3: 3
+  "hidpi-1": 1,
+  "hidpi-1-5": 1.5,
+  "hidpi-2": 2,
+  "retina": 2,
+  "hidpi-3": 3
 );
 $print-breakpoint: large;
 $breakpoint-classes: (small medium large);
@@ -461,7 +464,7 @@ $input-background-focus: $white;
 $input-background-disabled: $light-gray;
 $input-border: 1px solid $medium-gray;
 $input-border-focus: 1px solid $dark-gray;
-$input-padding: $form-spacing / 2;
+$input-padding: $form-spacing * 0.5;
 $input-shadow: inset 0 1px 2px rgba($black, 0.1);
 $input-shadow-focus: 0 0 5px $medium-gray;
 $input-cursor-disabled: not-allowed;
@@ -691,8 +694,7 @@ $prototype-separator-margin-top: $global-margin;
 // --------------------
 
 $prototype-shadow-breakpoints: $global-prototype-breakpoints;
-$prototype-box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),
-                       0 2px 10px 0 rgba(0,0,0,.12);
+$prototype-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
 
 // 41. Prototype Sizing
 // --------------------
@@ -780,7 +782,9 @@ $slider-radius: $global-radius;
 // ----------
 
 $switch-background: $medium-gray;
+$switch-background-focus: scale-color($switch-background, $lightness: -10%);
 $switch-background-active: $primary-color;
+$switch-background-active-focus: scale-color($switch-background-active, $lightness: -15%);
 $switch-height: 2rem;
 $switch-height-tiny: 1.5rem;
 $switch-height-small: 1.75rem;
@@ -791,7 +795,7 @@ $switch-paddle-background: $white;
 $switch-paddle-offset: 0.25rem;
 $switch-paddle-radius: $global-radius;
 $switch-paddle-transition: all 0.25s ease-out;
-$switch-opacity-disabled: .5;
+$switch-opacity-disabled: 0.5;
 $switch-cursor-disabled: not-allowed;
 
 // 50. Table
@@ -802,15 +806,15 @@ $table-color-scale: 5%;
 $table-border: 1px solid smart-scale($table-background, $table-color-scale);
 $table-padding: rem-calc(8 10 10);
 $table-hover-scale: 2%;
-$table-row-hover: darken($table-background, $table-hover-scale);
-$table-row-stripe-hover: darken($table-background, $table-color-scale + $table-hover-scale);
+$table-row-hover: color.adjust($table-background, $lightness: -$table-hover-scale);
+$table-row-stripe-hover: color.adjust($table-background, $lightness: -($table-color-scale + $table-hover-scale));
 $table-is-striped: true;
 $table-striped-background: smart-scale($table-background, $table-color-scale);
 $table-stripe: even;
-$table-head-background: smart-scale($table-background, $table-color-scale / 2);
-$table-head-row-hover: darken($table-head-background, $table-hover-scale);
+$table-head-background: smart-scale($table-background, $table-color-scale * 0.5);
+$table-head-row-hover: color.adjust($table-head-background, $lightness: -$table-hover-scale);
 $table-foot-background: smart-scale($table-background, $table-color-scale);
-$table-foot-row-hover: darken($table-foot-background, $table-hover-scale);
+$table-foot-row-hover: color.adjust($table-foot-background, $lightness: -$table-hover-scale);
 $table-head-font-color: $body-font-color;
 $table-foot-font-color: $body-font-color;
 $show-header-for-stacked: false;
@@ -878,15 +882,15 @@ $topbar-title-spacing: 0.5rem 1rem 0.5rem 0;
 $topbar-input-width: 200px;
 $topbar-unstack-breakpoint: medium;
 
-// 56. Xy Grid
+// 57. Xy Grid
 // -----------
 
 $xy-grid: true;
 $grid-container: $global-width;
 $grid-columns: 12;
 $grid-margin-gutters: (
-  small: 20px,
-  medium: 30px
+  "small": 20px,
+  "medium": 30px
 );
 $grid-padding-gutters: $grid-margin-gutters;
 $grid-container-padding: $grid-padding-gutters;

data/vendor/assets/scss/typography/_base.scss

@@ -73,7 +73,7 @@ $header-styles: (
 
 // $header-styles map is built from $header-sizes in order to ensure downward compatibility
 // when $header-sizes is depreciated, $header-styles needs to get !default values like settings.scss
-@function build_from_header-sizes($header-sizes) {
+@function build-from-header-sizes($header-sizes) {
   @warn 'Note, that $header-sizes has been replaced with $header-styles. $header-sizes still works, but it is going to be depreciated.';
   $header-styles: ();
   @each $size, $headers in $header-sizes {
@@ -88,7 +88,7 @@ $header-styles: (
 
 // If it exists $headers-sizes is used to build $header-styles. See the documentation.
 @if variable-exists(header-sizes) {
-  $header-styles: build_from_header-sizes($header-sizes);
+  $header-styles: build-from-header-sizes($header-sizes);
 }
 
 /// Text rendering method of headers.
@@ -117,7 +117,7 @@ $paragraph-text-rendering: optimizeLegibility !default;
 
 /// Use the `.code-inline` component as default for `<code>` elements.
 /// @type Boolean
-$enable-code-inline: true;
+$enable-code-inline: true !default;
 
 /// Default color for links.
 /// @type Color
@@ -197,7 +197,7 @@ $blockquote-border: 1px solid $medium-gray !default;
 
 /// Use the `.cite-block` component as default for `<cite>` elements.
 /// @type Boolean
-$enable-cite-block: true;
+$enable-cite-block: true !default;
 
 /// Font family for `<kbd>` elements.
 /// @type String | List
@@ -434,7 +434,7 @@ $abbr-underline: 1px dotted $black !default;
     cite {
       // Extending a class is not recommended.
       // TODO: Break the typography-base/typography-helpers separation
-      @extend .cite-block;
+      @extend %cite-block;
     }
   }
 
@@ -453,7 +453,7 @@ $abbr-underline: 1px dotted $black !default;
   // Code
   @if ($enable-code-inline == true) {
     code {
-      @extend .code-inline;
+      @extend %code-inline;
     }
   }
 

data/vendor/assets/scss/typography/_helpers.scss

@@ -164,15 +164,23 @@ $code-block-margin-bottom: 1.5rem !default;
     }
   }
 
-  .cite-block {
+  %cite-block {
     @include cite-block;
   }
 
-  .code-inline {
+  .cite-block {
+    @extend %cite-block;
+  }
+
+  %code-inline {
     @include code-style;
     @include code-inline;
   }
 
+  .code-inline {
+    @extend %code-inline;
+  }
+
   .code-block {
     @include code-style;
     @include code-block;

data/vendor/assets/scss/typography/_print.scss

@@ -24,11 +24,11 @@ $print-hrefs: true !default;
       @if $print-transparent-backgrounds {
         background: transparent !important;
         color: black !important; // Black prints faster: h5bp.com/s
-        color-adjust: economy;
+        print-color-adjust: economy;
       }
       // Otherwise, prevent any economy by the browser.
       @else {
-        color-adjust: exact;
+        print-color-adjust: exact;
       }
 
       box-shadow: none !important;

data/vendor/assets/scss/util/_breakpoint.scss

@@ -6,25 +6,28 @@
 /// @group breakpoints
 ////
 
+/// Patch to fix issue #12080
+$-zf-size: null;
+
 /// A list of named breakpoints. You can use these with the `breakpoint()` mixin to quickly create media queries.
 /// @type Map
 $breakpoints: (
-  small: 0,
-  medium: 640px,
-  large: 1024px,
-  xlarge: 1200px,
-  xxlarge: 1440px,
+  "small": 0,
+  "medium": 640px,
+  "large": 1024px,
+  "xlarge": 1200px,
+  "xxlarge": 1440px,
 ) !default;
 
 /// A list of named HiDPI breakpoints. You can use these with the `breakpoint()` mixin to quickly create media queries for resolutions.
 /// Values must represent the device pixels / web pixels ration and be unitless or in DPPX.
 /// @type Map
 $breakpoints-hidpi: (
-  hidpi-1: 1,
-  hidpi-1-5: 1.5,
-  hidpi-2: 2,
-  retina: 2,
-  hidpi-3: 3
+  "hidpi-1": 1,
+  "hidpi-1-5": 1.5,
+  "hidpi-2": 2,
+  "retina": 2,
+  "hidpi-3": 3
 ) !default;
 
 /// The largest named breakpoint in which to include print as a media type
@@ -113,7 +116,7 @@ $breakpoint-classes: (small medium large) !default;
       // Max value is 0.2px under the next breakpoint (0.02 / 16 = 0.00125).
       // Use a precision under 1px to support browser zoom, but not to low to avoid rounding.
       // See https://github.com/foundation/foundation-sites/issues/11313
-      $bp-max: if($hidpi, $bp-next - (1/$std-web-dpi), -zf-bp-to-em($bp-next) - 0.00125);
+      $bp-max: if($hidpi, $bp-next - divide(1, $std-web-dpi), -zf-bp-to-em($bp-next) - 0.00125);
     }
   }
 
@@ -244,15 +247,15 @@ $breakpoint-classes: (small medium large) !default;
 /// @returns {Mixed} The number following `$number`, if `$number` was found. If `$number` was not found, or `$number` was the biggest number in the map, returns `null`.
 @function -zf-map-next-number($map, $number) {
 
-  $next_number: null;
+  $next-number: null;
 
   @each $k, $v in $map {
-    @if type-of($v) == 'number' and $v > $number and ($next_number == null or $v < $next_number) {
-      $next_number: $v;
+    @if type-of($v) == 'number' and $v > $number and ($next-number == null or $v < $next-number) {
+      $next-number: $v;
     }
   }
 
-  @return $next_number;
+  @return $next-number;
 }
 
 /// Return a list of our named breakpoints less than $key. Useful for dealing with
@@ -264,13 +267,13 @@ $breakpoint-classes: (small medium large) !default;
 /// @returns {Array} The list of breakpoints up to and. If $key is auto, returns breakpoints above the zero
 @function -zf-breakpoints-less-than($key) {
   $list: ();
-  $found_key: false;
+  $found-key: false;
 
   @each $name in $-zf-breakpoints-keys {
     @if ($name == $key) {
-      $found_key: true;
+      $found-key: true;
     }
-    @if not $found_key {
+    @if not $found-key {
       $list: append($list, $name);
     }
   }

data/vendor/assets/scss/util/_color.scss

@@ -2,10 +2,18 @@
 // https://get.foundation
 // Licensed under MIT Open Source
 
+@use "sass:color";
 @import 'math';
 
 $contrast-warnings: true !default;
 
+/// Patch to fix issue #12080
+$primary-color: null !default;
+$secondary-color: null !default;
+$warning-color: null !default;
+$alert-color: null !default;
+$success-color: null !default;
+
 ////
 /// @group functions
 ////
@@ -18,14 +26,18 @@ $contrast-warnings: true !default;
 @function color-luminance($color) {
   // Adapted from: https://github.com/LeaVerou/contrast-ratio/blob/gh-pages/color.js
   // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
-  $rgba: red($color), green($color), blue($color);
+  $red   : round(color.channel($color, "red", $space: rgb));
+  $green : round(color.channel($color, "green", $space: rgb));
+  $blue  : round(color.channel($color, "blue", $space: rgb));
+
+  $rgba: $red, $green, $blue;
   $rgba2: ();
 
   @for $i from 1 through 3 {
     $rgb: nth($rgba, $i);
-    $rgb: $rgb / 255;
+    $rgb: divide($rgb, 255);
 
-    $rgb: if($rgb < 0.03928, $rgb / 12.92, pow(($rgb + 0.055) / 1.055, 2.4));
+    $rgb: if($rgb < 0.03928, divide($rgb, 12.92), pow(divide($rgb + 0.055, 1.055), 2.4));
 
     $rgba2: append($rgba2, $rgb);
   }
@@ -44,13 +56,13 @@ $contrast-warnings: true !default;
   // Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#contrast-ratiodef
   $luminance1: color-luminance($color1) + 0.05;
   $luminance2: color-luminance($color2) + 0.05;
-  $ratio: $luminance1 / $luminance2;
+  $ratio: divide($luminance1, $luminance2);
 
   @if $luminance2 > $luminance1 {
-    $ratio: 1 / $ratio;
+    $ratio: divide(1, $ratio);
   }
 
-  $ratio: round($ratio * 10) / 10;
+  $ratio: round($ratio * 10) * 0.1;
 
   @return $ratio;
 }
@@ -75,7 +87,7 @@ $contrast-warnings: true !default;
   }
 
   @if ($contrast-warnings and $contrast < 3) {
-    @warn "Contrast ratio of #{$best} on #{$base} is pretty bad, just #{$contrast}";
+    @warn 'Contrast ratio of #{$best} on #{$base} is pretty bad, just #{$contrast}';
   }
 
   @return $best;
@@ -89,7 +101,7 @@ $contrast-warnings: true !default;
 ///
 /// @returns {Color} A scaled color.
 @function smart-scale($color, $scale: 5%, $threshold: 40%) {
-  @if lightness($color) > $threshold {
+  @if color.channel($color, "lightness", $space: hsl) > $threshold {
     $scale: -$scale;
   }
   @return scale-color($color, $lightness: $scale);

data/vendor/assets/scss/util/_direction.scss

@@ -23,7 +23,7 @@
 
   // Calculate the opposite place in a circle, with a starting index of 1
   $length: length($dirs);
-  $demi: $length / 2;
+  $demi: $length * 0.5;
   $opposite-place: (($place + $demi - 1) % $length) + 1;
 
   @return nth($dirs, $opposite-place);

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

@@ -1,4 +1,4 @@
-@function -zf-flex-justify($text-direction){
+@function -zf-flex-justify($text-direction) {
   $-zf-flex-justify: (
     'left': if($text-direction == rtl, flex-end, flex-start),
     'right': if($text-direction == rtl, flex-start, flex-end),

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

@@ -2,6 +2,8 @@
 // https://get.foundation
 // Licensed under MIT Open Source
 
+@use "sass:math";
+
 ////
 /// @group functions
 ////
@@ -18,7 +20,7 @@
     @return gcd($b, $a % $b);
   }
   @else {
-    @return abs($a);
+    @return math.abs($a);
   }
 }
 
@@ -30,10 +32,10 @@
 /// @returns {Number} The product of the exponentiation.
 @function pow($base, $exponent, $prec: 16) {
   @if (floor($exponent) != $exponent) {
-    $prec2 : pow(10, $prec);
+    $prec2: pow(10, $prec);
     $exponent: round($exponent * $prec2);
     $denominator: gcd($exponent, $prec2);
-    @return nth-root(pow($base, $exponent / $denominator), $prec2 / $denominator, $prec);
+    @return nth-root(pow($base, divide($exponent, $denominator)), divide($prec2, $denominator), $prec);
   }
 
   $value: $base;
@@ -44,7 +46,7 @@
   }
   @else if $exponent < 1 {
     @for $i from 0 through -$exponent {
-      $value: $value / $base;
+      $value: divide($value, $base);
     }
   }
 
@@ -56,7 +58,7 @@
   $x: 1;
 
   @for $i from 0 through $prec {
-    $x: 1 / $n * (($n - 1) * $x + ($num / pow($x, $n - 1)));
+    $x: divide(1, $n) * (($n - 1) * $x + divide($num, pow($x, $n - 1)));
   }
 
   @return $x;
@@ -68,7 +70,7 @@
 @function ratio-to-percentage($ratio) {
   $w: nth($ratio, 1);
   $h: nth($ratio, 3);
-  @return $h / $w * 100%;
+  @return divide($h, $w) * 100%;
 }
 
 /// Parse the given `$fraction` to numerators and denumerators.
@@ -98,8 +100,8 @@
   @else if type-of($fraction) == 'list' {
     // "50 of 100", "50/100"...
     @if length($fraction) == 3
-      and type-of(nth($fraction, 1) == 'number')
-      and type-of(nth($fraction, 3) == 'number') {
+    and type-of(nth($fraction, 1) == 'number')
+    and type-of(nth($fraction, 3) == 'number') {
       @return (nth($fraction, 1), nth($fraction, 3));
     }
   }
@@ -143,5 +145,55 @@
     }
   }
 
-  @return percentage($parsed-nominator / $parsed-denominator);
+  @return percentage(divide($parsed-nominator, $parsed-denominator));
+}
+
+/// Divide the given `$divident` by the given `$divisor`.
+///
+/// @param {Number} $divident - The divident.
+/// @param {Number} $divisor - The divisor.
+/// @param {Number} $precision - The precision decimals for the division.
+///
+/// @return {Number} The product of the division.
+@function divide($dividend, $divisor, $precision: 12) {
+  $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1);
+  $dividend: math.abs($dividend);
+  $divisor: math.abs($divisor);
+  @if $dividend == 0 {
+    @return 0;
+  }
+  @if $divisor == 0 {
+    @error 'Cannot divide by 0';
+  }
+  $remainder: $dividend;
+  $result: 0;
+  $factor: 10;
+  @while ($remainder > 0 and $precision >= 0) {
+    $quotient: 0;
+    @while ($remainder >= $divisor) {
+      $remainder: $remainder - $divisor;
+      $quotient: $quotient + 1;
+    }
+    $result: $result * 10 + $quotient;
+    $factor: $factor * 0.1;
+    $remainder: $remainder * 10;
+    $precision: $precision - 1;
+    @if ($precision < 0 and $remainder >= $divisor * 5) {
+      $result: $result + 1;
+    }
+  }
+  $result: $result * $factor * $sign;
+  $dividend-unit: unit($dividend);
+  $divisor-unit: unit($divisor);
+  $unit-map: (
+    'px': 1px,
+    'rem': 1rem,
+    'em': 1em,
+    '%': 1%
+  );
+  @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) {
+    $result: $result * map-get($unit-map, $dividend-unit);
+  }
+
+  @return $result;
 }

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

@@ -6,6 +6,11 @@
 /// @group functions
 ////
 
+@use "sass:color";
+
+// Patch to fix issue #12080
+$-zf-bp-value: null;
+
 /// Creates an inner box-shadow for only one side
 ///
 /// @param {Keyword} $side - Side the shadow is supposed to appear. Can be `top`, `left`, `right` or `bottom`.
@@ -44,28 +49,25 @@
   width: 0;
   height: 0;
 
-  border: inset $triangle-size;
+  border-style: solid;
+  border-width: $triangle-size;
 
   content: '';
 
   @if ($triangle-direction == down) {
     border-bottom-width: 0;
-    border-top-style: solid;
     border-color: $triangle-color transparent transparent;
   }
   @if ($triangle-direction == up) {
     border-top-width: 0;
-    border-bottom-style: solid;
     border-color: transparent transparent $triangle-color;
   }
   @if ($triangle-direction == right) {
     border-right-width: 0;
-    border-left-style: solid;
     border-color: transparent transparent transparent $triangle-color;
   }
   @if ($triangle-direction == left) {
     border-left-width: 0;
-    border-right-style: solid;
     border-color: transparent $triangle-color transparent transparent;
   }
 }
@@ -91,7 +93,7 @@
   $hover-shadow: ();
 
   // Spacing between bars is calculated based on the total height of the icon and the weight of each bar
-  $spacing: ($height - ($weight * $bars)) / ($bars - 1);
+  $spacing: divide($height - ($weight * $bars), $bars - 1);
 
   @if unit($spacing) == 'px' {
     $spacing: floor($spacing);
@@ -146,12 +148,15 @@
 ///
 /// @param {Color} $color [$black] - Color to use for the triangle.
 @mixin background-triangle($color: $black) {
-  $rgb: 'rgb%28#{round(red($color))}, #{round(green($color))}, #{round(blue($color))}%29';
+  $red   : round(color.channel($color, "red", $space: rgb));
+  $green : round(color.channel($color, "green", $space: rgb));
+  $blue  : round(color.channel($color, "blue", $space: rgb));
+  $rgb   : 'rgb%28#{$red}, #{$green}, #{$blue}%29';
 
-  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='32' height='24' viewBox='0 0 32 24'><polygon points='0,0 32,0 16,24' style='fill: #{$rgb}'></polygon></svg>");
+  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="32" height="24" viewBox="0 0 32 24"><polygon points="0,0 32,0 16,24" style="fill: #{$rgb}"></polygon></svg>');
 
-  @media screen and (min-width:0\0) {
-    @if lightness($color) < 60% {
+  @media screen and (min-width: 0\0) {
+    @if color.channel($color, "lightness", $space: hsl) < 60% {
       // White triangle
       background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg==');
     }
@@ -192,7 +197,7 @@
   @for $i from 2 through $max {
     &:nth-last-child(#{$i}):first-child,
     &:nth-last-child(#{$i}):first-child ~ #{$elem} {
-      width: percentage(1 / $i);
+      width: percentage(divide(1, $i));
     }
   }
 }
@@ -219,7 +224,7 @@
   height: 1px #{$important};
   padding: 0 #{$important};
   overflow: hidden #{$important};
-  clip: rect(0,0,0,0) #{$important};
+  clip: rect(0, 0, 0, 0) #{$important};
   white-space: nowrap #{$important};
   border: 0 #{$important};
 }
@@ -323,8 +328,7 @@
     }
     $-zf-size: $bp !global;
 
-    @if ($media-queries == true
-      or ($media-queries == 'for-lists' and $-breakpoints-is-a-list)) {
+    @if ($media-queries == true or ($media-queries == 'for-lists' and $-breakpoints-is-a-list)) {
       @include breakpoint($bp) {
         @content;
       }

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

@@ -13,21 +13,7 @@
 @function text-inputs($types: (), $modifier: '') {
   $return: ();
 
-  $all-types:
-    text
-    password
-    date
-    datetime
-    datetime-local
-    month
-    week
-    email
-    number
-    search
-    tel
-    time
-    url
-    color;
+  $all-types: text password date datetime datetime-local month week email number search tel time url color;
 
   @if not has-value($types) {
     $types: $all-types;

data/vendor/assets/scss/util/_typography.scss

@@ -7,12 +7,12 @@
 ////
 
 $-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),
+  '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)`.