singularitygs 1.1.2 → 1.8.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (49) hide show
  1. checksums.yaml +7 -7
  2. data/lib/singularitygs.rb +14 -6
  3. data/stylesheets/_singularitygs.scss +21 -30
  4. data/stylesheets/singularitygs/_api.scss +103 -24
  5. data/stylesheets/singularitygs/_css-grid.scss +141 -0
  6. data/stylesheets/singularitygs/_helpers.scss +6 -2
  7. data/stylesheets/singularitygs/api/_calc.scss +218 -0
  8. data/stylesheets/singularitygs/api/_float.scss +87 -147
  9. data/stylesheets/singularitygs/api/_isolation.scss +98 -131
  10. data/stylesheets/singularitygs/grids/_add.scss +34 -16
  11. data/stylesheets/singularitygs/grids/_find.scss +6 -8
  12. data/stylesheets/singularitygs/gutter-styles/_add.scss +39 -16
  13. data/stylesheets/singularitygs/gutter-styles/_find.scss +10 -5
  14. data/stylesheets/singularitygs/gutter-styles/_helpers.scss +6 -10
  15. data/stylesheets/singularitygs/gutters/_add.scss +37 -14
  16. data/stylesheets/singularitygs/gutters/_find.scss +9 -5
  17. data/stylesheets/singularitygs/helpers/_background-grid.scss +196 -219
  18. data/stylesheets/singularitygs/helpers/_box-sizing.scss +17 -32
  19. data/stylesheets/singularitygs/helpers/_clearfix.scss +10 -95
  20. data/stylesheets/singularitygs/helpers/_columns.scss +4 -3
  21. data/stylesheets/singularitygs/helpers/_directions.scss +6 -0
  22. data/stylesheets/singularitygs/helpers/_find.scss +112 -65
  23. data/stylesheets/singularitygs/helpers/_layout.scss +107 -10
  24. data/stylesheets/singularitygs/helpers/_sass-lists.scss +1 -1
  25. data/stylesheets/singularitygs/helpers/_settings.scss +60 -0
  26. data/stylesheets/singularitygs/helpers/_sort.scss +56 -0
  27. data/stylesheets/singularitygs/helpers/_span-shared.scss +20 -2
  28. data/stylesheets/singularitygs/language/_parse-add.scss +53 -9
  29. data/stylesheets/singularitygs/language/_parse-list.scss +3 -3
  30. data/stylesheets/singularitygs/math/_columns.scss +9 -7
  31. data/stylesheets/singularitygs/math/_context.scss +1 -1
  32. data/stylesheets/singularitygs/math/_gutters.scss +2 -1
  33. metadata +52 -72
  34. data/templates/box-sizing/behaviors/box-sizing/boxsizing.htc +0 -399
  35. data/templates/box-sizing/behaviors/box-sizing/boxsizing.php +0 -23
  36. data/templates/box-sizing/manifest.rb +0 -4
  37. data/templates/demos/demo-float.scss +0 -159
  38. data/templates/demos/demo-isolation.scss +0 -132
  39. data/templates/demos/float.html.erb +0 -18
  40. data/templates/demos/isolation.html.erb +0 -18
  41. data/templates/demos/manifest.rb +0 -17
  42. data/templates/grid-toggle/grid.js +0 -16
  43. data/templates/grid-toggle/grid.min.js +0 -2
  44. data/templates/grid-toggle/manifest.rb +0 -22
  45. data/templates/project/grid.js +0 -16
  46. data/templates/project/grid.min.js +0 -2
  47. data/templates/project/manifest.rb +0 -23
  48. data/templates/project/partials/_base.scss +0 -4
  49. data/templates/project/style.scss +0 -15
