flint-gs 2.0.2 → 2.0.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 95fa317058ad844a74cbbf2ff08163f19c7023ad
-  data.tar.gz: 62700564e898e68da19ce762a7f89560cb59429b
+  metadata.gz: 3d0d0539567fb162ecf38772974dbbc0cde72548
+  data.tar.gz: 5094eb179d16d8b40ce55666c9cf11cd7a3244e1
 SHA512:
-  metadata.gz: 7751705093073a2812b4f492041ee8fdae176d543e77a4a86f4c86320c1cb9f56b93d1c5149ca0bb39ac23dd4be04582e2ef5c7744b1d075642fa3a246ff9236
-  data.tar.gz: 867230aeb048f0d6eb01d6ec1f143ffd7e543bcbf37e6c26f49599c4085cbe0b859848e766006d31f924e9e87f66f148a910a083d562d0b724d2400505dfffcf
+  metadata.gz: f0286cbcee185f45947a5728bbe594e2841e738e4c613b18578118e41418d634bf415396ef7e6bd0abf2cc0e39225200e2b2f36f4de5c7ea657cd8982bd21296
+  data.tar.gz: c82aa3383be1c1b424d6ed822a4294d19848da8492492f87856b3453a39ebe19fe4957a488916815a2c251173c077c131a41c582bec60252fad4a14fcfa246f9

data/README.md

