+++ /dev/null
-// Bourbon 7.3.0
-// https://www.bourbon.io/
-// Copyright 2011-2020 thoughtbot, inc.
-// MIT License
-
-@import "bourbon/helpers/buttons-list";
-@import "bourbon/helpers/scales";
-@import "bourbon/helpers/text-inputs-list";
-
-@import "bourbon/settings/settings";
-
-@import "bourbon/validators/contains";
-@import "bourbon/validators/contains-falsy";
-@import "bourbon/validators/is-color";
-@import "bourbon/validators/is-length";
-@import "bourbon/validators/is-number";
-@import "bourbon/validators/is-size";
-
-@import "bourbon/utilities/assign-inputs";
-@import "bourbon/utilities/compact-shorthand";
-@import "bourbon/utilities/directional-property";
-@import "bourbon/utilities/fetch-bourbon-setting";
-@import "bourbon/utilities/font-source-declaration";
-@import "bourbon/utilities/gamma";
-@import "bourbon/utilities/lightness";
-@import "bourbon/utilities/contrast-ratio";
-@import "bourbon/utilities/unpack-shorthand";
-
-@import "bourbon/library/border-color";
-@import "bourbon/library/border-radius";
-@import "bourbon/library/border-style";
-@import "bourbon/library/border-width";
-@import "bourbon/library/buttons";
-@import "bourbon/library/clearfix";
-@import "bourbon/library/contrast-switch";
-@import "bourbon/library/ellipsis";
-@import "bourbon/library/font-face";
-@import "bourbon/library/font-stacks";
-@import "bourbon/library/hide-text";
-@import "bourbon/library/hide-visually";
-@import "bourbon/library/margin";
-@import "bourbon/library/modular-scale";
-@import "bourbon/library/overflow-wrap";
-@import "bourbon/library/padding";
-@import "bourbon/library/position";
-@import "bourbon/library/prefixer";
-@import "bourbon/library/shade";
-@import "bourbon/library/size";
-@import "bourbon/library/strip-unit";
-@import "bourbon/library/text-inputs";
-@import "bourbon/library/timing-functions";
-@import "bourbon/library/tint";
-@import "bourbon/library/triangle";
-@import "bourbon/library/value-prefixer";
+++ /dev/null
-@charset "UTF-8";
-
-/// A list of all HTML button elements.
-///
-/// @type list
-///
-/// @access private
-
-$_buttons-list: (
- "button",
- "[type='button']",
- "[type='reset']",
- "[type='submit']",
-);
+++ /dev/null
-@charset "UTF-8";
-
-////
-/// Pre-defined scales for use with the `modular-scale` function.
-///
-/// @type number (unitless)
-///
-/// @see {function} modular-scale
-////
-
-$minor-second: 1.067;
-$major-second: 1.125;
-$minor-third: 1.2;
-$major-third: 1.25;
-$perfect-fourth: 1.333;
-$augmented-fourth: 1.414;
-$perfect-fifth: 1.5;
-$minor-sixth: 1.6;
-$golden: 1.618;
-$major-sixth: 1.667;
-$minor-seventh: 1.778;
-$major-seventh: 1.875;
-$octave: 2;
-$major-tenth: 2.5;
-$major-eleventh: 2.667;
-$major-twelfth: 3;
-$double-octave: 4;
+++ /dev/null
-@charset "UTF-8";
-
-/// A list of all _text-based_ HTML inputs.
-///
-/// @type list
-///
-/// @access private
-
-$_text-inputs-list: (
- "[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",
-);
+++ /dev/null
-@charset "UTF-8";
-
-/// Provides a concise, one-line method for setting `border-color` on specific
-/// edges of a box. Use a `null` value to “skip” edges of the box with standard
-/// CSS shorthand.
-///
-/// @argument {list} $values
-/// List of colors; accepts CSS shorthand.
-///
-/// @example scss
-/// .element {
-/// @include border-color(#a60b55 #76cd9c null #e8ae1a);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// border-left-color: #e8ae1a;
-/// border-right-color: #76cd9c;
-/// border-top-color: #a60b55;
-/// }
-///
-/// @require {mixin} _directional-property
-
-@mixin border-color($values) {
- @include _directional-property(border, color, $values);
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Provides a concise, one-line method for setting `border-radius` on both the
-/// top-left and top-right of a box.
-///
-/// @argument {number (with unit)} $radii
-///
-/// @example scss
-/// .element {
-/// @include border-top-radius(4px);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// border-top-left-radius: 4px;
-/// border-top-right-radius: 4px;
-/// }
-
-@mixin border-top-radius($radii) {
- border-top-left-radius: $radii;
- border-top-right-radius: $radii;
-}
-
-/// Provides a concise, one-line method for setting `border-radius` on both the
-/// top-right and bottom-right of a box.
-///
-/// @argument {number (with unit)} $radii
-///
-/// @example scss
-/// .element {
-/// @include border-right-radius(3px);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// border-bottom-right-radius: 3px;
-/// border-top-right-radius: 3px;
-/// }
-
-@mixin border-right-radius($radii) {
- border-bottom-right-radius: $radii;
- border-top-right-radius: $radii;
-}
-
-/// Provides a concise, one-line method for setting `border-radius` on both the
-/// bottom-left and bottom-right of a box.
-///
-/// @argument {number (with unit)} $radii
-///
-/// @example scss
-/// .element {
-/// @include border-bottom-radius(2px);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// border-bottom-left-radius: 2px;
-/// border-bottom-right-radius: 2px;
-/// }
-
-@mixin border-bottom-radius($radii) {
- border-bottom-left-radius: $radii;
- border-bottom-right-radius: $radii;
-}
-
-/// Provides a concise, one-line method for setting `border-radius` on both the
-/// top-left and bottom-left of a box.
-///
-/// @argument {number (with unit)} $radii
-///
-/// @example scss
-/// .element {
-/// @include border-left-radius(1px);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// border-bottom-left-radius: 1px;
-/// border-top-left-radius: 1px;
-/// }
-
-@mixin border-left-radius($radii) {
- border-bottom-left-radius: $radii;
- border-top-left-radius: $radii;
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Provides a concise, one-line method for setting `border-style` on specific
-/// edges of a box. Use a `null` value to “skip” edges of the box with standard
-/// CSS shorthand.
-///
-/// @argument {list} $values
-/// List of border styles; accepts CSS shorthand.
-///
-/// @example scss
-/// .element {
-/// @include border-style(dashed null solid);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// border-bottom-style: solid;
-/// border-top-style: dashed;
-/// }
-///
-/// @require {mixin} _directional-property
-
-@mixin border-style($values) {
- @include _directional-property(border, style, $values);
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Provides a concise, one-line method for setting `border-width` on specific
-/// edges of a box. Use a `null` value to “skip” edges of the box with standard
-/// CSS shorthand.
-///
-/// @argument {list} $values
-/// List of border widths; accepts CSS shorthand.
-///
-/// @example scss
-/// .element {
-/// @include border-width(1em null 20px);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// border-bottom-width: 20px;
-/// border-top-width: 1em;
-/// }
-///
-/// @require {mixin} _directional-property
-
-@mixin border-width($values) {
- @include _directional-property(border, width, $values);
-}
+++ /dev/null
-@charset "UTF-8";
-
-////
-/// @type list
-///
-/// @require {function} _assign-inputs
-///
-/// @require {variable} $_buttons-list
-////
-
-/// A list of all HTML button elements. Please note that you must interpolate
-/// the variable (`#{}`) to use it as a selector.
-///
-/// @example scss
-/// #{$all-buttons} {
-/// background-color: #f00;
-/// }
-///
-/// // CSS Output
-/// button,
-/// [type='button'],
-/// [type='reset'],
-/// [type='submit'] {
-/// background-color: #f00;
-/// }
-
-$all-buttons: _assign-inputs($_buttons-list);
-
-/// A list of all HTML button elements with the `:active` pseudo-class applied.
-/// Please note that you must interpolate the variable (`#{}`) to use it as a
-/// selector.
-///
-/// @example scss
-/// #{$all-buttons-active} {
-/// background-color: #00f;
-/// }
-///
-/// // CSS Output
-/// button:active,
-/// [type='button']:active,
-/// [type='reset']:active,
-/// [type='submit']:active {
-/// background-color: #00f;
-/// }
-
-$all-buttons-active: _assign-inputs($_buttons-list, active);
-
-/// A list of all HTML button elements with the `:focus` pseudo-class applied.
-/// Please note that you must interpolate the variable (`#{}`) to use it as a
-/// selector.
-///
-/// @example scss
-/// #{$all-buttons-focus} {
-/// background-color: #0f0;
-/// }
-///
-/// // CSS Output
-/// button:focus,
-/// [type='button']:focus,
-/// [type='reset']:focus,
-/// [type='submit']:focus {
-/// background-color: #0f0;
-/// }
-
-$all-buttons-focus: _assign-inputs($_buttons-list, focus);
-
-/// A list of all HTML button elements with the `:hover` pseudo-class applied.
-/// Please note that you must interpolate the variable (`#{}`) to use it as a
-/// selector.
-///
-/// @example scss
-/// #{$all-buttons-hover} {
-/// background-color: #0f0;
-/// }
-///
-/// // CSS Output
-/// button:hover,
-/// [type='button']:hover,
-/// [type='reset']:hover,
-/// [type='submit']:hover {
-/// background-color: #0f0;
-/// }
-
-$all-buttons-hover: _assign-inputs($_buttons-list, hover);
+++ /dev/null
-@charset "UTF-8";
-
-/// Provides an easy way to include a clearfix for containing floats.
-///
-/// @link https://goo.gl/yP5hiZ
-///
-/// @example scss
-/// .element {
-/// @include clearfix;
-/// }
-///
-/// // CSS Output
-/// .element::after {
-/// clear: both;
-/// content: "";
-/// display: block;
-/// }
-
-@mixin clearfix {
- &::after {
- clear: both;
- content: "";
- display: block;
- }
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Switches between two colors based on the contrast to another color. It’s
-/// like a [ternary operator] for color contrast and can be useful for building
-/// a button system.
-///
-/// The calculation of the contrast ratio is based on the [WCAG 2.0
-/// specification]. However, we cannot guarantee full compliance, though all of
-/// our manual testing passed.
-///
-/// [ternary operator]: https://goo.gl/ccfLqi
-/// [WCAG 2.0 specification]: https://goo.gl/zhQuYA
-///
-/// @argument {color} $base-color
-/// The color to evaluate lightness against.
-///
-/// @argument {color} $dark-color [#000]
-/// The color to be output when `$base-color` is light. Can also be set
-/// globally using the `contrast-switch-dark-color` key in the
-/// Bourbon settings.
-///
-/// @argument {color} $light-color [#fff]
-/// The color to be output when `$base-color` is dark. Can also be set
-/// globally using the `contrast-switch-light-color` key in the
-/// Bourbon settings.
-///
-/// @return {color}
-///
-/// @example scss
-/// .element {
-/// color: contrast-switch(#bae6e6);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// color: #000;
-/// }
-///
-/// @example scss
-/// .element {
-/// $button-color: #2d72d9;
-/// background-color: $button-color;
-/// color: contrast-switch($button-color, #222, #eee);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// background-color: #2d72d9;
-/// color: #eee;
-/// }
-///
-/// @require {function} _fetch-bourbon-setting
-///
-/// @require {function} _is-color
-///
-/// @require {function} _contrast-ratio
-///
-/// @since 5.0.0
-
-@function contrast-switch(
- $base-color,
- $dark-color: _fetch-bourbon-setting("contrast-switch-dark-color"),
- $light-color: _fetch-bourbon-setting("contrast-switch-light-color")
-) {
- @if not _is-color($base-color) {
- @error "`#{$base-color}` is not a valid color for the `$base-color` " +
- "argument in the `contrast-switch` function.";
- } @else if not _is-color($dark-color) {
- @error "`#{$dark-color}` is not a valid color for the `$dark-color` " +
- "argument in the `contrast-switch` function.";
- } @else if not _is-color($light-color) {
- @error "`#{$light-color}` is not a valid color for the `$light-color` " +
- "argument in the `contrast-switch` function.";
- } @else {
- $-contrast-to-dark: _contrast-ratio($base-color, $dark-color);
- $-contrast-to-light: _contrast-ratio($base-color, $light-color);
- $-prefer-dark: $-contrast-to-dark >= $-contrast-to-light;
-
- @return if($-prefer-dark, $dark-color, $light-color);
- }
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Truncates text and adds an ellipsis to represent overflow.
-///
-/// @argument {number} $width [100%]
-/// The `max-width` for the string to respect before being truncated.
-///
-/// @argument {string} $display [inline-block]
-/// Sets the display-value of the element.
-///
-/// @example scss
-/// .element {
-/// @include ellipsis;
-/// }
-///
-/// // CSS Output
-/// .element {
-/// display: inline-block;
-/// max-width: 100%;
-/// overflow: hidden;
-/// text-overflow: ellipsis;
-/// white-space: nowrap;
-/// word-wrap: normal;
-/// }
-
-@mixin ellipsis(
- $width: 100%,
- $display: inline-block
-) {
- display: $display;
- max-width: $width;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- word-wrap: normal;
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Generates an `@font-face` declaration. You can choose the specific file
-/// formats you need to output; the mixin supports `woff2`
-/// and `woff`. The mixin also supports usage with the Rails Asset Pipeline,
-/// which you can enable per use, or globally in the `$bourbon()` settings.
-///
-/// @argument {string} $font-family
-///
-/// @argument {string} $file-path
-///
-/// @argument {string | list} $file-formats [("woff2", "woff")]
-/// List of the font file formats to include. Can also be set globally using
-/// the `global-font-file-formats` key in the Bourbon settings.
-///
-/// @argument {boolean} $asset-pipeline [false]
-/// Set to `true` if you’re using the Rails Asset Pipeline (place the fonts
-/// in `app/assets/fonts/`). Can also be set globally using the
-/// `rails-asset-pipeline` key in the Bourbon settings.
-///
-/// @content
-/// Any additional CSS properties that are included in the `@include`
-/// directive will be output within the `@font-face` declaration, e.g. you can
-/// pass in `font-weight`, `font-style` and/or `unicode-range`.
-///
-/// @example scss
-/// @include font-face(
-/// "source-sans-pro",
-/// "fonts/source-sans-pro-regular",
-/// ("woff2", "woff")
-/// ) {
-/// font-style: normal;
-/// font-weight: 400;
-/// }
-///
-/// // CSS Output
-/// @font-face {
-/// font-family: "source-sans-pro";
-/// src: url("fonts/source-sans-pro-regular.woff2") format("woff2"),
-/// url("fonts/source-sans-pro-regular.woff") format("woff");
-/// font-style: normal;
-/// font-weight: 400;
-/// }
-///
-/// @require {function} _font-source-declaration
-///
-/// @require {function} _fetch-bourbon-setting
-
-@mixin font-face(
- $font-family,
- $file-path,
- $file-formats: _fetch-bourbon-setting("global-font-file-formats"),
- $asset-pipeline: _fetch-bourbon-setting("rails-asset-pipeline")
-) {
- @font-face {
- font-family: $font-family;
- src: _font-source-declaration(
- $font-family,
- $file-path,
- $asset-pipeline,
- $file-formats
- );
- @content;
- }
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// A variable that outputs a Helvetica font stack.
-///
-/// @link https://goo.gl/uSJvZe
-///
-/// @type list
-///
-/// @example scss
-/// .element {
-/// font-family: $font-stack-helvetica;
-/// }
-///
-/// // CSS Output
-/// .element {
-/// font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif;
-/// }
-
-$font-stack-helvetica: (
- "Helvetica Neue",
- "Helvetica",
- "Arial",
- sans-serif,
-);
-
-/// A variable that outputs a Lucida Grande font stack.
-///
-/// @link https://goo.gl/R5UyYE
-///
-/// @type list
-///
-/// @example scss
-/// .element {
-/// font-family: $font-stack-lucida-grande;
-/// }
-///
-/// // CSS Output
-/// .element {
-/// font-family: "Lucida Grande", "Lucida Sans Unicode", "Geneva", "Verdana", sans-serif;
-/// }
-
-$font-stack-lucida-grande: (
- "Lucida Grande",
- "Lucida Sans Unicode",
- "Geneva",
- "Verdana",
- sans-serif,
-);
-
-/// A variable that outputs a Verdana font stack.
-///
-/// @link https://goo.gl/yGXWSS
-///
-/// @type list
-///
-/// @example scss
-/// .element {
-/// font-family: $font-stack-verdana;
-/// }
-///
-/// // CSS Output
-/// .element {
-/// font-family: "Verdana", "Geneva", sans-serif;
-/// }
-
-$font-stack-verdana: (
- "Verdana",
- "Geneva",
- sans-serif,
-);
-
-/// A variable that outputs a system font stack.
-///
-/// @type list
-///
-/// @example scss
-/// .element {
-/// font-family: $font-stack-system;
-/// }
-///
-/// // CSS Output
-/// .element {
-/// font-family: system-ui, -apple-system, BlinkMacSystemFont, "Avenir Next", "Avenir", "Segoe UI", "Lucida Grande", "Helvetica Neue", "Helvetica", "Fira Sans", "Roboto", "Noto", "Droid Sans", "Cantarell", "Oxygen", "Ubuntu", "Franklin Gothic Medium", "Century Gothic", "Liberation Sans", sans-serif;
-/// }
-
-$font-stack-system: (
- system-ui,
- -apple-system,
- BlinkMacSystemFont,
- "Avenir Next",
- "Avenir",
- "Segoe UI",
- "Lucida Grande",
- "Helvetica Neue",
- "Helvetica",
- "Fira Sans",
- "Roboto",
- "Noto",
- "Droid Sans",
- "Cantarell",
- "Oxygen",
- "Ubuntu",
- "Franklin Gothic Medium",
- "Century Gothic",
- "Liberation Sans",
- sans-serif,
-);
-
-/// A variable that outputs a Garamond font stack.
-///
-/// @link https://goo.gl/QQFEkV
-///
-/// @type list
-///
-/// @example scss
-/// .element {
-/// font-family: $font-stack-garamond;
-/// }
-///
-/// // CSS Output
-/// .element {
-/// font-family: "Garamond", "Baskerville", "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
-/// }
-
-$font-stack-garamond: (
- "Garamond",
- "Baskerville",
- "Baskerville Old Face",
- "Hoefler Text",
- "Times New Roman",
- serif,
-);
-
-/// A variable that outputs a Georgia font stack.
-///
-/// @link https://goo.gl/wtzVPy
-///
-/// @type list
-///
-/// @example scss
-/// .element {
-/// font-family: $font-stack-georgia;
-/// }
-///
-/// // CSS Output
-/// .element {
-/// font-family: "Georgia", "Times", "Times New Roman", serif;
-/// }
-
-$font-stack-georgia: (
- "Georgia",
- "Times",
- "Times New Roman",
- serif,
-);
-
-/// A variable that outputs a Hoefler Text font stack.
-///
-/// @link https://goo.gl/n7U7zx
-///
-/// @type list
-///
-/// @example scss
-/// .element {
-/// font-family: $font-stack-hoefler-text;
-/// }
-///
-/// // CSS Output
-/// .element {
-/// font-family: "Hoefler Text", "Baskerville Old Face", "Garamond", "Times New Roman", serif;
-/// }
-
-$font-stack-hoefler-text: (
- "Hoefler Text",
- "Baskerville Old Face",
- "Garamond",
- "Times New Roman",
- serif,
-);
-
-/// A variable that outputs a Consolas font stack.
-///
-/// @link https://goo.gl/iKrtqv
-///
-/// @type list
-///
-/// @example scss
-/// .element {
-/// font-family: $font-stack-consolas;
-/// }
-///
-/// // CSS Output
-/// .element {
-/// font-family: "Consolas", "monaco", monospace;
-/// }
-
-$font-stack-consolas: (
- "Consolas",
- "monaco",
- monospace,
-);
-
-/// A variable that outputs a Courier New font stack.
-///
-/// @link https://goo.gl/bHfWMP
-///
-/// @type list
-///
-/// @example scss
-/// .element {
-/// font-family: $font-stack-courier-new;
-/// }
-///
-/// // CSS Output
-/// .element {
-/// font-family: "Courier New", "Courier", "Lucida Sans Typewriter", "Lucida Typewriter", monospace;
-/// }
-
-$font-stack-courier-new: (
- "Courier New",
- "Courier",
- "Lucida Sans Typewriter",
- "Lucida Typewriter",
- monospace,
-);
-
-/// A variable that outputs a Monaco font stack.
-///
-/// @link https://goo.gl/9PgKDO
-///
-/// @type list
-///
-/// @example scss
-/// .element {
-/// font-family: $font-stack-monaco;
-/// }
-///
-/// // CSS Output
-/// .element {
-/// font-family: "Monaco", "Consolas", "Lucida Console", monospace;
-/// }
-
-$font-stack-monaco: (
- "Monaco",
- "Consolas",
- "Lucida Console",
- monospace,
-);
+++ /dev/null
-@charset "UTF-8";
-
-/// Hides the text in an element, commonly used to show an image instead. Some
-/// elements will need block-level styles applied.
-///
-/// @link https://goo.gl/EvLRIu
-///
-/// @example scss
-/// .element {
-/// @include hide-text;
-/// }
-///
-/// // CSS Output
-/// .element {
-/// overflow: hidden;
-/// text-indent: 101%;
-/// white-space: nowrap;
-/// }
-
-@mixin hide-text {
- overflow: hidden;
- text-indent: 101%;
- white-space: nowrap;
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Hides an element visually while still allowing the content to be accessible
-/// to assistive technology, e.g. screen readers. Passing `unhide` will reverse
-/// the affects of the hiding, which is handy for showing the element on focus,
-/// for example.
-///
-/// @link https://goo.gl/Vf1TGn
-///
-/// @argument {string} $toggle [hide]
-/// Accepts `hide` or `unhide`. `unhide` reverses the affects of `hide`.
-///
-/// @example scss
-/// .element {
-/// @include hide-visually;
-///
-/// &:active,
-/// &:focus {
-/// @include hide-visually("unhide");
-/// }
-/// }
-///
-/// // CSS Output
-/// .element {
-/// border: 0;
-/// clip: rect(1px, 1px, 1px, 1px);
-/// clip-path: inset(100%);
-/// height: 1px;
-/// overflow: hidden;
-/// padding: 0;
-/// position: absolute;
-/// width: 1px;
-/// }
-///
-/// .hide-visually:active,
-/// .hide-visually:focus {
-/// clip: auto;
-/// clip-path: none;
-/// height: auto;
-/// overflow: visible;
-/// position: static;
-/// width: auto;
-/// }
-///
-/// @since 5.0.0
-
-@mixin hide-visually($toggle: "hide") {
- @if not index("hide" "unhide", $toggle) {
- @error "`#{$toggle}` is not a valid value for the `$toggle` argument in " +
- "the `hide-visually` mixin. Must be either `hide` or `unhide`.";
- } @else if $toggle == "hide" {
- border: 0;
- clip: rect(1px, 1px, 1px, 1px);
- clip-path: inset(100%);
- height: 1px;
- overflow: hidden;
- padding: 0;
- position: absolute;
- white-space: nowrap;
- width: 1px;
- } @else if $toggle == "unhide" {
- clip: auto;
- clip-path: none;
- height: auto;
- overflow: visible;
- position: static;
- white-space: inherit;
- width: auto;
- }
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Provides a concise, one-line method for setting `margin` on specific edges
-/// of a box. Use a `null` value to “skip” edges of the box with standard
-/// CSS shorthand.
-///
-/// @argument {list} $values
-/// List of margin values; accepts CSS shorthand.
-///
-/// @example scss
-/// .element {
-/// @include margin(null auto);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// margin-left: auto;
-/// margin-right: auto;
-/// }
-///
-/// @example scss
-/// .element {
-/// @include margin(10px 3em 20vh null);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// margin-bottom: 20vh;
-/// margin-right: 3em;
-/// margin-top: 10px;
-/// }
-///
-/// @require {mixin} _directional-property
-
-@mixin margin($values) {
- @include _directional-property(margin, null, $values);
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Increments up or down a defined scale and returns an adjusted value. This
-/// helps establish consistent measurements and spacial relationships throughout
-/// your project. We provide a list of commonly used scales as
-/// [pre-defined variables][scales].
-///
-/// [scales]: https://github.com/thoughtbot/bourbon/blob/master/core/bourbon/helpers/_scales.scss
-///
-/// @argument {number (unitless)} $increment
-/// How many steps to increment up or down the scale.
-///
-/// @argument {number (with unit) | list} $value [1em]
-/// The base value the scale starts at. Can also be set globally using the
-/// `modular-scale-base` key in the Bourbon settings.
-///
-/// @argument {number (unitless)} $ratio [1.25]
-/// The ratio the scale is built on. Can also be set globally using the
-/// `modular-scale-ratio` key in the Bourbon settings.
-///
-/// @return {number (with unit)}
-///
-/// @example scss
-/// .element {
-/// font-size: modular-scale(2);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// font-size: 1.5625em;
-/// }
-///
-/// @example scss
-/// .element {
-/// margin-right: modular-scale(3, 2em);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// margin-right: 3.90625em;
-/// }
-///
-/// @example scss
-/// .element {
-/// font-size: modular-scale(3, 1em 1.6em, $major-seventh);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// font-size: 3em;
-/// }
-///
-/// @example scss
-/// // Globally change the base ratio
-/// $bourbon: (
-/// "modular-scale-ratio": 1.2,
-/// );
-///
-/// .element {
-/// font-size: modular-scale(3);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// font-size: 1.728em;
-/// }
-///
-/// @require {function} _fetch-bourbon-setting
-
-@function modular-scale(
- $increment,
- $value: _fetch-bourbon-setting("modular-scale-base"),
- $ratio: _fetch-bourbon-setting("modular-scale-ratio")
-) {
- $v1: nth($value, 1);
- $v2: nth($value, length($value));
- $value: $v1;
-
- // scale $v2 to just above $v1
- @while $v2 > $v1 {
- $v2: ($v2 / $ratio); // will be off-by-1
- }
- @while $v2 < $v1 {
- $v2: ($v2 * $ratio); // will fix off-by-1
- }
-
- // check AFTER scaling $v2 to prevent double-counting corner-case
- $double-stranded: $v2 > $v1;
-
- @if $increment > 0 {
- @for $i from 1 through $increment {
- @if $double-stranded and ($v1 * $ratio) > $v2 {
- $value: $v2;
- $v2: ($v2 * $ratio);
- } @else {
- $v1: ($v1 * $ratio);
- $value: $v1;
- }
- }
- }
-
- @if $increment < 0 {
- // adjust $v2 to just below $v1
- @if $double-stranded {
- $v2: ($v2 / $ratio);
- }
-
- @for $i from $increment through -1 {
- @if $double-stranded and ($v1 / $ratio) < $v2 {
- $value: $v2;
- $v2: ($v2 / $ratio);
- } @else {
- $v1: ($v1 / $ratio);
- $value: $v1;
- }
- }
- }
-
- @return $value;
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Outputs the `overflow-wrap` property and its legacy name `word-wrap` to
-/// support browsers that do not yet use `overflow-wrap`.
-///
-/// @argument {string} $wrap [break-word]
-/// Accepted CSS values are `normal`, `break-word`, `inherit`, `initial`,
-/// or `unset`.
-///
-/// @example scss
-/// .wrapper {
-/// @include overflow-wrap;
-/// }
-///
-/// // CSS Output
-/// .wrapper {
-/// word-wrap: break-word;
-/// overflow-wrap: break-word;
-/// }
-
-@mixin overflow-wrap($wrap: break-word) {
- word-wrap: $wrap;
- // stylelint-disable-next-line order/properties-alphabetical-order
- overflow-wrap: $wrap;
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Provides a concise method for targeting `padding` on specific sides of a
-/// box. Use a `null` value to “skip” a side.
-///
-/// @argument {list} $values
-/// List of padding values; accepts CSS shorthand.
-///
-/// @example scss
-/// .element-one {
-/// @include padding(null 1rem);
-/// }
-///
-/// // CSS Output
-/// .element-one {
-/// padding-left: 1rem;
-/// padding-right: 1rem;
-/// }
-///
-/// @example scss
-/// .element-two {
-/// @include padding(10vh null 10px 5%);
-/// }
-///
-/// // CSS Output
-/// .element-two {
-/// padding-bottom: 10px;
-/// padding-left: 5%;
-/// padding-top: 10vh;
-/// }
-///
-/// @require {mixin} _directional-property
-
-@mixin padding($values) {
- @include _directional-property(padding, null, $values);
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Provides a concise, one-line method for setting an element’s positioning
-/// properties: `position`, `top`, `right`, `bottom` and `left`. Use a `null`
-/// value to “skip” an edge of the box.
-///
-/// @argument {string} $position
-/// A CSS position value.
-///
-/// @argument {list} $box-edge-values
-/// List of lengths; accepts CSS shorthand.
-///
-/// @example scss
-/// .element {
-/// @include position(relative, 0 null null 10em);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// left: 10em;
-/// position: relative;
-/// top: 0;
-/// }
-///
-/// @example scss
-/// .element {
-/// @include position(absolute, 0);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// position: absolute;
-/// top: 0;
-/// right: 0;
-/// bottom: 0;
-/// left: 0;
-/// }
-///
-/// @require {function} _is-length
-///
-/// @require {function} _unpack-shorthand
-
-@mixin position(
- $position,
- $box-edge-values
-) {
- $box-edge-values: _unpack-shorthand($box-edge-values);
- $offsets: (
- "top": nth($box-edge-values, 1),
- "right": nth($box-edge-values, 2),
- "bottom": nth($box-edge-values, 3),
- "left": nth($box-edge-values, 4),
- );
-
- position: $position;
-
- @each $offset, $value in $offsets {
- @if _is-length($value) {
- #{$offset}: $value;
- }
- }
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Generates vendor prefixes.
-///
-/// @argument {string} $property
-/// Property to prefix.
-///
-/// @argument {string} $value
-/// Value to use.
-///
-/// @argument {list} $prefixes
-/// Vendor prefixes to output.
-///
-/// @example scss
-/// .element {
-/// @include prefixer(appearance, none, ("webkit", "moz"));
-/// }
-///
-/// // CSS Output
-/// .element {
-/// -webkit-appearance: none;
-/// -moz-appearance: none;
-/// appearance: none;
-/// }
-///
-/// @author Hugo Giraudel
-
-@mixin prefixer(
- $property,
- $value,
- $prefixes: ()
-) {
- @each $prefix in $prefixes {
- #{"-" + $prefix + "-" + $property}: $value;
- }
- #{$property}: $value;
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Mixes a color with black.
-///
-/// @argument {color} $color
-///
-/// @argument {number (percentage)} $percent
-/// The amount of black to be mixed in.
-///
-/// @return {color}
-///
-/// @example scss
-/// .element {
-/// background-color: shade(#ffbb52, 60%);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// background-color: #664a20;
-/// }
-
-@function shade(
- $color,
- $percent
-) {
- @if not _is-color($color) {
- @error "`#{$color}` is not a valid color for the `$color` argument in " +
- "the `shade` mixin.";
- } @else {
- @return mix(#000, $color, $percent);
- }
-}
+++ /dev/null
-@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.";
- }
-}
+++ /dev/null
-@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));
-}
+++ /dev/null
-@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);
+++ /dev/null
-@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);
+++ /dev/null
-@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);
- }
-}
+++ /dev/null
-@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;
- }
- }
-}
+++ /dev/null
-@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;
-}
+++ /dev/null
-@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;
+++ /dev/null
-@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;
-}
+++ /dev/null
-@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;
-}
+++ /dev/null
-@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;
- }
-}
+++ /dev/null
-@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;
- }
-}
+++ /dev/null
-@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);
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Builds the `src` list for an `@font-face` declaration.
-///
-/// @link https://goo.gl/Ru1bKP
-///
-/// @argument {string} $font-family
-///
-/// @argument {string} $file-path
-///
-/// @argument {boolean} $asset-pipeline
-///
-/// @argument {list} $file-formats
-///
-/// @return {list}
-///
-/// @require {function} _contains
-///
-/// @access private
-
-@function _font-source-declaration(
- $font-family,
- $file-path,
- $asset-pipeline,
- $file-formats
-) {
- $src: ();
-
- $formats-map: (
- "woff2": "#{$file-path}.woff2" format("woff2"),
- "woff": "#{$file-path}.woff" format("woff"),
- );
-
- @each $format in $file-formats {
- @if _contains(map-keys($formats-map), $format) {
- $value: map-get($formats-map, $format);
- $file-path: nth($value, 1);
- $font-format: nth($value, 2);
-
- @if $asset-pipeline == true {
- $src: append($src, font-url($file-path) $font-format, comma);
- } @else {
- $src: append($src, url($file-path) $font-format, comma);
- }
- } @else {
- @error "`#{$file-formats}` contains an unsupported font file format. " +
- "Must be `woff` and/or `woff2`.";
- }
- }
-
- @return $src;
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Performs gamma correction on a single color channel.
-///
-/// Note that the calculation is approximate if a `pow()` is not available.
-///
-/// @argument {number (0-1)} $channel
-///
-/// @return {number (0-1)}
-///
-/// @access private
-
-@function _gamma($channel) {
- @if $channel < 0.03928 {
- @return $channel / 12.92;
- } @else {
- $c: ($channel + 0.055) / 1.055;
- @if function-exists("pow") {
- @return pow($c, 2.4);
- } @else {
- @return 0.56 * $c * $c * $c + 0.44 * $c * $c;
- }
- }
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Programatically determines the lightness of a color.
-///
-/// @argument {color (hex)} $hex-color
-///
-/// @return {number (0-1)}
-///
-/// @example scss
-/// _lightness($color)
-///
-/// @access private
-
-@function _lightness($hex-color) {
- $-local-red-raw: red(rgba($hex-color, 1));
- $-local-green-raw: green(rgba($hex-color, 1));
- $-local-blue-raw: blue(rgba($hex-color, 1));
-
- $-local-red: _gamma($-local-red-raw / 255);
- $-local-green: _gamma($-local-green-raw / 255);
- $-local-blue: _gamma($-local-blue-raw / 255);
-
- @return $-local-red * 0.2126 + $-local-green * 0.7152 + $-local-blue * 0.0722;
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Transforms shorthand that can range from 1-to-4 values to be 4 values.
-///
-/// @argument {list} $shorthand
-///
-/// @example scss
-/// .element {
-/// margin: _unpack-shorthand(1em 2em);
-/// }
-///
-/// // CSS Output
-/// .element {
-/// margin: 1em 2em 1em 2em;
-/// }
-///
-/// @access private
-
-@function _unpack-shorthand($shorthand) {
- @if length($shorthand) == 1 {
- @return nth($shorthand, 1) nth($shorthand, 1) nth($shorthand, 1) nth($shorthand, 1);
- } @else if length($shorthand) == 2 {
- @return nth($shorthand, 1) nth($shorthand, 2) nth($shorthand, 1) nth($shorthand, 2);
- } @else if length($shorthand) == 3 {
- @return nth($shorthand, 1) nth($shorthand, 2) nth($shorthand, 3) nth($shorthand, 2);
- } @else {
- @return $shorthand;
- }
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Checks if a list does not contain any values.
-///
-/// @argument {list} $list
-/// The list to check against.
-///
-/// @return {boolean}
-///
-/// @access private
-
-@function _contains-falsy($list) {
- @each $item in $list {
- @if not $item {
- @return true;
- }
- }
-
- @return false;
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Checks if a list contains a value(s).
-///
-/// @argument {list} $list
-/// The list to check against.
-///
-/// @argument {list} $values
-/// A single value or list of values to check for.
-///
-/// @return {boolean}
-///
-/// @access private
-
-@function _contains(
- $list,
- $values...
-) {
- @each $value in $values {
- @if type-of(index($list, $value)) != "number" {
- @return false;
- }
- }
-
- @return true;
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Checks for a valid CSS color.
-///
-/// @argument {string} $color
-///
-/// @return {boolean}
-///
-/// @access private
-
-@function _is-color($color) {
- @return (type-of($color) == color) or ($color == "currentColor");
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Checks for a valid CSS length.
-///
-/// @argument {string} $value
-///
-/// @return {boolean}
-///
-/// @access private
-
-@function _is-length($value) {
- @return type-of($value) != "null"
- and (
- str-slice($value + "", 1, 4) == "calc"
- or str-slice($value + "", 1, 3) == "var"
- or str-slice($value + "", 1, 3) == "env"
- or index(auto inherit initial 0, $value)
- or (type-of($value) == "number" and not(unitless($value)))
- );
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Checks for a valid number.
-///
-/// @argument {number} $value
-///
-/// @require {function} _contains
-///
-/// @return {boolean}
-///
-/// @access private
-
-@function _is-number($value) {
- @return _contains("0" "1" "2" "3" "4" "5" "6" "7" "8" "9" 0 1 2 3 4 5 6 7 8 9, $value);
-}
+++ /dev/null
-@charset "UTF-8";
-
-/// Checks for a valid CSS size.
-///
-/// @argument {string} $value
-///
-/// @return {boolean}
-///
-/// @require {function} _contains
-///
-/// @require {function} _is-length
-///
-/// @access private
-
-@function _is-size($value) {
- @return _is-length($value)
- or _contains("fill" "fit-content" "min-content" "max-content", $value);
-}
