bourbon 4.2.4 → 7.3.0

data/core/bourbon/library/_size.scss

@@ -0,0 +1,50 @@
+@charset "UTF-8";
+
+/// Sets the `width` and `height` of the element in one statement.
+///
+/// @argument {number (with unit) | string} $width
+///
+/// @argument {number (with unit) | string} $height [$width]
+///
+/// @example scss
+///   .first-element {
+///     @include size(2em);
+///   }
+///
+///   // CSS Output
+///   .first-element {
+///     width: 2em;
+///     height: 2em;
+///   }
+///
+/// @example scss
+///   .second-element {
+///     @include size(auto, 10em);
+///   }
+///
+///   // CSS Output
+///   .second-element {
+///     width: auto;
+///     height: 10em;
+///   }
+///
+/// @require {function} _is-size
+
+@mixin size(
+  $width,
+  $height: $width
+) {
+  @if _is-size($height) {
+    height: $height;
+  } @else {
+    @error "`#{$height}` is not a valid length for the `$height` argument " +
+      "in the `size` mixin.";
+  }
+
+  @if _is-size($width) {
+    width: $width;
+  } @else {
+    @error "`#{$width}` is not a valid length for the `$width` argument " +
+      "in the `size` mixin.";
+  }
+}

data/core/bourbon/library/_strip-unit.scss

@@ -0,0 +1,17 @@
+@charset "UTF-8";
+
+/// Strips the unit from a number.
+///
+/// @argument {number} $value
+///
+/// @return {number (unitless)}
+///
+/// @example scss
+///   $dimension: strip-unit(10em);
+///
+///   // Output
+///   $dimension: 10;
+
+@function strip-unit($value) {
+  @return ($value / ($value * 0 + 1));
+}

data/core/bourbon/library/_text-inputs.scss

@@ -0,0 +1,163 @@
+@charset "UTF-8";
+
+////
+/// @type list
+///
+/// @require {function} _assign-inputs
+///
+/// @require {variable} $_text-inputs-list
+////
+
+/// A list of all _text-based_ HTML inputs. Please note that you must
+/// interpolate the variable (`#{}`) to use it as a selector.
+///
+/// @example scss
+///   #{$all-text-inputs} {
+///     border: 1px solid #ccc;
+///   }
+///
+///   // CSS Output
+///   [type='color'],
+///   [type='date'],
+///   [type='datetime'],
+///   [type='datetime-local'],
+///   [type='email'],
+///   [type='month'],
+///   [type='number'],
+///   [type='password'],
+///   [type='search'],
+///   [type='tel'],
+///   [type='text'],
+///   [type='time'],
+///   [type='url'],
+///   [type='week'],
+///   input:not([type]),
+///   textarea {
+///     border: 1px solid #ccc;
+///   }
+
+$all-text-inputs: _assign-inputs($_text-inputs-list);
+
+/// A list of all _text-based_ HTML inputs with the `:active` pseudo-class
+/// applied. Please note that you must interpolate the variable (`#{}`) to use
+/// it as a selector.
+///
+/// @example scss
+///   #{$all-text-inputs-active} {
+///     border: 1px solid #aaa;
+///   }
+///
+///   // CSS Output
+///   [type='color']:active,
+///   [type='date']:active,
+///   [type='datetime']:active,
+///   [type='datetime-local']:active,
+///   [type='email']:active,
+///   [type='month']:active,
+///   [type='number']:active,
+///   [type='password']:active,
+///   [type='search']:active,
+///   [type='tel']:active,
+///   [type='text']:active,
+///   [type='time']:active,
+///   [type='url']:active,
+///   [type='week']:active,
+///   input:not([type]):active,
+///   textarea:active {
+///     border: 1px solid #aaa;
+///   }
+
+$all-text-inputs-active: _assign-inputs($_text-inputs-list, active);
+
+/// A list of all _text-based_ HTML inputs with the `:focus` pseudo-class
+/// applied. Please note that you must interpolate the variable (`#{}`) to use
+/// it as a selector.
+///
+/// @example scss
+///   #{$all-text-inputs-focus} {
+///     border: 1px solid #1565c0;
+///   }
+///
+///   // CSS Output
+///   [type='color']:focus,
+///   [type='date']:focus,
+///   [type='datetime']:focus,
+///   [type='datetime-local']:focus,
+///   [type='email']:focus,
+///   [type='month']:focus,
+///   [type='number']:focus,
+///   [type='password']:focus,
+///   [type='search']:focus,
+///   [type='tel']:focus,
+///   [type='text']:focus,
+///   [type='time']:focus,
+///   [type='url']:focus,
+///   [type='week']:focus,
+///   input:not([type]):focus,
+///   textarea:focus {
+///     border: 1px solid #1565c0;
+///   }
+
+$all-text-inputs-focus: _assign-inputs($_text-inputs-list, focus);
+
+/// A list of all _text-based_ HTML inputs with the `:hover` pseudo-class
+/// applied. Please note that you must interpolate the variable (`#{}`) to use
+/// it as a selector.
+///
+/// @example scss
+///   #{$all-text-inputs-hover} {
+///     border: 1px solid #aaa;
+///   }
+///
+///   // CSS Output
+///   [type='color']:hover,
+///   [type='date']:hover,
+///   [type='datetime']:hover,
+///   [type='datetime-local']:hover,
+///   [type='email']:hover,
+///   [type='month']:hover,
+///   [type='number']:hover,
+///   [type='password']:hover,
+///   [type='search']:hover,
+///   [type='tel']:hover,
+///   [type='text']:hover,
+///   [type='time']:hover,
+///   [type='url']:hover,
+///   [type='week']:hover,
+///   input:not([type]):hover,
+///   textarea:hover {
+///     border: 1px solid #aaa;
+///   }
+
+$all-text-inputs-hover: _assign-inputs($_text-inputs-list, hover);
+
+/// A list of all _text-based_ HTML inputs with the `:invalid` pseudo-class
+/// applied. Please note that you must interpolate the variable (`#{}`) to use
+/// it as a selector.
+///
+/// @example scss
+///   #{$all-text-inputs-invalid} {
+///     border: 1px solid #00f;
+///   }
+///
+///   // CSS Output
+///   [type='color']:invalid,
+///   [type='date']:invalid,
+///   [type='datetime']:invalid,
+///   [type='datetime-local']:invalid,
+///   [type='email']:invalid,
+///   [type='month']:invalid,
+///   [type='number']:invalid,
+///   [type='password']:invalid,
+///   [type='search']:invalid,
+///   [type='tel']:invalid,
+///   [type='text']:invalid,
+///   [type='time']:invalid,
+///   [type='url']:invalid,
+///   [type='week']:invalid,
+///   input:not([type]):invalid,
+///   textarea:invalid {
+///     border: 1px solid #00f;
+///   }
+
+$all-text-inputs-invalid: _assign-inputs($_text-inputs-list, invalid);

