flint-gs 1.12.0 → 2.0.0.rc.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (42) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +71 -207
  3. data/lib/flint.rb +8 -8
  4. data/stylesheets/_flint.scss +3 -2
  5. data/stylesheets/flint/config/_config.scss +37 -68
  6. data/stylesheets/flint/functions/_functions.scss +15 -7
  7. data/stylesheets/flint/functions/helpers/_helpers.scss +115 -117
  8. data/stylesheets/flint/functions/lib/_calc-breakpoint.scss +23 -32
  9. data/stylesheets/flint/functions/lib/_calc-width.scss +40 -26
  10. data/stylesheets/flint/functions/lib/_exists.scss +8 -7
  11. data/stylesheets/flint/functions/lib/_fluid-width.scss +8 -7
  12. data/stylesheets/flint/functions/lib/_get-index.scss +12 -10
  13. data/stylesheets/flint/functions/lib/_get-instance-value.scss +10 -16
  14. data/stylesheets/flint/functions/lib/_get-value.scss +9 -13
  15. data/stylesheets/flint/functions/lib/_has-family-instance.scss +21 -20
  16. data/stylesheets/flint/functions/lib/_instance.scss +19 -22
  17. data/stylesheets/flint/functions/lib/_last.scss +7 -6
  18. data/stylesheets/flint/functions/lib/_list-to-string.scss +11 -9
  19. data/stylesheets/flint/functions/lib/_map-fetch.scss +13 -19
  20. data/stylesheets/flint/functions/lib/_next-index.scss +9 -14
  21. data/stylesheets/flint/functions/lib/_purge.scss +9 -8
  22. data/stylesheets/flint/functions/lib/_remove.scss +11 -10
  23. data/stylesheets/flint/functions/lib/_replace-substring.scss +9 -8
  24. data/stylesheets/flint/functions/lib/_replace.scss +11 -10
  25. data/stylesheets/flint/functions/lib/_steal-key.scss +24 -13
  26. data/stylesheets/flint/functions/lib/_steal-values.scss +9 -12
  27. data/stylesheets/flint/functions/lib/_string-to-list.scss +11 -10
  28. data/stylesheets/flint/functions/lib/_support-syntax-bem.scss +10 -9
  29. data/stylesheets/flint/functions/lib/_support-syntax.scss +14 -12
  30. data/stylesheets/flint/functions/lib/_types-in-list.scss +9 -8
  31. data/stylesheets/flint/functions/lib/_use-syntax.scss +12 -8
  32. data/stylesheets/flint/globals/_globals.scss +35 -21
  33. data/stylesheets/flint/mixins/_mixins.scss +3 -2
  34. data/stylesheets/flint/mixins/lib/_box-sizing.scss +7 -7
  35. data/stylesheets/flint/mixins/lib/_calculate.scss +112 -583
  36. data/stylesheets/flint/mixins/lib/_clearfix.scss +7 -7
  37. data/stylesheets/flint/mixins/lib/_container.scss +6 -12
  38. data/stylesheets/flint/mixins/lib/_main.scss +271 -202
  39. data/stylesheets/flint/mixins/lib/_new-instance.scss +12 -15
  40. data/stylesheets/flint/mixins/lib/_print-instance.scss +16 -20
  41. metadata +3 -4
  42. data/stylesheets/flint/functions/lib/_calc-margin.scss +0 -57
