flint-gs 2.0.2 → 2.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +1 -1
  3. data/lib/flint.rb +3 -3
  4. data/stylesheets/flint/config/_config.scss +2 -0
  5. data/stylesheets/flint/functions/helpers/_helpers.scss +5 -1
  6. data/stylesheets/flint/functions/lib/_calc-breakpoint.scss +2 -0
  7. data/stylesheets/flint/functions/lib/_calc-width.scss +10 -8
  8. data/stylesheets/flint/functions/lib/_exists.scss +2 -0
  9. data/stylesheets/flint/functions/lib/_fluid-width.scss +2 -0
  10. data/stylesheets/flint/functions/lib/_get-index.scss +2 -0
  11. data/stylesheets/flint/functions/lib/_get-instance-value.scss +3 -1
  12. data/stylesheets/flint/functions/lib/_get-value.scss +2 -0
  13. data/stylesheets/flint/functions/lib/_has-family-instance.scss +3 -1
  14. data/stylesheets/flint/functions/lib/_instance.scss +2 -0
  15. data/stylesheets/flint/functions/lib/_last.scss +2 -0
  16. data/stylesheets/flint/functions/lib/_list-to-string.scss +2 -0
  17. data/stylesheets/flint/functions/lib/_map-fetch.scss +3 -1
  18. data/stylesheets/flint/functions/lib/_next-index.scss +3 -1
  19. data/stylesheets/flint/functions/lib/_purge.scss +2 -0
  20. data/stylesheets/flint/functions/lib/_remove.scss +2 -0
  21. data/stylesheets/flint/functions/lib/_replace-substring.scss +2 -0
  22. data/stylesheets/flint/functions/lib/_replace.scss +2 -0
  23. data/stylesheets/flint/functions/lib/_steal-key.scss +3 -1
  24. data/stylesheets/flint/functions/lib/_steal-values.scss +3 -1
  25. data/stylesheets/flint/functions/lib/_string-to-list.scss +3 -1
  26. data/stylesheets/flint/functions/lib/_support-syntax-bem.scss +2 -0
  27. data/stylesheets/flint/functions/lib/_support-syntax.scss +2 -0
  28. data/stylesheets/flint/functions/lib/_types-in-list.scss +4 -2
  29. data/stylesheets/flint/functions/lib/_use-syntax.scss +2 -0
  30. data/stylesheets/flint/globals/_globals.scss +4 -0
  31. data/stylesheets/flint/mixins/lib/_box-sizing.scss +3 -1
  32. data/stylesheets/flint/mixins/lib/_calculate.scss +9 -5
  33. data/stylesheets/flint/mixins/lib/_clearfix.scss +1 -1
  34. data/stylesheets/flint/mixins/lib/_container.scss +2 -0
  35. data/stylesheets/flint/mixins/lib/_main.scss +303 -35
  36. data/stylesheets/flint/mixins/lib/_new-instance.scss +2 -0
  37. data/stylesheets/flint/mixins/lib/_print-instance.scss +4 -0
  38. metadata +2 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 95fa317058ad844a74cbbf2ff08163f19c7023ad
4
- data.tar.gz: 62700564e898e68da19ce762a7f89560cb59429b
3
+ metadata.gz: 3d0d0539567fb162ecf38772974dbbc0cde72548
4
+ data.tar.gz: 5094eb179d16d8b40ce55666c9cf11cd7a3244e1
5
5
  SHA512:
6
- metadata.gz: 7751705093073a2812b4f492041ee8fdae176d543e77a4a86f4c86320c1cb9f56b93d1c5149ca0bb39ac23dd4be04582e2ef5c7744b1d075642fa3a246ff9236
7
- data.tar.gz: 867230aeb048f0d6eb01d6ec1f143ffd7e543bcbf37e6c26f49599c4085cbe0b859848e766006d31f924e9e87f66f148a910a083d562d0b724d2400505dfffcf
6
+ metadata.gz: f0286cbcee185f45947a5728bbe594e2841e738e4c613b18578118e41418d634bf415396ef7e6bd0abf2cc0e39225200e2b2f36f4de5c7ea657cd8982bd21296
7
+ data.tar.gz: c82aa3383be1c1b424d6ed822a4294d19848da8492492f87856b3453a39ebe19fe4957a488916815a2c251173c077c131a41c582bec60252fad4a14fcfa246f9
data/README.md CHANGED
@@ -85,7 +85,7 @@ function parses the selector string (for example, `.block__element__element`) li
85
85
 