@@ -1,160 +1,98 @@
1
- @mixin output-float($span, $location, $columns, $gutter, $options: false) {
1
+ @function output-float($Span-Map) {
2
+ // Set up Left/Right maps
3
+ $Return: ();
2
4
 
3
- $location-holder: $location;
5
+ $Span: map-get($Span-Map, 'span');
6
+ $Location: map-get($Span-Map, 'location');
4
7
 
5
- @if type-of($location) == string {
6
- @if end-row($span, $location, $columns) {
7
- $grid-length: length(find-grid($columns));
8
- $location-holder: $grid-length - $span;
9
- }
10
- @else {
11
- $location-holder: 1;
12
- }
13
- }
8
+ $Grid: map-get($Span-Map, 'grid');
9
+ $Gutter: map-get($Span-Map, 'gutter');
10
+ $Style: map-get($Span-Map, 'style');
14
11
 
15
- $gutter: find-gutter($gutter);
16
- $gutter-span: gutter-span($gutter, $columns);
17
- $end-row: end-row($span, $location, $columns);
18
- $start-row: start-row($location);
19
-
20
- $gutter-style: find-gutter-style();
21
- $fixed-gutter: fixed-gutter($columns, $gutter);
22
- $gutter-property: gutter-property($columns, $gutter);
23
-
24
- width: column-span($span, $location-holder, $columns, $gutter, $gutter-style);
25
-
26
- @if $direction == 'ltr' or $direction == 'both' {
27
- // Set the CSS direction to ltr
28
- $cssdir: 'ltr';
29
- // Find the CSS named direction and opposite direction
30
- $dir: named-direction($cssdir);
31
- $opp: opposite-direction($dir);
32
-
33
- clear: $opp;
34
-
35
- @if $end-row {
36
- float: $opp;
37
- @if index($gutter-style, split) and not $fixed-gutter {
38
- #{$gutter-property}-#{$dir}: 0;
39
- #{$gutter-property}-#{$opp}: $gutter-span / 2;
40
- }
41
- @else if not $fixed-gutter {
42
- #{$gutter-property}-#{$opp}: 0;
43
- }
44
- }
45
- @else {
46
- float: $dir;
47
-
48
- @if $start-row {
49
- @if index($gutter-style, split) and not $fixed-gutter {
50
- #{$gutter-property}-#{$dir}: $gutter-span / 2;
51
- #{$gutter-property}-#{$opp}: $gutter-span / 2;
52
- }
53
- @else if not $fixed-gutter {
54
- #{$gutter-property}-#{$dir}: 0;
55
- #{$gutter-property}-#{$opp}: $gutter-span;
56
- }
12
+ $Start-Row: map-get($Span-Map, 'start row');
13
+ $End-Row: map-get($Span-Map, 'end row');
57
14
 
58
- }
59
- }
15
+ $Fixed-Gutter: map-get($Span-Map, 'fixed gutter');
16
+ $Split-Gutter: map-get($Span-Map, 'split gutter');
17
+ $Gutter-Property: map-get($Span-Map, 'gutter property');
60
18
 
61
- @if $fixed-gutter {
62
- @if index($gutter-style, split) {
63
- #{$gutter-property}-#{$dir}: $gutter-span / 2;
64
- #{$gutter-property}-#{$opp}: $gutter-span / 2;
65
- }
66
- @else {
67
- #{$gutter-property}-#{$opp}: $gutter-span;
68
- }
69
- }
70
- }
19
+ $Direction: map-get($Span-Map, 'direction');
20
+ $Options: map-get($Span-Map, 'options');
71
21
 
72
- @if $direction == 'rtl' or $direction == 'both' {
73
- // Set the CSS direction to ltr
74
- $cssdir: 'rtl';
75
- // Find the CSS named direction and opposite direction
76
- $dir: named-direction($cssdir);
77
- $opp: opposite-direction($dir);
78
-
79
-
80
- [dir="#{$cssdir}"] & {
81
- clear: $opp;
82
-
83
- @if $end-row {
84
- float: $opp;
85
- @if index($gutter-style, split) and not $fixed-gutter {
86
- #{$gutter-property}-#{$dir}: 0;
87
- #{$gutter-property}-#{$opp}: $gutter-span / 2;
88
- }
89
- @else if not $fixed-gutter {
90
- #{$gutter-property}-#{$opp}: 0;
91
- }
92
- }
93
- @else {
94
- float: $dir;
95
-
96
- @if $start-row {
97
- @if index($gutter-style, split) and not $fixed-gutter {
98
- #{$gutter-property}-#{$dir}: $gutter-span / 2;
99
- #{$gutter-property}-#{$opp}: $gutter-span / 2;
100
- }
101
- @else if not $fixed-gutter {
102
- #{$gutter-property}-#{$dir}: 0;
103
- #{$gutter-property}-#{$opp}: $gutter-span;
104
- }
105
- }
106
- }
107
-
108
- @if $fixed-gutter {
109
- @if $direction == 'rtl' {
110
- @if index($gutter-style, split) {
111
- #{$gutter-property}-#{$dir}: $gutter-span / 2;
112
- #{$gutter-property}-#{$opp}: $gutter-span / 2;
113
- }
114
- @else {
115
- #{$gutter-property}-#{$opp}: $gutter-span;
116
- }
117
- }
118
- @else if not index($gutter-style, split) {
119
- #{$gutter-property}-#{$opp}: $gutter-span;
120
- }
121
- }
122
- }
22
+ @if $Start-Row {
23
+ $Location: 1;
24
+ }
25
+ @else if $End-Row {
26
+ $Location: column-count($Grid) - $Span + 1;
123
27
  }
124
28
 
125
- @include span-shared;
126
- }
127
-
128
- @mixin push-float($span, $location, $columns: false, $gutter: false) {
29
+ $Width: column-span($Span, $Location, $Grid, $Gutter, $Style);
30
+ $Margin-Span: column-span(($Location - 1), 1, $Grid, $Gutter, $Style);
31
+ $Gutter-Span: gutter-span($Gutter, $Grid);
129
32
 
130
- @if type-of($location) == string {
131
- $location: 1;
33
+ // Backwards Compatibility for Options
34
+ @if type-of($Options) != 'map' and $Options != null {
35
+ $Options: ('clear': unquote(nth($Options, 1)));
132
36
  }
133
37
 
134
- // Find the columns and gutters
135
- $columns: find-grid($columns);
136
- $gutter: find-gutter($gutter);
38
+ $Dir: $Direction;
39
+ $Opp: opposite-direction($Dir);
137
40
 
138
- // Combine the columns and gutters
139
- $gutter: column-span($span, $location, $columns, $gutter) + gutter-span($gutter, $columns);
41
+ $Return: map-merge($Return, ('width': $Width));
42
+ $Return: map-merge($Return, ('clear': $Opp));
140
43
 
141
- margin-left: $gutter;
142
- }
44
+ @if ($End-Row) {
45
+ $Return: map-merge($Return, ('float': $Opp));
143
46
 
144
- @mixin pull-float($span, $location, $columns: false, $gutter: false) {
47
+ @if $Split-Gutter and not $Fixed-Gutter {
48
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Dir}': 0));
49
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Opp}': $Gutter-Span / 2));
50
+ }
51
+ @else if not $Fixed-Gutter {
52
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Opp}': 0));
53
+ }
54
+ }
55
+ @else {
56
+ $Return: map-merge($Return, ('float': $Dir));
145
57
 
146
- @if type-of($location) == string {
147
- $location: 1;
58
+ @if $Split-Gutter and not $Fixed-Gutter {
59
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Dir}': $Gutter-Span / 2));
60
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Opp}': $Gutter-Span / 2));
61
+ }
62
+ @else if not $Fixed-Gutter {
63
+ @if $Start-Row {
64
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Dir}': 0));
65
+ }
66
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Opp}': $Gutter-Span));
67
+ }
68
+ }
69
+ // If options are set, we merge them in!
70
+ @if ($Options) {
71
+ $Return: map-merge($Return, $Options);
148
72
  }