@@ -1,10 +1,11 @@
1
- // Check if key exists in map
2
- //--------------------------------------------------------------------------------
3
- // @param $map [map] : map that contains $value
4
- // @param $value [string] : key to search for
5
- // -------------------------------------------------------------------------------
6
- // @return [bool]
7
-
1
+ /**
2
+ * Check if key exists in map
3
+ *
4
+ * @param {Map} $map - map to search
5
+ * @param {Strong} $value - key to search for
6
+ *
7
+ * @return {Bool}
8
+ */
8
9
  @function flint-exists($map, $value){
9
10
  $is-map: flint-is-map($map);
10
11
  $top-has-key: $is-map and map-has-key($map, $value) or false;
@@ -1,10 +1,11 @@
1
- // Convert fixed to fluid width
2
- //--------------------------------------------------------------------------------
3
- // @param $target [number] : target
4
- // @param $context [number] : context
5
- // -------------------------------------------------------------------------------
6
- // @return [number]
7
-
1
+ /**
2
+ * Convert fixed to fluid width
3
+ *
4
+ * @param {Number} $target
5
+ * @param {Number} $context
6
+ *
7
+ * @return {Number}
8
+ */
8
9
  @function flint-fluid-width($target, $context) {
9
10
  @return ($target / $context) * 100%;
10
11
  }
@@ -1,14 +1,16 @@
1
- // Gets the index of the passed key
2
- // -------------------------------------------------------------------------------
3
- // @param $key [string] : breakpoint key
4
- // -------------------------------------------------------------------------------
5
- // @return [number]
6
-
1
+ /**
2
+ * Gets the index of the passed key
3
+ *
4
+ * @param {String} $key - breakpoint key
5
+ *
6
+ * @return {Number}
7
+ */
7
8
  @function flint-get-index($key) {
8
- @for $i from 1 through (length(flint-map-fetch($flint, "config")) - 1) {
9
- @if flint-steal-key($i) == $key {
10
- @return $i;
11
- }
9
+
10
+ @for $i from 1 through length(map-keys(flint-get-value("breakpoints"))) {
11
+ @if flint-steal-key($i) == $key {
12
+ @return $i;
13
+ }
12
14
  }
13
15
 
14
16
  @return false;
@@ -1,17 +1,11 @@
1
- // Get single value from key in instance map based on $selector::$key
2
- // -------------------------------------------------------------------------------
3
- // @warning : all values returned are strings and must be converted with `flint-to-number()`
4
- // -------------------------------------------------------------------------------
5
- // @param $key [string] : key
6
- // @param $value [number] : value
7
- // @param $deep [number] : fetch deep value
8
- // -------------------------------------------------------------------------------
9
- // @return fetched literal | false
10
-
11
- @function flint-get-instance-value($key, $value, $deep: null) {
12
- @if not $deep {
13
- @return flint-map-fetch($flint__instances, flint-has-family-instance($key) $value);
14
- } @else {
15
- @return flint-map-fetch($flint__instances, flint-has-family-instance($key) $value $deep);
16
- }
1
+ /**
2
+ * Get single value from key in instance map based on $selector::$key
3
+ *
4
+ * @param {String} $key - breakpoint key to pass to instance method
5
+ * @param {ArgList} $values - list of keys to fetch value from
6
+ *
7
+ * @return {String | False}
8
+ */
9
+ @function flint-get-instance-value($key, $values...) {
10
+ @return flint-map-fetch($flint__instances, flint-has-family-instance($key), $values...);
17
11
  }
@@ -1,14 +1,10 @@
1
- // Get single value from key in instance map based on $selector::$key
2
- // -------------------------------------------------------------------------------
3
- // @param $key [string] : breakpoint key
4
- // @param $value [string] : key of value
5
- // -------------------------------------------------------------------------------
6
- // @return [literal]
7
-
8
- @function flint-get-value($key, $value: null) {
9
- @if not $value {
10
- @return flint-map-fetch($flint, "config" $key);
11
- } @else {
12
- @return flint-map-fetch($flint, "config" $key $value);
13
- }
1
+ /**
2
+ * Get single value from configuration map
3
+ *
4
+ * @param {ArgList} $keys - list of keys to fetch value from
5
+ *
6
+ * @return {*}
7
+ */
8
+ @function flint-get-value($keys...) {
9
+ @return flint-map-fetch($flint, $keys...);
14
10
  }
@@ -1,17 +1,18 @@
1
- // Checks if instance flint-exists in selector familiy tree, falls back from current selector
2
- // -------------------------------------------------------------------------------
3
- // @param $key [string] : breakpoint key to search for matching instance
4
- // @param $syntax [string | null] : searches for instance using passed syntax
5
- // -------------------------------------------------------------------------------
6
- // @return matching instance | false
7
-
1
+ /**
2
+ * Checks if instance flint-exists in selector familiy tree, falls back from current selector
3
+ *
4
+ * @param {String} $key - breakpoint key to search for matching instance
5
+ * @param {String} $syntax - searches for instance using passed syntax parser
6
+ *
7
+ * @return {String | False} instance selector
8
+ */
8
9
  @function flint-has-family-instance($key: flint-get-value("settings", "default"), $syntax: $flint__support-syntax) {
9
- $selector-string: selector_string();
10
+ $selector: nth(&, 1);
10
11
 
11
12
  // Check if instance result had been cached
12
- @if map-has-key($flint__cached-instances, "#{$selector-string}") {
13
+ @if map-has-key($flint__cached-instances, "#{$selector}") {
13
14
  // Get cached instance
14
- $cached-instance: map-get($flint__cached-instances, "#{$selector-string}");
15
+ $cached-instance: map-get($flint__cached-instances, "#{$selector}");
15
16
  // Return with current key
16
17
  @return "#{$cached-instance}::#{$key}";
17
18
  }
@@ -19,25 +20,25 @@
19
20
  // Check for syntax support, try to find instance using it
20
21
  @if $syntax {
21
22
 
22
- $selector-list: flint-use-syntax($selector-string);
23
- $length: length($selector-list);
23
+ $parsed-selector: flint-use-syntax($selector);
24
+ $length: length($parsed-selector);
24
25
 
25
26
  // Loop through transformed selectors
26
27
  @for $i from 1 through $length {
27
28
 
28
29
  // Check flint-last selector in list
29
- @if flint-exists($flint__instances, "#{flint-last($selector-list)}::#{$key}") {
30
+ @if flint-exists($flint__instances, "#{flint-last($parsed-selector)}::#{$key}") {
30
31
 
31
32
  // Cache result
32
- $flint__cached-instances: map-merge($flint__cached-instances, ("#{$selector-string}": "#{flint-last($selector-list)}"));
33
+ $flint__cached-instances: map-merge($flint__cached-instances, ("#{$selector}": "#{flint-last($parsed-selector)}"));
33
34
 
34
35
  // Return the matching instance key
35
- @return "#{flint-last($selector-list)}::#{$key}";
36
+ @return "#{flint-last($parsed-selector)}::#{$key}";
36
37
 
37
38
  } @else {
38
39
 
39
40
  // Else, flint-remove the flint-last selector and loop again
40
- $selector-list: flint-remove($selector-list, flint-last($selector-list));
41
+ $parsed-selector: flint-remove($parsed-selector, flint-last($parsed-selector));
41
42
 
42
43
  }
43
44
  }
@@ -46,17 +47,17 @@
46
47
  @return flint-has-family-instance($key, null);
47
48
 
48
49
  } @else {
49
- $selector-list: flint-string-to-list($selector-string);
50
+ $selector-list: $selector;
50
51
  $length: length($selector-list);
51
52
 
52
53
  // Loop through length of list of selectors
53
54
  @for $i from 1 through $length {
54
55
 
55
- // Make sure that we're not counting the current selector string
56
- @if flint-exists($flint__instances, "#{flint-list-to-string($selector-list, ' ')}::#{$key}") and $selector-string != flint-list-to-string($selector-list, " ") {
56
+ // Make sure that we're not counting the current selector set
57
+ @if flint-exists($flint__instances, "#{flint-list-to-string($selector-list, ' ')}::#{$key}") and $selector != $selector-list {
57
58
 
58
59
  // Cache result
59
- $flint__cached-instances: map-merge($flint__cached-instances, ("#{$selector-string}": "#{flint-list-to-string($selector-list, ' ')}"));
60
+ $flint__cached-instances: map-merge($flint__cached-instances, ("#{$selector}": "#{flint-list-to-string($selector-list, ' ')}"));
60
61
 
61
62
  // Return the matching instance key
62
63
  @return "#{flint-list-to-string($selector-list, ' ')}::#{$key}";
@@ -1,38 +1,35 @@
1
- // Keeps count of all instances with arguments, stores in global var
2
- // -------------------------------------------------------------------------------
3
- // @param $key [string] : computed breakpoint of instance
4
- // @param $span [number] : computed span of instance
5
- // @param $context [number] : computed context of instance
6
- // @param $gutter [number] : computed gutter of instance
7
- // @param $shift [number] : computed shift of instance
8
- // @param $output-width [number] : computed width of instance
9
- // @param $output-margin-right [number] : computed right margin of instance
10
- // @param $output-margin-left [number] : computed left margin of instance
11
- // -------------------------------------------------------------------------------
12
- // @return instance map
13
-
14
- @function flint-instance($key, $span, $context, $gutter, $shift, $output-width, $output-margin-right, $output-margin-left) {
1
+ /**
2
+ * Keeps count of all instances with arguments, stores in global var
3
+ *
4
+ * @param {String} $key - computed breakpoint of instance
5
+ * @param {Number} $span - computed span of instance
6
+ * @param {Number} $context - computed context of instance
7
+ * @param {Number} $gutter - computed gutter of instance
8
+ * @param {Number} $output-width - computed width of instance
9
+ * @param {Number} $output-margin-right - computed right margin of instance
10
+ * @param {Number} $output-margin-left - computed left margin of instance
11
+ *
12
+ * @return {Map} merged instance map
13
+ */
14
+ @function flint-instance($key, $span, $context, $gutter, $output-width, $output-margin-right, $output-margin-left) {
15
15
 
16
16
  // Increase the instance count
17
17
  $flint__instance-count: $flint__instance-count + 1 !global;
18
18
 
19
19
  // Lets clean up the selector a bit...
20
- $selector-string: selector_string();
21
- $selector-list: flint-string-to-list($selector-string);
22
- $selector-cleaned: flint-list-to-string($selector-list, " ");
20
+ $selector: nth(&, 1);
23
21
 
24
22
  $flint__instance: (
25
- "#{$selector-cleaned}::#{$key}": (
23
+ "#{$selector}::#{$key}": (
26
24
  "instance-count": $flint__instance-count,
27
25
  "parent-selector": if(flint-has-family-instance($key) != false, flint-has-family-instance($key), none),
28
26
  "key": $key,
29
- "breakpoint": flint-get-value($key, "breakpoint"),
30
- "columns": flint-get-value($key, "columns"),
27
+ "breakpoint": flint-get-value("breakpoints", $key, "breakpoint"),
28
+ "columns": flint-get-value("breakpoints", $key, "columns"),
31
29
  "span": $span,
32
30
  "context": if($context == "auto", flint-get-instance-value($key, "span"), $context),
33
31
  "gutter": $gutter,
34
- "shift": $shift,
35
- "output": (
32
+ "internal": (
36
33
  "width": $output-width,
37
34
  "margin-right": $output-margin-right,
38
35
  "margin-left": $output-margin-left
@@ -1,9 +1,10 @@
1
- // Get last item in list
2
- // -------------------------------------------------------------------------------
3
- // @param $list [list] : list
4
- // -------------------------------------------------------------------------------
5
- // @return [list]
6
-
1
+ /**
2
+ * Get last item in list
3
+ *
4
+ * @param {List} $list
5
+ *
6
+ * @return {List}
7
+ */
7
8
  @function flint-last($list) {
8
9
  @return nth($list, length($list));
9
10
  }
@@ -1,12 +1,14 @@
1
- // Joins all elements of $list with $glue
2
- // -------------------------------------------------------------------------------
3
- // @documentation http://sassylists.com/documentation/#to-string
4
- // -------------------------------------------------------------------------------
5
- // @param $list [list] : list
6
- // @param $glue [string] : value to use as a join string
7
- // -------------------------------------------------------------------------------
8
- // @return [string]
9
-
1
+ /**
2
+ * Joins all elements of list with passed glue
3
+ *
4
+ * @link http://sassylists.com/documentation/#to-string
5
+ *
6
+ * @param {List} $list
7
+ * @param {String} $glue
8
+ * @param {Bool} $is-nested
9
+ *
10
+ * @return {String}
11
+ */
10
12
  @function flint-list-to-string($list, $glue: "", $is-nested: false) {
11
13
  $result: null;
12
14
  $length: length($list);
@@ -1,23 +1,17 @@
1
- // Fetch value from key in map
2
- // -------------------------------------------------------------------------------
3
- // @param $map [map] : map to fetch from
4
- // @param $keys [string | list] : string of key, or list of strings
5
- // -------------------------------------------------------------------------------
6
- // @return fetched literal | false
1
+ /**
2
+ * Fetch value from map
3
+ *
4
+ * @param {Map} $map - map to fetch value from
5
+ * @param {ArgList} $keys - list of keys to traverse
6
+ *
7
+ * @return {String | False}
8
+ */
9
+ @function flint-map-fetch($map, $keys...) {
10
+ $result: $map;
7
11
 
8
- @function flint-map-fetch($map, $keys) {
9
- $has-key: flint-is-map($map) and map-has-key($map, nth($keys, 1)) and map-get($map, nth($keys, 1)) or false;
10
- $length: length($keys);
11
-
12
- @if $has-key and $length > 1 {
13
- $remainder: ();
14
-
15
- @for $i from 2 through $length {
16
- $remainder: append($remainder, nth($keys, $i))
17
- }
18
-
19
- @return flint-map-fetch($has-key, $remainder);
12
+ @each $key in $keys {
13
+ $result: flint-is-map($result) and map-has-key($result, $key) and map-get($result, $key) or false;
20
14
  }
21
15
 
22
- @return $has-key;
16
+ @return $result;
23
17
  }
@@ -1,15 +1,10 @@
1
- // Returns next indexed key based on passed index
2
- // -------------------------------------------------------------------------------
3
- // @param $index [number] : index
4
- // -------------------------------------------------------------------------------
5
- // @return [string] | null
6
-
7
- @function flint-next-index($index) {
8
- @if $index != (length(flint-map-fetch($flint, "config")) - 1) {
9
- @each $key in nth(map-get($flint, "config"), $index + 1) {
10
- @return $key;
11
- }
12
- } @else {
13
- @return null;
14
- }
1
+ /**
2
+ * Returns next indexed key based on passed index
3
+ *
4
+ * @param {Number} $index - index of breakpoint
5
+ *
6
+ * @return {String | False}
7
+ */
8
+ @function flint-next-index($index) {
9
+ @return if(flint-is-number($index) and $index != 0, flint-steal-key($index + 1), false);
15
10
  }
@@ -1,11 +1,12 @@
1
- // Removes all false and null values from $list
2
- // -------------------------------------------------------------------------------
3
- // @documentation http://sassylists.com/documentation.html#purge
4
- // -------------------------------------------------------------------------------
5
- // @param $list [list] : list
6
- // -------------------------------------------------------------------------------
7
- // @return [list]
8
-
1
+ /**
2
+ * Removes all false and null values from $list
3
+ *
4
+ * @link http://sassylists.com/documentation.html#purge
5
+ *
6
+ * @param {List} $list
7
+ *
8
+ * @return {List}
9
+ */
9
10
  @function flint-purge($list) {
10
11
  $result: ();
11
12
 
@@ -1,13 +1,14 @@
1
- // Remove $value from $list
2
- // -------------------------------------------------------------------------------
3
- // @documentation http://sassylists.com/documentation/#remove
4
- // -------------------------------------------------------------------------------
5
- // @param $list [list] : list
6
- // @param $value [literal] : value to flint-remove
7
- // @param $recursive [bool] : enable / disable recursivity
8
- // -------------------------------------------------------------------------------
9
- // @return [list]
10
-
1
+ /**
2
+ * Remove value from list
3
+ *
4
+ * @link http://sassylists.com/documentation/#remove
5
+ *
6
+ * @param {List} $list
7
+ * @param {*} $value
8
+ * @param {Bool} $recursive
9
+ *
10
+ * @return {List}
11
+ */
11
12
  @function flint-remove($list, $value) {
12
13
  @return flint-replace($list, $value, null);
13
14
  }
@@ -1,11 +1,12 @@
1
- // Replace substring
2
- // -------------------------------------------------------------------------------
3
- // @param $string [string] : string that contains substring
4
- // @param $substring [string] : substring to replace
5
- // @param $new-substring [string] : new string to replace sub with
6
- // -------------------------------------------------------------------------------
7
- // @return [string]
8
-
1
+ /**
2
+ * Replace substring
3
+ *
4
+ * @param {String} $string - string that contains substring
5
+ * @param {String} $substring - substring to replace
6
+ * @param {String} $new-substring (" ") - new string to replace sub with
7
+ *
8
+ * @return {String}
9
+ */
9
10
  @function flint-replace-substring($string, $substring, $new-substring: " ") {
10
11
 
11
12
  // Use Ruby function if available
@@ -1,13 +1,14 @@
1
- // Replaces $old by $new in $list
2
- // -------------------------------------------------------------------------------
3
- // @documentation http://sassylists.com/documentation.html#replace
4
- // -------------------------------------------------------------------------------
5
- // @param $list [list] : list
6
- // @param $old [literal] : value to replace
7
- // @param $value [literal] : new value for $old
8
- // -------------------------------------------------------------------------------
9
- // @return [list]
10
-
1
+ /**
2
+ * Replaces old by new in $list
3
+ *
4
+ * @link http://sassylists.com/documentation.html#replace
5
+ *
6
+ * @param {List} $list
7
+ * @param {*} $old
8
+ * @param {*} $value
9
+ *
10
+ * @return {List}
11
+ */
11
12
  @function flint-replace($list, $old, $value) {
12
13
  $running: true;
13
14