data/core/bourbon/library/_timing-functions.scss

@@ -0,0 +1,36 @@
+@charset "UTF-8";
+
+////
+/// CSS cubic-bezier timing functions.
+///
+/// @link https://goo.gl/p8u6SK
+///
+/// @type string
+////
+
+$ease-in-quad: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+$ease-in-cubic: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+$ease-in-quart: cubic-bezier(0.895, 0.03, 0.685, 0.22);
+$ease-in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06);
+$ease-in-sine: cubic-bezier(0.47, 0, 0.745, 0.715);
+$ease-in-expo: cubic-bezier(0.95, 0.05, 0.795, 0.035);
+$ease-in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.335);
+$ease-in-back: cubic-bezier(0.6, -0.28, 0.735, 0.045);
+
+$ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
+$ease-out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1);
+$ease-out-quart: cubic-bezier(0.165, 0.84, 0.44, 1);
+$ease-out-quint: cubic-bezier(0.23, 1, 0.32, 1);
+$ease-out-sine: cubic-bezier(0.39, 0.575, 0.565, 1);
+$ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);
+$ease-out-circ: cubic-bezier(0.075, 0.82, 0.165, 1);
+$ease-out-back: cubic-bezier(0.175, 0.885, 0.32, 1.275);
+
+$ease-in-out-quad: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+$ease-in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1);
+$ease-in-out-quart: cubic-bezier(0.77, 0, 0.175, 1);
+$ease-in-out-quint: cubic-bezier(0.86, 0, 0.07, 1);
+$ease-in-out-sine: cubic-bezier(0.445, 0.05, 0.55, 0.95);
+$ease-in-out-expo: cubic-bezier(1, 0, 0, 1);
+$ease-in-out-circ: cubic-bezier(0.785, 0.135, 0.15, 0.86);
+$ease-in-out-back: cubic-bezier(0.68, -0.55, 0.265, 1.55);

data/core/bourbon/library/_tint.scss

