bourbon 4.3.4 → 5.0.0.alpha.0

data/core/bourbon/addons/_border-width.scss

@@ -0,0 +1,25 @@
+@charset "UTF-8";
+
+/// Provides a quick method for targeting `border-width` on specific sides of a box. Use a `null` value to “skip” a side.
+///
+/// @param {arglist} $values
+/// List of border widths, defined as CSS shorthand
+///
+/// @example scss
+/// .element {
+///   @include border-width(1em null 20px);
+/// }
+///
+/// @example css
+/// .element {
+///   border-bottom-width: 20px;
+///   border-top-width: 1em;
+/// }
+///
+/// @require {mixin} directional-property
+///
+/// @output `border-*-width`
+
+@mixin border-width($values...) {
+  @include directional-property(border, width, $values...);
+}

data/core/bourbon/addons/_buttons.scss

@@ -0,0 +1,61 @@
+@charset "UTF-8";
+
+/// Generates variables for all buttons. Please note that you must use interpolation on the variable: `#{$all-buttons}`.
+///
+/// @example scss
+/// #{$all-buttons} {
+///   background-color: #f00;
+/// }
+///
+/// #{$all-buttons-focus},
+/// #{$all-buttons-hover} {
+///   background-color: #0f0;
+/// }
+///
+/// #{$all-buttons-active} {
+///   background-color: #00f;
+/// }
+///
+/// @example css
+/// button,
+/// [type="button"],
+/// [type="reset"],
+/// [type="submit"] {
+///   background-color: #f00;
+/// }
+///
+/// button:focus,
+/// [type="button"]:focus,
+/// [type="reset"]:focus,
+/// [type="submit"]:focus,
+/// button:hover,
+/// [type="button"]:hover,
+/// [type="reset"]:hover,
+/// [type="submit"]:hover {
+///   background-color: #0f0;
+/// }
+///
+/// button:active,
+/// [type="button"]:active,
+/// [type="reset"]:active,
+/// [type="submit"]:active {
+///   background-color: #00f;
+/// }
+///
+/// @require {function} assign-inputs
+///
+/// @type list
+
+// scss-lint:disable StringQuotes
+
+// scss-lint:disable StringQuotes
+
+$buttons-list: 'button',
+               '[type="button"]',
+               '[type="reset"]',
+               '[type="submit"]';
+
+$all-buttons:        assign-inputs($buttons-list);
+$all-buttons-active: assign-inputs($buttons-list, active);
+$all-buttons-focus:  assign-inputs($buttons-list, focus);
+$all-buttons-hover:  assign-inputs($buttons-list, hover);

data/core/bourbon/addons/_clearfix.scss

@@ -0,0 +1,25 @@
+@charset "UTF-8";
+
+/// Provides an easy way to include a clearfix for containing floats.
+///
+/// @link http://goo.gl/0VEum5
+///
+/// @example scss
+/// .element {
+///   @include clearfix;
+/// }
+///
+/// @example css
+/// .element::after {
+///   clear: both;
+///   content: "";
+///   display: table;
+/// }
+
+@mixin clearfix {
+  &::after {
+    clear: both;
+    content: "";
+    display: table;
+  }
+}

data/core/bourbon/addons/_ellipsis.scss

@@ -0,0 +1,30 @@
+@charset "UTF-8";
+
+/// Truncates text and adds an ellipsis to represent overflow.
+///
+/// @param {number} $width [100%]
+/// The `max-width` for the string to respect before being truncated
+///
+/// @example scss
+/// .element {
+///   @include ellipsis;
+/// }
+///
+/// @example css
+/// .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;
+  max-width: $width;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  word-wrap: normal;
+}

data/core/bourbon/addons/_font-stacks.scss

@@ -0,0 +1,19 @@
+@charset "UTF-8";
+
+////
+/// @type list
+///
+/// @link goo.gl/Cxb26i
+////
+
+$helvetica: "Helvetica Neue", "Helvetica", "Arial", sans-serif;
+$lucida-grande: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "Geneva", "Verdana", sans-serif;
+$verdana: "Verdana", "Geneva", sans-serif;
+
+$garamond: "Garamond", "Baskerville", "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
+$georgia: "Georgia", "Times", "Times New Roman", serif;
+$hoefler-text: "Hoefler Text", "Baskerville Old Face", "Garamond", "Times New Roman", serif;
+
+$consolas: "Consolas", "monaco", monospace;
+$courier-new: "Courier New", "Courier", "Lucida Sans Typewriter", "Lucida Typewriter", monospace;
+$monaco: "monaco", "Consolas", "Lucida Console", monospace;

data/core/bourbon/addons/_hide-text.scss

@@ -0,0 +1,23 @@
+@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 http://goo.gl/EvLRIu
+///
+/// @example scss
+/// .element {
+///   @include hide-text;
+/// }
+///
+/// @example css
+/// .element {
+///   overflow: hidden;
+///   text-indent: 101%;
+///   white-space: nowrap;
+/// }
+
+@mixin hide-text {
+  overflow: hidden;
+  text-indent: 101%;
+  white-space: nowrap;
+}

data/core/bourbon/addons/_margin.scss

