singularitygs 1.1.2 → 1.2.0.rc.1

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 (31) hide show
  1. checksums.yaml +7 -7
  2. data/lib/singularitygs.rb +2 -2
  3. data/stylesheets/_singularitygs.scss +13 -26
  4. data/stylesheets/singularitygs/_api.scss +89 -29
  5. data/stylesheets/singularitygs/_helpers.scss +6 -2
  6. data/stylesheets/singularitygs/api/_float.scss +87 -147
  7. data/stylesheets/singularitygs/api/_isolation.scss +81 -133
  8. data/stylesheets/singularitygs/grids/_add.scss +34 -16
  9. data/stylesheets/singularitygs/grids/_find.scss +6 -8
  10. data/stylesheets/singularitygs/gutter-styles/_add.scss +39 -16
  11. data/stylesheets/singularitygs/gutter-styles/_find.scss +10 -5
  12. data/stylesheets/singularitygs/gutter-styles/_helpers.scss +6 -10
  13. data/stylesheets/singularitygs/gutters/_add.scss +37 -14
  14. data/stylesheets/singularitygs/gutters/_find.scss +9 -5
  15. data/stylesheets/singularitygs/helpers/_background-grid.scss +155 -181
  16. data/stylesheets/singularitygs/helpers/_box-sizing.scss +17 -32
  17. data/stylesheets/singularitygs/helpers/_clearfix.scss +10 -95
  18. data/stylesheets/singularitygs/helpers/_columns.scss +4 -3
  19. data/stylesheets/singularitygs/helpers/_directions.scss +6 -0
  20. data/stylesheets/singularitygs/helpers/_find.scss +112 -64
  21. data/stylesheets/singularitygs/helpers/_layout.scss +39 -10
  22. data/stylesheets/singularitygs/helpers/_sass-lists.scss +1 -1
  23. data/stylesheets/singularitygs/helpers/_settings.scss +98 -0
  24. data/stylesheets/singularitygs/helpers/_sort.scss +56 -0
  25. data/stylesheets/singularitygs/helpers/_span-shared.scss +20 -2
  26. data/stylesheets/singularitygs/language/_parse-add.scss +52 -8
  27. data/stylesheets/singularitygs/language/_parse-list.scss +3 -3
  28. data/stylesheets/singularitygs/math/_columns.scss +5 -4
  29. data/stylesheets/singularitygs/math/_context.scss +1 -1
  30. data/stylesheets/singularitygs/math/_gutters.scss +2 -1
  31. metadata +63 -54
@@ -1,89 +1,137 @@
1
+ //////////////////////////////
2
+ // Find Object Keys
3
+ //
4
+ // Returns
5
+ //////////////////////////////
6
+ @function find-object-keys($haystack) {
7
+ $Keys: map-keys($haystack);
8
+ $List: ();
9
+ @each $Key in $Keys {
10
+ @if $Key != -1px {
11
+ @if unit($Key) == 'em' {
12
+ $Key: $Key / 1em * 16px;
13
+ }
14
+ $List: append($List, $Key);
15
+ }
16
+ }
17
+ @return quicksort($List);
18
+ }
19
+
1
20
  //////////////////////////////
2
21
  // Find Object
3
22
  //
4
23
  // Finds relevant object
5
24
  // Must be using Breakpoint to work properly
6
25
  //////////////////////////////