@@ -0,0 +1,32 @@
+@charset "UTF-8";
+
+/// Mixes a color with white.
+///
+/// @argument {color} $color
+///
+/// @argument {number (percentage)} $percent
+///   The amount of white to be mixed in.
+///
+/// @return {color}
+///
+/// @example scss
+///   .element {
+///     background-color: tint(#6ecaa6, 40%);
+///   }
+///
+///   // CSS Output
+///   .element {
+///     background-color: #a8dfc9;
+///   }
+
+@function tint(
+  $color,
+  $percent
+) {
+  @if not _is-color($color) {
+    @error "`#{$color}` is not a valid color for the `$color` argument in " +
+      "the `tint` mixin.";
+  } @else {
+    @return mix(#fff, $color, $percent);
+  }
+}

data/core/bourbon/library/_triangle.scss

@@ -0,0 +1,82 @@
+@charset "UTF-8";
+
+/// Generates a triangle pointing in a specified direction.
+///
+/// @argument {string} $direction
+///   The direction the triangle should point. Accepts `up`, `up-right`,
+///   `right`, `down-right`, `down`, `down-left`, `left` or `up-left`.
+///
+/// @argument {number (with unit)} $width
+///   Width of the triangle.
+///
+/// @argument {number (with unit)} $height
+///   Height of the triangle.
+///
+/// @argument {color} $color
+///   Color of the triangle.
+///
+/// @example scss
+///   .element {
+///     &::before {
+///       @include triangle("up", 2rem, 1rem, #b25c9c);
+///       content: "";
+///     }
+///   }
+///
+///   // CSS Output
+///   .element::before {
+///     border-style: solid;
+///     height: 0;
+///     width: 0;
+///     border-color: transparent transparent #b25c9c;
+///     border-width: 0 1rem 1rem;
+///     content: "";
+///   }
+
+@mixin triangle(
+  $direction,
+  $width,
+  $height,
+  $color
+) {
+  @if not index(
+    "up" "up-right" "right" "down-right" "down" "down-left" "left" "up-left",
+    $direction
+  ) {
+    @error "Direction must be `up`, `up-right`, `right`, `down-right`, " +
+      "`down`, `down-left`, `left` or `up-left`.";
+  } @else if not _is-color($color) {
+    @error "`#{$color}` is not a valid color for the `$color` argument in " +
+      "the `triangle` mixin.";
+  } @else {
+    border-style: solid;
+    height: 0;
+    width: 0;
+
+    @if $direction == "up" {
+      border-color: transparent transparent $color;
+      border-width: 0 ($width / 2) $height;
+    } @else if $direction == "up-right" {
+      border-color: transparent $color transparent transparent;
+      border-width: 0 $width $width 0;
+    } @else if $direction == "right" {
+      border-color: transparent transparent transparent $color;
+      border-width: ($height / 2) 0 ($height / 2) $width;
+    } @else if $direction == "down-right" {
+      border-color: transparent transparent $color;
+      border-width: 0 0 $width $width;
+    } @else if $direction == "down" {
+      border-color: $color transparent transparent;
+      border-width: $height ($width / 2) 0;
+    } @else if $direction == "down-left" {
+      border-color: transparent transparent transparent $color;
+      border-width: $width 0 0 $width;
+    } @else if $direction == "left" {
+      border-color: transparent $color transparent transparent;
+      border-width: ($height / 2) $width ($height / 2) 0;
+    } @else if $direction == "up-left" {
+      border-color: $color transparent transparent;
+      border-width: $width $width 0 0;
+    }
+  }
+}

data/core/bourbon/library/_value-prefixer.scss

@@ -0,0 +1,37 @@
+@charset "UTF-8";
+
+/// Generates vendor prefixes for values.
+///
+/// @argument {string} $property
+///   Property to use.
+///
+/// @argument {string} $value
+///   Value to prefix.
+///
+/// @argument {list} $prefixes
+///   Vendor prefixes to output.
+///
+/// @example scss
+///   .element {
+///     @include value-prefixer(cursor, grab, ("webkit", "moz"));
+///   }
+///
+///   // CSS Output
+///   .element {
+///     cursor: -webkit-grab;
+///     cursor: -moz-grab;
+///     cursor: grab;
+///   }
+///
+/// @author Matthew Tobiasz
+
+@mixin value-prefixer(
+  $property,
+  $value,
+  $prefixes: ()
+) {
+  @each $prefix in $prefixes {
+    #{$property}: #{"-" + $prefix + "-" + $value};
+  }
+  #{$property}: $value;
+}

data/core/bourbon/settings/_settings.scss

@@ -0,0 +1,75 @@
+@charset "UTF-8";
+
+/// Default global Bourbon settings. Values in this map are overwritten by any
+/// values set in the `$bourbon` map.
+///
+/// @type map
+///
+/// @property {color} contrast-switch-dark-color [#000]
+///   Global dark color for the `contrast-switch` function.
+///
+/// @property {color} contrast-switch-light-color [#fff]
+///   Global light color for the `contrast-switch` function.
+///
+/// @property {list} global-font-file-formats [("woff2", "woff")]
+///   Global font file formats for the `font-face` mixin.
+///
+/// @property {number (with unit)} modular-scale-base [1em]
+///   Global base value for the `modular-scale` function.
+///
+/// @property {number (unitless)} modular-scale-ratio [$major-third (1.25)]
+///   Global base ratio for the `modular-scale` function.
+///
+/// @property {boolean} rails-asset-pipeline [false]
+///   Set this to `true` when using the Rails Asset Pipeline and Bourbon will
+///   write asset paths using
+///   [sass-rails’ asset helpers](https://github.com/rails/sass-rails#asset-helpers).
+///
+/// @access private
+
+$_bourbon-defaults: (
+  "contrast-switch-dark-color": #000,
+  "contrast-switch-light-color": #fff,
+  "global-font-file-formats": ("woff2", "woff"),
+  "modular-scale-base": 1em,
+  "modular-scale-ratio": $major-third,
+  "rails-asset-pipeline": false,
+);
+
+/// Global Bourbon settings.
+///
+/// @name Settings
+///
+/// @type map
+///
+/// @property {color} contrast-switch-dark-color [#000]
+///   Global dark color for the `contrast-switch` function.
+///
+/// @property {color} contrast-switch-light-color [#fff]
+///   Global light color for the `contrast-switch` function.
+///
+/// @property {list} global-font-file-formats [("woff2", "woff")]
+///   Global font file formats for the `font-face` mixin.
+///
+/// @property {number (with unit)} modular-scale-base [1em]
+///   Global base value for the `modular-scale` function.
+///
+/// @property {number (unitless)} modular-scale-ratio [$major-third (1.25)]
+///   Global base ratio for the `modular-scale` function.
+///
+/// @property {boolean} rails-asset-pipeline [false]
+///   Set this to `true` when using the Rails Asset Pipeline and Bourbon will
+///   write asset paths using
+///   [sass-rails’ asset helpers](https://github.com/rails/sass-rails#asset-helpers).
+///
+/// @example scss
+///   $bourbon: (
+///     "contrast-switch-dark-color": #000,
+///     "contrast-switch-light-color": #fff,
+///     "global-font-file-formats": ("woff2", "woff"),
+///     "modular-scale-base": 1em,
+///     "modular-scale-ratio": $major-third,
+///     "rails-asset-pipeline": false,
+///   );
+
+$bourbon: () !default;

data/core/bourbon/utilities/_assign-inputs.scss

@@ -0,0 +1,28 @@
+@charset "UTF-8";
+
+/// Append pseudo-classes to a selector(s).
+///
+/// @argument {list | string} $inputs
+///   A selector, or list of selectors, to apply the pseudo-class to.
+///
+/// @argument {pseudo-class} $pseudo [null]
+///   The pseudo-class to be appended.
+///
+/// @return {list}
+///
+/// @access private
+
+@function _assign-inputs(
+  $inputs,
+  $pseudo: null
+) {
+  $list: ();
+
+  @each $input in $inputs {
+    $input: unquote($input);
+    $input: if($pseudo, $input + ":" + $pseudo, $input);
+    $list: append($list, $input, comma);
+  }
+
+  @return $list;
+}

data/core/bourbon/utilities/_compact-shorthand.scss

@@ -0,0 +1,42 @@
+@charset "UTF-8";
+
+/// Transforms shorthand to its shortest possible form.
+///
+/// @argument {list} $values
+///   List of directional values.
+///
+/// @example scss
+///   $values: _compact-shorthand(10px 20px 10px 20px);
+///
+///   // Output
+///   $values: 10px 20px;
+///
+/// @return {list}
+///
+/// @access private
+
+@function _compact-shorthand($values) {
+  $output: null;
+
+  $a: nth($values, 1);
+  $b: if(length($values) < 2, $a, nth($values, 2));
+  $c: if(length($values) < 3, $a, nth($values, 3));
+  $d: if(length($values) < 2, $a, nth($values, if(length($values) < 4, 2, 4)));
+
+  @if $a == 0 { $a: 0; }
+  @if $b == 0 { $b: 0; }
+  @if $c == 0 { $c: 0; }
+  @if $d == 0 { $d: 0; }
+
+  @if $a == $b and $a == $c and $a == $d {
+    $output: $a;
+  } @else if $a == $c and $b == $d {
+    $output: $a $b;
+  } @else if $b == $d {
+    $output: $a $b $c;
+  } @else {
+    $output: $a $b $c $d;
+  }
+
+  @return $output;
+}

data/core/bourbon/utilities/_contrast-ratio.scss

@@ -0,0 +1,31 @@
+@charset "UTF-8";
+
+/// Programatically determines the contrast ratio between two colors.
+///
+/// Note that the alpha channel is ignored.
+///
+/// @link https://goo.gl/54htLV
+///
+/// @argument {color (hex)} $color-1
+///
+/// @argument {color (hex)} $color-2
+///
+/// @return {number (1-21)}
+///
+/// @example scss
+///   _contrast-ratio(black, white)
+///
+/// @require {function} _lightness
+///
+/// @access private
+
+@function _contrast-ratio($color-1, $color-2) {
+  $-local-lightness-1: _lightness($color-1) + 0.05;
+  $-local-lightness-2: _lightness($color-2) + 0.05;
+
+  @if $-local-lightness-1 > $-local-lightness-2 {
+    @return $-local-lightness-1 / $-local-lightness-2;
+  } @else {
+    @return $-local-lightness-2 / $-local-lightness-1;
+  }
+}

data/core/bourbon/utilities/_directional-property.scss

@@ -0,0 +1,68 @@
+@charset "UTF-8";
+
+/// Builds directional properties by parsing CSS shorthand values. For example,
+/// a value of `10px null` will output top and bottom directional properties,
+/// but the `null` skips left and right from being output.
+///
+/// @argument {string} $property
+///   Base property.
+///
+/// @argument {string} $suffix
+///   Suffix to append. Use `null` to omit.
+///
+/// @argument {list} $values
+///   List of values to set for the property.
+///
+/// @example scss
+///   .element {
+///     @include _directional-property(border, width, null 5px);
+///   }
+///
+///   // CSS Output
+///   .element {
+///     border-right-width: 5px;
+///     border-left-width: 5px;
+///   }
+///
+/// @require {function} _compact-shorthand
+///
+/// @require {function} _contains-falsy
+///
+/// @access private
+
+@mixin _directional-property(
+  $property,
+  $suffix,
+  $values
+) {
+  $top: $property + "-top" + if($suffix, "-#{$suffix}", "");
+  $bottom: $property + "-bottom" + if($suffix, "-#{$suffix}", "");
+  $left: $property + "-left" + if($suffix, "-#{$suffix}", "");
+  $right: $property + "-right" + if($suffix, "-#{$suffix}", "");
+  $all: $property + if($suffix, "-#{$suffix}", "");
+
+  $values: _compact-shorthand($values);
+
+  @if _contains-falsy($values) {
+    @if nth($values, 1) { #{$top}: nth($values, 1); }
+
+    @if length($values) == 1 {
+      @if nth($values, 1) { #{$right}: nth($values, 1); }
+    } @else {
+      @if nth($values, 2) { #{$right}: nth($values, 2); }
+    }
+
+    @if length($values) == 2 {
+      @if nth($values, 1) { #{$bottom}: nth($values, 1); }
+      @if nth($values, 2) { #{$left}: nth($values, 2); }
+    } @else if length($values) == 3 {
+      @if nth($values, 3) { #{$bottom}: nth($values, 3); }
+      @if nth($values, 2) { #{$left}: nth($values, 2); }
+    } @else if length($values) == 4 {
+      @if nth($values, 3) { #{$bottom}: nth($values, 3); }
+      @if nth($values, 4) { #{$left}: nth($values, 4); }
+    }
+  } @else {
+    #{$all}: $values;
+  }
+}

data/core/bourbon/utilities/_fetch-bourbon-setting.scss

@@ -0,0 +1,16 @@
+@charset "UTF-8";
+
+/// Return a Bourbon setting.
+///
+/// @argument {string} $setting
+///
+/// @return {boolean | color | list | number | string}
+///
+/// @example scss
+///   _fetch-bourbon-setting(rails-asset-pipeline)
+///
+/// @access private
+
+@function _fetch-bourbon-setting($setting) {
+  @return map-get(map-merge($_bourbon-defaults, $bourbon), $setting);
+}