86
86
  ```
87
87
 
88
- This will be parsed into a list of selectors: `.block, .block__element, .block__element__element`. The list of selectors can then be used by
88
+ 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
89
89
  instance system to look up a selectors parent, etc. To support your own preferred syntax: create a `flint-support-syntax-<syntax-name>` function
90
90
  and hook into it through the config `"support-syntax": "<syntax-name>"` option -- the system will attempt to use the `call()` function in
91
91
  order to parse the selector string.
data/lib/flint.rb CHANGED
@@ -10,8 +10,8 @@ else
10
10
  end
11
11
 
12
12
  module Flint
13
- VERSION = "2.0.2"
14
- DATE = "2014-10-01"
13
+ VERSION = "2.0.3"
14
+ DATE = "2014-10-02"
15
15
  end
16
16
 
17
17
  module Sass::Script::Functions
@@ -31,7 +31,7 @@ module Sass::Script::Functions
31
31
  # @param {Map} map - map to fetch value from
32
32
  # @param {ArgList} keys - list of keys to traverse
33
33
  #
34
- # @return {String | False}
34
+ # @return {*}
35
35
  ###
36
36
  def flint_ruby_map_fetch(map, *keys)
37
37
  assert_type map, :Map, :map
@@ -19,6 +19,8 @@
19
19
  * @prop {Bool} settings.instance-maps - use instance maps for added features
20
20
  * @prop {Bool} settings.support-syntax - support syntax within instance functions
21
21
  * @prop {Bool} settings.debug-mode - enable debug mode
22
+ *
23
+ * @group Configuration
22
24
  */
23
25
  $flint: (
24
26
  "breakpoints": (
@@ -1,3 +1,7 @@
1
+ /**
2
+ * @group Internal Helper Functions
3
+ **/
4
+
1
5
  /**
2
6
  * Returns truthiness of a value
3
7
  *
@@ -192,7 +196,7 @@
192
196
  * @param {Number} $target - pixel value
193
197
  * @param {Number} $context - context to divide by
194
198
  *
195
- * @return em value of target relative to context
199
+ * @return {Number} em value of target relative to context
196
200
  */
197
201
  @function flint-to-em($target, $context: $flint__base-font-size) {
198
202
  @return ($target / $context) * 1em;
@@ -8,6 +8,8 @@
8
8
  * @param {Number} $i - index of current breakpoint
9
9
  *
10
10
  * @return {Number} - breakpoint value
11
+ *
12
+ * @group Internal Functions
11
13
  */
12
14
  @function flint-calc-breakpoint($type, $key, $i) {
13
15
 
@@ -3,19 +3,21 @@
3
3
  *
4
4
  * @access private
5
5
  *
6
- * @param {String} $key - key of breakpoint
7
- * @param {Number} $span - span value of element
8
- * @param {Number | String} $context (null) - context value of element
9
- * @param {Number} $deduct (null) - subtract value out of final width
6
+ * @param {String} $key - key of breakpoint
7
+ * @param {Number} $span - span value of element
8
+ * @param {Number|String} $context (null) - context value of element
9
+ * @param {Number} $deduct (null) - subtract value out of final width
10
10
  *
11
- * @return {Map | False} - map of target and context result
11
+ * @return {Map} - map of target and context result
12
+ *
13
+ * @group Internal Functions
12
14
  */
13
15
  @function flint-calc-width($key, $span, $context: null, $deduct: null) {
14
16
  $result: ();
15
17
 
16
18
  // Check to see if value has been cached
17
- @if map-has-key($flint__cached-values, "#{$key, $span, $context}::width") and $context != "auto" {
18
- @return map-get($flint__cached-values, "#{$key, $span, $context}::width");
19
+ @if map-has-key($flint__cached-values, "#{$key, $span, $context, $deduct}::width") and $context != "auto" {
20
+ @return map-get($flint__cached-values, "#{$key, $span, $context, $deduct}::width");
19
21
  }
20
22
 
21
23
  @if $span == "container" {
@@ -60,7 +62,7 @@
60
62
 
61
63
  // Save result to cache
62
64
  @if $context != "auto" {
63
- $flint__cached-values: map-merge($flint__cached-values, ("#{$key, $span, $context}::width": $result));
65
+ $flint__cached-values: map-merge($flint__cached-values, ("#{$key, $span, $context, $deduct}::width": $result));
64
66
  }
65
67
 
66
68
  // Return result
@@ -7,6 +7,8 @@
7
7
  * @param {String} $value - key to search for
8
8
  *
9
9
  * @return {Bool}
10
+ *
11
+ * @group Internal Functions
10
12
  */
11
13
  @function flint-exists($map, $value){
12
14
  $is-map: flint-is-map($map);
@@ -7,6 +7,8 @@
7
7
  * @param {Number} $context
8
8
  *
9
9
  * @return {Number}
10
+ *
11
+ * @group Internal Functions
10
12
  */
11
13
  @function flint-fluid-width($target, $context) {
12
14
  @return ($target / $context) * 100%;
@@ -6,6 +6,8 @@
6
6
  * @param {String} $key - breakpoint key
7
7
  *
8
8
  * @return {Number}
9
+ *
10
+ * @group Internal Functions
9
11
  */
10
12
  @function flint-get-index($key) {
11
13
 
@@ -6,7 +6,9 @@
6
6
  * @param {String} $key - breakpoint key to pass to instance method
7
7
  * @param {ArgList} $values - list of keys to fetch value from
8
8
  *
9
- * @return {String | False}
9
+ * @return {*}
10
+ *
11
+ * @group Internal Functions
10
12
  */
11
13
  @function flint-get-instance-value($key, $values...) {
12
14
  @return flint-map-fetch($flint__instances, flint-has-family-instance($key), $values...);
@@ -6,6 +6,8 @@
6
6
  * @param {ArgList} $keys - list of keys to fetch value from
7
7
  *
8
8
  * @return {*}
9
+ *
10
+ * @group Internal Functions
9
11
  */
10
12
  @function flint-get-value($keys...) {
11
13
  @return flint-map-fetch($flint, $keys...);
@@ -6,7 +6,9 @@
6
6
  * @param {String} $key - breakpoint key to search for matching instance
7
7
  * @param {String} $syntax - searches for instance using passed syntax parser
8
8
  *
9
- * @return {String | False} instance selector
9
+ * @return {String} instance selector
10
+ *
11
+ * @group Internal Functions
10
12
  */
11
13
  @function flint-has-family-instance($key: flint-get-value("settings", "default"), $syntax: $flint__support-syntax) {
12
14
  $selector: nth(&, 1);
@@ -12,6 +12,8 @@
12
12
  * @param {Number} $output-margin-left - computed left margin of instance
13
13
  *
14
14
  * @return {Map} merged instance map
15
+ *
16
+ * @group Internal Functions
15
17
  */
16
18
  @function flint-instance($key, $span, $context, $gutter, $output-width, $output-margin-right, $output-margin-left) {
17
19
 
@@ -6,6 +6,8 @@
6
6
  * @param {List} $list
7
7
  *
8
8
  * @return {List}
9
+ *
10
+ * @group Internal Functions
9
11
  */
10
12
  @function flint-last($list) {
11
13
  @return nth($list, length($list));
@@ -10,6 +10,8 @@
10
10
  * @param {Bool} $is-nested
11
11
  *
12
12
  * @return {String}
13
+ *
14
+ * @group Internal Functions
13
15
  */
14
16
  @function flint-list-to-string($list, $glue: "", $is-nested: false) {
15
17
  $result: null;
@@ -6,7 +6,9 @@
6
6
  * @param {Map} $map - map to fetch value from
7
7
  * @param {ArgList} $keys - list of keys to traverse
8
8
  *
9
- * @return {String | False}
9
+ * @return {*}
10
+ *
11
+ * @group Internal Functions
10
12
  */
11
13
  @function flint-map-fetch($map, $keys...) {
12
14
 
@@ -5,7 +5,9 @@
5
5
  *
6
6
  * @param {Number} $index - index of breakpoint
7
7
  *
8
- * @return {String | False}
8
+ * @return {String}
9
+ *
10
+ * @group Internal Functions
9
11
  */
10
12
  @function flint-next-index($index) {
11
13
  @return if(flint-is-number($index) and $index != 0, flint-steal-key($index + 1), false);
@@ -8,6 +8,8 @@
8
8
  * @param {List} $list
9
9
  *
10
10
  * @return {List}
11
+ *
12
+ * @group Internal Functions
11
13
  */
12
14
  @function flint-purge($list) {
13
15
  $result: ();
@@ -10,6 +10,8 @@
10
10
  * @param {Bool} $recursive
11
11
  *
12
12
  * @return {List}
13
+ *
14
+ * @group Internal Functions
13
15
  */
14
16
  @function flint-remove($list, $value) {
15
17
  @return flint-replace($list, $value, null);
@@ -8,6 +8,8 @@
8
8
  * @param {String} $new-substring (" ") - new string to replace sub with
9
9
  *
10
10
  * @return {String}
11
+ *
12
+ * @group Internal Functions
11
13
  */
12
14
  @function flint-replace-substring($string, $substring, $new-substring: " ") {
13
15
 
@@ -10,6 +10,8 @@
10
10
  * @param {*} $value
11
11
  *
12
12
  * @return {List}
13
+ *
14
+ * @group Internal Functions
13
15
  */
14
16
  @function flint-replace($list, $old, $value) {
15
17
  $running: true;
@@ -5,7 +5,9 @@
5
5
  *
6
6
  * @param {Number} $index - index of key
7
7
  *
8
- * @return {String | False}
8
+ * @return {String}
9
+ *
10
+ * @group Internal Functions
9
11
  */
10
12
  @function flint-steal-key($index) {
11
13
  $length: length(map-keys(flint-get-value("breakpoints")));
@@ -6,7 +6,9 @@
6
6
  * @param {Number} $index - index of key
7
7
  * @param {String} $value - value to get from breakpoint
8
8
  *
9
- * @return {String | False}
9
+ * @return {String}
10
+ *
11
+ * @group Internal Functions
10
12
  */
11
13
  @function flint-steal-values($index, $value) {
12
14
  @return if(flint-is-number($index), flint-get-value("breakpoints", flint-steal-key($index), $value), false);
@@ -7,7 +7,9 @@
7
7
  * @param {String} $find (" ") - item to find which separates substrings
8
8
  * @param {String} $ignore (",") - removes remaining string beyond item
9
9
  *
10
- * @return {List | False}
10
+ * @return {List}
11
+ *
12
+ * @group Internal Functions
11
13
  */
12
14
  @function flint-string-to-list($string, $find: " ", $ignore: ",") {
13
15
  @if flint-is-string($string) {
@@ -6,6 +6,8 @@
6
6
  * @param {List} $selectors - string of selectors to parse
7
7
  *
8
8
  * @return {List} - parsed list of selectors according to syntax
9
+ *
10
+ * @group Internal Functions
9
11
  */
10
12
  @function flint-support-syntax-bem($selectors) {
11
13
  // Clean up selector, remove double underscores for spaces
@@ -7,6 +7,8 @@
7
7
  * @param {List} $selectors - string of selectors to parse
8
8
  *
9
9
  * @return {List} - list of parsed selectors according to syntax
10
+ *
11
+ * @group Internal Functions
10
12
  */
11
13
  @function flint-support-syntax($syntax, $selectors) {
12
14
  $syntax: to-lower-case($syntax);
@@ -4,10 +4,12 @@
4
4
  * @access private
5
5
  *
6
6
  * @param {List} $list - list of items
7
- * @param {String | List} $assert-types (null) - single or list of types to assert
8
- * @param {Number} $assert-length (null) - assert length of list
7
+ * @param {String|List} $assert-types (null) - single or list of types to assert
8
+ * @param {Number} $assert-length (null) - assert length of list
9
9
  *
10
10
  * @return {Bool}
11
+ *
12
+ * @group Internal Functions
11
13
  */
12
14
  @function flint-types-in-list($list, $assert-types: null, $assert-length: null) {
13
15
  @if flint-is-list($list) {
@@ -6,6 +6,8 @@
6
6
  * @param {List} $selectors - string of selectors to parse
7
7
  *
8
8
  * @return {List} - parsed list of selectors
9
+ *
10
+ * @group Internal Functions
9
11
  */
10
12
  @function flint-use-syntax($selectors) {
11
13
  @if $flint__support-syntax {
@@ -1,3 +1,7 @@
1
+ /**
2
+ * @group Internal Variables
3
+ **/
4
+
1
5
  /**
2
6
  * Use development mode to silence fatal errors
3
7
  *
@@ -5,7 +5,9 @@
5
5
  *
6
6
  * @param {String} $type ("border-box") - border-box type
7
7
  *
8
- * @requires local box-sizing mixin if available
8
+ * @requires {Mixin} box-sizing - local mixin if available
9
+ *
10
+ * @group Internal Mixins
9
11
  */
10
12
  @mixin flint-box-sizing($type: "border-box") {
11
13
  @if mixin-exists("box-sizing") {
@@ -1,3 +1,7 @@
1
+ /**
2
+ * @group Internal Mixins
3
+ **/
4
+
1
5
  /**
2
6
  * Outputs calculated styles
3
7
  *
@@ -33,11 +37,11 @@
33
37
  *
34
38
  * @access private
35
39
  *
36
- * @param {String} $calc-key - breakpoint key
37
- * @param {Number} $calc-span - span value
38
- * @param {Number} $calc-context - context value
39
- * @param {String} $calc-gutter - gutter modifier
40
- * @param {Number | Null} $i - index if variable length is > 1
40
+ * @param {String} $calc-key - breakpoint key
41
+ * @param {Number} $calc-span - span value
42
+ * @param {Number} $calc-context - context value
43
+ * @param {String} $calc-gutter - gutter modifier
44
+ * @param {Number|Null} $i - index if variable length is > 1
41
45
  */
42
46
  @mixin flint-calculate($key, $span, $context, $gutter, $i: null) {
43
47
 
@@ -5,7 +5,7 @@
5
5
  *
6
6
  * @link http://nicolasgallagher.com/micro-clearfix-hack/
7
7
  *
8
- * @requires local clearfix mixin if available
8
+ * @requires {Mixin} clearfix - local mixin if available
9
9
  */
10
10
  @mixin flint-clearfix {
11
11
  @if mixin-exists("clearfix") {
@@ -5,6 +5,8 @@
5
5
  *
6
6
  * @param {String} $key (null) - alias of individual breakpoint
7
7
  * @param {Number} $i (null) - index number if called from loop
8
+ *
9
+ * @group Internal Mixins
8
10
  */
9
11
  @mixin flint-container($key: null, $i: null) {
10
12
 
@@ -1,23 +1,284 @@
1
1
  /**
2
- * Main API
2
+ * # Main API
3
3
  *
4
- * @access public
4
+ * ----
5
5
  *
6
- * @param {String | Number | List} $key - key of breakpoint or shorthand span
7
- * @param {String | Number | List} $span - value of span of column or shorthand context
8
- * @param {String | Number | List} $context - context value of span
9
- * @param {String | List} $gutter - alias for gutter modifier
6
+ * ## Shorthand
10
7
  *
11
- * @throws error if list lengths do not match number of breakpoints
8
+ * ### Recursive span
9
+ * Use this if you want identical column spans across all breakpoints. This is of course
10
+ * relative to each of your breakpoint's column count, so if your lowest breakpoint has
11
+ * a column count of `4`, then anything above that would likely cause layout issues
12
+ * for that breakpoint.
12
13
  *
13
- * @example scss - Clearfix
14
- * _(clear)
14
+ * \@include _(2);
15
15
  *
16
- * @example scss - Foundation
17
- * _(foundation)
16
+ * ### Recursive Span With Identical Context
17
+ * Use this if your nested context is identical across all breakpoints. The `$context` should
18
+ * be the span value of the element's parent, or `auto`.
18
19
  *
19
- * @example scss - Container
20
- * _(container)
20
+ * \@include _(4, 2);
21
+ *
22
+ * ### Recursive Span With Differing Context
23
+ * Use this if your nested context is not identical across all breakpoints. The `$context`
24
+ * should be the span value of the element's parent, or `auto`.
25
+ *
26
+ * \@include _(4, 8 8 4 4);
27
+ *
28
+ * ### Variable Span
29
+ * Use this if your content needs different spans across each breakpoint. The order of
30
+ * operations is the order that your breakpoints are listed in your config (DESC).
31
+ *
32
+ * \@include _(8 8 4 4);
33
+ *
34
+ * ### Variable Span With Identical Context
35
+ * Use this if your nested context is identical across all breakpoints. The `$context`
36
+ * should be the span value of the element's parent, or `auto`.
37
+ *
38
+ * \@include _(4 4 2 2, 4);
39
+ *
40
+ * ### Variable Span With Differing Context
41
+ * Use this if your nested context is not identical across all breakpoints. The `$context`
42
+ * should be the span value of the element's parent, or `auto`.
43
+ *
44
+ * \@include _(8 8 4 4, 8 8 4 4);
45
+ *
46
+ * ----
47
+ *
48
+ * ## Longhand
49
+ *
50
+ * ### Span
51
+ * Use if you want to define each span by breakpoint `$alias`.
52
+ *
53
+ * \@include _(desktop, 2);
54
+ *
55
+ * ### Span With Context
56
+ * Use if you want to define each span by breakpoint `$alias`. The `$context` should be the span
57
+ * value of the element's parent, or `auto`.
58
+ *
59
+ * \@include _(desktop, 4, 2);
60
+ *
61
+ * ----
62
+ *
63
+ * ## Automatic Context
64
+ *
65
+ * You can use `$context: auto`, and Flint will calculate based on the closest parent element's
66
+ * width instead of the current breakpoint. When using `auto`, Flint falls back from the topmost
67
+ * selector until one is found that has an instance, and it will calculate its span based on that
68
+ * instance's width for the current breakpoint. Think of the `auto` option as a self-correcting grid.
69
+ *
70
+ * When utilizing the `$context` argument, be sure to note the differences in the way the calculations
71
+ * happen depending on if you use a numerical value or `auto`. When using a numerical value, the span
72
+ * is calculated against the current breakpoint's value (example: `80em`), then is divided by it's column
73
+ * count (example: `16`), and then finally multiplied by the current breakpoints passed `$context` value.
74
+ * When using `auto`, the span is _always_ calculated against the closest parent element's width instead
75
+ * of the current breakpoint's width.
76
+ *
77
+ * The difference in output varies, but your gutters will be more accurate across the board if you
78
+ * consistently use the `auto` option. This option allows you to infinitely nest elements on both fixed
79
+ * and fluid grids without dealing with the inconsistencies that can be caused by nesting elements that
80
+ * all use a gutter value of their own. Because the parent element's actual width is always used, the
81
+ * gutters never become out of sync.
82
+ *
83
+ * .parent {
84
+ * \@include _(4);
85
+ * .child {
86
+ * \@include _(3, 4);
87
+ * }
88
+ * }
89
+ * // Auto will work
90
+ * .parent {
91
+ * \@include _(4);
92
+ * .child {
93
+ * \@include _(3, auto);
94
+ * }
95
+ * }
96
+ * // Will also work
97
+ * .parent {
98
+ * \@include _(4);
99
+ * }
100
+ * .parent .child {
101
+ * \@include _(3, auto);
102
+ * }
103
+ * // Will not work, as the child has no relation to
104
+ * // the parent within the stylesheet
105
+ * .parent {
106
+ * \@include _(6);
107
+ * }
108
+ * .child {
109
+ * \@include _(3, auto);
110
+ * }
111
+ *
112
+ * ----
113
+ *
114
+ * ## Modifiers
115
+ *
116
+ * ### Alpha
117
+ * Remove the left `$gutter` from the span. Other aliases for `alpha` include: `no-left` and `first`.
118
+ *
119
+ * div {
120
+ * \@include _(12 8 6 4, $gutter: alpha);
121
+ * }
122
+ *
123
+ * ### Omega
124
+ * Remove the right `$gutter` from the span. Other aliases for `omega` include: `no-right` and `last`.
125
+ *
126
+ * div {
127
+ * \@include _(2, $gutter: omega);
128
+ * }
129
+ *
130
+ * ### Row
131
+ * Remove both of the `$gutter` values from the span. Other aliases for `row` include: `none`.
132
+ *
133
+ * div {
134
+ * \@include _(4, $gutter: row);
135
+ * }
136
+ *
137
+ * ### Center
138
+ * Center the current span within it's container element. Outputs auto left and right margins.
139
+ * This modifier will also remove any float properties on the element.
140
+ *
141
+ * div {
142
+ * \@include _(4, $gutter: center);
143
+ * }
144
+ *
145
+ * ### Inside
146
+ * Sets both `$gutter` values on the inside of the element. Instead of deducting `$gutter*2` out
147
+ * of the final width, it will deduct `$gutter*4`. Useful for nesting elements inside of other
148
+ * elements without using `$context: auto`.
149
+ *
150
+ * div {
151
+ * \@include _(16 12 8 4, $gutter: inside);
152
+ * }
153
+ *
154
+ * ### Default
155
+ * Argument to use the default left/right `$gutter` values. Useful for when you want to use a
156
+ * variable `$gutter` argument. Other aliases for `default` include: `normal` and `regular`.
157
+ *
158
+ * div {
159
+ * \@include _(4, $gutter: default);
160
+ * }
161
+ *
162
+ * ### Variable Modifiers
163
+ * Instead of passing in a recursive `$gutter` value, you may specify a value for each breakpoint exactly
164
+ * like you would a `$span` argument.
165
+ *
166
+ * div {
167
+ * \@include _(10 8 6 4, $gutter: alpha omega omega default);
168
+ * }
169
+ *
170
+ * ----
171
+ *
172
+ * ## Queries
173
+ *
174
+ * ### By Alias
175
+ * Use this type of query to wrap the `@content` in a single query for the specified breakpoint.
176
+ *
177
+ * div {
178
+ * \@include _(desktop) {
179
+ * property: value;
180
+ * }
181
+ * }
182
+ *
183
+ * ### From, To
184
+ * Use this type of query to wrap the `@content` in a single query between 2 breakpoints. Make
185
+ * sure to pass in the breakpoints from lowest to highest.
186
+ *
187
+ * div {
188
+ * \@include _(from tablet to laptop) {
189
+ * property: value;
190
+ * }
191
+ * }
192
+ *
193
+ * ### Greater Than
194
+ * Use this type of query to wrap the `@content` in a single query for anything above
195
+ * the passed breakpoint.
196
+ *
197
+ * div {
198
+ * \@include _(greater than laptop) {
199
+ * property: value;
200
+ * }
201
+ * \@include _(5em greater than tablet) {
202
+ * property: value;
203
+ * }
204
+ * \@include _(greater than 55em) {
205
+ * property: value;
206
+ * }
207
+ * }
208
+ *
209
+ * ### Less Than
210
+ * Use this type of query to wrap the `@content` in a single query for anything below
211
+ * the passed breakpoint.
212
+ *
213
+ * div {
214
+ * \@include _(less than laptop) {
215
+ * property: value;
216
+ * }
217
+ * \@include _(5em less than tablet) {
218
+ * property: value;
219
+ * }
220
+ * \@include _(less than 8em) {
221
+ * property: value;
222
+ * }
223
+ * }
224
+ *
225
+ * ### For
226
+ * Use this type of query to wrap the `@content` in a single comma delimited query
227
+ * for each passed `$alias`.
228
+ *
229
+ * div {
230
+ * \@include _(for mobile tablet desktop) {
231
+ * property: value;
232
+ * }
233
+ * }
234
+ *
235
+ * ----
236
+ *
237
+ * ## Miscellaneous
238
+ *
239
+ * ### Clearfix
240
+ * Given that Flint is float based, you might find yourself needing to use a clearfix. Flint comes
241
+ * packaged with a micro-clearfix function. _Flint will attempt to use a local mixin named
242
+ * `clearfix`. If one is not found, it will use it's own._
243
+ *
244
+ * div {
245
+ * \@include _(clear);
246
+ * }
247
+ *
248
+ * ### Foundation
249
+ * A foundation instance will output a global box-sizing: border-box declaration. If you selected
250
+ * `"border-box-sizing": true`, then it is advised to create a global foundation instance. If you
251
+ * don't, Flint will automatically apply a foundation instance with your first span declaration.
252
+ * This should be placed at the root of your stylesheet. _Flint will attempt to use a local
253
+ * mixin named `box-sizing`. If one is not found, it will use it's own._
254
+ *
255
+ * \@include _(foundation);
256
+ *
257
+ * ### Container
258
+ * Containers act as a containing row for each individual breakpoint. It uses the `"max-width"`
259
+ * setting, if set. They do not float, so if you have `"center-container"` set, then it
260
+ * will also center your element using auto left and right margins. You may combine
261
+ * container and clear declarations, with arguments separated by a comma.
262
+ *
263
+ *
264
+ * div {
265
+ * \@include _(container);
266
+ * }
267
+ *
268
+ * ----
269
+ *
270
+ * @access public
271
+ *
272
+ * @param {String|Number|List} $key (null) - key of breakpoint, or shorthand span
273
+ * @param {String|Number|List} $span (null) - value of span for column, or shorthand context
274
+ * @param {String|Number} $context (null) - context value of span, or null for shorthand
275
+ * @param {String|List} $gutter (null) - alias for gutter modifier
276
+ *
277
+ * @content all content passed will be placed _underneath_ output so that it takes precedence.
278
+ *
279
+ * @throws error if list lengths do not match number of breakpoints (when using variable shorthands).
280
+ *
281
+ * ----
21
282
  *
22
283
  * @example scss - Recursive shorthand with no context
23
284
  * _(2)
@@ -48,40 +309,53 @@
48
309
  * _(desktop, 2, auto)
49
310
  *
50
311
  * @example scss - Call $key breakpoint by alias
51
- * _($key)
312
+ * _(desktop) { ... }
52
313
  *
53
314
  * @example scss - From $key breakpoint to infinity
54
- * _(from $key to infinity)
315
+ * _(from laptop to infinity) { ... }
55
316
  *
56
317
  * @example scss - From $key-x breakpoint to $key-y breakpoint
57
- * _(from $key-x to $key-y)
318
+ * _(from tablet to laptop) { ... }
58
319
  *
59
320
  * @example scss - From $num-x to $num-y
60
- * _(from $num-x to $num-y)
321
+ * _(from 20em to laptop) { ... }
61
322
  *
62
323
  * @example scss - Greater than $key breakpoint
63
- * _(greater than $key)
324
+ * _(greater than tablet) { ... }
64
325
  *
65
326
  * @example scss - Greater than number
66
- * _(greater than $num)
327
+ * _(greater than 15em) { ... }
67
328
  *
68
329
  * @example scss - Number greater than $key breakpoint
69
- * _($num greater than $key)
330
+ * _(5em greater than mobile) { ... }
70
331
  *
71
332
  * @example scss - Less than $key breakpoint
72
- * _(less than $key)
333
+ * _(less than laptop) { ... }
73
334
  *
74
335
  * @example scss - Less than number
75
- * _(less than $num)
336
+ * _(less than 35em) { ... }
76
337
  *
77
338
  * @example scss - Number less than $key breakpoint
78
- * _($num less than $key)
339
+ * _(10em less than laptop) { ... }
79
340
  *
80
- * @example scss - For $key-x $key-y $key-z
81
- * _(for $key-x $key-y $key-z)
341
+ * @example scss - For $key-x $key-y $key-z...
342
+ * _(for mobile tablet desktop) { ... }
343
+ *
344
+ * @example scss - Clear
345
+ * _(clear)
346
+ *
347
+ * @example scss - Foundation
348
+ * _(foundation)
349
+ *
350
+ * @example scss - Container
351
+ * _(container)
352
+ *
353
+ * ----
82
354
  *
83
355
  * @author Ezekiel Gabrielse
84
356
  * @link http://flint.gs
357
+ *
358
+ * @group Public API
85
359
  */
86
360
  @mixin _(
87
361
  $key: null,
@@ -145,9 +419,7 @@
145
419
  $flint__foundation: "existent" !global;
146
420
  }
147
421
 
148
- /*
149
- * Foundation is now globally existant
150
- */
422
+ // Foundation is now globally existant
151
423
  @if $flint__foundation == "existent" {
152
424
  @at-root *, *:before, *:after {
153
425
  @include flint-box-sizing;
@@ -165,9 +437,7 @@
165
437
  @include _("foundation");
166
438
  }
167
439
 
168
- /*
169
- * Output container for each breakpoint if fixed grid
170
- */
440
+ // Output container for each breakpoint if fixed grid
171
441
  @if $key == "container" and flint-get-value("settings", "grid") == "fixed" {
172
442
 
173
443
  @for $i from 1 through length($flint__all-keys) {
@@ -206,9 +476,7 @@
206
476
  }
207
477
  }
208
478
 
209
- /*
210
- * Output container for specific breakpoint if exists
211
- */
479
+ // Output container for specific breakpoint if exists
212
480
  } @else if flint-exists($flint, $key) and flint-get-value("settings", "grid") == "fixed" {
213
481
 
214
482
  @if flint-is-highest-breakpoint($key) {
@@ -253,7 +521,7 @@
253
521
  }
254
522
 
255
523
  /*
256
- * Creates a new instance, add to global instance map
524
+ * Create a new instance, add to global instance map
257
525
  */
258
526
  } @else {
259
527
 
@@ -10,6 +10,8 @@
10
10
  * @param {Number} $output-width
11
11
  * @param {Number} $output-margin-right
12
12
  * @param {Number} $output-margin-left
13
+ *
14
+ * @group Internal Mixins
13
15
  */
14
16
  @mixin flint-new-instance($calc-key, $calc-span, $calc-context, $calc-gutter, $output-width, $output-margin-right, $output-margin-left) {
15
17
  $flint__instances:
@@ -1,3 +1,7 @@
1
+ /**
2
+ * @group Internal Mixins
3
+ **/
4
+
1
5
  /**
2
6
  * Prints debug properties
3
7
  *
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: flint-gs
3
3
  version: !ruby/object:Gem::Version
4
- version: 2.0.2
4
+ version: 2.0.3
5
5
  platform: ruby
6
6
  authors:
7
7
  - Ezekiel Gabrielse
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2014-10-01 00:00:00.000000000 Z
11
+ date: 2014-10-02 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: sass