@@ -0,0 +1,26 @@
+@charset "UTF-8";
+
+/// Provides a quick method for targeting `margin` on specific sides of a box. Use a `null` value to “skip” a side.
+///
+/// @param {arglist} $values
+/// List of margin values, defined as CSS shorthand
+///
+/// @example scss
+/// .element {
+///   @include margin(null 10px 3em 20vh);
+/// }
+///
+/// @example css
+/// .element {
+///   margin-bottom: 3em;
+///   margin-left: 20vh;
+///   margin-right: 10px;
+/// }
+///
+/// @require {mixin} directional-property
+///
+/// @output `margin`
+
+@mixin margin($values...) {
+  @include directional-property(margin, false, $values...);
+}

data/core/bourbon/addons/_padding.scss

@@ -0,0 +1,26 @@
+@charset "UTF-8";
+
+/// Provides a quick method for targeting `padding` on specific sides of a box. Use a `null` value to “skip” a side.
+///
+/// @param {arglist} $values
+/// List of padding values, defined as CSS shorthand
+///
+/// @example scss
+/// .element {
+///   @include padding(12vh null 10px 5%);
+/// }
+///
+/// @example css
+/// .element {
+///   padding-bottom: 10px;
+///   padding-left: 5%;
+///   padding-top: 12vh;
+/// }
+///
+/// @require {mixin} directional-property
+///
+/// @output `padding`
+
+@mixin padding($values...) {
+  @include directional-property(padding, false, $values...);
+}

data/core/bourbon/addons/_position.scss

@@ -0,0 +1,49 @@
+@charset "UTF-8";
+
+/// Provides a quick method for setting an element’s position. Use a `null` value to “skip” a side.
+///
+/// @param {position} $position [relative]
+/// A CSS position value
+///
+/// @param {arglist} $coordinates [null]
+/// List of lengths, defined as CSS shorthand
+///
+/// @example scss
+/// .element {
+///   @include position(absolute, 0 null null 10em);
+/// }
+///
+/// @example css
+/// .element {
+///   left: 10em;
+///   position: absolute;
+///   top: 0;
+/// }
+///
+/// @require {function} is-length
+///
+/// @require {function} unpack
+
+@mixin position($position: relative, $coordinates: null) {
+  @if type-of($position) == list {
+    $coordinates: $position;
+    $position: relative;
+  }
+
+  $coordinates: unpack($coordinates);
+
+  $offsets: (
+    top:    nth($coordinates, 1),
+    right:  nth($coordinates, 2),
+    bottom: nth($coordinates, 3),
+    left:   nth($coordinates, 4)
+  );
+
+  position: $position;
+
+  @each $offset, $value in $offsets {
+    @if is-length($value) {
+      #{$offset}: $value;
+    }
+  }
+}

data/core/bourbon/addons/_prefixer.scss

@@ -0,0 +1,33 @@
+@charset "UTF-8";
+
+/// Generates vendor prefixes.
+///
+/// @param {string} $property
+/// Property to prefix
+///
+/// @param {*} $value
+/// Value to use
+///
+/// @param {list} $prefixes
+/// Vendor prefixes to output
+///
+/// @example scss
+/// .element {
+///   @include prefixer(appearance, none, webkit moz);
+/// }
+///
+/// @example css
+/// .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;
+}

data/core/bourbon/addons/_size.scss

@@ -0,0 +1,43 @@
+@charset "UTF-8";
+
+/// Sets the `width` and `height` of the element in one statement.
+///
+/// @param {number} $width
+///
+/// @param {number} $height [$width]
+///
+/// @example scss
+/// .first-element {
+///   @include size(2em);
+/// }
+///
+/// .second-element {
+///   @include size(auto, 10em);
+/// }
+///
+/// @example css
+/// .first-element {
+///   width: 2em;
+///   height: 2em;
+/// }
+///
+/// .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` parameter in the `size` mixin.";
+  }
+
+  @if is-size($width) {
+    width: $width;
+  } @else {
+    @error "`#{$width}` is not a valid length for the `$width` parameter in the `size` mixin.";
+  }
+}

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

@@ -0,0 +1,123 @@
+@charset "UTF-8";
+
+/// Generates variables for all text-based inputs. Please note that you must use interpolation on the variable: `#{$all-text-inputs}`.
+///
+/// @example scss
+/// #{$all-text-inputs} {
+///   border: 1px solid #f00;
+/// }
+///
+/// @example css
+/// [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 #f00;
+/// }
+///
+/// @example scss
+/// #{$all-text-inputs-focus},
+/// #{$all-text-inputs-hover} {
+///   border: 1px solid #0f0;
+/// }
+///
+/// @example css
+/// [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,
+/// [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 #0f0;
+/// }
+///
+/// @example scss
+/// #{$all-text-inputs-active} {
+///   border: 1px solid #00f;
+/// }
+///
+/// @example css
+/// [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 #00f;
+/// }
+///
+/// @require {function} assign-inputs
+///
+/// @type list
+
+// scss-lint:disable StringQuotes
+
+$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';
+
+$all-text-inputs:        assign-inputs($text-inputs-list);
+$all-text-inputs-active: assign-inputs($text-inputs-list, active);
+$all-text-inputs-focus:  assign-inputs($text-inputs-list, focus);
+$all-text-inputs-hover:  assign-inputs($text-inputs-list, hover);