149
73
 
150
- // Find the columns and gutters
151
- $columns: find-grid($columns);
152
- $gutter: find-gutter($gutter);
74
+ // If CLear isn't already available, set it!
75
+ @if not map-has-key($Return, 'clear') {
76
+ $Return: map-merge($Return, ('clear': none));
77
+ }
153
78
 
154
- // Combine the columns and gutters
155
- $gutter: (column-span($span, $location, $columns, $gutter) + gutter-span($gutter, $columns)) * -1;
79
+ // Left Fixed Gutters
80
+ @if $Fixed-Gutter {
81
+ @if index($Style, 'split') {
82
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Dir}': $Gutter-Span / 2));
83
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Opp}': $Gutter-Span / 2));
84
+ }
85
+ @else {
86
+ @if not $End-Row {
87
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Opp}': $Gutter-Span));
88
+ }
89
+ @else {
90
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Opp}': 0));
91
+ }
92
+ }
93
+ }
156
94
 
157
- margin-left: $gutter;
95
+ @return $Return;
158
96
  }
159
97
 
160
98
  //////////////////////////////
@@ -162,11 +100,13 @@
162
100
  //
163
101
  // Makes working with Float easier, as it allows you to walk the grid for symmetric grids and easy applying of 'last' and 'first', as well as automatically building the verbose grid-span mixin call
