bourbon 2.1.3 → 3.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (33) hide show
  1. data/Gemfile.lock +3 -3
  2. data/app/assets/stylesheets/_bourbon-deprecated-upcoming.scss +3 -0
  3. data/app/assets/stylesheets/_bourbon.scss +5 -0
  4. data/app/assets/stylesheets/addons/_html5-input-types.scss +21 -1
  5. data/app/assets/stylesheets/addons/_prefixer.scss +24 -13
  6. data/app/assets/stylesheets/css3/_animation.scss +23 -96
  7. data/app/assets/stylesheets/css3/_appearance.scss +1 -1
  8. data/app/assets/stylesheets/css3/_background-image.scss +2 -15
  9. data/app/assets/stylesheets/css3/_background-size.scss +2 -10
  10. data/app/assets/stylesheets/css3/_border-radius.scss +14 -36
  11. data/app/assets/stylesheets/css3/_box-shadow.scss +2 -11
  12. data/app/assets/stylesheets/css3/_box-sizing.scss +1 -1
  13. data/app/assets/stylesheets/css3/_columns.scss +10 -10
  14. data/app/assets/stylesheets/css3/_flex-box.scss +8 -8
  15. data/app/assets/stylesheets/css3/_perspective.scss +8 -0
  16. data/app/assets/stylesheets/css3/_radial-gradient.scss +3 -1
  17. data/app/assets/stylesheets/css3/_transform.scss +2 -2
  18. data/app/assets/stylesheets/css3/_transition.scss +21 -57
  19. data/app/assets/stylesheets/css3/_user-select.scss +1 -1
  20. data/app/assets/stylesheets/functions/_compact.scss +17 -0
  21. data/app/assets/stylesheets/functions/_deprecated-webkit-gradient.scss +1 -1
  22. data/app/assets/stylesheets/functions/_linear-gradient.scss +2 -19
  23. data/bourbon.gemspec +1 -1
  24. data/features/install.feature +0 -4
  25. data/features/step_definitions/bourbon_steps.rb +0 -7
  26. data/lib/bourbon.rb +3 -1
  27. data/lib/bourbon/generator.rb +3 -18
  28. data/lib/bourbon/version.rb +1 -1
  29. data/readme.md +7 -11
  30. metadata +14 -14
  31. data/lib/bourbon/sass_extensions.rb +0 -8
  32. data/lib/bourbon/sass_extensions/functions.rb +0 -13
  33. data/lib/bourbon/sass_extensions/functions/compact.rb +0 -14
data/Gemfile.lock CHANGED
@@ -1,8 +1,8 @@
1
1
  PATH
2
2
  remote: .
3
3
  specs:
4
- bourbon (2.1.2)
5
- sass (>= 3.2)
4
+ bourbon (3.0.0)
5
+ sass (>= 3.2.0)
6
6
  thor
7
7
 
8
8
  GEM
@@ -36,7 +36,7 @@ GEM
36
36
  rspec-expectations (2.8.0)
37
37
  diff-lcs (~> 1.1.2)
38
38
  rspec-mocks (2.8.0)
39
- sass (3.2.2)
39
+ sass (3.2.3)
40
40
  term-ansicolor (1.0.7)
41
41
  thor (0.16.0)
42
42
 
@@ -0,0 +1,3 @@
1
+ //************************************************************************//
2
+ // These mixins/functions will be deprecated in the next MAJOR version release
3
+ //************************************************************************//
@@ -1,4 +1,5 @@
1
1
  // Custom Functions
2
+ @import "functions/compact";
2
3
  @import "functions/deprecated-webkit-gradient";
3
4
  @import "functions/flex-grid";
4
5
  @import "functions/grid-width";
@@ -26,6 +27,7 @@
26
27
  @import "css3/image-rendering";
27
28
  @import "css3/inline-block";
28
29
  @import "css3/linear-gradient";
30
+ @import "css3/perspective";
29
31
  @import "css3/radial-gradient";
30
32
  @import "css3/transform";
31
33
  @import "css3/transition";
@@ -40,3 +42,6 @@
40
42
  @import "addons/position";
41
43
  @import "addons/prefixer";
42
44
  @import "addons/timing-functions";
45
+
46
+ // Soon to be deprecated Mixins
47
+ @import "bourbon-deprecated-upcoming";
@@ -21,15 +21,35 @@ $inputs-list: 'input[type="email"]',
21
21
  'input[type="week"]';
22
22
 
23
23
  $unquoted-inputs-list: ();
24
-
25
24
  @each $input-type in $inputs-list {
26
25
  $unquoted-inputs-list: append($unquoted-inputs-list, unquote($input-type), comma);
27
26
  }
28
27
 
29
28
  $all-text-inputs: $unquoted-inputs-list;
30
29
 
30
+
31
+ // Hover Pseudo-class
32
+ //************************************************************************//
33
+ $all-text-inputs-hover: ();
34
+ @each $input-type in $unquoted-inputs-list {
35
+ $input-type-hover: $input-type + ":hover";
36
+ $all-text-inputs-hover: append($all-text-inputs-hover, $input-type-hover, comma);
37
+ }
38
+
39
+ // Focus Pseudo-class
40
+ //************************************************************************//
41
+ $all-text-inputs-focus: ();
42
+ @each $input-type in $unquoted-inputs-list {
43
+ $input-type-focus: $input-type + ":focus";
44
+ $all-text-inputs-focus: append($all-text-inputs-focus, $input-type-focus, comma);
45
+ }
46
+
31
47
  // You must use interpolation on the variable:
32
48
  // #{$all-text-inputs}
49
+ // #{$all-text-inputs-hover}
50
+ // #{$all-text-inputs-focus}
51
+
52
+ // Example
33
53
  //************************************************************************//
34
54
  // #{$all-text-inputs}, textarea {
35
55
  // border: 1px solid red;
