susy 2.0.0.rc.2 → 2.0.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/VERSION +1 -1
- data/docs/changelog.rst +10 -0
- data/sass/susy/language/susy/_background.scss +113 -113
- data/sass/susy/language/susy/_container.scss +21 -21
- data/sass/susy/language/susy/_gutters.scss +50 -39
- data/sass/susy/language/susyone/_functions.scss +6 -1
- data/sass/susy/language/susyone/_grid.scss +7 -22
- metadata +5 -5
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: a6f0703eaf4d2da077dae12a6cc87086bc68788e
|
|
4
|
+
data.tar.gz: 0d2a5410f36d02ebf68f4149af66e7658dfd89b0
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: e3f227a8dc3d4cff8512a2ab2aaa637e9863ca16d941c4d3d6cd0084019501edd098f089c7b8b67dcb77fed5c417f7b98814e8cb3a7cb0d4b273fc24100af8df
|
|
7
|
+
data.tar.gz: b16019c24a18eabfbf85188230c489b4b5db282d756d781ed7abe4e06719b883806afbffc58d44678a0fc72d93807f3ca0740ea5217f52ef18d1bf019d9516c3
|
data/VERSION
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
2.0.0
|
|
1
|
+
2.0.0
|
data/docs/changelog.rst
CHANGED
|
@@ -1,6 +1,16 @@
|
|
|
1
1
|
Changelog
|
|
2
2
|
=========
|
|
3
3
|
|
|
4
|
+
2.0.0 — Mar 10 2013
|
|
5
|
+
-------------------
|
|
6
|
+
|
|
7
|
+
- New susyone tests for split-columns, is-default-layout, medialayout, columns,
|
|
8
|
+
relative-width, columns width and nth-of-type (using True).
|
|
9
|
+
- Sass 3.3.0 (Maptastic Maple)
|
|
10
|
+
- Rename local 2.0 variables that conflict with global susyone settings.
|
|
11
|
+
- Susyone container mixin applies full container settings at every breakpoint.
|
|
12
|
+
|
|
13
|
+
|
|
4
14
|
2.0.0.rc.2 — Mar 4 2014
|
|
5
15
|
-----------------------
|
|
6
16
|
|
|
@@ -11,9 +11,9 @@ $susy-overlay-grid-head-exists: false;
|
|
|
11
11
|
@mixin show-grid(
|
|
12
12
|
$grid: $susy
|
|
13
13
|
) {
|
|
14
|
-
$
|
|
14
|
+
$_output: debug-get(output, $grid);
|
|
15
15
|
|
|
16
|
-
@if $
|
|
16
|
+
@if $_output == overlay {
|
|
17
17
|
@include overlay-grid($grid);
|
|
18
18
|
} @else {
|
|
19
19
|
@include background-grid($grid);
|
|
@@ -33,19 +33,19 @@ $susy-overlay-grid-head-exists: false;
|
|
|
33
33
|
@mixin background-grid(
|
|
34
34
|
$grid: $susy
|
|
35
35
|
) {
|
|
36
|
-
$
|
|
36
|
+
$_output: get-background($grid);
|
|
37
37
|
|
|
38
|
-
@if length($
|
|
39
|
-
$
|
|
38
|
+
@if length($_output) > 0 {
|
|
39
|
+
$_flow: susy-get(flow, $grid);
|
|
40
40
|
|
|
41
|
-
$
|
|
42
|
-
@each $name, $layer in map-get($
|
|
43
|
-
$
|
|
44
|
-
$
|
|
41
|
+
$_image: ();
|
|
42
|
+
@each $name, $layer in map-get($_output, image) {
|
|
43
|
+
$_direction: if($name == baseline, to bottom, to to($_flow));
|
|
44
|
+
$_image: append($_image, linear-gradient($_direction, $layer...), comma);
|
|
45
45
|
}
|
|
46
|
-
$
|
|
46
|
+
$_output: map-merge($_output, (image: $_image));
|
|
47
47
|
|
|
48
|
-
@include background-grid-output($
|
|
48
|
+
@include background-grid-output($_output...);
|
|
49
49
|
}
|
|
50
50
|
}
|
|
51
51
|
|
|
@@ -101,19 +101,19 @@ $susy-overlay-grid-head-exists: false;
|
|
|
101
101
|
// ----------------------
|
|
102
102
|
// <head> styles to create grid overlay toggle
|
|
103
103
|
@mixin overlay-head {
|
|
104
|
-
$
|
|
105
|
-
$
|
|
106
|
-
$
|
|
104
|
+
$_toggle: debug-get(toggle);
|
|
105
|
+
$_horz: null;
|
|
106
|
+
$_vert: null;
|
|
107
107
|
|
|
108
|
-
@each $side in $
|
|
109
|
-
$
|
|
110
|
-
$
|
|
108
|
+
@each $side in $_toggle {
|
|
109
|
+
$_horz: if($side == left or $side == right, $side, $_horz);
|
|
110
|
+
$_vert: if($side == top or $side == bottom, $side, $_vert);
|
|
111
111
|
}
|
|
112
112
|
|
|
113
113
|
display: block;
|
|
114
114
|
position: fixed;
|
|
115
|
-
#{$
|
|
116
|
-
#{$
|
|
115
|
+
#{$_horz}: 10px;
|
|
116
|
+
#{$_vert}: 10px;
|
|
117
117
|
z-index: 999;
|
|
118
118
|
color: #333;
|
|
119
119
|
background: rgba(white, .25);
|
|
@@ -141,35 +141,35 @@ $susy-overlay-grid-head-exists: false;
|
|
|
141
141
|
$grid
|
|
142
142
|
) {
|
|
143
143
|
$grid : parse-grid($grid);
|
|
144
|
-
$
|
|
145
|
-
$
|
|
146
|
-
$
|
|
144
|
+
$_gutters : susy-get(gutters, $grid);
|
|
145
|
+
$_column-width : susy-get(column-width, $grid);
|
|
146
|
+
$_math : susy-get(math, $grid);
|
|
147
147
|
|
|
148
|
-
$
|
|
149
|
-
$
|
|
150
|
-
$
|
|
148
|
+
$_color : debug-get(color);
|
|
149
|
+
$_trans : transparent;
|
|
150
|
+
$_light : lighten($_color, 15%);
|
|
151
151
|
|
|
152
|
-
$
|
|
153
|
-
$
|
|
154
|
-
$
|
|
152
|
+
$_end : 1 + $_gutters;
|
|
153
|
+
$_after : percentage(1/$_end);
|
|
154
|
+
$_stops : ();
|
|
155
155
|
|
|
156
156
|
@if is-inside($grid) {
|
|
157
|
-
$
|
|
157
|
+
$_stops: $_color, $_light;
|
|
158
158
|
} @else if is-split($grid) {
|
|
159
|
-
$
|
|
160
|
-
$
|
|
161
|
-
$
|
|
162
|
-
$
|
|
159
|
+
$_split: $_gutters/2;
|
|
160
|
+
$_before: percentage($_split/$_end);
|
|
161
|
+
$_after: percentage((1 + $_split)/$_end);
|
|
162
|
+
$_stops: $_trans $_before, $_color $_before, $_light $_after, $_trans $_after;
|
|
163
163
|
} @else {
|
|
164
|
-
$
|
|
164
|
+
$_stops: $_color, $_light $_after, $_trans $_after;
|
|
165
165
|
}
|
|
166
166
|
|
|
167
|
-
$
|
|
168
|
-
image: (columns: $
|
|
169
|
-
size: if($
|
|
167
|
+
$_output: (
|
|
168
|
+
image: (columns: $_stops),
|
|
169
|
+
size: if($_math == static, $_column-width * $_end, span(1 $grid wide)),
|
|
170
170
|
);
|
|
171
171
|
|
|
172
|
-
@return $
|
|
172
|
+
@return $_output;
|
|
173
173
|
}
|
|
174
174
|
|
|
175
175
|
|
|
@@ -180,35 +180,35 @@ $susy-overlay-grid-head-exists: false;
|
|
|
180
180
|
$grid
|
|
181
181
|
) {
|
|
182
182
|
$grid : parse-grid($grid);
|
|
183
|
-
$
|
|
183
|
+
$_columns : susy-get(columns, $grid);
|
|
184
184
|
|
|
185
|
-
$
|
|
186
|
-
$
|
|
187
|
-
$
|
|
185
|
+
$_color : debug-get(color);
|
|
186
|
+
$_light : lighten($_color, 15%);
|
|
187
|
+
$_stops : ();
|
|
188
188
|
|
|
189
|
-
@for $location from 1 through column-count($
|
|
189
|
+
@for $location from 1 through column-count($_columns) {
|
|
190
190
|
$this-stop: ();
|
|
191
191
|
|
|
192
192
|
@if $location == 1 {
|
|
193
|
-
$this-stop: append($this-stop, $
|
|
193
|
+
$this-stop: append($this-stop, $_color, comma);
|
|
194
194
|
} @else {
|
|
195
195
|
$start: parse-span(1 at $location $grid);
|
|
196
196
|
$start: get-isolation($start);
|
|
197
|
-
$this-stop: append($this-stop, $
|
|
197
|
+
$this-stop: append($this-stop, $_color $start, comma);
|
|
198
198
|
}
|
|
199
199
|
|
|
200
|
-
@if $location == column-count($
|
|
201
|
-
$this-stop: append($this-stop, $
|
|
200
|
+
@if $location == column-count($_columns) {
|
|
201
|
+
$this-stop: append($this-stop, $_light, comma);
|
|
202
202
|
} @else {
|
|
203
|
-
$
|
|
204
|
-
$
|
|
205
|
-
$this-stop: append($this-stop, $
|
|
203
|
+
$_end: parse-span(1 at ($location + 1) $grid);
|
|
204
|
+
$_end: get-isolation($_end);
|
|
205
|
+
$this-stop: append($this-stop, $_light $_end, comma);
|
|
206
206
|
}
|
|
207
207
|
|
|
208
|
-
$
|
|
208
|
+
$_stops: join($_stops, $this-stop, comma);
|
|
209
209
|
}
|
|
210
210
|
|
|
211
|
-
@return $
|
|
211
|
+
@return $_stops;
|
|
212
212
|
}
|
|
213
213
|
|
|
214
214
|
|
|
@@ -219,28 +219,28 @@ $susy-overlay-grid-head-exists: false;
|
|
|
219
219
|
$grid
|
|
220
220
|
) {
|
|
221
221
|
$grid : parse-grid($grid);
|
|
222
|
-
$
|
|
222
|
+
$_columns : susy-get(columns, $grid);
|
|
223
223
|
|
|
224
|
-
$
|
|
225
|
-
$
|
|
226
|
-
$
|
|
224
|
+
$_color : debug-get(color);
|
|
225
|
+
$_light : lighten($_color, 15%);
|
|
226
|
+
$_stops : ();
|
|
227
227
|
|
|
228
|
-
@for $location from 1 through column-count($
|
|
228
|
+
@for $location from 1 through column-count($_columns) {
|
|
229
229
|
$this-stop: ();
|
|
230
230
|
|
|
231
231
|
$start: parse-span(1 at $location $grid);
|
|
232
232
|
$start: get-isolation($start);
|
|
233
233
|
$this-stop: append($this-stop, transparent $start, comma);
|
|
234
|
-
$this-stop: append($this-stop, $
|
|
234
|
+
$this-stop: append($this-stop, $_color $start, comma);
|
|
235
235
|
|
|
236
|
-
$
|
|
237
|
-
$this-stop: append($this-stop, $
|
|
238
|
-
$this-stop: append($this-stop, transparent $
|
|
236
|
+
$_end: $start + span(1 at $location $grid);
|
|
237
|
+
$this-stop: append($this-stop, $_light $_end, comma);
|
|
238
|
+
$this-stop: append($this-stop, transparent $_end, comma);
|
|
239
239
|
|
|
240
|
-
$
|
|
240
|
+
$_stops: join($_stops, $this-stop, comma);
|
|
241
241
|
}
|
|
242
242
|
|
|
243
|
-
@return $
|
|
243
|
+
@return $_stops;
|
|
244
244
|
}
|
|
245
245
|
|
|
246
246
|
|
|
@@ -251,40 +251,40 @@ $susy-overlay-grid-head-exists: false;
|
|
|
251
251
|
$grid
|
|
252
252
|
) {
|
|
253
253
|
$grid : parse-grid($grid);
|
|
254
|
-
$
|
|
254
|
+
$_columns : susy-get(columns, $grid);
|
|
255
255
|
|
|
256
|
-
$
|
|
257
|
-
$
|
|
258
|
-
$
|
|
259
|
-
$
|
|
256
|
+
$_color : debug-get(color);
|
|
257
|
+
$_light : lighten($_color, 15%);
|
|
258
|
+
$_trans : transparent;
|
|
259
|
+
$_stops : ();
|
|
260
260
|
|
|
261
|
-
@for $location from 1 through column-count($
|
|
261
|
+
@for $location from 1 through column-count($_columns) {
|
|
262
262
|
$this-stop: ();
|
|
263
263
|
|
|
264
264
|
@if $location == 1 {
|
|
265
|
-
$this-stop: append($this-stop, $
|
|
265
|
+
$this-stop: append($this-stop, $_color, comma);
|
|
266
266
|
} @else {
|
|
267
267
|
$start: parse-span(1 at $location $grid);
|
|
268
268
|
$start: get-isolation($start);
|
|
269
|
-
$this-stop: append($this-stop, $
|
|
269
|
+
$this-stop: append($this-stop, $_color $start, comma);
|
|
270
270
|
}
|
|
271
271
|
|
|
272
|
-
@if $location == column-count($
|
|
273
|
-
$this-stop: append($this-stop, $
|
|
272
|
+
@if $location == column-count($_columns) {
|
|
273
|
+
$this-stop: append($this-stop, $_light, comma);
|
|
274
274
|
} @else {
|
|
275
275
|
$gutter: get-span-width(first $location $grid);
|
|
276
276
|
|
|
277
|
-
$
|
|
278
|
-
$
|
|
277
|
+
$_end: parse-span(1 at ($location + 1) $grid);
|
|
278
|
+
$_end: get-isolation($_end);
|
|
279
279
|
|
|
280
|
-
$gutter: $
|
|
280
|
+
$gutter: $_light $gutter, $_trans $gutter, $_trans $_end;
|
|
281
281
|
$this-stop: join($this-stop, $gutter, comma);
|
|
282
282
|
}
|
|
283
283
|
|
|
284
|
-
$
|
|
284
|
+
$_stops: join($_stops, $this-stop, comma);
|
|
285
285
|
}
|
|
286
286
|
|
|
287
|
-
@return $
|
|
287
|
+
@return $_stops;
|
|
288
288
|
}
|
|
289
289
|
|
|
290
290
|
|
|
@@ -294,17 +294,17 @@ $susy-overlay-grid-head-exists: false;
|
|
|
294
294
|
@function get-background-asym(
|
|
295
295
|
$grid
|
|
296
296
|
) {
|
|
297
|
-
$
|
|
297
|
+
$_stops: ();
|
|
298
298
|
|
|
299
299
|
@if is-inside($grid) {
|
|
300
|
-
$
|
|
300
|
+
$_stops: get-asym-inside($grid);
|
|
301
301
|
} @else if is-split($grid) {
|
|
302
|
-
$
|
|
302
|
+
$_stops: get-asym-split($grid);
|
|
303
303
|
} @else {
|
|
304
|
-
$
|
|
304
|
+
$_stops: get-asym-outside($grid);
|
|
305
305
|
}
|
|
306
306
|
|
|
307
|
-
@return (image: (columns: $
|
|
307
|
+
@return (image: (columns: $_stops));
|
|
308
308
|
}
|
|
309
309
|
|
|
310
310
|
|
|
@@ -315,50 +315,50 @@ $susy-overlay-grid-head-exists: false;
|
|
|
315
315
|
$grid
|
|
316
316
|
) {
|
|
317
317
|
$grid : parse-grid($grid);
|
|
318
|
-
$
|
|
319
|
-
$
|
|
320
|
-
|
|
321
|
-
@if $
|
|
322
|
-
$
|
|
323
|
-
$
|
|
324
|
-
$
|
|
325
|
-
|
|
326
|
-
@if $
|
|
327
|
-
$
|
|
328
|
-
$
|
|
329
|
-
$
|
|
330
|
-
} @else if not $
|
|
318
|
+
$_show : susy-get(debug image, $grid);
|
|
319
|
+
$_return : ();
|
|
320
|
+
|
|
321
|
+
@if $_show and $_show != hide {
|
|
322
|
+
$_line-height: variable-exists(base-line-height);
|
|
323
|
+
$_line-height: if($_line-height, $base-line-height, false);
|
|
324
|
+
$_columns: susy-get(columns, $grid);
|
|
325
|
+
|
|
326
|
+
@if $_show != show-baseline {
|
|
327
|
+
$_sym: is-symmetrical($_columns);
|
|
328
|
+
$_return: if($_sym, get-background-sym($grid), get-background-asym($grid));
|
|
329
|
+
$_return: map-merge($_return, (clip: content-box));
|
|
330
|
+
} @else if not $_line-height {
|
|
331
331
|
@warn 'Please provide $base-line-height in order to see baseline grids.';
|
|
332
332
|
}
|
|
333
333
|
|
|
334
|
-
@if $
|
|
335
|
-
@if $
|
|
336
|
-
$
|
|
337
|
-
$
|
|
334
|
+
@if $_line-height {
|
|
335
|
+
@if $_show != show-columns {
|
|
336
|
+
$_color: variable-exists(grid-background-baseline-color);
|
|
337
|
+
$_color: if($_color, $grid-background-baseline-color, black);
|
|
338
338
|
|
|
339
|
-
$
|
|
340
|
-
$
|
|
341
|
-
$
|
|
342
|
-
$
|
|
339
|
+
$_image: map-get($_return, image);
|
|
340
|
+
$_size: map-get($_return, size);
|
|
341
|
+
$_baseline: (baseline: ($_color 5%, rgba($_color, 0) 5%));
|
|
342
|
+
$_baseline-size: 100% $_line-height;
|
|
343
343
|
|
|
344
|
-
$
|
|
345
|
-
image: if($
|
|
346
|
-
size: if($
|
|
344
|
+
$_return: map-merge($_return, (
|
|
345
|
+
image: if($_image, map-merge($_image, $_baseline), $_baseline),
|
|
346
|
+
size: if($_size, ($_size, $_baseline-size), $_baseline-size),
|
|
347
347
|
));
|
|
348
348
|
}
|
|
349
349
|
|
|
350
|
-
@if $
|
|
351
|
-
$
|
|
352
|
-
$
|
|
350
|
+
@if $_show == show {
|
|
351
|
+
$_clip: map-get($_return, clip);
|
|
352
|
+
$_return: map-merge($_return, (clip: join($_clip, border-box, comma)));
|
|
353
353
|
}
|
|
354
354
|
}
|
|
355
355
|
}
|
|
356
356
|
|
|
357
|
-
@if map-get($
|
|
358
|
-
$
|
|
357
|
+
@if map-get($_return, image) {
|
|
358
|
+
$_return: map-merge($_return, (flow: susy-get(flow, $grid)));
|
|
359
359
|
}
|
|
360
360
|
|
|
361
|
-
@return $
|
|
361
|
+
@return $_return;
|
|
362
362
|
}
|
|
363
363
|
|
|
364
364
|
|
|
@@ -10,17 +10,17 @@
|
|
|
10
10
|
) {
|
|
11
11
|
$layout : parse-grid($layout);
|
|
12
12
|
|
|
13
|
-
$
|
|
14
|
-
$
|
|
15
|
-
$
|
|
13
|
+
$_width : get-container-width($layout);
|
|
14
|
+
$_justify : parse-container-position(susy-get(container-position, $layout));
|
|
15
|
+
$_property : if(susy-get(math, $layout) == static, width, max-width);
|
|
16
16
|
|
|
17
|
-
$
|
|
17
|
+
$_box : susy-get(box-sizing, $layout);
|
|
18
18
|
|
|
19
|
-
@if $
|
|
20
|
-
@include output((box-sizing: $
|
|
19
|
+
@if $_box {
|
|
20
|
+
@include output((box-sizing: $_box));
|
|
21
21
|
}
|
|
22
22
|
|
|
23
|
-
@include float-container($
|
|
23
|
+
@include float-container($_width, $_justify, $_property);
|
|
24
24
|
@include show-grid($layout);
|
|
25
25
|
}
|
|
26
26
|
|
|
@@ -43,22 +43,22 @@
|
|
|
43
43
|
$layout: $susy
|
|
44
44
|
) {
|
|
45
45
|
$layout : parse-grid($layout);
|
|
46
|
-
$
|
|
47
|
-
$
|
|
46
|
+
$_width : susy-get(container, $layout);
|
|
47
|
+
$_column-width : susy-get(column-width, $layout);
|
|
48
48
|
|
|
49
|
-
@if not $
|
|
50
|
-
@if $
|
|
51
|
-
$
|
|
52
|
-
$
|
|
53
|
-
$
|
|
54
|
-
$
|
|
49
|
+
@if not $_width or $_width == auto {
|
|
50
|
+
@if $_column-width {
|
|
51
|
+
$_columns : susy-get(columns, $layout);
|
|
52
|
+
$_gutters : susy-get(gutters, $layout);
|
|
53
|
+
$_spread : if(is-split($layout), wide, narrow);
|
|
54
|
+
$_width : column-sum($_columns, $_gutters, $_spread) * $_column-width;
|
|
55
55
|
} @else {
|
|
56
56
|
// if we have nothing, default to 100%
|
|
57
|
-
$
|
|
57
|
+
$_width: 100%;
|
|
58
58
|
}
|
|
59
59
|
}
|
|
60
60
|
|
|
61
|
-
@return $
|
|
61
|
+
@return $_width;
|
|
62
62
|
}
|
|
63
63
|
|
|
64
64
|
// Parse Container Position
|
|
@@ -68,12 +68,12 @@
|
|
|
68
68
|
@function parse-container-position(
|
|
69
69
|
$justify: map-get($susy-defaults, container-position)
|
|
70
70
|
) {
|
|
71
|
-
$
|
|
71
|
+
$_return: if($justify == left, 0, auto) if($justify == right, 0, auto);
|
|
72
72
|
|
|
73
73
|
@if not index(left right center, $justify) {
|
|
74
|
-
$
|
|
75
|
-
$
|
|
74
|
+
$_return: nth($justify, 1);
|
|
75
|
+
$_return: $_return if(length($justify) > 1, nth($justify, 2), $_return);
|
|
76
76
|
}
|
|
77
77
|
|
|
78
|
-
@return $
|
|
78
|
+
@return $_return;
|
|
79
79
|
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
// Gutter Syntax
|
|
2
2
|
// =============
|
|
3
3
|
|
|
4
|
+
|
|
4
5
|
// Gutters
|
|
5
6
|
// -------
|
|
6
7
|
// Set gutters on an element.
|
|
@@ -9,17 +10,18 @@
|
|
|
9
10
|
$span: $susy
|
|
10
11
|
) {
|
|
11
12
|
$span: parse-gutters($span);
|
|
12
|
-
$
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
13
|
+
$_gutters: get-gutters($span);
|
|
14
|
+
|
|
15
|
+
$_output: (
|
|
16
|
+
before: map-get($_gutters, before),
|
|
17
|
+
after: map-get($_gutters, after),
|
|
16
18
|
flow: susy-get(flow, $span),
|
|
17
19
|
);
|
|
18
20
|
|
|
19
21
|
@if is-inside($span) {
|
|
20
|
-
@include padding-output($
|
|
22
|
+
@include padding-output($_output...);
|
|
21
23
|
} @else {
|
|
22
|
-
@include margin-output($
|
|
24
|
+
@include margin-output($_output...);
|
|
23
25
|
}
|
|
24
26
|
}
|
|
25
27
|
|
|
@@ -29,6 +31,7 @@
|
|
|
29
31
|
@include gutters($span);
|
|
30
32
|
}
|
|
31
33
|
|
|
34
|
+
|
|
32
35
|
// Gutter
|
|
33
36
|
// ------
|
|
34
37
|
// Return the width of a gutter.
|
|
@@ -38,10 +41,10 @@
|
|
|
38
41
|
) {
|
|
39
42
|
$span: parse-gutters($span);
|
|
40
43
|
|
|
41
|
-
$
|
|
42
|
-
$
|
|
44
|
+
$_gutters: get-gutters($span);
|
|
45
|
+
$_gutters: map-get($_gutters, before) or map-get($_gutters, after);
|
|
43
46
|
|
|
44
|
-
@return $
|
|
47
|
+
@return $_gutters;
|
|
45
48
|
}
|
|
46
49
|
|
|
47
50
|
@function gutters(
|
|
@@ -50,6 +53,7 @@
|
|
|
50
53
|
@return gutter($span);
|
|
51
54
|
}
|
|
52
55
|
|
|
56
|
+
|
|
53
57
|
// Get Gutter Width
|
|
54
58
|
// ----------------
|
|
55
59
|
// Return gutter width.
|
|
@@ -58,25 +62,27 @@
|
|
|
58
62
|
$context: $susy
|
|
59
63
|
) {
|
|
60
64
|
$context : parse-gutters($context);
|
|
61
|
-
$gutters : susy-get(gutters, $context);
|
|
62
|
-
$gutter : susy-get(gutter-override, $context);
|
|
63
65
|
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
66
|
+
$_gutters : susy-get(gutters, $context);
|
|
67
|
+
$_gutter : susy-get(gutter-override, $context);
|
|
68
|
+
|
|
69
|
+
@if $_gutters and ($_gutters > 0) and not $_gutter {
|
|
70
|
+
$_column-width: susy-get(column-width, $context);
|
|
71
|
+
@if $_column-width and gutter-math($context) == static {
|
|
72
|
+
$_gutter: $_gutters * $_column-width;
|
|
68
73
|
} @else {
|
|
69
|
-
$
|
|
70
|
-
$
|
|
71
|
-
$
|
|
74
|
+
$_columns : susy-get(columns, $context);
|
|
75
|
+
$_spread : if(is-split($context), wide, susy-get(spread, $context));
|
|
76
|
+
$_gutter : percentage($_gutters / column-sum($_columns, $_gutters, $_spread));
|
|
72
77
|
}
|
|
73
78
|
}
|
|
74
79
|
|
|
75
|
-
$
|
|
80
|
+
$_gutter: if($_gutter == 'no-gutters' or $_gutter == 'no-gutter', null, $_gutter);
|
|
76
81
|
|
|
77
|
-
@return $
|
|
82
|
+
@return $_gutter;
|
|
78
83
|
}
|
|
79
84
|
|
|
85
|
+
|
|
80
86
|
// Get Gutters
|
|
81
87
|
// -----------
|
|
82
88
|
// Return before and after gutter values.
|
|
@@ -84,21 +90,24 @@
|
|
|
84
90
|
@function get-gutters(
|
|
85
91
|
$context: $susy
|
|
86
92
|
) {
|
|
87
|
-
$context
|
|
88
|
-
|
|
89
|
-
$
|
|
90
|
-
$
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
93
|
+
$context : parse-gutters($context);
|
|
94
|
+
|
|
95
|
+
$_gutter-position : susy-get(gutter-position, $context);
|
|
96
|
+
$_gutter : get-gutter-width($context);
|
|
97
|
+
|
|
98
|
+
$_return : (before: null, after: null);
|
|
99
|
+
|
|
100
|
+
@if is-split($context) and $_gutter {
|
|
101
|
+
$_gutter: $_gutter / 2;
|
|
102
|
+
$_return: map-merge($_return, (before: $_gutter, after: $_gutter));
|
|
95
103
|
} @else {
|
|
96
|
-
$
|
|
104
|
+
$_return: map-merge($_return, ($_gutter-position: $_gutter));
|
|
97
105
|
}
|
|
98
106
|
|
|
99
|
-
@return $
|
|
107
|
+
@return $_return;
|
|
100
108
|
}
|
|
101
109
|
|
|
110
|
+
|
|
102
111
|
// Is Inside
|
|
103
112
|
// ---------
|
|
104
113
|
// Returns true if gutters are inside.
|
|
@@ -106,12 +115,13 @@
|
|
|
106
115
|
@function is-inside(
|
|
107
116
|
$context
|
|
108
117
|
) {
|
|
109
|
-
$
|
|
110
|
-
$
|
|
118
|
+
$_inside: inside inside-static;
|
|
119
|
+
$_gutter-position: susy-get(gutter-position, $context);
|
|
111
120
|
|
|
112
|
-
@return if(index($
|
|
121
|
+
@return if(index($_inside, $_gutter-position), true, false);
|
|
113
122
|
}
|
|
114
123
|
|
|
124
|
+
|
|
115
125
|
// Is Split
|
|
116
126
|
// --------
|
|
117
127
|
// Returns true if gutters are split.
|
|
@@ -119,12 +129,13 @@
|
|
|
119
129
|
@function is-split(
|
|
120
130
|
$context
|
|
121
131
|
) {
|
|
122
|
-
$
|
|
123
|
-
$
|
|
132
|
+
$_split: split inside inside-static;
|
|
133
|
+
$_gutter-position: susy-get(gutter-position, $context);
|
|
124
134
|
|
|
125
|
-
@return if(index($
|
|
135
|
+
@return if(index($_split, $_gutter-position), true, false);
|
|
126
136
|
}
|
|
127
137
|
|
|
138
|
+
|
|
128
139
|
// Gutter Math
|
|
129
140
|
// -----------
|
|
130
141
|
// Return the math to use for gutter calculations
|
|
@@ -132,8 +143,8 @@
|
|
|
132
143
|
@function gutter-math(
|
|
133
144
|
$context: $susy
|
|
134
145
|
) {
|
|
135
|
-
$
|
|
136
|
-
$
|
|
146
|
+
$_return : susy-get(math, $context);
|
|
147
|
+
$_return : if(susy-get(gutter-position, $context) == inside-static, static, $_return);
|
|
137
148
|
|
|
138
|
-
@return $
|
|
149
|
+
@return $_return;
|
|
139
150
|
}
|
|
@@ -245,7 +245,12 @@ $rem-with-px-fallback : true !default;
|
|
|
245
245
|
}
|
|
246
246
|
|
|
247
247
|
// This name will be deprecated...
|
|
248
|
-
@function absolute-ems(
|
|
248
|
+
@function absolute-ems(
|
|
249
|
+
$ems,
|
|
250
|
+
$font-size: $base-font-size
|
|
251
|
+
){
|
|
252
|
+
@return base-ems( $ems, $font-size);
|
|
253
|
+
}
|
|
249
254
|
|
|
250
255
|
// Return a length, after any em-values have been sent through absolute-ems().
|
|
251
256
|
//
|
|
@@ -64,31 +64,16 @@
|
|
|
64
64
|
// : Two optional lengths (representing min and max-width media-query breakpoints).
|
|
65
65
|
// $media-layout-2 ...-10 : [optional] Same as $media-layout-1
|
|
66
66
|
@mixin container(
|
|
67
|
-
$media-
|
|
68
|
-
$media-layout-2 : false,
|
|
69
|
-
$media-layout-3 : false,
|
|
70
|
-
$media-layout-4 : false,
|
|
71
|
-
$media-layout-5 : false,
|
|
72
|
-
$media-layout-6 : false,
|
|
73
|
-
$media-layout-7 : false,
|
|
74
|
-
$media-layout-8 : false,
|
|
75
|
-
$media-layout-9 : false,
|
|
76
|
-
$media-layout-10 : false
|
|
67
|
+
$media-layouts...
|
|
77
68
|
){
|
|
78
|
-
$media-layouts
|
|
79
|
-
|
|
80
|
-
@if is-default-layout($media-layout-1) {
|
|
81
|
-
@include apply-container();
|
|
82
|
-
} @else {
|
|
83
|
-
@include at-breakpoint($media-layout-1) {
|
|
84
|
-
@include apply-container();
|
|
85
|
-
}
|
|
86
|
-
}
|
|
69
|
+
$media-layouts: if(length($media-layouts) > 0, $media-layouts, $total-columns);
|
|
87
70
|
|
|
88
71
|
@each $ml in $media-layouts {
|
|
89
|
-
@if $ml {
|
|
72
|
+
@if is-default-layout($ml) {
|
|
73
|
+
@include apply-container;
|
|
74
|
+
} @else {
|
|
90
75
|
@include at-breakpoint($ml) {
|
|
91
|
-
@include
|
|
76
|
+
@include apply-container;
|
|
92
77
|
}
|
|
93
78
|
}
|
|
94
79
|
}
|
|
@@ -260,7 +245,7 @@
|
|
|
260
245
|
$style : fix-static-misalignment()
|
|
261
246
|
) {
|
|
262
247
|
$from : unquote($from);
|
|
263
|
-
|
|
248
|
+
|
|
264
249
|
&:#{format-nth($n,$selector)} {
|
|
265
250
|
@if $n == "first" {
|
|
266
251
|
@include remove-omega($context, $from, $style);
|
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: susy
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 2.0.0
|
|
4
|
+
version: 2.0.0
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Eric Suzanne
|
|
@@ -21,14 +21,14 @@ dependencies:
|
|
|
21
21
|
requirements:
|
|
22
22
|
- - ~>
|
|
23
23
|
- !ruby/object:Gem::Version
|
|
24
|
-
version: 3.3.0
|
|
24
|
+
version: 3.3.0
|
|
25
25
|
type: :runtime
|
|
26
26
|
prerelease: false
|
|
27
27
|
version_requirements: !ruby/object:Gem::Requirement
|
|
28
28
|
requirements:
|
|
29
29
|
- - ~>
|
|
30
30
|
- !ruby/object:Gem::Version
|
|
31
|
-
version: 3.3.0
|
|
31
|
+
version: 3.3.0
|
|
32
32
|
description: Susy is a toolkit for building layouts of all types with a simple, natural
|
|
33
33
|
syntax.
|
|
34
34
|
email:
|
|
@@ -127,9 +127,9 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
|
127
127
|
version: '0'
|
|
128
128
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
|
129
129
|
requirements:
|
|
130
|
-
- - '
|
|
130
|
+
- - '>='
|
|
131
131
|
- !ruby/object:Gem::Version
|
|
132
|
-
version: 1.
|
|
132
|
+
version: '1.2'
|
|
133
133
|
requirements: []
|
|
134
134
|
rubyforge_project: susy
|
|
135
135
|
rubygems_version: 2.1.10
|