7
- @function find-object($haystack, $user-object: false) {
8
- $length: length($haystack);
9
-
10
- @if $user-object != false {
26
+ @function find-object($haystack, $user-object: null) {
27
+ // If a user object has been passed in, bypass the whole function and just return that object.
28
+ @if $user-object != null and $user-object != false {
11
29
  @return $user-object;
12
30
  }
13
- @else if $length > 1 {
14
- //////////////////////////////
15
- // @TODO! REplace with Native Sass Fucntion when vailable!
16
- // https://github.com/nex3/sass/pull/689
17
- //////////////////////////////
18
- @if (is-breakpoint-list($haystack) != false) {
19
- $query-min: breakpoint-get-context('min-width');
20
- $query-max: breakpoint-get-context('max-width');
21
31
 
22
- // If we've got a min-width or max-width
23
- @if $query-min or $query-max {
24
- // Reverse the grid so we can step through it
25
- $reverse-haystack: ();
26
- @for $i from 2 through $length {
27
- $reverse-haystack: append($reverse-haystack, nth($haystack, $i), comma);
28
- }
29
- $reverse-haystack: reverse($reverse-haystack);
30
- $rg-length: $length - 1;
32
+ $Deprecate-Warning: singularity-deprecation-warning();
33
+ $Length: length($haystack);
34
+ $Mobile-First: sgs-get('mobile first');
31
35
 
32
- // Grab the largest and smallest MQs
33
- $smallest: nth(nth($haystack, 2), 2);
34
- $largest: nth(nth($reverse-haystack, 1), 2);
35
- $context: $query-min;
36
+ // Haystack must be map
37
+ @if type-of($haystack) != 'map' {
38
+ @warn "DEPRECATION: In order to remove global variable naming conflicts, Singularity's settings have been moved into the single `$singularity` variable. Please refer to our documentation (https://github.com/Team-Sass/Singularity/wiki) on how to update your settings. In the next version of Singularity, this warning will be removed. #{nth($haystack, 1)} has been returned.";
39
+ @return nth($haystack, 1);
40
+ }
36
41
 
37
- @if not ($mobile-first) {
38
- $context: $query-max;
42
+ // Grab Breakpoint Context
43
+ @if not function-exists(breakpoint-get-context) {
44
+ @warn "Responsive contexts require Breakpoint (https://github.com/Team-Sass/breakpoint). Please ensure that Breakpoint is imported and available for Singularity to use. First item used.";
45
+ @return map-get($haystack, -1px);
46
+ }
47
+ // Get Breakpoint Contexts
48
+ $Query-Min: breakpoint-get-context('min-width');
49
+ $Query-Max: breakpoint-get-context('max-width');
50
+
51
+ @if length($Query-Min) == 1 {
52
+ $Query-Min: nth($Query-Min, 1);
53
+ }
54
+ @else if length($Query-Min) > 1 {
55
+ @warn "Responsive contexts are not available for `or` queries as which query to use is ambiguous. Please only use single context queries. Default context is used.";
56
+ @return map-get($haystack, -1px);
57
+ }
58
+
59
+
60
+ @if $Length > 1 {
61
+ @if length($Query-Max) == 1 {
62
+ $Query-Max: nth($Query-Max, 1);
63
+ }
64
+ @else if length($Query-Max) > 1 {
65
+ @warn "Responsive contexts are not available for `or` queries as which query to use is ambiguous. Please only use single context queries. Default context is used.";
66
+ @return map-get($haystack, -1px);
67
+ }
68
+
69
+ // If there is no min or max context, return first item
70
+ @if $Query-Min == false and $Query-Max == false {
71
+ $RETURN: map-get($haystack, -1px);
72
+ @return $RETURN;
73
+ }
74
+
75
+ // Convert to PX
76
+ @if $Query-Min != false and unit($Query-Min) == 'em' {
77
+ $Query-Min: $Query-Min / 1em * 16px;
78
+ }
79
+ @if $Query-Max != false and unit($Query-Max) == 'em' {
80
+ $Query-Max: $Query-Max / 1em * 16px;
81
+ }
82
+
83
+ $Find-Haystack: find-object-keys($haystack);
84
+ $Reverse-Haystack: reverse($Find-Haystack);
85
+
86
+ $Smallest: nth($Find-Haystack, 1);
87
+ $Largest: nth($Reverse-Haystack, 1);
88
+ $Context: $Query-Min;
89
+
90
+ @if not $Mobile-First {
91
+ $Context: $Query-Max;
92
+ }
93
+
94
+ // Loop over each item in Context to find if any of the items pass.
95
+ @each $Query-Context in $Context {
96
+ @if $Query-Context != false {
97
+ // If it's smallest than the smallest MQ, use the 1st grid
98
+ @if $Query-Context < $Smallest {
99
+ $RETURN: map-get($haystack, -1px);
100
+ @return $RETURN;
39
101
  }
102
+ // If it's larger than or equal to the largest MQ, use the last grid
103
+ @else if $Query-Context >= $Largest {
104
+ $RETURN: map-get($haystack, $Largest);
105
+ @return $RETURN;
106
+ }
107
+ // If it's in between the smallest and largest, go run a check.
108
+ @else {
109
+ // Loop through each MQ.
110
+ @for $j from 1 through length($Reverse-Haystack) {
111
+ $Query: nth($Reverse-Haystack, $j);
40
112
 
41
- // Loop over each item in Context to find if any of the items pass.
42
- @each $query-context in $context {
43
- @if $query-context != false {
44
- // If it's smallest than the smallest MQ, use the 1st grid
45
- @if $query-context < $smallest {
46
- @return nth($haystack, 1);
47
- }
48
- // If it's larger than or equal to the largest MQ, use the last grid
49
- @else if $query-context >= $largest {
50
- @return nth(nth($reverse-haystack, 1), 1);
113
+ // If the MQ is greather than or equal to the the MQ in question, use it! (mobile first)
114
+ @if ($Mobile-First) {
115
+ @if $Query-Context >= $Query {
116
+ $RETURN: map-get($haystack, nth($Reverse-Haystack, $j));
117
+ @return $RETURN;
118
+ }
51
119
  }
52
- // If it's in between the smallest and largest, go run a check.
120
+ // If the MQ is less than or equal to the the MQ in question, use it! (not mobile first)
53
121
  @else {
54
- // Loop through each MQ.
55
- @for $j from 1 through $rg-length {
56
- $query: nth(nth($reverse-haystack, $j), 2);
57
-
58
- // If the MQ is greather than or equal to the the MQ in question, use it! (mobile first)
59
- @if ($mobile-first) {
60
- @if $query-context >= $query {
61
- @return nth(nth($reverse-haystack, $j), 1);
62
- }
63
- }
64
- // If the MQ is less than or equal to the the MQ in question, use it! (not mobile first)
65
- @else {
66
- @if $query-context <= $query {
67
- @return nth(nth($reverse-haystack, $j), 1);
68
- }
69
- }
122
+ @if $Query-Context <= $Query {
123
+ $RETURN: map-get($haystack, nth($Reverse-Haystack, $j));
124
+ @return $RETURN;
70
125
  }
71
126
  }
72
127
  }
73
128
  }
74
- @return nth($haystack, 1);
75
- }
76
- // All else fails, return the first grid
77
- @else {
78
- @return nth($haystack, 1);
79
129
  }
80
130
  }
81
- @else {
82
- @return $haystack;
83
- }
84
131
  }
85
- // All else fails, return the first grid
132
+ // All else fails, return the first item
86
133
  @else {
87
- @return nth($haystack, 1);
134
+ $RETURN: map-get($haystack, -1px);
135
+ @return $RETURN;
88
136
  }
89
137
  }
@@ -1,28 +1,57 @@
1
1
  //////////////////////////////
2
2
  // Wrapper mixin for overriding the global contexts as a block
3
3
  //////////////////////////////
4
- @mixin layout($grid: false, $gutter: false, $output-style: false) {
4
+ @mixin layout($grid: false, $gutter: false, $output-style: false, $gutter-style: false) {
5
5
  // Private holder for current global context
6
- $layout-private-grid-holder: $grids;
7
- $layout-private-gutter-holder: $gutters;
8
- $layout-private-output-holder: $output;
6
+ $layout-private-grid-holder: sgs-get('grids');
7
+ $layout-private-gutter-holder: sgs-get('gutters');
8
+ $layout-private-output-holder: sgs-get('output');
9
+ $layout-private-gutter-style-holder: sgs-get('gutter styles');
9
10
 
10
11
  // Overides current global contexts, but only if needed
11
12
  @if $grid != false {
12
- $grids: $grid;
13
+ @include sgs-reset('grids');
14
+ @if type-of($grid) != 'map' {
15
+ @include sgs-change('grids', (-1px: $grid));
16
+ }
17
+ @else {
18
+ @include sgs-change('grids', $grid);
19
+ }
13
20
  }
14
21
  @if $gutter != false {
15
- $gutters: $gutter;
22
+ @include sgs-reset('gutters');
23
+ @if type-of($gutter) != 'map' {
24
+ @include sgs-change('gutters', (-1px: $gutter));
25
+ }
26
+ @else {
27
+ @include sgs-change('gutters', $gutter);
28
+ }
16
29
  }
17
30
  @if $output-style != false {
18
- $output: $output-style;
31
+ @include sgs-reset('output');
32
+ @include sgs-change('output', $output-style);
33
+ }
34
+ @if $gutter-style != false {
35
+ @include sgs-reset('gutter styles');
36
+ @if type-of($gutter-style) != 'map' {
37
+ @include sgs-change('gutter styles', (-1px: $gutter-style));
38
+ }
39
+ @else {
40
+ @include sgs-change('gutter styles', $gutter-style);
41
+ }
19
42
  }
20
43
 
21
44
  // All the things!
22
45
  @content;
23
46
 
47
+ // REset ALL the settings
48
+ @include sgs-reset('grids');
49
+ @include sgs-reset('gutters');
50
+ @include sgs-reset('output');
51
+ @include sgs-reset('gutter styles');
24
52
  // Resets global contexts
25
- $grids: $layout-private-grid-holder;
26
- $gutters: $layout-private-gutter-holder;
27
- $output: $layout-private-output-holder;
53
+ @include sgs-change('grids', $layout-private-grid-holder);
54
+ @include sgs-change('gutters', $layout-private-gutter-holder);
55
+ @include sgs-change('output', $layout-private-output-holder);
56
+ @include sgs-change('gutter styles', $layout-private-gutter-style-holder);
28
57
  }
@@ -65,7 +65,7 @@
65
65
  $length: length($list);
66
66
  $return: ();
67
67
  @for $i from 0 to $length {
68
- $return: append($return, nth($list, $length - $i), comma);
68
+ $return: append($return, nth($list, $length - $i));
69
69
  }
70
70
  @return $return;
71
71
  }
@@ -0,0 +1,98 @@
1
+ //////////////////////////////
2
+ // Deprecation Warnings for new Setting System
3
+ //////////////////////////////
4
+ @function singularity-deprecation-warning() {
5
+ $Singularity-Global-Vars: 'grids', 'gutters', 'gutter-styles', 'mobile-first', 'output', 'direction', 'include-border-box', 'include-clearfix';
6
+
7
+ @each $var in $Singularity-Global-Vars {
8
+ @if global-variable-exists($var) {
9
+ $Singularity-Warning-Output: "DEPRECATION: In order to remove global variable naming conflicts, Singularity's settings have been moved into the single `$singularity` variable.";
10
+
11
+ @if $var == 'grids' or $var == 'gutters' or $var == 'gutter-styles' {
12
+ $Singularity-Singleton-Var: str_slice($var, 1, -2);
13
+ $Singularity-Warning-Output: $Singularity-Warning-Output + " Please replace all `$#{$var}` definitions, and all `add-#{$Singularity-Singleton-Var}()` calls to `@include add-#{$Singularity-Singleton-Var}()`";
14
+ }
15
+ @else {
16
+ // String Replace
17
+ $Singularity-Replace-Index: -1;
18
+ $Singularity-Replace-Holder: '';
19
+ $Singularity-Replace-Spaced: $var;
20
+ @while $Singularity-Replace-Index != 0 {
21
+ $Singularity-Replace-Index: str-index($Singularity-Replace-Spaced, '-');
22
+ @if $Singularity-Replace-Index != 0 {
23
+ $Singularity-Replace-Holder: str-slice($Singularity-Replace-Spaced, 1, $Singularity-Replace-Index - 1) + ' ';
24
+ $Singularity-Replace-Spaced: str-slice($Singularity-Replace-Spaced, $Singularity-Replace-Index + 1);
25
+ $Singularity-Replace-Spaced: $Singularity-Replace-Holder + $Singularity-Replace-Spaced;
26
+ $Singularity-Replace-Index: str-index($Singularity-Replace-Spaced, '-');
27
+ }
28
+ }
29
+ $Singularity-Warning-Output: $Singularity-Warning-Output + " Please replace all `$#{$var}` definitions with `@include sgs-change('#{$Singularity-Replace-Spaced}', $value)`";
30
+ }
31
+
32
+ $Singularity-Warning-Output: $Singularity-Warning-Output + " In the next version of Singularity, this warning will be removed";
33
+
34
+ @warn $Singularity-Warning-Output;
35
+ }
36
+ }
37
+
38
+ @return false;
39
+ }
40
+
41
+ $DEPRECATE:singularity-deprecation-warning();
42
+
43
+ //////////////////////////////
44
+ // Has Setting
45
+ //////////////////////////////
46
+ @function sgs-has($setting) {
47
+ @if map-has-key($singularity, $setting) {
48
+ @return true;
49
+ }
50
+ @else {
51
+ @return false;
52
+ }
53
+ }
54
+
55
+ //////////////////////////////
56
+ // Get Settings
57
+ //////////////////////////////
58
+ @function sgs-get($setting) {
59
+ @if sgs-has($setting) {
60
+ @return map-get($singularity, $setting);
61
+ }
62
+ @else {
63
+ @return map-get($Singularity-Settings, $setting);
64
+ }
65
+ }
66
+
67
+ //////////////////////////////
68
+ // Set Settings
69
+ //////////////////////////////
70
+ @function sgs-set($setting, $value) {
71
+ @if str-index($setting, '-') > 0 {
72
+ @warn "Singularity settings should contain spaces, not dashes. Please replace dashes with spaces. Settings will not work as expected until changed.";
73
+ }
74
+ $singularity: map-merge($singularity, ($setting: $value)) !global;
75
+ @return true;
76
+ }
77
+
78
+ @mixin sgs-change($setting, $value) {
79
+ $sgs-change: sgs-set($setting, $value);
80
+ }
81
+
82
+ //////////////////////////////
83
+ // Remove Setting
84
+ //////////////////////////////
85
+ @function sgs-reset($setting) {
86
+ $Return: ();
87
+
88
+ @each $Key, $Value in $singularity {
89
+ $Return: if($setting == $Key, $Return, map-merge($Return, ($Key: $Value)));
90
+ }
91
+
92
+ $singularity: $Return !global;
93
+ @return true;
94
+ }
95
+
96
+ @mixin sgs-reset($setting) {
97
+ $sgs-reset: sgs-reset($setting);
98
+ }
@@ -0,0 +1,56 @@
1
+ //////////////////////////////
2
+ // Quicksort
3
+ // http://rosettacode.org/wiki/Sorting_algorithms/Quicksort
4
+ //////////////////////////////
5
+ @function quicksort($list) {
6
+
7
+ $QS-Less: ();
8
+ $QS-Equal: ();
9
+ $QS-Large: ();
10
+
11
+ $QS-Length: length($list);
12
+
13
+ $QS-Seed: round($QS-Length / 2);
14
+
15
+ @if $QS-Length > 1 {
16
+ $QS-Seed: nth($list, $QS-Seed);
17
+ @each $Item in $list {
18
+ @if $Item < $QS-Seed {
19
+ $QS-Less: append($QS-Less, $Item);
20
+ }
21
+ @else if $Item == $QS-Seed {
22
+ $QS-Equal: append($QS-Equal, $Item);
23
+ }
24
+ @else {
25
+ $QS-Large: append($QS-Large, $Item);
26
+ }
27
+ }
28
+ $QS-Less: quicksort($QS-Less);
29
+ $QS-Large: quicksort($QS-Large);
30
+
31
+ $QS-Return: join($QS-Less, $QS-Equal);
32
+ $QS-Return: join($QS-Return, $QS-Large);
33
+
34
+ @return $QS-Return;
35
+ }
36
+
37
+ @return $list;
38
+ }
39
+
40
+ //////////////////////////////
41
+ // Sort Map function
42
+ //////////////////////////////
43
+ @function sort-map($map, $reverse: false) {
44
+ $Sort-Map-Keys: quicksort(map-keys($map));
45
+ $Sort-Map-Map: ();
46
+
47
+ @if $reverse {
48
+ $Sort-Map-Keys: reverse($Sort-Map-Keys);
49
+ }
50
+
51
+ @each $key in $Sort-Map-Keys {
52
+ $Sort-Map-Map: map-merge($Sort-Map-Map, ($key: map-get($map, $key)));
53
+ }
54
+
55
+ @return $Sort-Map-Map;
56
+ }
@@ -1,9 +1,27 @@
1
1
  @mixin span-shared {
2
+ $include-border-box: sgs-get('include border box');
3
+ $include-clearfix: sgs-get('include clearfix');
4
+
2
5
  @if $include-border-box {
3
- @include box-sizing('border-box');
6
+ @if mixin-exists(box-sizing) {
7
+ @include box-sizing(border-box);
8
+ }
9
+ @else {
10
+ -moz-box-sizing: border-box;
11
+ box-sizing: border-box;
12
+ }
4
13
  }
5
14
 
6
15
  @if $include-clearfix {
7
- @include clearfix;
16
+ @if mixin-exists(clearfix) {
17
+ @include clearfix;
18
+ }
19
+ @else {
20
+ &:after {
21
+ content: "";
22
+ display: table;
23
+ clear: both;
24
+ }
25
+ }
8
26
  }
9
27
  }
@@ -1,19 +1,63 @@
1
+ //////////////////////////////
2
+ // Parse add string
3
+ //
4
+ // Retrieve add and media query values from a definition
5
+ // parse-add($definition)
6
+ // $definition : <list>
7
+ // - A list like: .25 at 300px
8
+ //
9
+ //////////////////////////////
1
10
  @function parse-add($definition) {
2
- $grid: ();
3
- $mq: false;
4
- $mq-find: false;
11
+ $parse-find: ();
12
+ $parse-mq: null;
13
+ $parse-mq-find: false;
14
+ $Mobile-First: sgs-get('mobile first');
5
15
 
6
16
  @each $item in $definition {
7
- @if $item != 'at' and $mq-find != true {
8
- $grid: append($grid, $item, 'space');
17
+ @if $item != 'at' and $parse-mq-find != true {
18
+ $parse-find: append($parse-find, $item, 'space');
9
19
  }
10
20
  @else if $item == 'at' {
11
- $mq-find: true;
21
+ $parse-mq-find: true;
12
22
  }
13
23
  @else {
14
- $mq: $item;
24
+ $parse-mq: $item;
15
25
  }
16
26
  }
17
27
 
18
- @return ($grid $mq);
28
+ @if $parse-mq {
29
+ @if not function-exists(breakpoint) {
30
+ @warn "Responsive contexts require Breakpoint (https://github.com/Team-Sass/breakpoint). Please ensure that Breakpoint is imported and available for Singularity to use. Context set to -1px.";
31
+ $parse-mq: -1px;
32
+ }
33
+ @else {
34
+ $breakpoint-parse: breakpoint($parse-mq);
35
+ $breakpoint-parse: map-get($breakpoint-parse, 'context holder');
36
+ $breakpoint-mq: null;
37
+ @if $Mobile-First {
38
+ $breakpoint-mq: map-get($breakpoint-parse, 'min-width');
39
+ }
40
+ @else {
41
+ $breakpoint-mq: map-get($breakpoint-parse, 'max-width');
42
+ }
43
+
44
+ @if length($breakpoint-mq) > 1 {
45
+ @warn "Responsive contexts are not available for `or` queries as which query to use is ambiguous. Please only use single context queries. Context set to -1px.";
46
+ $parse-mq: 1px;
47
+ }
48
+ @else if length($breakpoint-mq) < 1 {
49
+ @warn "No " + if($Mobile-First, 'min-width', 'max-width') + ' context found. Please use a media query with the correct context. Context set to -1px.';
50
+ $parse-mq: -1px;
51
+ }
52
+ @else {
53
+ $parse-mq: nth($breakpoint-mq, 1);
54
+ }
55
+ }
56
+ }
57
+
58
+ @if $parse-mq and unit($parse-mq) == 'em' {
59
+ $parse-mq: $parse-mq / 1em * 16px;
60
+ }
61
+
62
+ @return ($parse-find $parse-mq);
19
63
  }
@@ -4,9 +4,10 @@
4
4
  // Retrieve values from the natural language string.
5
5
  // parse-string($var, $list)
6
6
  // $var : <string>
7
- // - at/span/of or any other keywords.
7
+ // - 'at'/'span'/'of' or any other keywords.
8
8
  // - 'span' queries the unprefixed span declaration.
9
9
  // - 'at' can also query first, last, alpha, and omega.
10
+ // - 'grid' will return the same as 'of'
10
11
  // $list : <list>
11
12
  // - A list like this: last 2 of (1 1 2) push 1
12
13
  //
@@ -19,7 +20,6 @@
19
20
 
20
21
  // Loop through list.
21
22
  @each $item in $list {
22
-
23
23
  // if 'span' - return the first numeric.
24
24
  // if keyword was found - return the following item.
25
25
  @if (type-of($item) == number and $var == span and $found != 'grid') or $found == true {
@@ -29,7 +29,7 @@
29
29
  }
30
30
 
31
31
  // Special handling for Grids
32
- @else if $item == $var and $var == 'of' {
32
+ @else if ($item == $var or $item == 'grid' or $item == 'of') and ($var == 'of' or $var == 'grid') {
33
33
  $found: 'grid';
34
34
  }
35
35
 
@@ -1,11 +1,12 @@
1
1
  //////////////////////////////
2
2
  // Find width, in percentages, of the column span
3
3
  //////////////////////////////
4
- @function column-span($span, $location, $grid: false, $gutter: false, $gutter-style: false) {
4
+ @function column-span($span, $location, $grid: null, $gutter: null, $gutter-style: null) {
5
5
 
6
6
  // Find the grid and gutters
7
7
  $grid: find-grid($grid);
8
8
  $gutter: find-gutter($gutter);
9
+ $gutter-style: find-gutter-style($gutter-style);
9
10
 
10
11
  @if fixed-gutter($grid, $gutter, $gutter-style) {
11
12
  $gutter: 0;
@@ -15,7 +16,7 @@
15
16
  // @debug $gutter;
16
17
 
17
18
  // Combine the grid and gutters
18
- $grid-and-gutters: column-sum($grid, $gutter);
19
+ $grid-and-gutters: column-sum($grid, $gutter, $gutter-style);
19
20
 
20
21
  // @debug $grid-and-gutters;
21
22
 
@@ -52,8 +53,8 @@
52
53
  //////////////////////////////
53
54
  // Find the total sum of the grid
54
55
  //////////////////////////////
55
- @function column-sum($grid, $gutter) {
56
- $split: if(index(find-gutter-style(), split), true, false);
56
+ @function column-sum($grid, $gutter, $gutter-style) {
57
+ $split: if(index($gutter-style, 'split'), true, false);
57
58
 
58
59
  @if type-of($grid) == 'number' or length($grid) == 1 {
59
60
  @if $split {
@@ -1,3 +1,3 @@
1
1
  @function context($primary, $secondary) {
2
- @return ($primary * $secondary) / 100%;;
2
+ @return ($primary / $secondary) * 100%;
3
3
  }
@@ -3,13 +3,14 @@
3
3
  // Find the columns and gutters
4
4
  $grid: find-grid($grid);
5
5
  $gutter: find-gutter($gutter);
6
+ $gutter-style: find-gutter-style($gutter-style);
6
7
 
7
8
  @if fixed-gutter($grid, $gutter, $gutter-style) {
8
9
  @return nth($gutter, 1);
9
10
  }
10
11
 
11
12
  // Combine the columns and gutters
12
- $grid-and-gutters: column-sum($grid, $gutter);
13
+ $grid-and-gutters: column-sum($grid, $gutter, $gutter-style);
13
14
 
14
15
  @return (nth($gutter, 1) / $grid-and-gutters) * 100%
15
16
  }