@@ -1,16 +1,27 @@
1
1
  //************************************************************************//
2
- // Default: Webkit, moz, spec
3
- // Example: @include prefixer(border-radius, $radii, $o: true);
2
+ // Example: @include prefixer(border-radius, $radii, webkit ms spec);
4
3
  //************************************************************************//
5
- @mixin prefixer ($property, $value,
6
- $webkit: true,
7
- $moz: true,
8
- $ms: false,
9
- $o: false,
10
- $spec: true) {
11
- @if $webkit { -webkit-#{$property}: $value; }
12
- @if $moz { -moz-#{$property}: $value; }
13
- @if $ms { -ms-#{$property}: $value; }
14
- @if $o { -o-#{$property}: $value; }
15
- @if $spec { #{$property}: $value; }
4
+ @mixin prefixer ($property, $value, $prefixes) {
5
+
6
+ @each $prefix in $prefixes {
7
+
8
+ @if $prefix == webkit {
9
+ -webkit-#{$property}: $value;
10
+ }
11
+ @else if $prefix == moz {
12
+ -moz-#{$property}: $value;
13
+ }
14
+ @else if $prefix == ms {
15
+ -ms-#{$property}: $value;
16
+ }
17
+ @else if $prefix == o {
18
+ -o-#{$property}: $value;
19
+ }
20
+ @else if $prefix == spec {
21
+ #{$property}: $value;
22
+ }
23
+ @else {
24
+ @warn "Unrecognized prefix: #{$prefix}";
25
+ }
26
+ }
16
27
  }
@@ -2,124 +2,51 @@
2
2
  // Each of these mixins support comma separated lists of values, which allows different transitions for individual properties to be described in a single style rule. Each value in the list corresponds to the value at that same position in the other properties.
3
3
 
4
4
  // Official animation shorthand property.
5
- @mixin animation ($animation-1,
6
- $animation-2: false, $animation-3: false,
7
- $animation-4: false, $animation-5: false,
8
- $animation-6: false, $animation-7: false,
9
- $animation-8: false, $animation-9: false)
10
- {
11
- $full: compact($animation-1, $animation-2, $animation-3, $animation-4,
12
- $animation-5, $animation-6, $animation-7, $animation-8, $animation-9);
13
-
14
- @include prefixer(animation, $full);
5
+ @mixin animation ($animations...) {
6
+ @include prefixer(animation, $animations, webkit moz spec);
15
7
  }
16
8
 
17
9
  // Individual Animation Properties
18
- @mixin animation-name ($name-1,
19
- $name-2: false, $name-3: false,
20
- $name-4: false, $name-5: false,
21
- $name-6: false, $name-7: false,
22
- $name-8: false, $name-9: false)
23
- {
24
- $full: compact($name-1, $name-2, $name-3, $name-4,
25
- $name-5, $name-6, $name-7, $name-8, $name-9);
26
-
27
- @include prefixer(animation-name, $full);
10
+ @mixin animation-name ($names...) {
11
+ @include prefixer(animation-name, $names, webkit moz spec);
28
12
  }
29
13
 
30
14
 
31
- @mixin animation-duration ($time-1: 0,
32
- $time-2: false, $time-3: false,
33
- $time-4: false, $time-5: false,
34
- $time-6: false, $time-7: false,
35
- $time-8: false, $time-9: false)
36
- {
37
- $full: compact($time-1, $time-2, $time-3, $time-4,
38
- $time-5, $time-6, $time-7, $time-8, $time-9);
39
-
40
- @include prefixer(animation-duration, $full);
15
+ @mixin animation-duration ($times...) {
16
+ @include prefixer(animation-duration, $times, webkit moz spec);
41
17
  }
42
18
 
43
19
 
44
- @mixin animation-timing-function ($motion-1: ease,
45
- // ease | linear | ease-in | ease-out | ease-in-out
46
- $motion-2: false, $motion-3: false,
47
- $motion-4: false, $motion-5: false,
48
- $motion-6: false, $motion-7: false,
49
- $motion-8: false, $motion-9: false)
50
- {
51
- $full: compact($motion-1, $motion-2, $motion-3, $motion-4,
52
- $motion-5, $motion-6, $motion-7, $motion-8, $motion-9);
53
-
54
- @include prefixer(animation-timing-function, $full);
20
+ @mixin animation-timing-function ($motions...) {
21
+ // ease | linear | ease-in | ease-out | ease-in-out
22
+ @include prefixer(animation-timing-function, $motions, webkit moz spec);
55
23
  }
56
24
 
57
25
 
58
- @mixin animation-iteration-count ($value-1: 1,
59
- // infinite | <number>
60
- $value-2: false, $value-3: false,
61
- $value-4: false, $value-5: false,
62
- $value-6: false, $value-7: false,
63
- $value-8: false, $value-9: false)
64
- {
65
- $full: compact($value-1, $value-2, $value-3, $value-4,
66
- $value-5, $value-6, $value-7, $value-8, $value-9);
67
-
68
- @include prefixer(animation-iteration-count, $full);
26
+ @mixin animation-iteration-count ($values...) {
27
+ // infinite | <number>
28
+ @include prefixer(animation-iteration-count, $values, webkit moz spec);
69
29
  }
70
30
 
71
31
 
72
- @mixin animation-direction ($direction-1: normal,
73
- // normal | alternate
74
- $direction-2: false, $direction-3: false,
75
- $direction-4: false, $direction-5: false,
76
- $direction-6: false, $direction-7: false,
77
- $direction-8: false, $direction-9: false)
78
- {
79
- $full: compact($direction-1, $direction-2, $direction-3, $direction-4,
80
- $direction-5, $direction-6, $direction-7, $direction-8, $direction-9);
81
-
82
- @include prefixer(animation-direction, $full);
32
+ @mixin animation-direction ($directions...) {
33
+ // normal | alternate
34
+ @include prefixer(animation-direction, $directions, webkit moz spec);
83
35
  }
84
36
 
85
37
 
86
- @mixin animation-play-state ($state-1: running,
87
- // running | paused
88
- $state-2: false, $state-3: false,
89
- $state-4: false, $state-5: false,
90
- $state-6: false, $state-7: false,
91
- $state-8: false, $state-9: false)
92
- {
93
- $full: compact($state-1, $state-2, $state-3, $state-4,
94
- $state-5, $state-6, $state-7, $state-8, $state-9);
95
-
96
- @include prefixer(animation-play-state, $full);
38
+ @mixin animation-play-state ($states...) {
39
+ // running | paused
40
+ @include prefixer(animation-play-state, $states, webkit moz spec);
97
41
  }
98
42
 
99
43
 
100
- @mixin animation-delay ($time-1: 0,
101
- $time-2: false, $time-3: false,
102
- $time-4: false, $time-5: false,
103
- $time-6: false, $time-7: false,
104
- $time-8: false, $time-9: false)
105
- {
106
- $full: compact($time-1, $time-2, $time-3, $time-4,
107
- $time-5, $time-6, $time-7, $time-8, $time-9);
108
-
109
- @include prefixer(animation-delay, $full);
44
+ @mixin animation-delay ($times...) {
45
+ @include prefixer(animation-delay, $times, webkit moz spec);
110
46
  }
111
47
 
112
48
 
113
- @mixin animation-fill-mode ($mode-1: none,
114
- // http://goo.gl/l6ckm
115
- // none | forwards | backwards | both
116
- $mode-2: false, $mode-3: false,
117
- $mode-4: false, $mode-5: false,
118
- $mode-6: false, $mode-7: false,
119
- $mode-8: false, $mode-9: false)
120
- {
121
- $full: compact($mode-1, $mode-2, $mode-3, $mode-4,
122
- $mode-5, $mode-6, $mode-7, $mode-8, $mode-9);
123
-
124
- @include prefixer(animation-fill-mode, $full);
49
+ @mixin animation-fill-mode ($modes...) {
50
+ // none | forwards | backwards | both
51
+ @include prefixer(animation-fill-mode, $modes, webkit moz spec);
125
52
  }
@@ -1,3 +1,3 @@
1
1
  @mixin appearance ($value) {
2
- @include prefixer(appearance, $value, webkit, moz, ms, o);
2
+ @include prefixer(appearance, $value, webkit moz ms o spec);
3
3
  }
@@ -3,19 +3,7 @@
3
3
  // gradients, or for stringing multiple gradients together.
4
4
  //************************************************************************//
5
5
 
6
- @mixin background-image(
7
- $image-1 , $image-2: false,
8
- $image-3: false, $image-4: false,
9
- $image-5: false, $image-6: false,
10
- $image-7: false, $image-8: false,
11
- $image-9: false, $image-10: false
12
- ) {
13
- $images: compact($image-1, $image-2,
14
- $image-3, $image-4,
15
- $image-5, $image-6,
16
- $image-7, $image-8,
17
- $image-9, $image-10);
18
-
6
+ @mixin background-image($images...) {
19
7
  background-image: add-prefix($images, webkit);
20
8
  background-image: add-prefix($images, moz);
21
9
  background-image: add-prefix($images, ms);
@@ -48,10 +36,9 @@
48
36
  }
49
37
 
50
38
 
51
-
52
39
  //Examples:
53
40
  //@include background-image(linear-gradient(top, orange, red));
54
41
  //@include background-image(radial-gradient(50% 50%, cover circle, orange, red));
55
42
  //@include background-image(url("/images/a.png"), linear-gradient(orange, red));
56
43
  //@include background-image(url("image.png"), linear-gradient(orange, red), url("image.png"));
57
- //@include background-image(linear-gradient(hsla(0, 100%, 100%, 0.25) 0%, hsla(0, 100%, 100%, 0.08) 50%, transparent 50%), linear-gradient(orange, red);
44
+ //@include background-image(linear-gradient(hsla(0, 100%, 100%, 0.25) 0%, hsla(0, 100%, 100%, 0.08) 50%, transparent 50%), linear-gradient(orange, red));
@@ -1,11 +1,3 @@
1
- @mixin background-size ($length-1,
2
- $length-2: false, $length-3: false,
3
- $length-4: false, $length-5: false,
4
- $length-6: false, $length-7: false,
5
- $length-8: false, $length-9: false)
6
- {
7
- $full: compact($length-1, $length-2, $length-3, $length-4,
8
- $length-5, $length-6, $length-7, $length-8, $length-9);
9
-
10
- @include prefixer(background-size, $full, webkit, moz, ms, o);
1
+ @mixin background-size ($lengths...) {
2
+ @include prefixer(background-size, $lengths, webkit moz ms o spec);
11
3
  }
@@ -1,44 +1,22 @@
1
- @mixin border-radius ($radii) {
2
- @include prefixer(border-radius, $radii, webkit, not moz);
3
- @warn "border-radius mixin is deprecated and will be removed in the next major version release.";
4
- }
5
-
6
- @mixin border-top-left-radius($radii) {
7
- @include prefixer(border-top-left-radius, $radii, webkit, not moz);
8
- @warn "border-top-left-radius mixin is deprecated and will be removed in the next major version release.";
9
- }
10
-
11
- @mixin border-top-right-radius($radii) {
12
- @include prefixer(border-top-right-radius, $radii, webkit, not moz);
13
- @warn "border-top-right-radius mixin is deprecated and will be removed in the next major version release.";
14
- }
15
-
16
- @mixin border-bottom-left-radius($radii) {
17
- @include prefixer(border-bottom-left-radius, $radii, webkit, not moz);
18
- @warn "border-bottom-left-radius mixin is deprecated and will be removed in the next major version release.";
19
- }
20
-
21
- @mixin border-bottom-right-radius($radii) {
22
- @include prefixer(border-bottom-right-radius, $radii, webkit, not moz);
23
- @warn "border-bottom-right-radius mixin is deprecated and will be removed in the next major version release.";
24
- }
25
-
1
+ //************************************************************************//
2
+ // Shorthand Border-radius mixins
3
+ //************************************************************************//
26
4
  @mixin border-top-radius($radii) {
27
- @include border-top-left-radius($radii);
28
- @include border-top-right-radius($radii);
29
- }
30
-
31
- @mixin border-right-radius($radii) {
32
- @include border-top-right-radius($radii);
33
- @include border-bottom-right-radius($radii);
5
+ @include prefixer(border-top-left-radius, $radii, spec);
6
+ @include prefixer(border-top-right-radius, $radii, spec);
34
7
  }
35
8
 
36
9
  @mixin border-bottom-radius($radii) {
37
- @include border-bottom-left-radius($radii);
38
- @include border-bottom-right-radius($radii);
10
+ @include prefixer(border-bottom-left-radius, $radii, spec);
11
+ @include prefixer(border-bottom-right-radius, $radii, spec);
39
12
  }
40
13
 
41
14
  @mixin border-left-radius($radii) {
42
- @include border-top-left-radius($radii);
43
- @include border-bottom-left-radius($radii);
15
+ @include prefixer(border-top-left-radius, $radii, spec);
16
+ @include prefixer(border-bottom-left-radius, $radii, spec);
17
+ }
18
+
19
+ @mixin border-right-radius($radii) {
20
+ @include prefixer(border-top-right-radius, $radii, spec);
21
+ @include prefixer(border-bottom-right-radius, $radii, spec);
44
22
  }
@@ -1,12 +1,3 @@
1
- // Box-Shadow Mixin Requires Sass v3.1.1+
2
- @mixin box-shadow ($shadow-1,
3
- $shadow-2: false, $shadow-3: false,
4
- $shadow-4: false, $shadow-5: false,
5
- $shadow-6: false, $shadow-7: false,
6
- $shadow-8: false, $shadow-9: false)
7
- {
8
- $full: compact($shadow-1, $shadow-2, $shadow-3, $shadow-4,
9
- $shadow-5, $shadow-6, $shadow-7, $shadow-8, $shadow-9);
10
-
11
- @include prefixer(box-shadow, $full, webkit, not moz);
1
+ @mixin box-shadow ($shadows...) {
2
+ @include prefixer(box-shadow, $shadows, webkit spec);
12
3
  }
@@ -1,4 +1,4 @@
1
1
  @mixin box-sizing ($box) {
2
2
  // content-box | border-box | inherit
3
- @include prefixer(box-sizing, $box);
3
+ @include prefixer(box-sizing, $box, webkit moz spec);
4
4
  }
@@ -1,47 +1,47 @@
1
1
  @mixin columns($arg: auto) {
2
2
  // <column-count> || <column-width>
3
- @include prefixer(columns, $arg);
3
+ @include prefixer(columns, $arg, webkit moz spec);
4
4
  }
5
5
 
6
6
  @mixin column-count($int: auto) {
7
7
  // auto || integer
8
- @include prefixer(column-count, $int);
8
+ @include prefixer(column-count, $int, webkit moz spec);
9
9
  }
10
10
 
11
11
  @mixin column-gap($length: normal) {
12
12
  // normal || length
13
- @include prefixer(column-gap, $length);
13
+ @include prefixer(column-gap, $length, webkit moz spec);
14
14
  }
15
15
 
16
16
  @mixin column-fill($arg: auto) {
17
17
  // auto || length
18
- @include prefixer(columns-fill, $arg);
18
+ @include prefixer(columns-fill, $arg, webkit moz spec);
19
19
  }
20
20
 
21
21
  @mixin column-rule($arg) {
22
22
  // <border-width> || <border-style> || <color>
23
- @include prefixer(column-rule, $arg);
23
+ @include prefixer(column-rule, $arg, webkit moz spec);
24
24
  }
25
25
 
26
26
  @mixin column-rule-color($color) {
27
- @include prefixer(column-rule-color, $color);
27
+ @include prefixer(column-rule-color, $color, webkit moz spec);
28
28
  }
29
29
 
30
30
  @mixin column-rule-style($style: none) {
31
31
  // none | hidden | dashed | dotted | double | groove | inset | inset | outset | ridge | solid
32
- @include prefixer(column-rule-style, $style);
32
+ @include prefixer(column-rule-style, $style, webkit moz spec);
33
33
  }
34
34
 
35
35
  @mixin column-rule-width ($width: none) {
36
- @include prefixer(column-rule-width, $width);
36
+ @include prefixer(column-rule-width, $width, webkit moz spec);
37
37
  }
38
38
 
39
39
  @mixin column-span($arg: none) {
40
40
  // none || all
41
- @include prefixer(column-span, $arg);
41
+ @include prefixer(column-span, $arg, webkit moz spec);
42
42
  }
43
43
 
44
44
  @mixin column-width($length: auto) {
45
45
  // auto || length
46
- @include prefixer(column-width, $length);
46
+ @include prefixer(column-width, $length, webkit moz spec);
47
47
  }
@@ -16,37 +16,37 @@
16
16
 
17
17
  @mixin box-orient($orient: inline-axis) {
18
18
  // horizontal|vertical|inline-axis|block-axis|inherit
19
- @include prefixer(box-orient, $orient);
19
+ @include prefixer(box-orient, $orient, webkit moz spec);
20
20
  }
21
21
 
22
22
  @mixin box-pack($pack: start) {
23
23
  // start|end|center|justify
24
- @include prefixer(box-pack, $pack);
24
+ @include prefixer(box-pack, $pack, webkit moz spec);
25
25
  }
26
26
 
27
27
  @mixin box-align($align: stretch) {
28
28
  // start|end|center|baseline|stretch
29
- @include prefixer(box-align, $align);
29
+ @include prefixer(box-align, $align, webkit moz spec);
30
30
  }
31
31
 
32
32
  @mixin box-direction($direction: normal) {
33
33
  // normal|reverse|inherit
34
- @include prefixer(box-direction, $direction);
34
+ @include prefixer(box-direction, $direction, webkit moz spec);
35
35
  }
36
36
 
37
37
  @mixin box-lines($lines: single) {
38
38
  // single|multiple
39
- @include prefixer(box-lines, $lines);
39
+ @include prefixer(box-lines, $lines, webkit moz spec);
40
40
  }
41
41
 
42
42
  @mixin box-ordinal-group($int: 1) {
43
- @include prefixer(box-ordinal-group, $int);
43
+ @include prefixer(box-ordinal-group, $int, webkit moz spec);
44
44
  }
45
45
 
46
46
  @mixin box-flex($value: 0.0) {
47
- @include prefixer(box-flex, $value);
47
+ @include prefixer(box-flex, $value, webkit moz spec);
48
48
  }
49
49
 
50
50
  @mixin box-flex-group($int: 1) {
51
- @include prefixer(box-flex-group, $int);
51
+ @include prefixer(box-flex-group, $int, webkit moz spec);
52
52
  }
@@ -0,0 +1,8 @@
1
+ @mixin perspective($depth: none) {
2
+ // none | <length>
3
+ @include prefixer(perspective, $depth, webkit moz o spec);
4
+ }
5
+
6
+ @mixin perspective-origin($value: 50% 50%) {
7
+ @include prefixer(perspective-origin, $value, webkit moz o spec);
8
+ }
@@ -56,7 +56,9 @@
56
56
 
57
57
  $full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
58
58
 
59
- $fallback-color: nth($G1, 1);
59
+ // Set $G1 as the default fallback color
60
+ $first-color: nth($full, 1);
61
+ $fallback-color: nth($first-color, 1);
60
62
 
61
63
  @if (type-of($fallback) == color) or ($fallback == "transparent") {
62
64
  $fallback-color: $fallback;
@@ -1,11 +1,11 @@
1
1
  @mixin transform($property: none) {
2
2
  // none | <transform-function>
3
- @include prefixer(transform, $property, webkit, moz, ms, o);
3
+ @include prefixer(transform, $property, webkit moz ms o spec);
4
4
  }
5
5
 
6
6
  @mixin transform-origin($axes: 50%) {
7
7
  // x-axis - left | center | right | length | %
8
8
  // y-axis - top | center | bottom | length | %
9
9
  // z-axis - length
10
- @include prefixer(transform-origin, $axes, webkit, moz, ms, o);
10
+ @include prefixer(transform-origin, $axes, webkit moz ms o spec);
11
11
  }
@@ -3,70 +3,34 @@
3
3
  // @include transition ((opacity, width), (1.0s, 2.0s), ease-in, (0, 2s));
4
4
  // @include transition ($property:(opacity, width), $delay: (1.5s, 2.5s));
5
5
 
6
- @mixin transition ($prop-1: all 0.15s ease-out 0,
7
- $prop-2: false, $prop-3: false,
8
- $prop-4: false, $prop-5: false,
9
- $prop-6: false, $prop-7: false,
10
- $prop-8: false, $prop-9: false)
11
- {
12
- $full: compact($prop-1, $prop-2, $prop-3, $prop-4, $prop-5,
13
- $prop-6, $prop-7, $prop-8, $prop-9);
14
-
15
- @include prefixer(transition, $full, webkit, moz, ms, o);
6
+ @mixin transition ($properties...) {
7
+ @if length($properties) >= 1 {
8
+ @include prefixer(transition, $properties, webkit moz ms o spec);
9
+ }
10
+
11
+ @else {
12
+ $properties: all 0.15s ease-out 0;
13
+ @include prefixer(transition, $properties, webkit moz ms o spec);
14
+ }
16
15
  }
17
16
 
18
-
19
-
20
- @mixin transition-property ($prop-1: all,
21
- $prop-2: false, $prop-3: false,
22
- $prop-4: false, $prop-5: false,
23
- $prop-6: false, $prop-7: false,
24
- $prop-8: false, $prop-9: false)
25
- {
26
- $full: compact($prop-1, $prop-2, $prop-3, $prop-4, $prop-5,
27
- $prop-6, $prop-7, $prop-8, $prop-9);
28
-
29
- -webkit-transition-property: transition-property-names($full, 'webkit');
30
- -moz-transition-property: transition-property-names($full, 'moz');
31
- -ms-transition-property: transition-property-names($full, 'ms');
32
- -o-transition-property: transition-property-names($full, 'o');
33
- transition-property: transition-property-names($full, false);
17
+ @mixin transition-property ($properties...) {
18
+ -webkit-transition-property: transition-property-names($properties, 'webkit');
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
+ transition-property: transition-property-names($properties, false);
34
23
  }
35
24
 
36
- @mixin transition-duration ($time-1: 0,
37
- $time-2: false, $time-3: false,
38
- $time-4: false, $time-5: false,
39
- $time-6: false, $time-7: false,
40
- $time-8: false, $time-9: false)
41
- {
42
- $full: compact($time-1, $time-2, $time-3, $time-4, $time-5,
43
- $time-6, $time-7, $time-8, $time-9);
44
-
45
- @include prefixer(transition-duration, $full, webkit, moz, ms, o);
25
+ @mixin transition-duration ($times...) {
26
+ @include prefixer(transition-duration, $times, webkit moz ms o spec);
46
27
  }
47
28
 
48
- @mixin transition-timing-function ($motion-1: ease,
49
- $motion-2: false, $motion-3: false,
50
- $motion-4: false, $motion-5: false,
51
- $motion-6: false, $motion-7: false,
52
- $motion-8: false, $motion-9: false)
53
- {
54
- $full: compact($motion-1, $motion-2, $motion-3, $motion-4, $motion-5,
55
- $motion-6, $motion-7, $motion-8, $motion-9);
56
-
29
+ @mixin transition-timing-function ($motions...) {
57
30
  // ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier()
58
- @include prefixer(transition-timing-function, $full, webkit, moz, ms, o);
31
+ @include prefixer(transition-timing-function, $motions, webkit moz ms o spec);
59
32
  }
60
33
 
61
- @mixin transition-delay ($time-1: 0,
62
- $time-2: false, $time-3: false,
63
- $time-4: false, $time-5: false,
64
- $time-6: false, $time-7: false,
65
- $time-8: false, $time-9: false)
66
- {
67
- $full: compact($time-1, $time-2, $time-3, $time-4, $time-5,
68
- $time-6, $time-7, $time-8, $time-9);
69
-
70
- @include prefixer(transition-delay, $full, webkit, moz, ms, o);
34
+ @mixin transition-delay ($times...) {
35
+ @include prefixer(transition-delay, $times, webkit moz ms o spec);
71
36
  }
72
-
@@ -1,3 +1,3 @@
1
1
  @mixin user-select($arg: none) {
2
- @include prefixer(user-select, $arg, webkit, moz, ms);
2
+ @include prefixer(user-select, $arg, webkit moz ms spec);
3
3
  }
@@ -0,0 +1,17 @@
1
+ // functions/_compact.scss
2
+
3
+ /**
4
+ * Sass implementation of `compact` function from the bourbon.rb library
5
+ */
6
+ @function compact($var-1, $var-2: false, $var-3: false, $var-4: false, $var-5: false, $var-6: false, $var-7: false, $var-8: false, $var-9: false, $var-10: false, $var-11: false, $var-12: false,$var-13: false, $var-14: false, $var-15: false, $var-16: false) {
7
+ $list: ();
8
+ $vars: $var-1, $var-2, $var-3, $var-4, $var-5, $var-6, $var-7, $var-8, $var-9, $var-10, $var-11, $var-12, $var-13, $var-14, $var-15;
9
+
10
+ @each $var in $vars {
11
+ @if $var {
12
+ $list: append($list, $var, comma);
13
+ }
14
+ }
15
+
16
+ @return $list;
17
+ }
@@ -18,7 +18,7 @@
18
18
  $gradient-list: join($gradient-list, $color-stop, comma);
19
19
  }
20
20
 
21
- @else {
21
+ @else if $gradient != null {
22
22
  @if $i == $full-length {
23
23
  $percentage: 100%;
24
24
  }
@@ -1,23 +1,6 @@
1
- @function linear-gradient($pos: top, $G1: false, $G2: false,
2
- $G3: false, $G4: false,
3
- $G5: false, $G6: false,
4
- $G7: false, $G8: false,
5
- $G9: false, $G10: false) {
6
-
7
- // Detect what type of value exists in $pos
8
- $pos-type: type-of(nth($pos, 1));
9
-
10
- // If $pos is missing from mixin, reassign vars and add default position
11
- @if ($pos-type == color) or (nth($pos, 1) == "transparent") {
12
- $G10: $G9; $G9: $G8; $G8: $G7; $G7: $G6; $G6: $G5;
13
- $G5: $G4; $G4: $G3; $G3: $G2; $G2: $G1; $G1: $pos;
14
- $pos: top; // Default position
15
- }
16
-
1
+ @function linear-gradient($gradients...) {
17
2
  $type: linear;
18
- $gradient: compact($pos, $G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
19
- $type-gradient: append($type, $gradient, comma);
3
+ $type-gradient: append($type, $gradients, comma);
20
4
 
21
5
  @return $type-gradient;
22
6
  }
23
-
data/bourbon.gemspec CHANGED
@@ -26,7 +26,7 @@ that support only CSS3 prefixed properties.
26
26
  s.executables = `git ls-files -- bin/*`.split("\n").map{ |f| File.basename(f) }
27
27
  s.require_paths = ["lib"]
28
28
 
29
- s.add_dependency('sass', '>= 3.2')
29
+ s.add_dependency('sass', '>= 3.2.0')
30
30
  s.add_dependency('thor')
31
31
 
32
32
  s.add_development_dependency('aruba', '~> 0.4')
@@ -6,9 +6,7 @@ Feature: Install bourbon files
6
6
  Then the sass directories should have been generated
7
7
  And the following directories should exist:
8
8
  | bourbon |
9
- | bourbon/lib |
10
9
  And the master bourbon partial should have been generated
11
- And the lib files should have been generated
12
10
  And the output should contain "Bourbon files installed to bourbon/"
13
11
 
14
12
  Scenario: Generating does not overwrite an existing bourbon directory
@@ -21,9 +19,7 @@ Feature: Install bourbon files
21
19
  Then the sass directories with "custom_path" prefix should have been generated
22
20
  And the following directories should exist:
23
21
  | custom_path/bourbon |
24
- | custom_path/bourbon/lib |
25
22
  And the master bourbon partial should have been generated within "custom_path" directory
26
- And the lib files should have been generated within "custom_path" directory
27
23
  And the output should contain "Bourbon files installed to custom_path/bourbon/"
28
24
 
29
25
  Scenario: Forcing install of bourbon
@@ -15,13 +15,6 @@ Then /^the master bourbon partial should have been generated(?: within "([^"]+)"
15
15
  check_file_presence([bourbon_path(prefix, '_bourbon.scss')], true)
16
16
  end
17
17
 
18
- Then /^the lib files should have been generated(?: within "([^"]+)" directory)?$/ do |prefix|
19
- check_file_presence([bourbon_path(prefix, 'lib/bourbon.rb')], true)
20
- check_directory_presence([bourbon_path(prefix, 'lib/bourbon')], true)
21
- check_file_presence([bourbon_path(prefix, 'lib/bourbon/sass_extensions.rb')], true)
22
- check_directory_presence([bourbon_path(prefix, 'lib/bourbon/sass_extensions')], true)
23
- end
24
-
25
18
  Then /^bourbon should not have been generated$/ do
26
19
  check_directory_presence(['bourbon'], false)
27
20
  end
data/lib/bourbon.rb CHANGED
@@ -20,4 +20,6 @@ module Bourbon
20
20
  end
21
21
  end
22
22
 
23
- require File.join(File.dirname(__FILE__), "/bourbon/sass_extensions")
23
+ unless defined?(Sass)
24
+ require 'sass'
25
+ end
@@ -49,8 +49,7 @@ module Bourbon
49
49
  end
50
50
 
51
51
  def install_files
52
- make_lib_directory
53
- copy_in_sass_extensions
52
+ make_install_directory
54
53
  copy_in_scss_files
55
54
  end
56
55
 
@@ -58,14 +57,8 @@ module Bourbon
58
57
  FileUtils.rm_rf("bourbon")
59
58
  end
60
59
 
61
- def make_lib_directory
62
- FileUtils.mkdir_p(install_path.join('lib', 'bourbon'))
63
- end
64
-
65
- def copy_in_sass_extensions
66
- FileUtils.cp(File.join(lib_directory, 'bourbon.rb'), install_path.join('lib'))
67
- FileUtils.cp(File.join(lib_bourbon_directory, 'sass_extensions.rb'), install_path.join('lib', 'bourbon'))
68
- FileUtils.cp_r(File.join(lib_bourbon_directory, 'sass_extensions'), install_path.join('lib', 'bourbon'))
60
+ def make_install_directory
61
+ FileUtils.mkdir_p(install_path)
69
62
  end
70
63
 
71
64
  def copy_in_scss_files
@@ -80,14 +73,6 @@ module Bourbon
80
73
  File.join(top_level_directory, "app", "assets", "stylesheets")
81
74
  end
82
75
 
83
- def lib_directory
84
- File.join(top_level_directory, "lib")
85
- end
86
-
87
- def lib_bourbon_directory
88
- File.join(top_level_directory, "lib", "bourbon")
89
- end
90
-
91
76
  def top_level_directory
92
77
  File.dirname(File.dirname(File.dirname(__FILE__)))
93
78
  end
@@ -1,3 +1,3 @@
1
1
  module Bourbon
2
- VERSION = "2.1.3"
2
+ VERSION = "3.0.0"
3
3
  end
data/readme.md CHANGED
@@ -40,15 +40,13 @@ Import Bourbon at the beginning of application.css.scss. All additional styleshe
40
40
 
41
41
  [Help! I'm getting an undefined mixin error.](https://github.com/thoughtbot/bourbon/wiki/Rails-Help-%5C-Undefined-mixin)
42
42
 
43
- ##### [Rails 3.0.x Install Instructions](https://github.com/thoughtbot/bourbon/wiki/Rails-3.0.x-Install)
44
-
45
- ##### Rails 2.3 - follow the [non-rails installation](#non-rails)
43
+ ##### [Rails 3.0.x Install Instructions](https://github.com/thoughtbot/bourbon/wiki/Rails-3.0.x-Install) | [Rails 2.3 Install Instructions](https://github.com/thoughtbot/bourbon/wiki/Bourbon-v2.x-or-Rails-2.3-Install)
46
44
 
47
45
  # <span id="non-rails"></span>Non-Rails projects
48
46
  Bourbon includes an easy way to generate a directory with all the necessary files.
49
47
  For command line help: `$ bourbon help` or visit the [Command line tools wiki](https://github.com/thoughtbot/bourbon/wiki/Command-Line-Tools)
50
48
 
51
- ####Install
49
+ ####Install (Bourbon v3.0+)
52
50
 
53
51
  gem install bourbon
54
52
 
@@ -56,19 +54,15 @@ Install Bourbon into the current directory by generating the `bourbon` folder:
56
54
 
57
55
  bourbon install
58
56
 
59
- <small>The generated folder will contain all the mixins and other necessary Bourbon files.
60
- It is recommended not to add or modify the Bourbon files so that you can update Bourbon easily.</small>
61
-
62
- #### Sass Watch
63
- *Sass Watch:* To output properly, Bourbon must be explicitly required (`-r`) by Sass at the command line:
57
+ The generated folder will contain all the mixins and other necessary Bourbon files. It is recommended not to add or modify the Bourbon files so that you can update Bourbon easily.
64
58
 
65
- # Example (project root directory)
66
- sass --watch stylesheets/sass:stylesheets -r ./stylesheets/sass/bourbon/lib/bourbon.rb
59
+ #### Import
67
60
 
68
61
  Lastly, import the mixins at the beginning of your stylesheet(s):
69
62
 
70
63
  @import 'bourbon/bourbon';
71
64
 
65
+ Note: Bourbon no longer requires a custom `sass --watch` command for Bourbon v3.0+
72
66
 
73
67
  #### Other Commands
74
68
  Visit the [Command line tools wiki](https://github.com/thoughtbot/bourbon/wiki/Command-Line-Tools) for a complete list
@@ -76,6 +70,8 @@ Visit the [Command line tools wiki](https://github.com/thoughtbot/bourbon/wiki/C
76
70
  bourbon help
77
71
  bourbon update
78
72
 
73
+ ##### [Bourbon v2.x install instructions](https://github.com/thoughtbot/bourbon/wiki/Bourbon-v2.x-or-Rails-2.3-Install)
74
+
79
75
  -------
80
76
  # [Changelog](https://github.com/thoughtbot/bourbon/wiki)
81
77
 
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: bourbon
3
3
  version: !ruby/object:Gem::Version
4
- version: 2.1.3
4
+ version: 3.0.0
5
5
  prerelease:
6
6
  platform: ruby
7
7
  authors:
@@ -20,22 +20,22 @@ authors:
20
20
  autorequire:
21
21
  bindir: bin
22
22
  cert_chain: []
23
- date: 2012-12-05 00:00:00.000000000 Z
23
+ date: 2012-12-06 00:00:00.000000000 Z
24
24
  dependencies:
25
25
  - !ruby/object:Gem::Dependency
26
26
  name: sass
27
- requirement: &70313890203780 !ruby/object:Gem::Requirement
27
+ requirement: &70282866974140 !ruby/object:Gem::Requirement
28
28
  none: false
29
29
  requirements:
30
30
  - - ! '>='
31
31
  - !ruby/object:Gem::Version
32
- version: '3.2'
32
+ version: 3.2.0
33
33
  type: :runtime
34
34
  prerelease: false
35
- version_requirements: *70313890203780
35
+ version_requirements: *70282866974140
36
36
  - !ruby/object:Gem::Dependency
37
37
  name: thor
38
- requirement: &70313890203160 !ruby/object:Gem::Requirement
38
+ requirement: &70282866973720 !ruby/object:Gem::Requirement
39
39
  none: false
40
40
  requirements:
41
41
  - - ! '>='
@@ -43,10 +43,10 @@ dependencies:
43
43
  version: '0'
44
44
  type: :runtime
45
45
  prerelease: false
46
- version_requirements: *70313890203160
46
+ version_requirements: *70282866973720
47
47
  - !ruby/object:Gem::Dependency
48
48
  name: aruba
49
- requirement: &70313890202620 !ruby/object:Gem::Requirement
49
+ requirement: &70282866973180 !ruby/object:Gem::Requirement
50
50
  none: false
51
51
  requirements:
52
52
  - - ~>
@@ -54,10 +54,10 @@ dependencies:
54
54
  version: '0.4'
55
55
  type: :development
56
56
  prerelease: false
57
- version_requirements: *70313890202620
57
+ version_requirements: *70282866973180
58
58
  - !ruby/object:Gem::Dependency
59
59
  name: rake
60
- requirement: &70313890202120 !ruby/object:Gem::Requirement
60
+ requirement: &70282866972700 !ruby/object:Gem::Requirement
61
61
  none: false
62
62
  requirements:
63
63
  - - ! '>='
@@ -65,7 +65,7 @@ dependencies:
65
65
  version: '0'
66
66
  type: :development
67
67
  prerelease: false
68
- version_requirements: *70313890202120
68
+ version_requirements: *70282866972700
69
69
  description: ! 'The purpose of Bourbon Vanilla Sass Mixins is to provide a comprehensive
70
70
  framework of
71
71
 
@@ -92,6 +92,7 @@ files:
92
92
  - Gemfile.lock
93
93
  - LICENSE
94
94
  - Rakefile
95
+ - app/assets/stylesheets/_bourbon-deprecated-upcoming.scss
95
96
  - app/assets/stylesheets/_bourbon.scss
96
97
  - app/assets/stylesheets/addons/_button.scss
97
98
  - app/assets/stylesheets/addons/_clearfix.scss
@@ -117,10 +118,12 @@ files:
117
118
  - app/assets/stylesheets/css3/_image-rendering.scss
118
119
  - app/assets/stylesheets/css3/_inline-block.scss
119
120
  - app/assets/stylesheets/css3/_linear-gradient.scss
121
+ - app/assets/stylesheets/css3/_perspective.scss
120
122
  - app/assets/stylesheets/css3/_radial-gradient.scss
121
123
  - app/assets/stylesheets/css3/_transform.scss
122
124
  - app/assets/stylesheets/css3/_transition.scss
123
125
  - app/assets/stylesheets/css3/_user-select.scss
126
+ - app/assets/stylesheets/functions/_compact.scss
124
127
  - app/assets/stylesheets/functions/_deprecated-webkit-gradient.scss
125
128
  - app/assets/stylesheets/functions/_flex-grid.scss
126
129
  - app/assets/stylesheets/functions/_grid-width.scss
@@ -141,9 +144,6 @@ files:
141
144
  - lib/bourbon.rb
142
145
  - lib/bourbon/engine.rb
143
146
  - lib/bourbon/generator.rb
144
- - lib/bourbon/sass_extensions.rb
145
- - lib/bourbon/sass_extensions/functions.rb
146
- - lib/bourbon/sass_extensions/functions/compact.rb
147
147
  - lib/bourbon/version.rb
148
148
  - lib/tasks/install.rake
149
149
  - readme.md
@@ -1,8 +0,0 @@
1
- module Bourbon::SassExtensions
2
- end
3
-
4
- unless defined?(Sass)
5
- require 'sass'
6
- end
7
-
8
- require File.join(File.dirname(__FILE__), '/sass_extensions/functions')
@@ -1,13 +0,0 @@
1
- module Bourbon::SassExtensions::Functions
2
- end
3
-
4
- require File.join(File.dirname(__FILE__), "/functions/compact")
5
-
6
- module Sass::Script::Functions
7
- include Bourbon::SassExtensions::Functions::Compact
8
- end
9
-
10
- # Wierd that this has to be re-included to pick up sub-modules. Ruby bug?
11
- class Sass::Script::Functions::EvaluationContext
12
- include Sass::Script::Functions
13
- end
@@ -1,14 +0,0 @@
1
- # Compact function pulled from compass
2
- module Bourbon::SassExtensions::Functions::Compact
3
-
4
- def compact(*args)
5
- sep = :comma
6
- if args.size == 1 && args.first.is_a?(Sass::Script::List)
7
- list = args.first
8
- args = list.value
9
- sep = list.separator
10
- end
11
- Sass::Script::List.new(args.reject{|a| !a.to_bool}, sep)
12
- end
13
-
14
- end