susy 2.0.0.alpha.5 → 2.0.0.alpha.6
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/sass/susy/language/_susy.scss +1 -2
- data/sass/susy/language/susy/_bleed.scss +7 -41
- data/sass/susy/language/susy/_context.scss +3 -3
- data/sass/susy/language/susy/_gallery.scss +6 -6
- data/sass/susy/language/susy/_grids.scss +34 -0
- data/sass/susy/language/susy/_gutters.scss +10 -25
- data/sass/susy/language/susy/_isolate.scss +5 -5
- data/sass/susy/language/susy/_margins.scss +6 -6
- data/sass/susy/language/susy/_padding.scss +14 -9
- data/sass/susy/language/susy/_rows.scss +2 -2
- data/sass/susy/language/susy/_settings.scss +160 -1
- data/sass/susy/language/susy/_span.scss +18 -128
- metadata +2 -3
- data/sass/susy/language/_shared.scss +0 -4
- data/sass/susy/language/shared/_settings.scss +0 -104
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 9d9745f52ad903a2a78251d04371ec781709c112
|
4
|
+
data.tar.gz: 813b91ca3c0342062062b4ec627ac5a4c41ed8cb
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: c566795d29e1ee51da335d566ac39d339c47557970e69d749dc34243808fb4bf2d4dbd525e6fd4f31c6dc18cfbda7dc1070b7f36087c9ace2fa91cc6e8291841
|
7
|
+
data.tar.gz: 3cd5e4b3c2474377dbc1595b0097b564b5a5df032fcdc4dff3228fe0e823e4ceb6a3cf16196212992db3d022e3b3a7bd9aa020bbe0fc4ec1eedfcfed436b1000
|
data/VERSION
CHANGED
@@ -1 +1 @@
|
|
1
|
-
2.0.0.alpha.
|
1
|
+
2.0.0.alpha.5
|
@@ -8,9 +8,8 @@
|
|
8
8
|
@mixin bleed(
|
9
9
|
$bleed: 0 gutter()
|
10
10
|
) {
|
11
|
-
$bleed : parse-
|
12
|
-
$
|
13
|
-
$trbl : span-get(span, $bleed);
|
11
|
+
$bleed : parse-span($bleed);
|
12
|
+
$trbl : susy-get(span, $bleed);
|
14
13
|
$spans : (top: 0, right: 0, bottom: 0, left: 0);
|
15
14
|
|
16
15
|
$i: 1;
|
@@ -31,7 +30,7 @@
|
|
31
30
|
@each $side, $span in $spans {
|
32
31
|
$padding: $span;
|
33
32
|
@if is-inside($bleed) and ($side == right or $side == left) {
|
34
|
-
$gutter: gutter($
|
33
|
+
$gutter: gutter($bleed);
|
35
34
|
$padding: if(comparable($padding, $gutter), $padding + $gutter, $padding);
|
36
35
|
}
|
37
36
|
margin-#{$side}: if($span != 0, 0 - $span, null);
|
@@ -44,8 +43,8 @@
|
|
44
43
|
@mixin bleed-x(
|
45
44
|
$bleed: gutter()
|
46
45
|
) {
|
47
|
-
$bleed : parse-
|
48
|
-
$trbl :
|
46
|
+
$bleed : parse-span($bleed);
|
47
|
+
$trbl : susy-get(span, $bleed);
|
49
48
|
|
50
49
|
@if length($trbl) == 1 {
|
51
50
|
$bleed: map-merge($bleed, (span: 0 nth($trbl, 1)));
|
@@ -61,8 +60,8 @@
|
|
61
60
|
@mixin bleed-y(
|
62
61
|
$bleed: if(function-exists(rhythm), rhythm(1), 1em)
|
63
62
|
) {
|
64
|
-
$bleed : parse-
|
65
|
-
$trbl :
|
63
|
+
$bleed : parse-span($bleed);
|
64
|
+
$trbl : susy-get(span, $bleed);
|
66
65
|
|
67
66
|
@if length($trbl) == 1 {
|
68
67
|
$bleed: map-merge($bleed, (span: nth($trbl, 1) 0));
|
@@ -74,36 +73,3 @@
|
|
74
73
|
|
75
74
|
@include bleed($bleed);
|
76
75
|
}
|
77
|
-
|
78
|
-
// Parse Bleed
|
79
|
-
// -----------
|
80
|
-
// Parse the bleed syntax, returning a TRBL list of spans
|
81
|
-
// - $bleed: <bleed>
|
82
|
-
@function parse-bleed(
|
83
|
-
$bleed
|
84
|
-
) {
|
85
|
-
$return: $bleed;
|
86
|
-
|
87
|
-
@if type-of($bleed) != map {
|
88
|
-
$return: parse-span($bleed);
|
89
|
-
$span-list: ();
|
90
|
-
$keywords: false;
|
91
|
-
$i: 1;
|
92
|
-
|
93
|
-
@while not $keywords and $i <= length($bleed) {
|
94
|
-
$item: nth($bleed, $i);
|
95
|
-
|
96
|
-
@if type-of($item) == number {
|
97
|
-
$span-list: append($span-list, $item);
|
98
|
-
} @else {
|
99
|
-
$keywords: true;
|
100
|
-
}
|
101
|
-
|
102
|
-
$i: $i + 1;
|
103
|
-
}
|
104
|
-
|
105
|
-
$return: map-merge($return, (span: $span-list));
|
106
|
-
}
|
107
|
-
|
108
|
-
@return map-merge($return, (spread: wide));
|
109
|
-
}
|
@@ -9,9 +9,9 @@
|
|
9
9
|
$context
|
10
10
|
) {
|
11
11
|
$context : parse-span($context);
|
12
|
-
$span :
|
13
|
-
$location :
|
14
|
-
$columns :
|
12
|
+
$span : susy-get(span, $context);
|
13
|
+
$location : susy-get(location, $context);
|
14
|
+
$columns : susy-get(columns, $context);
|
15
15
|
|
16
16
|
@return get-columns($span, $location, $columns);
|
17
17
|
}
|
@@ -13,12 +13,12 @@
|
|
13
13
|
$layout : parse-span($layout);
|
14
14
|
$layout : map-merge($layout, (location: 1));
|
15
15
|
|
16
|
-
$span :
|
17
|
-
$columns :
|
16
|
+
$span : susy-get(span, $layout);
|
17
|
+
$columns : susy-get(columns, $layout);
|
18
18
|
$context : column-count($columns);
|
19
|
-
$flow :
|
19
|
+
$flow : susy-get(flow, $layout);
|
20
20
|
|
21
|
-
$box :
|
21
|
+
$box : susy-get(box-sizing, $layout);
|
22
22
|
$inside : is-inside($layout);
|
23
23
|
$from : from($flow);
|
24
24
|
$line : floor($context / $span);
|
@@ -73,7 +73,7 @@
|
|
73
73
|
// Individual Output
|
74
74
|
@include float-span-output($output...);
|
75
75
|
|
76
|
-
@if is-first(
|
76
|
+
@if is-first(susy-get(location, $layout)) {
|
77
77
|
@include first($layout);
|
78
78
|
clear: $from;
|
79
79
|
} @else {
|
@@ -81,7 +81,7 @@
|
|
81
81
|
}
|
82
82
|
|
83
83
|
// Individual Location Increment
|
84
|
-
$location:
|
84
|
+
$location: susy-get(location, $layout) + $span;
|
85
85
|
$location: if($location > $context, 1, $location);
|
86
86
|
$layout: map-merge($layout, (location: $location));
|
87
87
|
}
|
@@ -0,0 +1,34 @@
|
|
1
|
+
// Grid Syntax
|
2
|
+
// ===========
|
3
|
+
|
4
|
+
// Set Grid
|
5
|
+
// --------
|
6
|
+
// Set a new grid using a shorthand
|
7
|
+
// - $grid : <settings>
|
8
|
+
@mixin set-grid(
|
9
|
+
$grid
|
10
|
+
) {
|
11
|
+
$susy: map-merge($susy, parse-grid($grid)) !global;
|
12
|
+
}
|
13
|
+
|
14
|
+
// Alternative syntax
|
15
|
+
@mixin susy-set(
|
16
|
+
$grid
|
17
|
+
) {
|
18
|
+
@include set-grid($grid);
|
19
|
+
}
|
20
|
+
|
21
|
+
// Use Grid
|
22
|
+
// --------
|
23
|
+
// Use an arbitrary grid for a section of code
|
24
|
+
// - $grid : <settings>
|
25
|
+
@mixin use-grid(
|
26
|
+
$grid
|
27
|
+
) {
|
28
|
+
$old: $susy;
|
29
|
+
|
30
|
+
@include set-grid($grid);
|
31
|
+
@content;
|
32
|
+
|
33
|
+
$susy: $old !global;
|
34
|
+
}
|
@@ -13,7 +13,7 @@
|
|
13
13
|
$output : (
|
14
14
|
before: map-get($gutters, before),
|
15
15
|
after: map-get($gutters, after),
|
16
|
-
flow:
|
16
|
+
flow: susy-get(flow, $context),
|
17
17
|
);
|
18
18
|
|
19
19
|
@if is-inside($context) {
|
@@ -50,23 +50,6 @@
|
|
50
50
|
@return gutter($context);
|
51
51
|
}
|
52
52
|
|
53
|
-
// Parse Gutters
|
54
|
-
// -------------
|
55
|
-
// Return context with override value set
|
56
|
-
// $context: <context>
|
57
|
-
@function parse-gutters(
|
58
|
-
$context: $susy
|
59
|
-
) {
|
60
|
-
$context : parse-span($context);
|
61
|
-
$override : span-get(gutter-override, $context) or span-get(span, $context);
|
62
|
-
|
63
|
-
@if $override and not unitless($override) {
|
64
|
-
$context: map-merge($context, (gutter-override: $override));
|
65
|
-
}
|
66
|
-
|
67
|
-
@return $context;
|
68
|
-
}
|
69
|
-
|
70
53
|
// Get Gutter Width
|
71
54
|
// ----------------
|
72
55
|
// Return gutter width.
|
@@ -75,20 +58,22 @@
|
|
75
58
|
$context: $susy
|
76
59
|
) {
|
77
60
|
$context : parse-gutters($context);
|
78
|
-
$gutter :
|
61
|
+
$gutter : susy-get(gutter-override, $context);
|
79
62
|
|
80
63
|
@if not $gutter {
|
81
|
-
$gutters:
|
82
|
-
$column-width:
|
64
|
+
$gutters: susy-get(gutters, $context);
|
65
|
+
$column-width: susy-get(column-width, $context);
|
83
66
|
@if $column-width and gutter-math($context) == static {
|
84
67
|
$gutter: $gutters * $column-width;
|
85
68
|
} @else {
|
86
|
-
$columns :
|
87
|
-
$spread
|
69
|
+
$columns : susy-get(columns, $context);
|
70
|
+
$spread : if(is-split($context), wide, susy-get(spread, $context));
|
88
71
|
$gutter : percentage($gutters / column-sum($columns, $gutters, $spread));
|
89
72
|
}
|
90
73
|
}
|
91
74
|
|
75
|
+
$gutter: if($gutter == 'no-gutters' or $gutter == 'no-gutter', null, $gutter);
|
76
|
+
|
92
77
|
@return $gutter;
|
93
78
|
}
|
94
79
|
|
@@ -100,11 +85,11 @@
|
|
100
85
|
$context: $susy
|
101
86
|
) {
|
102
87
|
$context : parse-gutters($context);
|
103
|
-
$gutter-position :
|
88
|
+
$gutter-position : susy-get(gutter-position, $context);
|
104
89
|
$gutter : get-gutter-width($context);
|
105
90
|
$return : (before: null, after: null);
|
106
91
|
|
107
|
-
@if is-split($context) {
|
92
|
+
@if is-split($context) and $gutter {
|
108
93
|
$gutter: $gutter / 2;
|
109
94
|
$return: map-merge($return, (before: $gutter, after: $gutter));
|
110
95
|
} @else {
|
@@ -11,7 +11,7 @@
|
|
11
11
|
$input : parse-span($input);
|
12
12
|
$output : (
|
13
13
|
push: get-isolation($input),
|
14
|
-
flow:
|
14
|
+
flow: susy-get(flow, $input),
|
15
15
|
);
|
16
16
|
|
17
17
|
@include isolate-output($output...);
|
@@ -24,9 +24,9 @@
|
|
24
24
|
@function get-isolation(
|
25
25
|
$input
|
26
26
|
) {
|
27
|
-
$span :
|
28
|
-
$location :
|
29
|
-
$columns :
|
27
|
+
$span : susy-get(span, $input);
|
28
|
+
$location : susy-get(location, $input);
|
29
|
+
$columns : susy-get(columns, $input);
|
30
30
|
$width : null;
|
31
31
|
|
32
32
|
@if type-of($location) == number and not unitless($location) {
|
@@ -43,7 +43,7 @@
|
|
43
43
|
}
|
44
44
|
}
|
45
45
|
|
46
|
-
@if
|
46
|
+
@if susy-get(gutter-position, $input) == split {
|
47
47
|
$width: if($width == null, gutters($input), $width + gutters($input));
|
48
48
|
}
|
49
49
|
|
@@ -9,8 +9,8 @@
|
|
9
9
|
$span
|
10
10
|
) {
|
11
11
|
$span : map-merge((spread: wide), parse-span($span));
|
12
|
-
$flow :
|
13
|
-
$split : if(
|
12
|
+
$flow : susy-get(flow, $span);
|
13
|
+
$split : if(susy-get(gutter-position, $span) == split, true, false);
|
14
14
|
$width : if($split, span($span) + gutter($span), span($span));
|
15
15
|
|
16
16
|
@include margin-output($width, null, $flow);
|
@@ -24,8 +24,8 @@
|
|
24
24
|
$span
|
25
25
|
) {
|
26
26
|
$span : map-merge((spread: wide), parse-span($span));
|
27
|
-
$flow :
|
28
|
-
$split : if(
|
27
|
+
$flow : susy-get(flow, $span);
|
28
|
+
$split : if(susy-get(gutter-position, $span) == split, true, false);
|
29
29
|
$width : if($split, span($span) + gutter($span), span($span));
|
30
30
|
|
31
31
|
@include margin-output(null, $width, $flow);
|
@@ -49,8 +49,8 @@
|
|
49
49
|
$span
|
50
50
|
) {
|
51
51
|
$span : map-merge((spread: wide), parse-span($span));
|
52
|
-
$flow :
|
53
|
-
$split : if(
|
52
|
+
$flow : susy-get(flow, $span);
|
53
|
+
$split : if(susy-get(gutter-position, $span) == split, true, false);
|
54
54
|
$width : if($split, 0 - span($span) + gutter($span), 0 - span($span));
|
55
55
|
|
56
56
|
@include margin-output($width, null, $flow);
|
@@ -9,9 +9,14 @@
|
|
9
9
|
$span
|
10
10
|
) {
|
11
11
|
$span : map-merge((spread: wide), parse-span($span));
|
12
|
-
$flow :
|
12
|
+
$flow : susy-get(flow, $span);
|
13
13
|
$width : span($span);
|
14
14
|
|
15
|
+
@if is-inside($span) {
|
16
|
+
$gutter: gutter($span);
|
17
|
+
$width: if($gutter and comparable($width, $gutter), $width + $gutter, $width);
|
18
|
+
}
|
19
|
+
|
15
20
|
@include padding-output($width, null, $flow);
|
16
21
|
}
|
17
22
|
|
@@ -23,9 +28,14 @@
|
|
23
28
|
$span
|
24
29
|
) {
|
25
30
|
$span : map-merge((spread: wide), parse-span($span));
|
26
|
-
$flow :
|
31
|
+
$flow : susy-get(flow, $span);
|
27
32
|
$width : span($span);
|
28
33
|
|
34
|
+
@if is-inside($span) {
|
35
|
+
$gutter: gutter($span);
|
36
|
+
$width: if($gutter and comparable($width, $gutter), $width + $gutter, $width);
|
37
|
+
}
|
38
|
+
|
29
39
|
@include padding-output(null, $width, $flow);
|
30
40
|
}
|
31
41
|
|
@@ -42,11 +52,6 @@
|
|
42
52
|
$pre : map-merge((spread: wide), parse-span($pre));
|
43
53
|
$post : map-merge((spread: wide), parse-span($post));
|
44
54
|
|
45
|
-
|
46
|
-
|
47
|
-
after: span($post),
|
48
|
-
flow: span-get(flow, $pre) or span-get(flow, $post),
|
49
|
-
);
|
50
|
-
|
51
|
-
@include padding-output($output...);
|
55
|
+
@include prefix($pre);
|
56
|
+
@include suffix($post);
|
52
57
|
}
|
@@ -33,8 +33,8 @@
|
|
33
33
|
) {
|
34
34
|
$span: parse-span($span);
|
35
35
|
|
36
|
-
@include row(
|
37
|
-
@if is-split($span) and not
|
36
|
+
@include row(susy-get(flow, $span));
|
37
|
+
@if is-split($span) and not susy-get(is-container, $span) {
|
38
38
|
@include gutters($span);
|
39
39
|
}
|
40
40
|
float: none;
|
@@ -26,10 +26,11 @@ $susy-keywords: (
|
|
26
26
|
container-position: left center right,
|
27
27
|
flow: ltr rtl,
|
28
28
|
show-grids: show hide show-columns show-baseline,
|
29
|
-
gutter-position: before after split inside inside-static
|
29
|
+
gutter-position: before after split inside inside-static,
|
30
30
|
box-sizing: border-box content-box,
|
31
31
|
location: first alpha last omega,
|
32
32
|
spread: narrow wide wider,
|
33
|
+
gutter-override: no-gutters no-gutter,
|
33
34
|
is-container: container,
|
34
35
|
);
|
35
36
|
|
@@ -39,3 +40,161 @@ $susy-keywords: (
|
|
39
40
|
// - Set EITHER $column-width OR $container
|
40
41
|
// - Use $column-width for static layouts
|
41
42
|
$susy: () !default;
|
43
|
+
|
44
|
+
// Parse Susy Keywords and Maps
|
45
|
+
// ----------------------------
|
46
|
+
@function parse-settings(
|
47
|
+
$short: $susy
|
48
|
+
) {
|
49
|
+
$return: ();
|
50
|
+
|
51
|
+
@if type-of($short) == map {
|
52
|
+
$return: $short;
|
53
|
+
} @else {
|
54
|
+
@each $item in $short {
|
55
|
+
// strings
|
56
|
+
@if type-of($item) == string {
|
57
|
+
@each $key, $value in $susy-keywords {
|
58
|
+
@if index($value, $item) {
|
59
|
+
$return: map-merge($return, ($key: $item));
|
60
|
+
}
|
61
|
+
}
|
62
|
+
// maps
|
63
|
+
} @else if type-of($item) == map {
|
64
|
+
$return: map-merge($return, $item);
|
65
|
+
}
|
66
|
+
}
|
67
|
+
}
|
68
|
+
|
69
|
+
@return $return;
|
70
|
+
}
|
71
|
+
|
72
|
+
// Parse Columns & Gutters
|
73
|
+
// -----------------------
|
74
|
+
@function parse-layout(
|
75
|
+
$short
|
76
|
+
) {
|
77
|
+
$return: ();
|
78
|
+
$columns: ();
|
79
|
+
$gutters: null;
|
80
|
+
|
81
|
+
@if not unitless(nth(nth($short, 1), 1)) {
|
82
|
+
$gutters: nth($short, 1);
|
83
|
+
} @else {
|
84
|
+
$columns: (columns: nth($short, 1));
|
85
|
+
$gutters: if(length($short) > 1, nth($short, 2), $gutters);
|
86
|
+
}
|
87
|
+
|
88
|
+
@if type-of($gutters) == list and length($gutters) > 0 {
|
89
|
+
$gutters: (
|
90
|
+
gutters: nth($gutters, 2) / nth($gutters, 1),
|
91
|
+
column-width: nth($gutters, 1),
|
92
|
+
);
|
93
|
+
} @else {
|
94
|
+
$gutters: if($gutters, (gutters: $gutters), ());
|
95
|
+
}
|
96
|
+
|
97
|
+
$return: map-merge($return, $columns);
|
98
|
+
$return: map-merge($return, $gutters);
|
99
|
+
|
100
|
+
@return $return;
|
101
|
+
}
|
102
|
+
|
103
|
+
// Parse Grid/Context
|
104
|
+
// ------------------
|
105
|
+
@function parse-grid(
|
106
|
+
$short: $susy
|
107
|
+
) {
|
108
|
+
$return: parse-settings($short);
|
109
|
+
$layout: ();
|
110
|
+
|
111
|
+
@if type-of($short) == map {
|
112
|
+
$return: $short;
|
113
|
+
} @else {
|
114
|
+
@each $item in $short {
|
115
|
+
// number or list
|
116
|
+
@if type-of($item) == number or type-of($item) == list {
|
117
|
+
@if type-of($item) == list or unitless($item) {
|
118
|
+
$layout: append($layout, $item);
|
119
|
+
} @else {
|
120
|
+
$return: map-merge($return, (container: $item));
|
121
|
+
}
|
122
|
+
}
|
123
|
+
}
|
124
|
+
|
125
|
+
$layout: if(length($layout) > 0, parse-layout($layout), $layout);
|
126
|
+
}
|
127
|
+
|
128
|
+
@return map-merge($return, $layout);
|
129
|
+
}
|
130
|
+
|
131
|
+
// Parse Span
|
132
|
+
// ----------
|
133
|
+
@function parse-span(
|
134
|
+
$short,
|
135
|
+
$key: span
|
136
|
+
) {
|
137
|
+
$return: ();
|
138
|
+
|
139
|
+
@if type-of($short) == map {
|
140
|
+
$return: $short;
|
141
|
+
} @else {
|
142
|
+
$at: index($short, at);
|
143
|
+
|
144
|
+
@if $at {
|
145
|
+
$loci: $at + 1;
|
146
|
+
$location: nth($short, $loci);
|
147
|
+
$return: map-merge($return, (location: $location));
|
148
|
+
$short: set-nth($short, $at, null);
|
149
|
+
$short: set-nth($short, $loci, null);
|
150
|
+
}
|
151
|
+
|
152
|
+
$i: 1;
|
153
|
+
$span: ();
|
154
|
+
|
155
|
+
@while $i <= length($short) {
|
156
|
+
$this: nth($short, $i);
|
157
|
+
|
158
|
+
@if type-of($this) == number {
|
159
|
+
$span: append($span, $this);
|
160
|
+
$short: set-nth($short, $i, null);
|
161
|
+
} @else if $this == of {
|
162
|
+
$short: set-nth($short, $i, null);
|
163
|
+
$i: length($short) + 1;
|
164
|
+
}
|
165
|
+
|
166
|
+
$i: $i + 1;
|
167
|
+
}
|
168
|
+
|
169
|
+
@if length($span) > 0 {
|
170
|
+
$span: if(length($span) == 1, nth($span, 1), $span);
|
171
|
+
$return: map-merge($return, ($key: $span));
|
172
|
+
}
|
173
|
+
|
174
|
+
$return: map-merge($return, parse-grid($short));
|
175
|
+
}
|
176
|
+
|
177
|
+
@return $return;
|
178
|
+
}
|
179
|
+
|
180
|
+
// Parse Gutters
|
181
|
+
// -------------
|
182
|
+
@function parse-gutters(
|
183
|
+
$short: $susy
|
184
|
+
) {
|
185
|
+
@return parse-span($short, gutter-override);
|
186
|
+
}
|
187
|
+
|
188
|
+
// Susy Get
|
189
|
+
// --------
|
190
|
+
// Return one setting from a grid
|
191
|
+
// - $key : <keyword>
|
192
|
+
// - $grid : <settings>
|
193
|
+
@function susy-get(
|
194
|
+
$key,
|
195
|
+
$grid: map-merge($susy-defaults, $susy)
|
196
|
+
) {
|
197
|
+
$grid: parse-grid($grid);
|
198
|
+
|
199
|
+
@return map-get($grid, $key) or map-get($susy, $key) or map-get($susy-defaults, $key);
|
200
|
+
}
|
@@ -10,7 +10,7 @@
|
|
10
10
|
) {
|
11
11
|
$span : parse-span($span);
|
12
12
|
$output : span-math($span);
|
13
|
-
$box :
|
13
|
+
$box : susy-get(box-sizing, $span) or if(is-inside($span), border-box, null);
|
14
14
|
|
15
15
|
@include susy-box-sizing($box);
|
16
16
|
@include float-span-output($output...);
|
@@ -24,101 +24,7 @@
|
|
24
24
|
@function span(
|
25
25
|
$span
|
26
26
|
) {
|
27
|
-
@return get-span-width(
|
28
|
-
}
|
29
|
-
|
30
|
-
// Parse Span
|
31
|
-
// ----------
|
32
|
-
// Parse the span shortcut syntax.
|
33
|
-
// - $string : <span>
|
34
|
-
@function parse-span(
|
35
|
-
$string
|
36
|
-
) {
|
37
|
-
@if type-of($string) == map {
|
38
|
-
@return $string;
|
39
|
-
} @else {
|
40
|
-
$return: map-merge($susy-defaults, $susy);
|
41
|
-
$i: 1;
|
42
|
-
|
43
|
-
@while $i <= length($string) {
|
44
|
-
$item : nth($string,$i);
|
45
|
-
$at : false;
|
46
|
-
$of : false;
|
47
|
-
$gutter : false;
|
48
|
-
|
49
|
-
// maps
|
50
|
-
@if type-of($item) == map {
|
51
|
-
$return: map-merge($return, $item);
|
52
|
-
|
53
|
-
// keywords
|
54
|
-
} @else if type-of($item) == string {
|
55
|
-
|
56
|
-
// at, of, gutter
|
57
|
-
@if index(at of gutter gutters, $item) {
|
58
|
-
$at: index(at, $item);
|
59
|
-
$of: index(of, $item);
|
60
|
-
$gutter: index(gutter gutters, $item);
|
61
|
-
} @else {
|
62
|
-
@each $key, $value in $susy-keywords {
|
63
|
-
@if index($value, $item) {
|
64
|
-
$return: map-merge($return, ($key: $item));
|
65
|
-
}
|
66
|
-
}
|
67
|
-
}
|
68
|
-
|
69
|
-
// span
|
70
|
-
} @else if not map-get($return, span) and type-of($item) == number {
|
71
|
-
$return: map-merge($return, (span: $item));
|
72
|
-
}
|
73
|
-
|
74
|
-
// location integer
|
75
|
-
@if $at {
|
76
|
-
$i: $i + 1;
|
77
|
-
$return: map-merge($return, (location: nth($string, $i)));
|
78
|
-
}
|
79
|
-
|
80
|
-
// gutter override
|
81
|
-
@if $gutter {
|
82
|
-
$i: $i + 1;
|
83
|
-
$return: map-merge($return, (gutter-override: nth($string, $i)));
|
84
|
-
}
|
85
|
-
|
86
|
-
// context
|
87
|
-
@if $of {
|
88
|
-
$i: $i + 1;
|
89
|
-
$context: ();
|
90
|
-
|
91
|
-
@while $of and $i <= length($string) {
|
92
|
-
$this: nth($string,$i);
|
93
|
-
@if type-of($this) != string {
|
94
|
-
$context: append($context, $this);
|
95
|
-
$i: $i + 1;
|
96
|
-
} @else {
|
97
|
-
$of: false;
|
98
|
-
$i: $i - 1;
|
99
|
-
}
|
100
|
-
}
|
101
|
-
|
102
|
-
$return: map-merge($return, parse-grid($context));
|
103
|
-
}
|
104
|
-
|
105
|
-
$i: $i + 1;
|
106
|
-
}
|
107
|
-
|
108
|
-
@return $return;
|
109
|
-
}
|
110
|
-
}
|
111
|
-
|
112
|
-
// Get Span Setting
|
113
|
-
// ----------------
|
114
|
-
// Return one particular span setting from a list.
|
115
|
-
// - $setting : <keyword> (see $options below)
|
116
|
-
// - $span : <span>
|
117
|
-
@function span-get(
|
118
|
-
$key,
|
119
|
-
$span
|
120
|
-
) {
|
121
|
-
@return map-get(parse-span($span), $key) or map-get($susy-defaults, $key);
|
27
|
+
@return get-span-width($span);
|
122
28
|
}
|
123
29
|
|
124
30
|
// Span Math
|
@@ -128,7 +34,7 @@
|
|
128
34
|
@function span-math(
|
129
35
|
$span
|
130
36
|
) {
|
131
|
-
$split-container : if(is-split($span) and
|
37
|
+
$split-container : if(is-split($span) and susy-get(is-container, $span), true, false);
|
132
38
|
|
133
39
|
$float : from;
|
134
40
|
$padding-before : null;
|
@@ -144,7 +50,7 @@
|
|
144
50
|
|
145
51
|
// apply gutters
|
146
52
|
@if is-inside($span) {
|
147
|
-
@if not
|
53
|
+
@if not susy-get(is-container, $span) {
|
148
54
|
$padding-before: map-get($gutters, before);
|
149
55
|
$padding-after: map-get($gutters, after);
|
150
56
|
}
|
@@ -156,16 +62,16 @@
|
|
156
62
|
}
|
157
63
|
|
158
64
|
// special margin handling
|
159
|
-
@if
|
65
|
+
@if susy-get(layout-method, $span) == isolate {
|
160
66
|
$margin-before: get-isolation($span);
|
161
67
|
$margin-after: -100%;
|
162
68
|
} @else {
|
163
|
-
$location:
|
69
|
+
$location: susy-get(location, $span);
|
164
70
|
@if $location {
|
165
|
-
$last: is-last(
|
71
|
+
$last: is-last(susy-get(span, $span), $location, susy-get(columns, $span));
|
166
72
|
$is-split: is-split($span);
|
167
73
|
@if $last {
|
168
|
-
$float:
|
74
|
+
$float: susy-get(last-flow, $span);
|
169
75
|
$margin-after: if($is-split, $margin-after, null);
|
170
76
|
} @else if is-first($location) {
|
171
77
|
$margin-before: if($is-split, $margin-before, null);
|
@@ -180,7 +86,7 @@
|
|
180
86
|
margin_after : $margin-after,
|
181
87
|
padding_before : $padding-before,
|
182
88
|
padding_after : $padding-after,
|
183
|
-
flow :
|
89
|
+
flow : susy-get(flow, $span),
|
184
90
|
);
|
185
91
|
}
|
186
92
|
|
@@ -191,11 +97,13 @@
|
|
191
97
|
@function get-span-width(
|
192
98
|
$span
|
193
99
|
) {
|
194
|
-
$
|
195
|
-
|
196
|
-
$
|
197
|
-
$
|
198
|
-
$
|
100
|
+
$span : parse-span($span);
|
101
|
+
|
102
|
+
$n : susy-get(span, $span);
|
103
|
+
$location : susy-get(location, $span);
|
104
|
+
$columns : susy-get(columns, $span);
|
105
|
+
$gutters : susy-get(gutters, $span);
|
106
|
+
$spread : susy-get(spread, $span);
|
199
107
|
|
200
108
|
$context : null;
|
201
109
|
$span-sum : null;
|
@@ -205,8 +113,8 @@
|
|
205
113
|
$context: column-sum($columns, $gutters, if(is-split($span), wide, narrow));
|
206
114
|
$span-sum: get-column-span-sum($n, $location, $columns, $gutters, if(is-inside($span), wide, $spread));
|
207
115
|
|
208
|
-
@if
|
209
|
-
$width: $span-sum *
|
116
|
+
@if susy-get(layout-math, $span) == static {
|
117
|
+
$width: $span-sum * susy-get(column-width, $span);
|
210
118
|
} @else {
|
211
119
|
$width: percentage($span-sum / $context);
|
212
120
|
}
|
@@ -216,21 +124,3 @@
|
|
216
124
|
|
217
125
|
@return $width;
|
218
126
|
}
|
219
|
-
|
220
|
-
// Get Span Context
|
221
|
-
// ----------------
|
222
|
-
// - $span: <map>
|
223
|
-
@function get-span-context(
|
224
|
-
$span
|
225
|
-
) {
|
226
|
-
$span: parse-span($span);
|
227
|
-
$return: ();
|
228
|
-
|
229
|
-
@each $key, $value in $span {
|
230
|
-
@if not index(span location, $key) {
|
231
|
-
$return: map-merge($return, ($key: $value));
|
232
|
-
}
|
233
|
-
}
|
234
|
-
|
235
|
-
@return $return;
|
236
|
-
}
|
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.alpha.
|
4
|
+
version: 2.0.0.alpha.6
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Eric Meyer
|
@@ -71,14 +71,13 @@ files:
|
|
71
71
|
- sass/susy/helpers/_clearfix.scss
|
72
72
|
- sass/susy/helpers/_direction.scss
|
73
73
|
- sass/susy/helpers/_nth.scss
|
74
|
-
- sass/susy/language/_shared.scss
|
75
74
|
- sass/susy/language/_susy.scss
|
76
|
-
- sass/susy/language/shared/_settings.scss
|
77
75
|
- sass/susy/language/susy/_background.scss
|
78
76
|
- sass/susy/language/susy/_bleed.scss
|
79
77
|
- sass/susy/language/susy/_container.scss
|
80
78
|
- sass/susy/language/susy/_context.scss
|
81
79
|
- sass/susy/language/susy/_gallery.scss
|
80
|
+
- sass/susy/language/susy/_grids.scss
|
82
81
|
- sass/susy/language/susy/_gutters.scss
|
83
82
|
- sass/susy/language/susy/_isolate.scss
|
84
83
|
- sass/susy/language/susy/_margins.scss
|
@@ -1,104 +0,0 @@
|
|
1
|
-
// Grid Syntax
|
2
|
-
// ===========
|
3
|
-
|
4
|
-
// Set Grid
|
5
|
-
// --------
|
6
|
-
// Set a new grid using a shorthand
|
7
|
-
// - $grid : <settings>
|
8
|
-
@mixin set-grid(
|
9
|
-
$grid
|
10
|
-
) {
|
11
|
-
$susy: map-merge($susy, parse-grid($grid)) !global;
|
12
|
-
}
|
13
|
-
|
14
|
-
// Alternative syntax
|
15
|
-
@mixin susy-set(
|
16
|
-
$grid
|
17
|
-
) {
|
18
|
-
@include set-grid($grid);
|
19
|
-
}
|
20
|
-
|
21
|
-
// Use Grid
|
22
|
-
// --------
|
23
|
-
// Use an arbitrary grid for a section of code
|
24
|
-
// - $grid : <settings>
|
25
|
-
@mixin use-grid(
|
26
|
-
$grid
|
27
|
-
) {
|
28
|
-
$old: $susy;
|
29
|
-
|
30
|
-
@include set-grid($grid);
|
31
|
-
@content;
|
32
|
-
|
33
|
-
$susy: $old !global;
|
34
|
-
}
|
35
|
-
|
36
|
-
// Parse Grid
|
37
|
-
// ----------
|
38
|
-
// Parse a shorthand grid, and return an ordered list of settings
|
39
|
-
// - [$grid] : <settings>
|
40
|
-
@function parse-grid(
|
41
|
-
$grid
|
42
|
-
) {
|
43
|
-
$return: $grid;
|
44
|
-
|
45
|
-
@if type-of($grid) != map {
|
46
|
-
$return : ();
|
47
|
-
$columns-check : false;
|
48
|
-
|
49
|
-
@each $item in $grid {
|
50
|
-
|
51
|
-
// maps
|
52
|
-
@if type-of($item) == map {
|
53
|
-
$return: map-merge($return, $item);
|
54
|
-
|
55
|
-
// Keywords
|
56
|
-
} @else if type-of($item) == string {
|
57
|
-
@each $key, $value in $susy-keywords {
|
58
|
-
@if index($value, $item) {
|
59
|
-
$return: map-merge($return, ($key: $item));
|
60
|
-
}
|
61
|
-
}
|
62
|
-
}
|
63
|
-
|
64
|
-
// Container, Columns, or Gutters
|
65
|
-
@else if type-of($item) == number {
|
66
|
-
@if not unitless($item) {
|
67
|
-
$return: map-merge($return, (container: $item));
|
68
|
-
} @else if not $columns-check {
|
69
|
-
$return: map-merge($return, (columns: $item));
|
70
|
-
$columns-check: true;
|
71
|
-
} @else {
|
72
|
-
$return: map-merge($return, (gutters: $item));
|
73
|
-
}
|
74
|
-
}
|
75
|
-
|
76
|
-
// Columns or Gutters
|
77
|
-
@else if type-of($item) == list {
|
78
|
-
@if unitless(nth($item,1)) {
|
79
|
-
$return: map-merge($return, (columns: $item));
|
80
|
-
$columns-check: true;
|
81
|
-
} @else {
|
82
|
-
$return: map-merge($return, (column-width: nth($item,1)));
|
83
|
-
$return: map-merge($return, (gutters: nth($item,2) / nth($item,1)));
|
84
|
-
}
|
85
|
-
}
|
86
|
-
}
|
87
|
-
}
|
88
|
-
|
89
|
-
@return $return;
|
90
|
-
}
|
91
|
-
|
92
|
-
// Get Setting
|
93
|
-
// -----------
|
94
|
-
// Return one setting from a grid
|
95
|
-
// - setting : <keyword>
|
96
|
-
// - $grid : <settings>
|
97
|
-
@function susy-get(
|
98
|
-
$key,
|
99
|
-
$grid: map-merge($susy-defaults, $susy)
|
100
|
-
) {
|
101
|
-
$grid: parse-grid($grid);
|
102
|
-
|
103
|
-
@return map-get($grid, $key) or map-get($susy, $key) or map-get($susy-defaults, $key);
|
104
|
-
}
|