164
102
  //////////////////////////////
165
- @mixin float-span($span, $location: false, $grid: false, $gutter: false) {
103
+ @mixin float-span($Span, $Location: false, $grid: false, $gutter: false, $gutter-style: false, $from: false) {
166
104
  $grid: find-grid($grid);
167
105
  $gutter: find-gutter($gutter);
168
106
  $row: false;
169
107
 
108
+ $Options: if($from, ('from': $from), null);
109
+
170
110
  // Working around SASS treating a number like a list with one element
171
111
  @if type-of($grid) == 'list' and length($grid) == 1 {
172
112
  $grid: nth($grid, 1);
@@ -175,27 +115,27 @@
175
115
  // Working with a symmetric grid
176
116
  @if type-of($grid) == 'number' {
177
117
  // Special treatment for non-numeric location
178
- @if type-of($location) != 'number' {
179
- @if $location == 'last' or $location == 'omega' {
180
- $location: $grid - $span + 1;
118
+ @if type-of($Location) != 'number' {
119
+ @if $Location == 'last' or $Location == 'omega' {
120
+ $Location: $grid - $Span + 1;
181
121
  }
182
122
  @else {
183
- @if $location == 'first' or $location == 'alpha' {
123
+ @if $Location == 'first' or $Location == 'alpha' {
184
124
  $row: true;
185
125
  }
186
- $location: 1;
126
+ $Location: 1;
187
127
  }
188
128
  }
189
129
 
190
- @include grid-span($span, $location, $grid, $gutter, 'float');
130
+ @include grid-span($Span, $Location, $grid, $gutter, 'float', $gutter-style, $Options);
191
131
 
192
132
  @if $row {
193
133
  clear: both;
194
134
  }
195
135
  }
196
136
  // Working with an asymmetric grid, should have location provided
197
- @else if type-of($grid) == 'list' and $location != false {
198
- @include grid-span($span, $location, $grid, $gutter, 'float');
137
+ @else if type-of($grid) == 'list' and $Location != false {
138
+ @include grid-span($Span, $Location, $grid, $gutter, 'float', $gutter-style, $Options);
199
139
  }
200
140
  @else {
201
141
  @warn 'Asymmetric Grids need a Location value as well as a span value in order to know where on the grid you are! Please include a location value!';
@@ -1,168 +1,135 @@
1
- @mixin output-isolation($span, $location, $columns, $gutter, $options: false) {
1
+ @function output-isolation($Span-Map) {
2
+ // Set up Left/Right maps
3
+ $Return: ();
2
4
 
3
- $gutter: find-gutter($gutter);
4
- $gutter-span: gutter-span($gutter, $columns);
5
- $end-row: end-row($span, $location, $columns);
6
- $start-row: start-row($location);
5
+ $Span: map-get($Span-Map, 'span');
6
+ $Location: map-get($Span-Map, 'location');
7
7
 
8
- $gutter-style: find-gutter-style();
9
- $fixed-gutter: fixed-gutter($columns, $gutter);
10
- $gutter-property: gutter-property($columns, $gutter);
11
- $split: index($gutter-style, split);
8
+ $Grid: map-get($Span-Map, 'grid');
9
+ $Gutter: map-get($Span-Map, 'gutter');
10
+ $Style: map-get($Span-Map, 'style');
12
11
 
13
- $margin-span: column-span(($location - 1), 1, $columns, $gutter, $gutter-style);
12
+ $Start-Row: map-get($Span-Map, 'start row');
13
+ $End-Row: map-get($Span-Map, 'end row');
14
14
 
15
- @if not $fixed-gutter {
16
- $margin-span: $margin-span + $gutter-span;
15
+ $Fixed-Gutter: map-get($Span-Map, 'fixed gutter');
16
+ $Split-Gutter: map-get($Span-Map, 'split gutter');
17
+ $Gutter-Property: map-get($Span-Map, 'gutter property');
18
+
19
+ $Direction: map-get($Span-Map, 'direction');
20
+ $Options: map-get($Span-Map, 'options');
21
+
22
+ $Width: column-span($Span, $Location, $Grid, $Gutter, $Style);
23
+ $Margin-Span: column-span(($Location - 1), 1, $Grid, $Gutter, $Style);
24
+ $Gutter-Span: gutter-span($Gutter, $Grid);
25
+
26
+ // Backwards Compatibility for Options
27
+ @if type-of($Options) != 'map' and $Options != null {
28
+ $Options: ('clear': unquote(nth($Options, 1)));
17
29
  }
18
30
 
31
+ $Dir: $Direction;
32
+ $Opp: opposite-direction($Dir);
19
33
 
20
- @if $direction == 'ltr' or $direction == 'both' {
21
- // Set the CSS direction to ltr
22
- $cssdir: 'ltr';
23
- // Find the CSS named direction and opposite direction
24
- $dir: named-direction($cssdir);
25
- $opp: opposite-direction($dir);
34
+ $Return: map-merge($Return, ('width': $Width));
26
35
 
27
- width: column-span($span, $location, $columns, $gutter, $gutter-style);
36
+ @if ($End-Row) {
37
+ $Return: map-merge($Return, ('float': $Opp));
38
+ $Return: map-merge($Return, ('margin-#{$Dir}': 0));
28
39
 
29
- // If we are at the last item in the row, we float it the opposite direction
30
- @if ($end-row) {
31
- float: $opp;
32
- margin-#{$dir}: 0;
33
- @if $split and not $fixed-gutter {
34
- #{$gutter-property}-#{$opp}: $gutter-span / 2;
35
- }
36
- @else {
37
- margin-#{$opp}: 0;
38
- }
40
+ @if $Split-Gutter and not $Fixed-Gutter {
41
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Opp}': $Gutter-Span / 2));
39
42
  }
40
43
  @else {
41
- float: $dir;
42
- margin-#{$opp}: -100%;
43
-
44
- @if $start-row {
45
- @if $split and not $fixed-gutter {
46
- margin-#{$dir}: $gutter-span / 2;
47
- }
48
- @else {
49
- margin-#{$dir}: 0%;
50
- }
51
- }
52
- @else {
53
- @if $split and not $fixed-gutter {
54
- margin-#{$dir}: $margin-span + $gutter-span / 2;
55
- }
56
- @else {
57
- margin-#{$dir}: $margin-span;
58
- }
59
-
60
- }
44
+ $Return: map-merge($Return, ('margin-#{$Opp}': 0));
61
45
  }
46
+ }
47
+ @else {
48
+ $Return: map-merge($Return, ('float': $Dir));
49
+ $Return: map-merge($Return, ('margin-#{$Opp}': -100%));
62
50
 
63
- // If options are set, we clear to that option, otherwise no clear!
64
- @if ($options) {
65
- clear: unquote($options);
51
+ @if $Start-Row {
52
+ @if $Split-Gutter and not $Fixed-Gutter {
53
+ $Return: map-merge($Return, ('margin-#{$Dir}': $Gutter-Span / 2));
54
+ }
55
+ @else if not $Fixed-Gutter {
56
+ $Return: map-merge($Return, ('margin-#{$Dir}': 0));
57
+ }
66
58
  }
67
59
  @else {
68
- clear: none;
69
- }
70
-
71
- @if $fixed-gutter {
72
- @if index($gutter-style, split) {
73
- #{$gutter-property}-#{$dir}: $gutter-span / 2;
74
- #{$gutter-property}-#{$opp}: $gutter-span / 2;
60
+ @if $Split-Gutter and not $Fixed-Gutter {
61
+ $Return: map-merge($Return, ('margin-#{$Dir}': $Margin-Span + $Gutter-Span + $Gutter-Span / 2));
62
+ }
63
+ @else if not $Fixed-Gutter {
64
+ $Return: map-merge($Return, ('margin-#{$Dir}': $Margin-Span + $Gutter-Span));
75
65
  }
76
66
  @else {
77
- #{$gutter-property}-#{$opp}: $gutter-span;
67
+ $Return: map-merge($Return, ('margin-#{$Dir}': $Margin-Span));
78
68
  }
79
69
  }
80
70
  }
71
+ // If options are set, we merge them in!
72
+ @if ($Options) {
73
+ $Return: map-merge($Return, $Options);
74
+ }
81
75
 
82
- @if $direction == 'rtl' or $direction == 'both' {
83
- // Set the CSS direction to ltr
84
- $cssdir: 'rtl';
85
- // Find the CSS named direction and opposite direction
86
- $dir: named-direction($cssdir);
87
- $opp: opposite-direction($dir);
88
-
89
- [dir="#{$cssdir}"] & {
90
- // If we are at the last item in the row, we float it the opposite direction
91
- @if ($end-row) {
92
- float: $opp;
93
- margin-#{$dir}: 0;
94
- @if $split and not $fixed-gutter {
95
- #{$gutter-property}-#{$opp}: $gutter-span / 2;
96
- }
97
- @else {
98
- margin-#{$opp}: 0;
99
- }
100
- }
101
- @else {
102
- float: $dir;
103
- margin-#{$opp}: -100%;
104
-
105
- @if $start-row {
106
- @if $split and not $fixed-gutter {
107
- margin-#{$dir}: $gutter-span / 2;
108
- }
109
- @else {
110
- margin-#{$dir}: 0%;
111
- }
112
- }
113
- @else {
114
- @if $split and not $fixed-gutter {
115
- margin-#{$dir}: $margin-span + $gutter-span / 2;
116
- }
117
- @else {
118
- margin-#{$dir}: $margin-span;
119
- }
120
-
121
- }
122
- }
76
+ // If CLear isn't already available, set it!
77
+ @if not map-has-key($Return, 'clear') {
78
+ $Return: map-merge($Return, ('clear': none));
79
+ }
123
80
 
124
- // If options are set, we clear to that option, otherwise no clear!
125
- @if ($options) {
126
- clear: unquote($options);
81
+ // Left Fixed Gutters
82
+ @if $Fixed-Gutter {
83
+ @if index($Style, 'split') {
84
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Dir}': $Gutter-Span / 2));
85
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Opp}': $Gutter-Span / 2));
86
+ }
87
+ @else {
88
+ @if not $End-Row {
89
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Opp}': $Gutter-Span));
127
90
  }
128
91
  @else {
129
- clear: none;
130
- }
131
-
132
- @if $fixed-gutter {
133
- @if $direction == 'rtl' {
134
- @if index($gutter-style, split) {
135
- #{$gutter-property}-#{$dir}: $gutter-span / 2;
136
- #{$gutter-property}-#{$opp}: $gutter-span / 2;
137
- }
138
- @else {
139
- #{$gutter-property}-#{$opp}: $gutter-span;
140
- }
141
- }
142
- @else if not index($gutter-style, split) {
143
- #{$gutter-property}-#{$opp}: $gutter-span;
144
- }
92
+ $Return: map-merge($Return, ('#{$Gutter-Property}-#{$Opp}': 0));
145
93
  }
146
94
  }
147
95
  }
148
96
 
149
- @include span-shared;
150
-
97
+ @return $Return;
151
98
  }
152
99
 
153
- @mixin push-isolation($span, $location, $columns: false, $gutter: false) {
154
- @include push-float($span, $location, $columns, $gutter);
155
- }
100
+ //////////////////////////////
101
+ // Happy Syntax for Isolation
102
+ //
103
+ // Makes working with Isolation easier, as it moves Clear to a 1st class citizen of the mixin, and automatically builds the verbose grid-span mixin call
104
+ //////////////////////////////
105
+ @mixin isolation-span($Span, $Location, $clear: false, $grid: false, $gutter: false, $gutter-style: false, $from: false) {
106
+ $Options: ();
107
+ @if $clear {
108
+ $Options: map-merge($Options, ('clear': unquote($clear)));
109
+ }
110
+ @if $from {
111
+ $Options: map-merge($Options, ('from': $from));
112
+ }
156
113
 
157
- @mixin pull-isolation($span, $location, $columns: false, $gutter: false) {
158
- @include pull-float($span, $location, $columns, $gutter);
114
+ $Options: if(length($Options) > 0, $Options, null);
115
+ @include grid-span($Span, $Location, $grid, $gutter, 'isolation', $gutter-style, $Options);
159
116
  }
160
117
 
161
118
  //////////////////////////////
162
- // Happy Syntax for Isolation
119
+ // Happy Syntax of Asymmetric Grids
163
120
  //
164
- // Makes working with Isolation easier, as it moves Clear to a 1st class citizen of the mixin, and automatically builds the verbose grid-span mixin call
121
+ // Makes working with asymmetric grids easier!
165
122
  //////////////////////////////
166
- @mixin isolation-span($span, $location, $clear: false, $grid: false, $gutter: false) {
167
- @include grid-span($span, $location, $grid, $gutter, 'isolation', $clear);
123
+ @mixin asymmetric-span($Location, $Span: false, $grid: false, $gutter: false, $gutter-style: false, $from: false, $output-style: false) {
124
+
125
+ $Span: if($Span != false, $Span, 1);
126
+ $output-style: if($output-style != false, $output-style, sgs-get('asymmetric output'));
127
+
128
+ $Options: ();
129
+ @if $from {
130
+ $Options: map-merge($Options, ('from': $from));
131
+ }
132
+ $Options: if(length($Options) > 0, $Options, null);
133
+
134
+ @include grid-span($Span, $Location, $grid, $gutter, $output-style, $gutter-style, $Options);
168
135
  }
@@ -8,28 +8,46 @@
8
8
  // https://github.com/Team-Sass/Singularity/wiki/Creating-Grids
9
9
  // - $append-to-list : [list] A list to append to.
10
10
  // Defaults to $grids if none is specified.
11
- @function add-grid($grid-definition, $append-to-list: $grids) {
12
- $parsed: parse-add($grid-definition); // Converts the definiton to a temporary format:
13
- // either `((<grid>))` or `((<grid>) (<breakpoint>))`
14
- $grid: nth($parsed, 1); // E. g. `(<grid>)`.
15
- $breakpoint: nth($parsed, 2); // Either `(<breakpoint>)` or false.
16
- $list-length: length($append-to-list);
17
-
11
+ @function add-grid($grid-definition, $custom-map: false) {
12
+ $Parsed: parse-add($grid-definition); // Parses grid definition to grid/breakpoint
13
+ $Grid: nth($Parsed, 1); // E. g. `(<grid>)`.
14
+ $Breakpoint: nth($Parsed, 2); // Either `(<breakpoint>)` or false.
15
+ $Mobile-First: sgs-get('mobile first');
16
+ $Grid-Map: ();
17
+
18
+ // Determine if a custom map or the default maps should be used.
19
+ @if $custom-map {
20
+ $Grid-Map: $custom-map;
21
+ }
22
+ @else {
23
+ @if sgs-has('grids') {
24
+ $Grid-Map: sgs-get('grids');
25
+ }
26
+ }
27
+ $Grid-Key-Length: length(map-keys($Grid-Map));
28
+
18
29
  // Check whether the definition will be the first one in the list
19
30
  // and whether it has no breakpoint specified.
20
- @if $breakpoint == false and $list-length == 0 {
31
+ @if $Breakpoint == null {
21
32
  // Returns the first item of the list, e. g. `(<grid>)`
22
- @return $grid;
33
+ $Grid-Map: map-merge($Grid-Map, (-1px: $Grid));
23
34
  }
24
35
  // IF the list is initiated with a list of grid columns need to start off
25
36
  // a comma seprated list.
26
- @elseif $list-length > 1 and length(nth($append-to-list, 2)) == 1 {
27
- // Seed the first value and grid + breakpoint seperated by a comma.
28
- @return $append-to-list, ($grid $breakpoint);
29
- }
30
37
  @else {
31
- // Appends to a comma-separated list of definitions in the internal format
32
- // and returns it, e. g. `(<grid>), (<grid> <breakpoint>), (<grid> <breakpoint>)`
33
- @return append($append-to-list, ($grid $breakpoint), 'comma');
38
+ @if not (map-has-key($Grid-Map, -1px)) {
39
+ $Grid-Map: map-merge($Grid-Map, map-get($Singularity-Settings, 'grids'));
40
+ }
41
+ $Grid-Map: map-merge($Grid-Map, ($Breakpoint: $Grid));
34
42
  }
43
+
44
+ $Grid-Map: sort-map($Grid-Map, not $Mobile-First);
45
+
46
+ @return $Grid-Map;
35
47
  }
48
+
49
+
50
+ @mixin add-grid($grid-definition) {
51
+ $Add-Grid: add-grid($grid-definition);
52
+ $HOLDER: sgs-set('grids', $Add-Grid);
53
+ }
@@ -5,19 +5,17 @@
5
5
  // From Singularity
6
6
  // Must be using Breakpoint to work properly
7
7
  //////////////////////////////
8
- @function find-grid($user-columns: false) {
8
+ @function find-grid($user-columns: null) {
9
9
 
10
10
  // We supply a default if the user hasn't set any grids and hasn't passed in a custom column set
11
11
  // The default supplied is based on original Susy options
12
- @if length($grids) == 0 and $user-columns == false {
13
- $user-columns: 12;
14
- }
12
+ $Grids: sgs-get('grids');
15
13
 
16
- $found: find-object($grids, $user-columns);
14
+ $Found: find-object($Grids, $user-columns);
17
15
 
18
- @if length($found) == 1 {
19
- $found: nth($found, 1);
16
+ @if length($Found) == 1 {
17
+ $Found: nth($Found, 1);
20
18
  }
21
19
 
22
- @return $found;
20
+ @return $Found;
23
21
  }