susy 2.0.0.alpha.5 → 2.0.0.alpha.6
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.
- 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
|
-
}
|