bourbon-compass 3.1.1 → 3.1.3
Sign up to get free protection for your applications and to get access to all the features.
- data/stylesheets/bourbon/_bourbon-deprecated-upcoming.scss +7 -2
- data/stylesheets/bourbon/_bourbon.scss +10 -3
- data/stylesheets/bourbon/addons/_button.scss +3 -3
- data/stylesheets/bourbon/addons/_hide-text.scss +0 -8
- data/stylesheets/bourbon/addons/_prefixer.scss +20 -11
- data/stylesheets/bourbon/css3/_backface-visibility.scss +6 -0
- data/stylesheets/bourbon/css3/_background-image.scss +18 -14
- data/stylesheets/bourbon/css3/_background.scss +26 -30
- data/stylesheets/bourbon/css3/_border-image.scss +7 -10
- data/stylesheets/bourbon/css3/_keyframes.scss +0 -10
- data/stylesheets/bourbon/css3/_linear-gradient.scss +12 -14
- data/stylesheets/bourbon/css3/_perspective.scss +2 -2
- data/stylesheets/bourbon/css3/_placeholder.scss +11 -0
- data/stylesheets/bourbon/css3/_radial-gradient.scss +19 -53
- data/stylesheets/bourbon/css3/_transition.scss +5 -7
- data/stylesheets/bourbon/functions/_linear-gradient.scss +9 -2
- data/stylesheets/bourbon/functions/_radial-gradient.scss +11 -45
- data/stylesheets/bourbon/{functions → helpers}/_deprecated-webkit-gradient.scss +1 -6
- data/stylesheets/bourbon/helpers/_gradient-positions-parser.scss +13 -0
- data/stylesheets/bourbon/helpers/_linear-positions-parser.scss +64 -0
- data/stylesheets/bourbon/helpers/_radial-arg-parser.scss +69 -0
- data/stylesheets/bourbon/helpers/_radial-positions-parser.scss +18 -0
- data/stylesheets/bourbon/helpers/_render-gradients.scss +26 -0
- data/stylesheets/bourbon/helpers/_shape-size-stripper.scss +10 -0
- metadata +10 -5
- data/stylesheets/bourbon/css3/_background-size.scss +0 -3
- data/stylesheets/bourbon/functions/_render-gradients.scss +0 -14
@@ -3,6 +3,11 @@
|
|
3
3
|
// They will be removed in the next MAJOR version release
|
4
4
|
//************************************************************************//
|
5
5
|
@mixin box-shadow ($shadows...) {
|
6
|
-
|
7
|
-
|
6
|
+
@include prefixer(box-shadow, $shadows, spec);
|
7
|
+
@warn "box-shadow is deprecated and will be removed in the next major version release";
|
8
|
+
}
|
9
|
+
|
10
|
+
@mixin background-size ($lengths...) {
|
11
|
+
@include prefixer(background-size, $lengths, spec);
|
12
|
+
@warn "background-size is deprecated and will be removed in the next major version release";
|
8
13
|
}
|
@@ -1,22 +1,29 @@
|
|
1
|
+
// Custom Helpers
|
2
|
+
@import "helpers/deprecated-webkit-gradient";
|
3
|
+
@import "helpers/gradient-positions-parser";
|
4
|
+
@import "helpers/linear-positions-parser";
|
5
|
+
@import "helpers/radial-arg-parser";
|
6
|
+
@import "helpers/radial-positions-parser";
|
7
|
+
@import "helpers/render-gradients";
|
8
|
+
@import "helpers/shape-size-stripper";
|
9
|
+
|
1
10
|
// Custom Functions
|
2
11
|
@import "functions/compact";
|
3
|
-
@import "functions/deprecated-webkit-gradient";
|
4
12
|
@import "functions/flex-grid";
|
5
13
|
@import "functions/grid-width";
|
6
14
|
@import "functions/linear-gradient";
|
7
15
|
@import "functions/modular-scale";
|
8
16
|
@import "functions/px-to-em";
|
9
17
|
@import "functions/radial-gradient";
|
10
|
-
@import "functions/render-gradients";
|
11
18
|
@import "functions/tint-shade";
|
12
19
|
@import "functions/transition-property-name";
|
13
20
|
|
14
21
|
// CSS3 Mixins
|
15
22
|
@import "css3/animation";
|
16
23
|
@import "css3/appearance";
|
24
|
+
@import "css3/backface-visibility";
|
17
25
|
@import "css3/background";
|
18
26
|
@import "css3/background-image";
|
19
|
-
@import "css3/background-size";
|
20
27
|
@import "css3/border-image";
|
21
28
|
@import "css3/border-radius";
|
22
29
|
@import "css3/box-sizing";
|
@@ -74,7 +74,7 @@
|
|
74
74
|
padding: 7px 18px;
|
75
75
|
text-decoration: none;
|
76
76
|
text-shadow: 0 1px 0 $text-shadow;
|
77
|
-
|
77
|
+
background-clip: padding-box;
|
78
78
|
|
79
79
|
&:hover:not(:disabled) {
|
80
80
|
$base-color-hover: adjust-color($base-color, $saturation: -4%, $lightness: -5%);
|
@@ -219,7 +219,7 @@
|
|
219
219
|
text-align: center;
|
220
220
|
text-decoration: none;
|
221
221
|
text-shadow: 0 -1px 1px $text-shadow;
|
222
|
-
|
222
|
+
background-clip: padding-box;
|
223
223
|
|
224
224
|
&:hover:not(:disabled) {
|
225
225
|
$base-color-hover: adjust-color($base-color, $lightness: -4.5%);
|
@@ -246,7 +246,7 @@
|
|
246
246
|
cursor: pointer;
|
247
247
|
@include linear-gradient ($base-color-hover, $stop-gradient-hover);
|
248
248
|
text-shadow: 0 -1px 1px $text-shadow-hover;
|
249
|
-
|
249
|
+
background-clip: padding-box;
|
250
250
|
}
|
251
251
|
|
252
252
|
&:active:not(:disabled) {
|
@@ -9,21 +9,30 @@ $prefix-for-spec: true !default; // required for keyframe mixin
|
|
9
9
|
|
10
10
|
@mixin prefixer ($property, $value, $prefixes) {
|
11
11
|
@each $prefix in $prefixes {
|
12
|
-
|
13
|
-
|
14
|
-
|
12
|
+
@if $prefix == webkit {
|
13
|
+
@if $prefix-for-webkit {
|
14
|
+
-webkit-#{$property}: $value;
|
15
|
+
}
|
15
16
|
}
|
16
|
-
@else if $prefix == moz
|
17
|
-
-
|
17
|
+
@else if $prefix == moz {
|
18
|
+
@if $prefix-for-mozilla {
|
19
|
+
-moz-#{$property}: $value;
|
20
|
+
}
|
18
21
|
}
|
19
|
-
@else if $prefix == ms
|
20
|
-
-
|
22
|
+
@else if $prefix == ms {
|
23
|
+
@if $prefix-for-microsoft {
|
24
|
+
-ms-#{$property}: $value;
|
25
|
+
}
|
21
26
|
}
|
22
|
-
@else if $prefix == o
|
23
|
-
-
|
27
|
+
@else if $prefix == o {
|
28
|
+
@if $prefix-for-opera {
|
29
|
+
-o-#{$property}: $value;
|
30
|
+
}
|
24
31
|
}
|
25
|
-
@else if $prefix == spec
|
26
|
-
|
32
|
+
@else if $prefix == spec {
|
33
|
+
@if $prefix-for-spec {
|
34
|
+
#{$property}: $value;
|
35
|
+
}
|
27
36
|
}
|
28
37
|
@else {
|
29
38
|
@warn "Unrecognized prefix: #{$prefix}";
|
@@ -0,0 +1,6 @@
|
|
1
|
+
//************************************************************************//
|
2
|
+
// Backface-visibility mixin
|
3
|
+
//************************************************************************//
|
4
|
+
@mixin backface-visibility($visibility) {
|
5
|
+
@include prefixer(backface-visibility, $visibility, webkit spec);
|
6
|
+
}
|
@@ -4,29 +4,34 @@
|
|
4
4
|
//************************************************************************//
|
5
5
|
|
6
6
|
@mixin background-image($images...) {
|
7
|
-
background-image:
|
8
|
-
background-image:
|
9
|
-
background-image: add-prefix($images, ms);
|
10
|
-
background-image: add-prefix($images, o);
|
11
|
-
background-image: add-prefix($images);
|
7
|
+
background-image: _add-prefix($images, webkit);
|
8
|
+
background-image: _add-prefix($images);
|
12
9
|
}
|
13
10
|
|
14
|
-
|
15
|
-
@function add-prefix($images, $vendor: false) {
|
11
|
+
@function _add-prefix($images, $vendor: false) {
|
16
12
|
$images-prefixed: ();
|
17
|
-
|
13
|
+
$gradient-positions: false;
|
18
14
|
@for $i from 1 through length($images) {
|
19
15
|
$type: type-of(nth($images, $i)); // Get type of variable - List or String
|
20
16
|
|
21
17
|
// If variable is a list - Gradient
|
22
18
|
@if $type == list {
|
23
|
-
$gradient-type: nth(nth($images, $i), 1); //
|
24
|
-
$gradient-
|
25
|
-
|
26
|
-
|
19
|
+
$gradient-type: nth(nth($images, $i), 1); // linear or radial
|
20
|
+
$gradient-pos: null;
|
21
|
+
$gradient-args: null;
|
22
|
+
|
23
|
+
@if ($gradient-type == linear) or ($gradient-type == radial) {
|
24
|
+
$gradient-pos: nth(nth($images, $i), 2); // Get gradient position
|
25
|
+
$gradient-args: nth(nth($images, $i), 3); // Get actual gradient (red, blue)
|
26
|
+
}
|
27
|
+
@else {
|
28
|
+
$gradient-args: nth(nth($images, $i), 2); // Get actual gradient (red, blue)
|
29
|
+
}
|
30
|
+
|
31
|
+
$gradient-positions: _gradient-positions-parser($gradient-type, $gradient-pos);
|
32
|
+
$gradient: _render-gradients($gradient-positions, $gradient-args, $gradient-type, $vendor);
|
27
33
|
$images-prefixed: append($images-prefixed, $gradient, comma);
|
28
34
|
}
|
29
|
-
|
30
35
|
// If variable is a string - Image
|
31
36
|
@else if $type == string {
|
32
37
|
$images-prefixed: join($images-prefixed, nth($images, $i), comma);
|
@@ -35,7 +40,6 @@
|
|
35
40
|
@return $images-prefixed;
|
36
41
|
}
|
37
42
|
|
38
|
-
|
39
43
|
//Examples:
|
40
44
|
//@include background-image(linear-gradient(top, orange, red));
|
41
45
|
//@include background-image(radial-gradient(50% 50%, cover circle, orange, red));
|
@@ -22,20 +22,17 @@
|
|
22
22
|
$fallback-color: $fallback;
|
23
23
|
}
|
24
24
|
@else {
|
25
|
-
$fallback-color:
|
25
|
+
$fallback-color: _extract-background-color($backgrounds);
|
26
26
|
}
|
27
27
|
|
28
28
|
@if $fallback-color {
|
29
29
|
background-color: $fallback-color;
|
30
30
|
}
|
31
|
-
background:
|
32
|
-
background:
|
33
|
-
background: background-add-prefix($backgrounds, ms);
|
34
|
-
background: background-add-prefix($backgrounds, o);
|
35
|
-
background: background-add-prefix($backgrounds);
|
31
|
+
background: _background-add-prefix($backgrounds, webkit);
|
32
|
+
background: _background-add-prefix($backgrounds);
|
36
33
|
}
|
37
34
|
|
38
|
-
@function
|
35
|
+
@function _extract-background-color($backgrounds) {
|
39
36
|
$final-bg-layer: nth($backgrounds, length($backgrounds));
|
40
37
|
@if type-of($final-bg-layer) == list {
|
41
38
|
@for $i from 1 through length($final-bg-layer) {
|
@@ -48,51 +45,50 @@
|
|
48
45
|
@return false;
|
49
46
|
}
|
50
47
|
|
51
|
-
|
52
|
-
@function background-add-prefix($backgrounds, $vendor: false) {
|
48
|
+
@function _background-add-prefix($backgrounds, $vendor: false) {
|
53
49
|
$backgrounds-prefixed: ();
|
54
50
|
|
55
51
|
@for $i from 1 through length($backgrounds) {
|
56
52
|
$shorthand: nth($backgrounds, $i); // Get member for current index
|
57
|
-
$type: type-of($shorthand); // Get type of variable - List or String
|
53
|
+
$type: type-of($shorthand); // Get type of variable - List (gradient) or String (image)
|
58
54
|
|
59
|
-
// If shorthand is a list
|
55
|
+
// If shorthand is a list (gradient)
|
60
56
|
@if $type == list {
|
61
57
|
$first-member: nth($shorthand, 1); // Get first member of shorthand
|
62
58
|
|
63
59
|
// Linear Gradient
|
64
60
|
@if index(linear radial, nth($first-member, 1)) {
|
65
61
|
$gradient-type: nth($first-member, 1); // linear || radial
|
66
|
-
|
67
|
-
|
68
|
-
$
|
69
|
-
$
|
70
|
-
|
71
|
-
|
72
|
-
$gradient-args: nth($first-member, 2);
|
62
|
+
$gradient-args: false;
|
63
|
+
$gradient-positions: false;
|
64
|
+
$shorthand-start: false;
|
65
|
+
@if type-of($first-member) == list { // Linear gradient plus additional shorthand values — lg(red,orange)repeat,...
|
66
|
+
$gradient-positions: nth($first-member, 2);
|
67
|
+
$gradient-args: nth($first-member, 3);
|
73
68
|
$shorthand-start: 2;
|
74
69
|
}
|
75
|
-
// Linear gradient only
|
76
|
-
|
77
|
-
$gradient-args:
|
78
|
-
$shorthand-start: 3;
|
70
|
+
@else { // Linear gradient only — lg(red,orange),...
|
71
|
+
$gradient-positions: nth($shorthand, 2);
|
72
|
+
$gradient-args: nth($shorthand, 3); // Get gradient (red, blue)
|
79
73
|
}
|
80
74
|
|
81
|
-
$gradient:
|
82
|
-
|
83
|
-
|
75
|
+
$gradient-positions: _gradient-positions-parser($gradient-type, $gradient-positions);
|
76
|
+
$gradient: _render-gradients($gradient-positions, $gradient-args, $gradient-type, $vendor);
|
77
|
+
|
78
|
+
// Append any additional shorthand args to gradient
|
79
|
+
@if $shorthand-start {
|
80
|
+
@for $j from $shorthand-start through length($shorthand) {
|
81
|
+
$gradient: join($gradient, nth($shorthand, $j), space);
|
82
|
+
}
|
84
83
|
}
|
85
84
|
$backgrounds-prefixed: append($backgrounds-prefixed, $gradient, comma);
|
86
85
|
}
|
87
|
-
|
88
86
|
// Image with additional properties
|
89
87
|
@else {
|
90
88
|
$backgrounds-prefixed: append($backgrounds-prefixed, $shorthand, comma);
|
91
89
|
}
|
92
|
-
|
93
90
|
}
|
94
|
-
|
95
|
-
// If shorthand is a simple string, color or image
|
91
|
+
// If shorthand is a simple string (color or image)
|
96
92
|
@else if $type == string {
|
97
93
|
$backgrounds-prefixed: join($backgrounds-prefixed, $shorthand, comma);
|
98
94
|
}
|
@@ -102,6 +98,6 @@
|
|
102
98
|
|
103
99
|
//Examples:
|
104
100
|
//@include background(linear-gradient(top, orange, red));
|
105
|
-
//@include background(radial-gradient(
|
101
|
+
//@include background(radial-gradient(circle at 40% 40%, orange, red));
|
106
102
|
//@include background(url("/images/a.png") no-repeat, linear-gradient(orange, red));
|
107
103
|
//@include background(url("image.png") center center, linear-gradient(orange, red), url("image.png"));
|
@@ -1,11 +1,11 @@
|
|
1
1
|
@mixin border-image($images) {
|
2
|
-
-webkit-border-image:
|
3
|
-
-moz-border-image:
|
4
|
-
-o-border-image:
|
5
|
-
border-image:
|
2
|
+
-webkit-border-image: _border-add-prefix($images, webkit);
|
3
|
+
-moz-border-image: _border-add-prefix($images, moz);
|
4
|
+
-o-border-image: _border-add-prefix($images, o);
|
5
|
+
border-image: _border-add-prefix($images);
|
6
6
|
}
|
7
7
|
|
8
|
-
@function
|
8
|
+
@function _border-add-prefix($images, $vendor: false) {
|
9
9
|
$border-image: ();
|
10
10
|
$images-type: type-of(nth($images, 1));
|
11
11
|
$first-var: nth(nth($images, 1), 1); // Get type of Gradient (Linear || radial)
|
@@ -16,16 +16,14 @@
|
|
16
16
|
@for $i from 2 through length($images) {
|
17
17
|
$gradient-type: nth($images, 1); // Get type of gradient (linear || radial)
|
18
18
|
$gradient-args: nth($images, $i); // Get actual gradient (red, blue)
|
19
|
-
$border-image:
|
19
|
+
$border-image: _render-gradients($gradient-args, $gradient-type, $vendor);
|
20
20
|
}
|
21
21
|
}
|
22
|
-
|
23
22
|
// If input is a URL
|
24
23
|
@else {
|
25
24
|
$border-image: $images;
|
26
25
|
}
|
27
26
|
}
|
28
|
-
|
29
27
|
// If input is gradient or url + additional args
|
30
28
|
@else if $images-type == list {
|
31
29
|
@for $i from 1 through length($images) {
|
@@ -35,9 +33,8 @@
|
|
35
33
|
@if $type == list {
|
36
34
|
$gradient-type: nth(nth($images, $i), 1); // Get type of gradient (linear || radial)
|
37
35
|
$gradient-args: nth(nth($images, $i), 2); // Get actual gradient (red, blue)
|
38
|
-
$border-image:
|
36
|
+
$border-image: _render-gradients($gradient-args, $gradient-type, $vendor);
|
39
37
|
}
|
40
|
-
|
41
38
|
// If variable is a string - Image or number
|
42
39
|
@else if ($type == string) or ($type == number) {
|
43
40
|
$border-image: append($border-image, nth($images, $i));
|
@@ -2,7 +2,6 @@
|
|
2
2
|
@mixin keyframes($name) {
|
3
3
|
$original-prefix-for-webkit: $prefix-for-webkit;
|
4
4
|
$original-prefix-for-mozilla: $prefix-for-mozilla;
|
5
|
-
$original-prefix-for-microsoft: $prefix-for-microsoft;
|
6
5
|
$original-prefix-for-opera: $prefix-for-opera;
|
7
6
|
$original-prefix-for-spec: $prefix-for-spec;
|
8
7
|
|
@@ -20,13 +19,6 @@
|
|
20
19
|
@content;
|
21
20
|
}
|
22
21
|
}
|
23
|
-
@if $original-prefix-for-microsoft {
|
24
|
-
@include disable-prefix-for-all();
|
25
|
-
$prefix-for-microsoft: true;
|
26
|
-
@-ms-keyframes #{$name} {
|
27
|
-
@content;
|
28
|
-
}
|
29
|
-
}
|
30
22
|
@if $original-prefix-for-opera {
|
31
23
|
@include disable-prefix-for-all();
|
32
24
|
$prefix-for-opera: true;
|
@@ -35,7 +27,6 @@
|
|
35
27
|
}
|
36
28
|
}
|
37
29
|
@if $original-prefix-for-spec {
|
38
|
-
$prefix-for-spec: true !default;
|
39
30
|
@include disable-prefix-for-all();
|
40
31
|
$prefix-for-spec: true;
|
41
32
|
@keyframes #{$name} {
|
@@ -45,7 +36,6 @@
|
|
45
36
|
|
46
37
|
$prefix-for-webkit: $original-prefix-for-webkit;
|
47
38
|
$prefix-for-mozilla: $original-prefix-for-mozilla;
|
48
|
-
$prefix-for-microsoft: $original-prefix-for-microsoft;
|
49
39
|
$prefix-for-opera: $original-prefix-for-opera;
|
50
40
|
$prefix-for-spec: $original-prefix-for-spec;
|
51
41
|
}
|
@@ -8,12 +8,20 @@
|
|
8
8
|
$fallback: false) {
|
9
9
|
// Detect what type of value exists in $pos
|
10
10
|
$pos-type: type-of(nth($pos, 1));
|
11
|
+
$pos-spec: null;
|
12
|
+
$pos-degree: null;
|
11
13
|
|
12
14
|
// If $pos is missing from mixin, reassign vars and add default position
|
13
15
|
@if ($pos-type == color) or (nth($pos, 1) == "transparent") {
|
14
16
|
$G10: $G9; $G9: $G8; $G8: $G7; $G7: $G6; $G6: $G5;
|
15
17
|
$G5: $G4; $G4: $G3; $G3: $G2; $G2: $G1; $G1: $pos;
|
16
|
-
|
18
|
+
$pos: null;
|
19
|
+
}
|
20
|
+
|
21
|
+
@if $pos {
|
22
|
+
$positions: _linear-positions-parser($pos);
|
23
|
+
$pos-degree: nth($positions, 1);
|
24
|
+
$pos-spec: nth($positions, 2);
|
17
25
|
}
|
18
26
|
|
19
27
|
$full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
|
@@ -27,17 +35,7 @@
|
|
27
35
|
}
|
28
36
|
|
29
37
|
background-color: $fallback-color;
|
30
|
-
background-image:
|
31
|
-
background-image:
|
32
|
-
background-image:
|
33
|
-
background-image: -ms-linear-gradient($pos, $full);
|
34
|
-
background-image: -o-linear-gradient($pos, $full);
|
35
|
-
background-image: unquote("linear-gradient(#{$pos}, #{$full})");
|
38
|
+
background-image: _deprecated-webkit-gradient(linear, $deprecated-pos1, $deprecated-pos2, $full); // Safari <= 5.0
|
39
|
+
background-image: -webkit-linear-gradient($pos-degree $full); // Safari 5.1+, Chrome
|
40
|
+
background-image: unquote("linear-gradient(#{$pos-spec}#{$full})");
|
36
41
|
}
|
37
|
-
|
38
|
-
|
39
|
-
// Usage: Gradient position is optional, default is top. Position can be a degree. Color stops are optional as well.
|
40
|
-
// @include linear-gradient(#1e5799, #2989d8);
|
41
|
-
// @include linear-gradient(#1e5799, #2989d8, $fallback:#2989d8);
|
42
|
-
// @include linear-gradient(top, #1e5799 0%, #2989d8 50%);
|
43
|
-
// @include linear-gradient(50deg, rgba(10, 10, 10, 0.5) 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%);
|
@@ -1,8 +1,8 @@
|
|
1
1
|
@mixin perspective($depth: none) {
|
2
2
|
// none | <length>
|
3
|
-
@include prefixer(perspective, $depth, webkit moz
|
3
|
+
@include prefixer(perspective, $depth, webkit moz spec);
|
4
4
|
}
|
5
5
|
|
6
6
|
@mixin perspective-origin($value: 50% 50%) {
|
7
|
-
@include prefixer(perspective-origin, $value, webkit moz
|
7
|
+
@include prefixer(perspective-origin, $value, webkit moz spec);
|
8
8
|
}
|
@@ -9,6 +9,17 @@ $placeholders: '-webkit-input-placeholder',
|
|
9
9
|
@content;
|
10
10
|
}
|
11
11
|
}
|
12
|
+
@else if $placeholder == "-moz-placeholder" {
|
13
|
+
// FF 18-
|
14
|
+
&:#{$placeholder} {
|
15
|
+
@content;
|
16
|
+
}
|
17
|
+
|
18
|
+
// FF 19+
|
19
|
+
&::#{$placeholder} {
|
20
|
+
@content;
|
21
|
+
}
|
22
|
+
}
|
12
23
|
@else {
|
13
24
|
&:#{$placeholder} {
|
14
25
|
@content;
|
@@ -4,58 +4,25 @@
|
|
4
4
|
$G5: false, $G6: false,
|
5
5
|
$G7: false, $G8: false,
|
6
6
|
$G9: false, $G10: false,
|
7
|
-
$pos:
|
8
|
-
$shape-size:
|
7
|
+
$pos: null,
|
8
|
+
$shape-size: null,
|
9
9
|
$deprecated-pos1: center center,
|
10
10
|
$deprecated-pos2: center center,
|
11
11
|
$deprecated-radius1: 0,
|
12
12
|
$deprecated-radius2: 460,
|
13
13
|
$fallback: false) {
|
14
14
|
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
@if ($pos-type == number)
|
21
|
-
or ($first-val == "center")
|
22
|
-
or ($first-val == "top")
|
23
|
-
or ($first-val == "right")
|
24
|
-
or ($first-val == "bottom")
|
25
|
-
or ($first-val == "left") {
|
26
|
-
|
27
|
-
$pos: $value;
|
28
|
-
|
29
|
-
@if $pos == $G1 {
|
30
|
-
$G1: false;
|
31
|
-
}
|
32
|
-
}
|
33
|
-
|
34
|
-
@else if
|
35
|
-
($first-val == "ellipse")
|
36
|
-
or ($first-val == "circle")
|
37
|
-
or ($first-val == "closest-side")
|
38
|
-
or ($first-val == "closest-corner")
|
39
|
-
or ($first-val == "farthest-side")
|
40
|
-
or ($first-val == "farthest-corner")
|
41
|
-
or ($first-val == "contain")
|
42
|
-
or ($first-val == "cover") {
|
43
|
-
|
44
|
-
$shape-size: $value;
|
45
|
-
|
46
|
-
@if $value == $G1 {
|
47
|
-
$G1: false;
|
48
|
-
}
|
49
|
-
|
50
|
-
@else if $value == $G2 {
|
51
|
-
$G2: false;
|
52
|
-
}
|
53
|
-
}
|
54
|
-
}
|
55
|
-
}
|
15
|
+
$data: _radial-arg-parser($G1, $G2, $pos, $shape-size);
|
16
|
+
$G1: nth($data, 1);
|
17
|
+
$G2: nth($data, 2);
|
18
|
+
$pos: nth($data, 3);
|
19
|
+
$shape-size: nth($data, 4);
|
56
20
|
|
57
21
|
$full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
|
58
22
|
|
23
|
+
// Strip deprecated cover/contain for spec
|
24
|
+
$shape-size-spec: _shape-size-stripper($shape-size);
|
25
|
+
|
59
26
|
// Set $G1 as the default fallback color
|
60
27
|
$first-color: nth($full, 1);
|
61
28
|
$fallback-color: nth($first-color, 1);
|
@@ -64,15 +31,14 @@
|
|
64
31
|
$fallback-color: $fallback;
|
65
32
|
}
|
66
33
|
|
34
|
+
// Add Commas and spaces
|
35
|
+
$shape-size: if($shape-size, '#{$shape-size}, ', null);
|
36
|
+
$pos: if($pos, '#{$pos}, ', null);
|
37
|
+
$pos-spec: if($pos, 'at #{$pos}', null);
|
38
|
+
$shape-size-spec: if(($shape-size-spec != ' ') and ($pos == null), '#{$shape-size-spec}, ', '#{$shape-size-spec} ');
|
39
|
+
|
67
40
|
background-color: $fallback-color;
|
68
|
-
background-image:
|
69
|
-
background-image:
|
70
|
-
background-image:
|
71
|
-
background-image: -ms-radial-gradient($pos, $shape-size, $full);
|
72
|
-
background-image: -o-radial-gradient($pos, $shape-size, $full);
|
73
|
-
background-image: unquote("radial-gradient(#{$pos}, #{$shape-size}, #{$full})");
|
41
|
+
background-image: _deprecated-webkit-gradient(radial, $deprecated-pos1, $deprecated-pos2, $full, $deprecated-radius1, $deprecated-radius2); // Safari <= 5.0 && IOS 4
|
42
|
+
background-image: -webkit-radial-gradient(unquote(#{$pos}#{$shape-size}#{$full}));
|
43
|
+
background-image: unquote("radial-gradient(#{$shape-size-spec}#{$pos-spec}#{$full})");
|
74
44
|
}
|
75
|
-
|
76
|
-
// Usage: Gradient position and shape-size are required. Color stops are optional.
|
77
|
-
// @include radial-gradient(50% 50%, circle cover, #1e5799, #efefef);
|
78
|
-
// @include radial-gradient(50% 50%, circle cover, #eee 10%, #1e5799 30%, #efefef);
|
@@ -5,32 +5,30 @@
|
|
5
5
|
|
6
6
|
@mixin transition ($properties...) {
|
7
7
|
@if length($properties) >= 1 {
|
8
|
-
@include prefixer(transition, $properties, webkit moz
|
8
|
+
@include prefixer(transition, $properties, webkit moz spec);
|
9
9
|
}
|
10
10
|
|
11
11
|
@else {
|
12
12
|
$properties: all 0.15s ease-out 0;
|
13
|
-
@include prefixer(transition, $properties, webkit moz
|
13
|
+
@include prefixer(transition, $properties, webkit moz spec);
|
14
14
|
}
|
15
15
|
}
|
16
16
|
|
17
17
|
@mixin transition-property ($properties...) {
|
18
18
|
-webkit-transition-property: transition-property-names($properties, 'webkit');
|
19
19
|
-moz-transition-property: transition-property-names($properties, 'moz');
|
20
|
-
-ms-transition-property: transition-property-names($properties, 'ms');
|
21
|
-
-o-transition-property: transition-property-names($properties, 'o');
|
22
20
|
transition-property: transition-property-names($properties, false);
|
23
21
|
}
|
24
22
|
|
25
23
|
@mixin transition-duration ($times...) {
|
26
|
-
@include prefixer(transition-duration, $times, webkit moz
|
24
|
+
@include prefixer(transition-duration, $times, webkit moz spec);
|
27
25
|
}
|
28
26
|
|
29
27
|
@mixin transition-timing-function ($motions...) {
|
30
28
|
// ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier()
|
31
|
-
@include prefixer(transition-timing-function, $motions, webkit moz
|
29
|
+
@include prefixer(transition-timing-function, $motions, webkit moz spec);
|
32
30
|
}
|
33
31
|
|
34
32
|
@mixin transition-delay ($times...) {
|
35
|
-
@include prefixer(transition-delay, $times, webkit moz
|
33
|
+
@include prefixer(transition-delay, $times, webkit moz spec);
|
36
34
|
}
|
@@ -1,6 +1,13 @@
|
|
1
|
-
@function linear-gradient($gradients...) {
|
1
|
+
@function linear-gradient($pos, $gradients...) {
|
2
2
|
$type: linear;
|
3
|
-
$type
|
3
|
+
$pos-type: type-of(nth($pos, 1));
|
4
4
|
|
5
|
+
// if $pos doesn't exist, fix $gradient
|
6
|
+
@if ($pos-type == color) or (nth($pos, 1) == "transparent") {
|
7
|
+
$gradients: zip($pos $gradients);
|
8
|
+
$pos: false;
|
9
|
+
}
|
10
|
+
|
11
|
+
$type-gradient: $type, $pos, $gradients;
|
5
12
|
@return $type-gradient;
|
6
13
|
}
|
@@ -4,54 +4,20 @@
|
|
4
4
|
$G5: false, $G6: false,
|
5
5
|
$G7: false, $G8: false,
|
6
6
|
$G9: false, $G10: false,
|
7
|
-
$pos:
|
8
|
-
$shape-size:
|
7
|
+
$pos: null,
|
8
|
+
$shape-size: null) {
|
9
9
|
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
@if ($pos-type == number)
|
16
|
-
or ($first-val == "center")
|
17
|
-
or ($first-val == "top")
|
18
|
-
or ($first-val == "right")
|
19
|
-
or ($first-val == "bottom")
|
20
|
-
or ($first-val == "left") {
|
21
|
-
|
22
|
-
$pos: $value;
|
23
|
-
|
24
|
-
@if $pos == $G1 {
|
25
|
-
$G1: false;
|
26
|
-
}
|
27
|
-
}
|
28
|
-
|
29
|
-
@else if
|
30
|
-
($first-val == "ellipse")
|
31
|
-
or ($first-val == "circle")
|
32
|
-
or ($first-val == "closest-side")
|
33
|
-
or ($first-val == "closest-corner")
|
34
|
-
or ($first-val == "farthest-side")
|
35
|
-
or ($first-val == "farthest-corner")
|
36
|
-
or ($first-val == "contain")
|
37
|
-
or ($first-val == "cover") {
|
38
|
-
|
39
|
-
$shape-size: $value;
|
40
|
-
|
41
|
-
@if $value == $G1 {
|
42
|
-
$G1: false;
|
43
|
-
}
|
44
|
-
|
45
|
-
@else if $value == $G2 {
|
46
|
-
$G2: false;
|
47
|
-
}
|
48
|
-
}
|
49
|
-
}
|
50
|
-
}
|
10
|
+
$data: _radial-arg-parser($G1, $G2, $pos, $shape-size);
|
11
|
+
$G1: nth($data, 1);
|
12
|
+
$G2: nth($data, 2);
|
13
|
+
$pos: nth($data, 3);
|
14
|
+
$shape-size: nth($data, 4);
|
51
15
|
|
52
16
|
$type: radial;
|
53
|
-
$gradient: compact($
|
54
|
-
$type-gradient: append($type, $gradient, comma);
|
17
|
+
$gradient: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
|
55
18
|
|
19
|
+
$type-gradient: $type, $shape-size $pos, $gradient;
|
56
20
|
@return $type-gradient;
|
57
21
|
}
|
22
|
+
|
23
|
+
|
@@ -1,6 +1,6 @@
|
|
1
1
|
// Render Deprecated Webkit Gradient - Linear || Radial
|
2
2
|
//************************************************************************//
|
3
|
-
@function
|
3
|
+
@function _deprecated-webkit-gradient($type,
|
4
4
|
$deprecated-pos1, $deprecated-pos2,
|
5
5
|
$full,
|
6
6
|
$deprecated-radius1: false, $deprecated-radius2: false) {
|
@@ -17,16 +17,13 @@
|
|
17
17
|
$color-stop: color-stop(nth($gradient, 2), nth($gradient, 1));
|
18
18
|
$gradient-list: join($gradient-list, $color-stop, comma);
|
19
19
|
}
|
20
|
-
|
21
20
|
@else if $gradient != null {
|
22
21
|
@if $i == $full-length {
|
23
22
|
$percentage: 100%;
|
24
23
|
}
|
25
|
-
|
26
24
|
@else {
|
27
25
|
$percentage: ($i - 1) * (100 / ($full-length - 1)) + "%";
|
28
26
|
}
|
29
|
-
|
30
27
|
$color-stop: color-stop(unquote($percentage), $gradient);
|
31
28
|
$gradient-list: join($gradient-list, $color-stop, comma);
|
32
29
|
}
|
@@ -35,10 +32,8 @@
|
|
35
32
|
@if $type == radial {
|
36
33
|
$gradient: -webkit-gradient(radial, $deprecated-pos1, $deprecated-radius1, $deprecated-pos2, $deprecated-radius2, $gradient-list);
|
37
34
|
}
|
38
|
-
|
39
35
|
@else if $type == linear {
|
40
36
|
$gradient: -webkit-gradient(linear, $deprecated-pos1, $deprecated-pos2, $gradient-list);
|
41
37
|
}
|
42
|
-
|
43
38
|
@return $gradient;
|
44
39
|
}
|
@@ -0,0 +1,13 @@
|
|
1
|
+
@function _gradient-positions-parser($gradient-type, $gradient-positions) {
|
2
|
+
@if $gradient-positions
|
3
|
+
and ($gradient-type == linear)
|
4
|
+
and (type-of($gradient-positions) != color) {
|
5
|
+
$gradient-positions: _linear-positions-parser($gradient-positions);
|
6
|
+
}
|
7
|
+
@else if $gradient-positions
|
8
|
+
and ($gradient-type == radial)
|
9
|
+
and (type-of($gradient-positions) != color) {
|
10
|
+
$gradient-positions: _radial-positions-parser($gradient-positions);
|
11
|
+
}
|
12
|
+
@return $gradient-positions;
|
13
|
+
}
|
@@ -0,0 +1,64 @@
|
|
1
|
+
@function _linear-positions-parser($pos) {
|
2
|
+
$type: type-of(nth($pos, 1));
|
3
|
+
$spec: null;
|
4
|
+
$degree: null;
|
5
|
+
$side: null;
|
6
|
+
$corner: null;
|
7
|
+
$length: length($pos);
|
8
|
+
// Parse Side and corner positions
|
9
|
+
@if ($length > 1) {
|
10
|
+
@if nth($pos, 1) == "to" { // Newer syntax
|
11
|
+
$side: nth($pos, 2);
|
12
|
+
|
13
|
+
@if $length == 2 { // eg. to top
|
14
|
+
// Swap for backwards compatability
|
15
|
+
$degree: _position-flipper(nth($pos, 2));
|
16
|
+
}
|
17
|
+
@else if $length == 3 { // eg. to top left
|
18
|
+
$corner: nth($pos, 3);
|
19
|
+
}
|
20
|
+
}
|
21
|
+
@else if $length == 2 { // Older syntax ("top left")
|
22
|
+
$side: _position-flipper(nth($pos, 1));
|
23
|
+
$corner: _position-flipper(nth($pos, 2));
|
24
|
+
}
|
25
|
+
|
26
|
+
@if ("#{$side} #{$corner}" == "left top") or ("#{$side} #{$corner}" == "top left") {
|
27
|
+
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
|
28
|
+
}
|
29
|
+
@else if ("#{$side} #{$corner}" == "right top") or ("#{$side} #{$corner}" == "top right") {
|
30
|
+
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
|
31
|
+
}
|
32
|
+
@else if ("#{$side} #{$corner}" == "right bottom") or ("#{$side} #{$corner}" == "bottom right") {
|
33
|
+
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
|
34
|
+
}
|
35
|
+
@else if ("#{$side} #{$corner}" == "left bottom") or ("#{$side} #{$corner}" == "bottom left") {
|
36
|
+
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
|
37
|
+
}
|
38
|
+
@else {
|
39
|
+
@warn "Incorrect gradient syntax";
|
40
|
+
}
|
41
|
+
$spec: to $side $corner;
|
42
|
+
}
|
43
|
+
@else if $length == 1 {
|
44
|
+
// Swap for backwards compatability
|
45
|
+
@if $type == string {
|
46
|
+
$degree: $pos;
|
47
|
+
$spec: to _position-flipper($pos);
|
48
|
+
}
|
49
|
+
@else {
|
50
|
+
$degree: -270 - $pos; //rotate the gradient opposite from spec
|
51
|
+
$spec: $pos;
|
52
|
+
}
|
53
|
+
}
|
54
|
+
$degree: unquote($degree + ",");
|
55
|
+
$spec: unquote($spec + ",");
|
56
|
+
@return $degree $spec;
|
57
|
+
}
|
58
|
+
|
59
|
+
@function _position-flipper($pos) {
|
60
|
+
@return if($pos == left, right, null)
|
61
|
+
if($pos == right, left, null)
|
62
|
+
if($pos == top, bottom, null)
|
63
|
+
if($pos == bottom, top, null);
|
64
|
+
}
|
@@ -0,0 +1,69 @@
|
|
1
|
+
@function _radial-arg-parser($G1, $G2, $pos, $shape-size) {
|
2
|
+
@each $value in $G1, $G2 {
|
3
|
+
$first-val: nth($value, 1);
|
4
|
+
$pos-type: type-of($first-val);
|
5
|
+
$spec-at-index: null;
|
6
|
+
|
7
|
+
// Determine if spec was passed to mixin
|
8
|
+
@if type-of($value) == list {
|
9
|
+
$spec-at-index: if(index($value, at), index($value, at), false);
|
10
|
+
}
|
11
|
+
@if $spec-at-index {
|
12
|
+
@if $spec-at-index > 1 {
|
13
|
+
@for $i from 1 through ($spec-at-index - 1) {
|
14
|
+
$shape-size: $shape-size nth($value, $i);
|
15
|
+
}
|
16
|
+
@for $i from ($spec-at-index + 1) through length($value) {
|
17
|
+
$pos: $pos nth($value, $i);
|
18
|
+
}
|
19
|
+
}
|
20
|
+
@else if $spec-at-index == 1 {
|
21
|
+
@for $i from ($spec-at-index + 1) through length($value) {
|
22
|
+
$pos: $pos nth($value, $i);
|
23
|
+
}
|
24
|
+
}
|
25
|
+
$G1: false;
|
26
|
+
}
|
27
|
+
|
28
|
+
// If not spec calculate correct values
|
29
|
+
@else {
|
30
|
+
@if ($pos-type != color) or ($first-val != "transparent") {
|
31
|
+
@if ($pos-type == number)
|
32
|
+
or ($first-val == "center")
|
33
|
+
or ($first-val == "top")
|
34
|
+
or ($first-val == "right")
|
35
|
+
or ($first-val == "bottom")
|
36
|
+
or ($first-val == "left") {
|
37
|
+
|
38
|
+
$pos: $value;
|
39
|
+
|
40
|
+
@if $pos == $G1 {
|
41
|
+
$G1: false;
|
42
|
+
}
|
43
|
+
}
|
44
|
+
|
45
|
+
@else if
|
46
|
+
($first-val == "ellipse")
|
47
|
+
or ($first-val == "circle")
|
48
|
+
or ($first-val == "closest-side")
|
49
|
+
or ($first-val == "closest-corner")
|
50
|
+
or ($first-val == "farthest-side")
|
51
|
+
or ($first-val == "farthest-corner")
|
52
|
+
or ($first-val == "contain")
|
53
|
+
or ($first-val == "cover") {
|
54
|
+
|
55
|
+
$shape-size: $value;
|
56
|
+
|
57
|
+
@if $value == $G1 {
|
58
|
+
$G1: false;
|
59
|
+
}
|
60
|
+
|
61
|
+
@else if $value == $G2 {
|
62
|
+
$G2: false;
|
63
|
+
}
|
64
|
+
}
|
65
|
+
}
|
66
|
+
}
|
67
|
+
}
|
68
|
+
@return $G1, $G2, $pos, $shape-size;
|
69
|
+
}
|
@@ -0,0 +1,18 @@
|
|
1
|
+
@function _radial-positions-parser($gradient-pos) {
|
2
|
+
$shape-size: nth($gradient-pos, 1);
|
3
|
+
$pos: nth($gradient-pos, 2);
|
4
|
+
$shape-size-spec: _shape-size-stripper($shape-size);
|
5
|
+
|
6
|
+
$pre-spec: unquote(if($pos, "#{$pos}, ", null))
|
7
|
+
unquote(if($shape-size, "#{$shape-size},", null));
|
8
|
+
$pos-spec: if($pos, "at #{$pos}", null);
|
9
|
+
|
10
|
+
$spec: "#{$shape-size-spec} #{$pos-spec}";
|
11
|
+
|
12
|
+
// Add comma
|
13
|
+
@if ($spec != ' ') {
|
14
|
+
$spec: "#{$spec},"
|
15
|
+
}
|
16
|
+
|
17
|
+
@return $pre-spec $spec;
|
18
|
+
}
|
@@ -0,0 +1,26 @@
|
|
1
|
+
// User for linear and radial gradients within background-image or border-image properties
|
2
|
+
|
3
|
+
@function _render-gradients($gradient-positions, $gradients, $gradient-type, $vendor: false) {
|
4
|
+
$pre-spec: null;
|
5
|
+
$spec: null;
|
6
|
+
$vendor-gradients: null;
|
7
|
+
@if $gradient-type == linear {
|
8
|
+
@if $gradient-positions {
|
9
|
+
$pre-spec: nth($gradient-positions, 1);
|
10
|
+
$spec: nth($gradient-positions, 2);
|
11
|
+
}
|
12
|
+
}
|
13
|
+
@else if $gradient-type == radial {
|
14
|
+
$pre-spec: nth($gradient-positions, 1);
|
15
|
+
$spec: nth($gradient-positions, 2);
|
16
|
+
}
|
17
|
+
|
18
|
+
@if $vendor {
|
19
|
+
$vendor-gradients: -#{$vendor}-#{$gradient-type}-gradient(#{$pre-spec} $gradients);
|
20
|
+
}
|
21
|
+
@else if $vendor == false {
|
22
|
+
$vendor-gradients: "#{$gradient-type}-gradient(#{$spec} #{$gradients})";
|
23
|
+
$vendor-gradients: unquote($vendor-gradients);
|
24
|
+
}
|
25
|
+
@return $vendor-gradients;
|
26
|
+
}
|
@@ -0,0 +1,10 @@
|
|
1
|
+
@function _shape-size-stripper($shape-size) {
|
2
|
+
$shape-size-spec: null;
|
3
|
+
@each $value in $shape-size {
|
4
|
+
@if ($value == "cover") or ($value == "contain") {
|
5
|
+
$value: null;
|
6
|
+
}
|
7
|
+
$shape-size-spec: "#{$shape-size-spec} #{$value}";
|
8
|
+
}
|
9
|
+
@return $shape-size-spec;
|
10
|
+
}
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: bourbon-compass
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 3.1.
|
4
|
+
version: 3.1.3
|
5
5
|
prerelease:
|
6
6
|
platform: ruby
|
7
7
|
authors:
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2013-
|
12
|
+
date: 2013-04-15 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: compass
|
@@ -65,8 +65,8 @@ files:
|
|
65
65
|
- stylesheets/bourbon/addons/_triangle.scss
|
66
66
|
- stylesheets/bourbon/css3/_animation.scss
|
67
67
|
- stylesheets/bourbon/css3/_appearance.scss
|
68
|
+
- stylesheets/bourbon/css3/_backface-visibility.scss
|
68
69
|
- stylesheets/bourbon/css3/_background-image.scss
|
69
|
-
- stylesheets/bourbon/css3/_background-size.scss
|
70
70
|
- stylesheets/bourbon/css3/_background.scss
|
71
71
|
- stylesheets/bourbon/css3/_border-image.scss
|
72
72
|
- stylesheets/bourbon/css3/_border-radius.scss
|
@@ -86,16 +86,21 @@ files:
|
|
86
86
|
- stylesheets/bourbon/css3/_transition.scss
|
87
87
|
- stylesheets/bourbon/css3/_user-select.scss
|
88
88
|
- stylesheets/bourbon/functions/_compact.scss
|
89
|
-
- stylesheets/bourbon/functions/_deprecated-webkit-gradient.scss
|
90
89
|
- stylesheets/bourbon/functions/_flex-grid.scss
|
91
90
|
- stylesheets/bourbon/functions/_grid-width.scss
|
92
91
|
- stylesheets/bourbon/functions/_linear-gradient.scss
|
93
92
|
- stylesheets/bourbon/functions/_modular-scale.scss
|
94
93
|
- stylesheets/bourbon/functions/_px-to-em.scss
|
95
94
|
- stylesheets/bourbon/functions/_radial-gradient.scss
|
96
|
-
- stylesheets/bourbon/functions/_render-gradients.scss
|
97
95
|
- stylesheets/bourbon/functions/_tint-shade.scss
|
98
96
|
- stylesheets/bourbon/functions/_transition-property-name.scss
|
97
|
+
- stylesheets/bourbon/helpers/_deprecated-webkit-gradient.scss
|
98
|
+
- stylesheets/bourbon/helpers/_gradient-positions-parser.scss
|
99
|
+
- stylesheets/bourbon/helpers/_linear-positions-parser.scss
|
100
|
+
- stylesheets/bourbon/helpers/_radial-arg-parser.scss
|
101
|
+
- stylesheets/bourbon/helpers/_radial-positions-parser.scss
|
102
|
+
- stylesheets/bourbon/helpers/_render-gradients.scss
|
103
|
+
- stylesheets/bourbon/helpers/_shape-size-stripper.scss
|
99
104
|
homepage: https://github.com/thoughtbot/bourbon
|
100
105
|
licenses: []
|
101
106
|
post_install_message:
|
@@ -1,14 +0,0 @@
|
|
1
|
-
// User for linear and radial gradients within background-image or border-image properties
|
2
|
-
|
3
|
-
@function render-gradients($gradients, $gradient-type, $vendor: false) {
|
4
|
-
$vendor-gradients: false;
|
5
|
-
@if $vendor {
|
6
|
-
$vendor-gradients: -#{$vendor}-#{$gradient-type}-gradient($gradients);
|
7
|
-
}
|
8
|
-
|
9
|
-
@else if $vendor == false {
|
10
|
-
$vendor-gradients: "#{$gradient-type}-gradient(#{$gradients})";
|
11
|
-
$vendor-gradients: unquote($vendor-gradients);
|
12
|
-
}
|
13
|
-
@return $vendor-gradients;
|
14
|
-
}
|