@@ -85,7 +85,7 @@ function parses the selector string (for example, `.block__element__element`) li
 
 ```
 
-This will be parsed into a list of selectors: `.block, .block__element, .block__element__element`. The list of selectors can then be used by
+This will be parsed into a list of selectors: `.block, .block__element, .block__element__element`. The list of selectors can then be used by the
 instance system to look up a selectors parent, etc. To support your own preferred syntax: create a `flint-support-syntax-<syntax-name>` function
 and hook into it through the config `"support-syntax": "<syntax-name>"` option -- the system will attempt to use the `call()` function in
 order to parse the selector string.

data/lib/flint.rb

@@ -10,8 +10,8 @@ else
 end
 
 module Flint
-    VERSION = "2.0.2"
-    DATE = "2014-10-01"
+    VERSION = "2.0.3"
+    DATE = "2014-10-02"
 end
 
 module Sass::Script::Functions
@@ -31,7 +31,7 @@ module Sass::Script::Functions
     # @param {Map}     map  - map to fetch value from
     # @param {ArgList} keys - list of keys to traverse
     #
-    # @return {String | False}
+    # @return {*}
     ###
     def flint_ruby_map_fetch(map, *keys)
         assert_type map, :Map, :map

data/stylesheets/flint/config/_config.scss

@@ -19,6 +19,8 @@
  * @prop {Bool}   settings.instance-maps       - use instance maps for added features
  * @prop {Bool}   settings.support-syntax      - support syntax within instance functions
  * @prop {Bool}   settings.debug-mode          - enable debug mode
+ *
+ * @group Configuration
  */
 $flint: (
     "breakpoints": (

data/stylesheets/flint/functions/helpers/_helpers.scss

@@ -1,3 +1,7 @@
+/**
+ * @group Internal Helper Functions
+ **/
+
 /**
  * Returns truthiness of a value
  *
@@ -192,7 +196,7 @@
  * @param {Number} $target  - pixel value
  * @param {Number} $context - context to divide by
  *
- * @return em value of target relative to context
+ * @return {Number} em value of target relative to context
  */
 @function flint-to-em($target, $context: $flint__base-font-size) {
 	@return ($target / $context) * 1em;

data/stylesheets/flint/functions/lib/_calc-breakpoint.scss

@@ -8,6 +8,8 @@
  * @param {Number} $i    - index of current breakpoint
  *
  * @return {Number} - breakpoint value
+ *
+ * @group Internal Functions
  */
 @function flint-calc-breakpoint($type, $key, $i) {
 

data/stylesheets/flint/functions/lib/_calc-width.scss

@@ -3,19 +3,21 @@
 *
 * @access private
 *
-* @param {String}          $key            - key of breakpoint
-* @param {Number}          $span           - span value of element
-* @param {Number | String} $context (null) - context value of element
-* @param {Number}          $deduct  (null) - subtract value out of final width
+* @param {String}        $key            - key of breakpoint
+* @param {Number}        $span           - span value of element
+* @param {Number|String} $context (null) - context value of element
+* @param {Number}        $deduct  (null) - subtract value out of final width
 *
-* @return {Map | False} - map of target and context result
+* @return {Map} - map of target and context result
+*
+* @group Internal Functions
 */
 @function flint-calc-width($key, $span, $context: null, $deduct: null) {
 	$result: ();
 
 	// Check to see if value has been cached
-	@if map-has-key($flint__cached-values, "#{$key, $span, $context}::width") and $context != "auto" {
-		@return map-get($flint__cached-values, "#{$key, $span, $context}::width");
+	@if map-has-key($flint__cached-values, "#{$key, $span, $context, $deduct}::width") and $context != "auto" {
+		@return map-get($flint__cached-values, "#{$key, $span, $context, $deduct}::width");
 	}
 
 	@if $span == "container" {
@@ -60,7 +62,7 @@
 
 	// Save result to cache
 	@if $context != "auto" {
-		$flint__cached-values: map-merge($flint__cached-values, ("#{$key, $span, $context}::width": $result));
+		$flint__cached-values: map-merge($flint__cached-values, ("#{$key, $span, $context, $deduct}::width": $result));
 	}
 
 	// Return result

data/stylesheets/flint/functions/lib/_exists.scss

@@ -7,6 +7,8 @@
  * @param {String} $value - key to search for
  *
  * @return {Bool}
+ *
+ * @group Internal Functions
  */
 @function flint-exists($map, $value){
 	$is-map: flint-is-map($map);

data/stylesheets/flint/functions/lib/_fluid-width.scss

@@ -7,6 +7,8 @@
  * @param {Number} $context
  *
  * @return {Number}
+ *
+ * @group Internal Functions
  */
 @function flint-fluid-width($target, $context) {
 	@return ($target / $context) * 100%;

data/stylesheets/flint/functions/lib/_get-index.scss

@@ -6,6 +6,8 @@
  * @param {String} $key - breakpoint key
  *
  * @return {Number}
+ *
+ * @group Internal Functions
  */
 @function flint-get-index($key) {
 

data/stylesheets/flint/functions/lib/_get-instance-value.scss

@@ -6,7 +6,9 @@
  * @param {String}  $key    - breakpoint key to pass to instance method
  * @param {ArgList} $values - list of keys to fetch value from
  *
- * @return {String | False}
+ * @return {*}
+ *
+ * @group Internal Functions
  */
 @function flint-get-instance-value($key, $values...) {
 	@return flint-map-fetch($flint__instances, flint-has-family-instance($key), $values...);

data/stylesheets/flint/functions/lib/_get-value.scss

@@ -6,6 +6,8 @@
  * @param {ArgList} $keys - list of keys to fetch value from
  *
  * @return {*}
+ *
+ * @group Internal Functions
  */
 @function flint-get-value($keys...) {
 	@return flint-map-fetch($flint, $keys...);

data/stylesheets/flint/functions/lib/_has-family-instance.scss

@@ -6,7 +6,9 @@
  * @param {String} $key    - breakpoint key to search for matching instance
  * @param {String} $syntax - searches for instance using passed syntax parser
  *
- * @return {String | False} instance selector
+ * @return {String} instance selector
+ *
+ * @group Internal Functions
  */
 @function flint-has-family-instance($key: flint-get-value("settings", "default"), $syntax: $flint__support-syntax) {
 	$selector: nth(&, 1);

data/stylesheets/flint/functions/lib/_instance.scss

@@ -12,6 +12,8 @@
  * @param {Number} $output-margin-left  - computed left margin of instance
  *
  * @return {Map} merged instance map
+ *
+ * @group Internal Functions
  */
 @function flint-instance($key, $span, $context, $gutter, $output-width, $output-margin-right, $output-margin-left) {
 

data/stylesheets/flint/functions/lib/_last.scss

@@ -6,6 +6,8 @@
  * @param {List} $list
  *
  * @return {List}
+ *
+ * @group Internal Functions
  */
 @function flint-last($list) {
 	@return nth($list, length($list));

data/stylesheets/flint/functions/lib/_list-to-string.scss

@@ -10,6 +10,8 @@
  * @param {Bool}   $is-nested
  *
  * @return {String}
+ *
+ * @group Internal Functions
  */
 @function flint-list-to-string($list, $glue: "", $is-nested: false) {
 	$result: null;

data/stylesheets/flint/functions/lib/_map-fetch.scss

@@ -6,7 +6,9 @@
  * @param {Map}     $map  - map to fetch value from
  * @param {ArgList} $keys - list of keys to traverse
  *
- * @return {String | False}
+ * @return {*}
+ *
+ * @group Internal Functions
  */
 @function flint-map-fetch($map, $keys...) {
 

data/stylesheets/flint/functions/lib/_next-index.scss

@@ -5,7 +5,9 @@
  *
  * @param {Number} $index - index of breakpoint
  *
- * @return {String | False}
+ * @return {String}
+ *
+ * @group Internal Functions
  */
 @function flint-next-index($index) {
 	@return if(flint-is-number($index) and $index != 0, flint-steal-key($index + 1), false);

data/stylesheets/flint/functions/lib/_purge.scss

@@ -8,6 +8,8 @@
  * @param {List} $list
  *
  * @return {List}
+ *
+ * @group Internal Functions
  */
 @function flint-purge($list) {
 	$result: ();

data/stylesheets/flint/functions/lib/_remove.scss

@@ -10,6 +10,8 @@
  * @param {Bool} $recursive
  *
  * @return {List}
+ *
+ * @group Internal Functions
  */
 @function flint-remove($list, $value) {
 	@return flint-replace($list, $value, null);

data/stylesheets/flint/functions/lib/_replace-substring.scss

@@ -8,6 +8,8 @@
  * @param {String} $new-substring (" ") - new string to replace sub with
  *
  * @return {String}
+ *
+ * @group Internal Functions
  */
 @function flint-replace-substring($string, $substring, $new-substring: " ") {
 

data/stylesheets/flint/functions/lib/_replace.scss

@@ -10,6 +10,8 @@
  * @param {*}    $value
  *
  * @return {List}
+ *
+ * @group Internal Functions
  */
 @function flint-replace($list, $old, $value) {
   $running: true;

data/stylesheets/flint/functions/lib/_steal-key.scss

@@ -5,7 +5,9 @@
  *
  * @param {Number} $index - index of key
  *
- * @return {String | False}
+ * @return {String}
+ *
+ * @group Internal Functions
  */
 @function flint-steal-key($index) {
 	$length: length(map-keys(flint-get-value("breakpoints")));

data/stylesheets/flint/functions/lib/_steal-values.scss

@@ -6,7 +6,9 @@
  * @param {Number} $index - index of key
  * @param {String} $value - value to get from breakpoint
  *
- * @return {String | False}
+ * @return {String}
+ *
+ * @group Internal Functions
  */
 @function flint-steal-values($index, $value) {
 	@return if(flint-is-number($index), flint-get-value("breakpoints", flint-steal-key($index), $value), false);

data/stylesheets/flint/functions/lib/_string-to-list.scss

@@ -7,7 +7,9 @@
  * @param {String} $find   (" ") - item to find which separates substrings
  * @param {String} $ignore (",") - removes remaining string beyond item
  *
- * @return {List | False}
+ * @return {List}
+ *
+ * @group Internal Functions
  */
 @function flint-string-to-list($string, $find: " ", $ignore: ",") {
 	@if flint-is-string($string) {

data/stylesheets/flint/functions/lib/_support-syntax-bem.scss

@@ -6,6 +6,8 @@
  * @param {List} $selectors - string of selectors to parse
  *
  * @return {List} - parsed list of selectors according to syntax
+ *
+ * @group Internal Functions
  */
 @function flint-support-syntax-bem($selectors) {
     // Clean up selector, remove double underscores for spaces

data/stylesheets/flint/functions/lib/_support-syntax.scss

@@ -7,6 +7,8 @@
  * @param {List}   $selectors - string of selectors to parse
  *
  * @return {List} - list of parsed selectors according to syntax
+ *
+ * @group Internal Functions
  */
 @function flint-support-syntax($syntax, $selectors) {
     $syntax: to-lower-case($syntax);

data/stylesheets/flint/functions/lib/_types-in-list.scss

@@ -4,10 +4,12 @@
  * @access private
  *
  * @param {List} $list                          - list of items
- * @param {String | List} $assert-types  (null) - single or list of types to assert
- * @param {Number}        $assert-length (null) - assert length of list
+ * @param {String|List} $assert-types  (null) - single or list of types to assert
+ * @param {Number}      $assert-length (null) - assert length of list
  *
  * @return {Bool}
+ *
+ * @group Internal Functions
  */
 @function flint-types-in-list($list, $assert-types: null, $assert-length: null) {
     @if flint-is-list($list) {

data/stylesheets/flint/functions/lib/_use-syntax.scss

@@ -6,6 +6,8 @@
  * @param {List} $selectors - string of selectors to parse
  *
  * @return {List} - parsed list of selectors
+ *
+ * @group Internal Functions
  */
 @function flint-use-syntax($selectors) {
     @if $flint__support-syntax {

data/stylesheets/flint/globals/_globals.scss

@@ -1,3 +1,7 @@
+/**
+ * @group Internal Variables
+**/
+
 /**
  * Use development mode to silence fatal errors
  *

data/stylesheets/flint/mixins/lib/_box-sizing.scss

@@ -5,7 +5,9 @@
  *
  * @param {String} $type ("border-box") - border-box type
  *
- * @requires local box-sizing mixin if available
+ * @requires {Mixin} box-sizing - local mixin if available
+ *
+ * @group Internal Mixins
  */
 @mixin flint-box-sizing($type: "border-box") {
     @if mixin-exists("box-sizing") {

data/stylesheets/flint/mixins/lib/_calculate.scss

@@ -1,3 +1,7 @@
+/**
+ * @group Internal Mixins
+ **/
+
 /**
  * Outputs calculated styles
  *
@@ -33,11 +37,11 @@
  *
  * @access private
  *
- * @param {String}        $calc-key     - breakpoint key
- * @param {Number}        $calc-span    - span value
- * @param {Number}        $calc-context - context value
- * @param {String}        $calc-gutter  - gutter modifier
- * @param {Number | Null} $i            - index if variable length is > 1
+ * @param {String}      $calc-key     - breakpoint key
+ * @param {Number}      $calc-span    - span value
+ * @param {Number}      $calc-context - context value
+ * @param {String}      $calc-gutter  - gutter modifier
+ * @param {Number|Null} $i            - index if variable length is > 1
  */
 @mixin flint-calculate($key, $span, $context, $gutter, $i: null) {
 

data/stylesheets/flint/mixins/lib/_clearfix.scss

@@ -5,7 +5,7 @@
  *
  * @link http://nicolasgallagher.com/micro-clearfix-hack/
  *
- * @requires local clearfix mixin if available
+ * @requires {Mixin} clearfix - local mixin if available
  */
 @mixin flint-clearfix {
     @if mixin-exists("clearfix") {

data/stylesheets/flint/mixins/lib/_container.scss

@@ -5,6 +5,8 @@
  *
  * @param {String} $key (null) - alias of individual breakpoint
  * @param {Number} $i   (null) - index number if called from loop
+ *
+ * @group Internal Mixins
  */
 @mixin flint-container($key: null, $i: null) {
 

data/stylesheets/flint/mixins/lib/_main.scss

@@ -1,23 +1,284 @@
 /**
- * Main API
+ * # Main API
  *
- * @access public
+ * ----
  *
- * @param {String | Number | List} $key     - key of breakpoint or shorthand span
- * @param {String | Number | List} $span    - value of span of column or shorthand context
- * @param {String | Number | List} $context - context value of span
- * @param {String | List}          $gutter  - alias for gutter modifier
+ * ## Shorthand
  *
- * @throws error if list lengths do not match number of breakpoints
+ * ### Recursive span
+ * Use this if you want identical column spans across all breakpoints. This is of course
+ * relative to each of your breakpoint's column count, so if your lowest breakpoint has
+ * a column count of `4`, then anything above that would likely cause layout issues
+ * for that breakpoint.
  *
- * @example scss - Clearfix
- * _(clear)
+ *     \@include _(2);
  *
- * @example scss - Foundation
- * _(foundation)
+ * ### Recursive Span With Identical Context
+ * Use this if your nested context is identical across all breakpoints. The `$context` should
+ * be the span value of the element's parent, or `auto`.
  *
- * @example scss - Container
- * _(container)
+ *     \@include _(4, 2);
+ *
+ * ### Recursive Span With Differing Context
+ * Use this if your nested context is not identical across all breakpoints. The `$context`
+ * should be the span value of the element's parent, or `auto`.
+ *
+ *     \@include _(4, 8 8 4 4);
+ *
+ * ### Variable Span
+ * Use this if your content needs different spans across each breakpoint. The order of
+ * operations is the order that your breakpoints are listed in your config (DESC).
+ *
+ *     \@include _(8 8 4 4);
+ *
+ * ### Variable Span With Identical Context
+ * Use this if your nested context is identical across all breakpoints. The `$context`
+ * should be the span value of the element's parent, or `auto`.
+ *
+ *     \@include _(4 4 2 2, 4);
+ *
+ * ### Variable Span With Differing Context
+ * Use this if your nested context is not identical across all breakpoints. The `$context`
+ * should be the span value of the element's parent, or `auto`.
+ *
+ *     \@include _(8 8 4 4, 8 8 4 4);
+ *
+ * ----
+ *
+ * ## Longhand
+ *
+ * ### Span
+ * Use if you want to define each span by breakpoint `$alias`.
+ *
+ *     \@include _(desktop, 2);
+ *
+ * ### Span With Context
+ * Use if you want to define each span by breakpoint `$alias`. The `$context` should be the span
+ * value of the element's parent, or `auto`.
+ *
+ *     \@include _(desktop, 4, 2);
+ *
+ * ----
+ *
+ * ## Automatic Context
+ *
+ * You can use `$context: auto`, and Flint will calculate based on the closest parent element's
+ * width instead of the current breakpoint. When using `auto`, Flint falls back from the topmost
+ * selector until one is found that has an instance, and it will calculate its span based on that
+ * instance's width for the current breakpoint. Think of the `auto` option as a self-correcting grid.
+ *
+ * When utilizing the `$context` argument, be sure to note the differences in the way the calculations
+ * happen depending on if you use a numerical value or `auto`. When using a numerical value, the span
+ * is calculated against the current breakpoint's value (example: `80em`), then is divided by it's column
+ * count (example: `16`), and then finally multiplied by the current breakpoints passed `$context` value.
+ * When using `auto`, the span is _always_ calculated against the closest parent element's width instead
+ * of the current breakpoint's width.
+ *
+ * The difference in output varies, but your gutters will be more accurate across the board if you
+ * consistently use the `auto` option. This option allows you to infinitely nest elements on both fixed
+ * and fluid grids without dealing with the inconsistencies that can be caused by nesting elements that
+ * all use a gutter value of their own. Because the parent element's actual width is always used, the
+ * gutters never become out of sync.
+ *
+ *    .parent {
+ *        \@include _(4);
+ *        .child {
+ *            \@include _(3, 4);
+ *        }
+ *    }
+ *    // Auto will work
+ *    .parent {
+ *        \@include _(4);
+ *        .child {
+ *            \@include _(3, auto);
+ *        }
+ *    }
+ *    // Will also work
+ *    .parent {
+ *        \@include _(4);
+ *    }
+ *    .parent .child {
+ *        \@include _(3, auto);
+ *    }
+ *    // Will not work, as the child has no relation to
+ *    //   the parent within the stylesheet
+ *    .parent {
+ *        \@include _(6);
+ *    }
+ *    .child {
+ *        \@include _(3, auto);
+ *    }
+ *
+ * ----
+ *
+ * ## Modifiers
+ *
+ * ### Alpha
+ * Remove the left `$gutter` from the span. Other aliases for `alpha` include: `no-left` and `first`.
+ *
+ *    div {
+ *        \@include _(12 8 6 4, $gutter: alpha);
+ *    }
+ *
+ * ### Omega
+ * Remove the right `$gutter` from the span. Other aliases for `omega` include: `no-right` and `last`.
+ *
+ *    div {
+ *        \@include _(2, $gutter: omega);
+ *    }
+ *
+ * ### Row
+ * Remove both of the `$gutter` values from the span. Other aliases for `row` include: `none`.
+ *
+ *    div {
+ *        \@include _(4, $gutter: row);
+ *    }
+ *
+ * ### Center
+ * Center the current span within it's container element. Outputs auto left and right margins.
+ * This modifier will also remove any float properties on the element.
+ *
+ *    div {
+ *        \@include _(4, $gutter: center);
+ *    }
+ *
+ * ### Inside
+ * Sets both `$gutter` values on the inside of the element. Instead of deducting `$gutter*2` out
+ * of the final width, it will deduct `$gutter*4`. Useful for nesting elements inside of other
+ * elements without using `$context: auto`.
+ *
+ *    div {
+ *        \@include _(16 12 8 4, $gutter: inside);
+ *    }
+ *
+ * ### Default
+ * Argument to use the default left/right `$gutter` values. Useful for when you want to use a
+ * variable `$gutter` argument. Other aliases for `default` include: `normal` and `regular`.
+ *
+ *    div {
+ *        \@include _(4, $gutter: default);
+ *    }
+ *
+ * ### Variable Modifiers
+ * Instead of passing in a recursive `$gutter` value, you may specify a value for each breakpoint exactly
+ * like you would a `$span` argument.
+ *
+ *    div {
+ *        \@include _(10 8 6 4, $gutter: alpha omega omega default);
+ *    }
+ *
+ * ----
+ *
+ * ## Queries
+ *
+ * ### By Alias
+ * Use this type of query to wrap the `@content` in a single query for the specified breakpoint.
+ *
+ *    div {
+ *        \@include _(desktop) {
+ *            property: value;
+ *        }
+ *    }
+ *
+ * ### From, To
+ * Use this type of query to wrap the `@content` in a single query between 2 breakpoints. Make
+ * sure to pass in the breakpoints from lowest to highest.
+ *
+ *    div {
+ *        \@include _(from tablet to laptop) {
+ *            property: value;
+ *        }
+ *    }
+ *
+ * ### Greater Than
+ * Use this type of query to wrap the `@content` in a single query for anything above
+ * the passed breakpoint.
+ *
+ *    div {
+ *        \@include _(greater than laptop) {
+ *            property: value;
+ *        }
+ *        \@include _(5em greater than tablet) {
+ *            property: value;
+ *        }
+ *        \@include _(greater than 55em) {
+ *            property: value;
+ *        }
+ *    }
+ *
+ * ### Less Than
+ * Use this type of query to wrap the `@content` in a single query for anything below
+ * the passed breakpoint.
+ *
+ *    div {
+ *        \@include _(less than laptop) {
+ *            property: value;
+ *        }
+ *        \@include _(5em less than tablet) {
+ *            property: value;
+ *        }
+ *        \@include _(less than 8em) {
+ *            property: value;
+ *        }
+ *    }
+ *
+ * ### For
+ * Use this type of query to wrap the `@content` in a single comma delimited query
+ * for each passed `$alias`.
+ *
+ *    div {
+ *        \@include _(for mobile tablet desktop) {
+ *            property: value;
+ *        }
+ *    }
+ *
+ * ----
+ *
+ * ## Miscellaneous
+ *
+ * ### Clearfix
+ * Given that Flint is float based, you might find yourself needing to use a clearfix. Flint comes
+ * packaged with a micro-clearfix function. _Flint will attempt to use a local mixin named
+ * `clearfix`. If one is not found, it will use it's own._
+ *
+ *    div {
+ *        \@include _(clear);
+ *    }
+ *
+ * ### Foundation
+ * A foundation instance will output a global box-sizing: border-box declaration. If you selected
+ * `"border-box-sizing": true`, then it is advised to create a global foundation instance. If you
+ * don't, Flint will automatically apply a foundation instance with your first span declaration.
+ * This should be placed at the root of your stylesheet. _Flint will attempt to use a local
+ * mixin named `box-sizing`. If one is not found, it will use it's own._
+ *
+ *     \@include _(foundation);
+ *
+ * ### Container
+ * Containers act as a containing row for each individual breakpoint. It uses the `"max-width"`
+ * setting, if set. They do not float, so if you have `"center-container"` set, then it
+ * will also center your element using auto left and right margins. You may combine
+ * container and clear declarations, with arguments separated by a comma.
+ *
+ *
+ *    div {
+ *        \@include _(container);
+ *    }
+ *
+ * ----
+ *
+ * @access public
+ *
+ * @param {String|Number|List} $key     (null) - key of breakpoint, or shorthand span
+ * @param {String|Number|List} $span    (null) - value of span for column, or shorthand context
+ * @param {String|Number}      $context (null) - context value of span, or null for shorthand
+ * @param {String|List}        $gutter  (null) - alias for gutter modifier
+ *
+ * @content all content passed will be placed _underneath_ output so that it takes precedence.
+ *
+ * @throws error if list lengths do not match number of breakpoints (when using variable shorthands).
+ *
+ * ----
  *
  * @example scss - Recursive shorthand with no context
  * _(2)
@@ -48,40 +309,53 @@
  * _(desktop, 2, auto)
  *
  * @example scss - Call $key breakpoint by alias
- * _($key)
+ * _(desktop) { ... }
  *
  * @example scss - From $key breakpoint to infinity
- * _(from $key to infinity)
+ * _(from laptop to infinity) { ... }
  *
  * @example scss - From $key-x breakpoint to $key-y breakpoint
- * _(from $key-x to $key-y)
+ * _(from tablet to laptop) { ... }
  *
  * @example scss - From $num-x to $num-y
- * _(from $num-x to $num-y)
+ * _(from 20em to laptop) { ... }
  *
  * @example scss - Greater than $key breakpoint
- * _(greater than $key)
+ * _(greater than tablet) { ... }
  *
  * @example scss - Greater than number
- * _(greater than $num)
+ * _(greater than 15em) { ... }
  *
  * @example scss - Number greater than $key breakpoint
- * _($num greater than $key)
+ * _(5em greater than mobile) { ... }
  *
  * @example scss - Less than $key breakpoint
- * _(less than $key)
+ * _(less than laptop) { ... }
  *
  * @example scss - Less than number
- * _(less than $num)
+ * _(less than 35em) { ... }
  *
  * @example scss - Number less than $key breakpoint
- * _($num less than $key)
+ * _(10em less than laptop) { ... }
  *
- * @example scss - For $key-x $key-y $key-z
- * _(for $key-x $key-y $key-z)
+ * @example scss - For $key-x $key-y $key-z...
+ * _(for mobile tablet desktop) { ... }
+ *
+ * @example scss - Clear
+ * _(clear)
+ *
+ * @example scss - Foundation
+ * _(foundation)
+ *
+ * @example scss - Container
+ * _(container)
+ *
+ * ----
  *
  * @author Ezekiel Gabrielse
  * @link http://flint.gs
+ *
+ * @group Public API
  */
 @mixin _(
     $key: null,
@@ -145,9 +419,7 @@
             $flint__foundation: "existent" !global;
         }
 
-        /*
-         * Foundation is now globally existant
-         */
+        // Foundation is now globally existant
         @if $flint__foundation == "existent" {
             @at-root *, *:before, *:after {
                 @include flint-box-sizing;
@@ -165,9 +437,7 @@
             @include _("foundation");
         }
 
-        /*
-         * Output container for each breakpoint if fixed grid
-         */
+        // Output container for each breakpoint if fixed grid
         @if $key == "container" and flint-get-value("settings", "grid") == "fixed" {
 
             @for $i from 1 through length($flint__all-keys) {
@@ -206,9 +476,7 @@
                 }
             }
 
-        /*
-         * Output container for specific breakpoint if exists
-         */
+        // Output container for specific breakpoint if exists
         } @else if flint-exists($flint, $key) and flint-get-value("settings", "grid") == "fixed" {
 
             @if flint-is-highest-breakpoint($key) {
@@ -253,7 +521,7 @@
         }
 
     /*
-     * Creates a new instance, add to global instance map
+     * Create a new instance, add to global instance map
      */
     } @else {
 

data/stylesheets/flint/mixins/lib/_new-instance.scss

@@ -10,6 +10,8 @@
  * @param {Number} $output-width
  * @param {Number} $output-margin-right
  * @param {Number} $output-margin-left
+ *
+ * @group Internal Mixins
  */
 @mixin flint-new-instance($calc-key, $calc-span, $calc-context, $calc-gutter, $output-width, $output-margin-right, $output-margin-left) {
 	$flint__instances:

data/stylesheets/flint/mixins/lib/_print-instance.scss

@@ -1,3 +1,7 @@
+/**
+ * @group Internal Mixins
+ **/
+
 /**
  * Prints debug properties
  *

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: flint-gs
 version: !ruby/object:Gem::Version
-  version: 2.0.2
+  version: 2.0.3
 platform: ruby
 authors:
 - Ezekiel Gabrielse
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2014-10-01 00:00:00.000000000 Z
+date: 2014-10-02 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass