bourbon 4.1.1 → 4.2.0.beta

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.
Files changed (107) hide show
  1. checksums.yaml +4 -4
  2. data/.gitignore +4 -3
  3. data/.hound.yml +4 -0
  4. data/.npmignore +5 -2
  5. data/.scss-lint.yml +175 -0
  6. data/README.md +7 -12
  7. data/Rakefile +6 -4
  8. data/app/assets/stylesheets/_bourbon-deprecated-upcoming.scss +16 -7
  9. data/app/assets/stylesheets/_bourbon.scss +27 -26
  10. data/app/assets/stylesheets/addons/_border-color.scss +26 -0
  11. data/app/assets/stylesheets/addons/_border-radius.scss +48 -0
  12. data/app/assets/stylesheets/addons/_border-style.scss +25 -0
  13. data/app/assets/stylesheets/addons/_border-width.scss +25 -0
  14. data/app/assets/stylesheets/addons/_buttons.scss +64 -0
  15. data/app/assets/stylesheets/addons/_clearfix.scss +17 -10
  16. data/app/assets/stylesheets/addons/_ellipsis.scss +22 -0
  17. data/app/assets/stylesheets/addons/{_font-family.scss → _font-stacks.scss} +26 -0
  18. data/app/assets/stylesheets/addons/_hide-text.scss +23 -8
  19. data/app/assets/stylesheets/addons/_margin.scss +26 -0
  20. data/app/assets/stylesheets/addons/_padding.scss +26 -0
  21. data/app/assets/stylesheets/addons/_position.scss +24 -2
  22. data/app/assets/stylesheets/addons/_prefixer.scss +36 -15
  23. data/app/assets/stylesheets/addons/_size.scss +30 -1
  24. data/app/assets/stylesheets/addons/_text-inputs.scss +112 -0
  25. data/app/assets/stylesheets/addons/_timing-functions.scss +7 -5
  26. data/app/assets/stylesheets/addons/_triangle.scss +11 -11
  27. data/app/assets/stylesheets/addons/_word-wrap.scss +19 -0
  28. data/app/assets/stylesheets/css3/_animation.scss +14 -23
  29. data/app/assets/stylesheets/css3/_appearance.scss +1 -1
  30. data/app/assets/stylesheets/css3/_backface-visibility.scss +0 -3
  31. data/app/assets/stylesheets/css3/_background-image.scss +1 -1
  32. data/app/assets/stylesheets/css3/_background.scss +3 -3
  33. data/app/assets/stylesheets/css3/_border-image.scss +3 -3
  34. data/app/assets/stylesheets/css3/_calc.scss +1 -1
  35. data/app/assets/stylesheets/css3/_columns.scss +8 -8
  36. data/app/assets/stylesheets/css3/_filter.scss +0 -1
  37. data/app/assets/stylesheets/css3/_flex-box.scss +16 -47
  38. data/app/assets/stylesheets/css3/_font-feature-settings.scss +1 -7
  39. data/app/assets/stylesheets/css3/_hyphens.scss +2 -2
  40. data/app/assets/stylesheets/css3/_image-rendering.scss +6 -6
  41. data/app/assets/stylesheets/css3/_keyframes.scss +1 -0
  42. data/app/assets/stylesheets/css3/_linear-gradient.scss +11 -11
  43. data/app/assets/stylesheets/css3/_radial-gradient.scss +14 -14
  44. data/app/assets/stylesheets/css3/_selection.scss +39 -11
  45. data/app/assets/stylesheets/css3/_transform.scss +5 -5
  46. data/app/assets/stylesheets/css3/_transition.scss +17 -23
  47. data/app/assets/stylesheets/css3/_user-select.scss +2 -2
  48. data/app/assets/stylesheets/functions/{_assign.scss → _assign-inputs.scss} +2 -2
  49. data/app/assets/stylesheets/functions/_contains-falsy.scss +20 -0
  50. data/app/assets/stylesheets/functions/_contains.scss +16 -2
  51. data/app/assets/stylesheets/functions/_is-length.scss +5 -1
  52. data/app/assets/stylesheets/functions/_is-light.scss +21 -0
  53. data/app/assets/stylesheets/functions/_is-number.scss +11 -0
  54. data/app/assets/stylesheets/functions/_is-size.scss +8 -1
  55. data/app/assets/stylesheets/functions/_px-to-em.scss +2 -2
  56. data/app/assets/stylesheets/functions/_px-to-rem.scss +2 -2
  57. data/app/assets/stylesheets/functions/_shade.scss +24 -0
  58. data/app/assets/stylesheets/functions/_strip-units.scss +15 -3
  59. data/app/assets/stylesheets/functions/_tint.scss +24 -0
  60. data/app/assets/stylesheets/functions/_transition-property-name.scss +14 -14
  61. data/app/assets/stylesheets/functions/_unpack.scss +18 -8
  62. data/app/assets/stylesheets/helpers/_convert-units.scss +2 -2
  63. data/app/assets/stylesheets/helpers/_directional-values.scss +96 -0
  64. data/app/assets/stylesheets/helpers/_font-source-declaration.scss +2 -1
  65. data/app/assets/stylesheets/helpers/_linear-gradient-parser.scss +1 -1
  66. data/app/assets/stylesheets/helpers/_linear-positions-parser.scss +1 -1
  67. data/app/assets/stylesheets/helpers/_radial-arg-parser.scss +10 -10
  68. data/app/assets/stylesheets/helpers/_radial-gradient-parser.scss +4 -4
  69. data/app/assets/stylesheets/helpers/_radial-positions-parser.scss +2 -2
  70. data/app/assets/stylesheets/helpers/_str-to-num.scss +3 -3
  71. data/app/assets/stylesheets/settings/_asset-pipeline.scss +6 -0
  72. data/app/assets/stylesheets/settings/_prefixer.scss +5 -2
  73. data/bourbon.gemspec +4 -2
  74. data/bower.json +8 -6
  75. data/lib/bourbon/version.rb +1 -1
  76. data/package.json +1 -1
  77. data/spec/bourbon/functions/assign_inputs_spec.rb +50 -0
  78. data/spec/bourbon/functions/contains_spec.rb +27 -0
  79. data/spec/bourbon/functions/is_length_spec.rb +49 -0
  80. data/spec/bourbon/functions/is_light_spec.rb +37 -0
  81. data/spec/bourbon/functions/is_number_spec.rb +43 -0
  82. data/spec/bourbon/functions/is_size_spec.rb +43 -0
  83. data/spec/bourbon/functions/modular_scale_spec.rb +43 -0
  84. data/spec/bourbon/functions/px_to_em_spec.rb +31 -0
  85. data/spec/fixtures/_setup.scss +1 -0
  86. data/spec/fixtures/functions/assign-inputs.scss +19 -0
  87. data/spec/fixtures/functions/contains.scss +28 -0
  88. data/spec/fixtures/functions/is-length.scss +35 -0
  89. data/spec/fixtures/functions/is-light.scss +29 -0
  90. data/spec/fixtures/functions/is-number.scss +31 -0
  91. data/spec/fixtures/functions/is-size.scss +31 -0
  92. data/spec/fixtures/functions/modular-scale.scss +29 -0
  93. data/spec/fixtures/functions/px-to-em.scss +17 -0
  94. data/spec/spec_helper.rb +22 -0
  95. data/spec/support/matchers/be_contained_in.rb +10 -0
  96. data/spec/support/matchers/have_rule.rb +35 -0
  97. data/spec/support/matchers/have_value.rb +15 -0
  98. data/spec/support/parser_support.rb +16 -0
  99. data/spec/support/sass_support.rb +10 -0
  100. metadata +102 -19
  101. data/app/assets/stylesheets/addons/_directional-values.scss +0 -111
  102. data/app/assets/stylesheets/addons/_html5-input-types.scss +0 -90
  103. data/app/assets/stylesheets/css3/_border-radius.scss +0 -22
  104. data/app/assets/stylesheets/css3/_box-sizing.scss +0 -4
  105. data/app/assets/stylesheets/functions/_color-lightness.scss +0 -13
  106. data/app/assets/stylesheets/functions/_tint-shade.scss +0 -9
  107. data/app/assets/stylesheets/helpers/_is-num.scss +0 -5
@@ -1,111 +0,0 @@
1
- // directional-property mixins are shorthands
2
- // for writing properties like the following
3
- //
4
- // @include margin(null 0 10px);
5
- // ------
6
- // margin-right: 0;
7
- // margin-bottom: 10px;
8
- // margin-left: 0;
9
- //
10
- // - or -
11
- //
12
- // @include border-style(dotted null);
13
- // ------
14
- // border-top-style: dotted;
15
- // border-bottom-style: dotted;
16
- //
17
- // ------
18
- //
19
- // Note: You can also use false instead of null
20
-
21
- @function collapse-directionals($vals) {
22
- $output: null;
23
-
24
- $A: nth( $vals, 1 );
25
- $B: if( length($vals) < 2, $A, nth($vals, 2));
26
- $C: if( length($vals) < 3, $A, nth($vals, 3));
27
- $D: if( length($vals) < 2, $A, nth($vals, if( length($vals) < 4, 2, 4) ));
28
-
29
- @if $A == 0 { $A: 0 }
30
- @if $B == 0 { $B: 0 }
31
- @if $C == 0 { $C: 0 }
32
- @if $D == 0 { $D: 0 }
33
-
34
- @if $A == $B and $A == $C and $A == $D { $output: $A }
35
- @else if $A == $C and $B == $D { $output: $A $B }
36
- @else if $B == $D { $output: $A $B $C }
37
- @else { $output: $A $B $C $D }
38
-
39
- @return $output;
40
- }
41
-
42
- @function contains-falsy($list) {
43
- @each $item in $list {
44
- @if not $item {
45
- @return true;
46
- }
47
- }
48
-
49
- @return false;
50
- }
51
-
52
- @mixin directional-property($pre, $suf, $vals) {
53
- // Property Names
54
- $top: $pre + "-top" + if($suf, "-#{$suf}", "");
55
- $bottom: $pre + "-bottom" + if($suf, "-#{$suf}", "");
56
- $left: $pre + "-left" + if($suf, "-#{$suf}", "");
57
- $right: $pre + "-right" + if($suf, "-#{$suf}", "");
58
- $all: $pre + if($suf, "-#{$suf}", "");
59
-
60
- $vals: collapse-directionals($vals);
61
-
62
- @if contains-falsy($vals) {
63
- @if nth($vals, 1) { #{$top}: nth($vals, 1); }
64
-
65
- @if length($vals) == 1 {
66
- @if nth($vals, 1) { #{$right}: nth($vals, 1); }
67
- } @else {
68
- @if nth($vals, 2) { #{$right}: nth($vals, 2); }
69
- }
70
-
71
- // prop: top/bottom right/left
72
- @if length($vals) == 2 {
73
- @if nth($vals, 1) { #{$bottom}: nth($vals, 1); }
74
- @if nth($vals, 2) { #{$left}: nth($vals, 2); }
75
-
76
- // prop: top right/left bottom
77
- } @else if length($vals) == 3 {
78
- @if nth($vals, 3) { #{$bottom}: nth($vals, 3); }
79
- @if nth($vals, 2) { #{$left}: nth($vals, 2); }
80
-
81
- // prop: top right bottom left
82
- } @else if length($vals) == 4 {
83
- @if nth($vals, 3) { #{$bottom}: nth($vals, 3); }
84
- @if nth($vals, 4) { #{$left}: nth($vals, 4); }
85
- }
86
-
87
- // prop: top/right/bottom/left
88
- } @else {
89
- #{$all}: $vals;
90
- }
91
- }
92
-
93
- @mixin margin($vals...) {
94
- @include directional-property(margin, false, $vals...);
95
- }
96
-
97
- @mixin padding($vals...) {
98
- @include directional-property(padding, false, $vals...);
99
- }
100
-
101
- @mixin border-style($vals...) {
102
- @include directional-property(border, style, $vals...);
103
- }
104
-
105
- @mixin border-color($vals...) {
106
- @include directional-property(border, color, $vals...);
107
- }
108
-
109
- @mixin border-width($vals...) {
110
- @include directional-property(border, width, $vals...);
111
- }
@@ -1,90 +0,0 @@
1
- //************************************************************************//
2
- // Generate a variable ($all-text-inputs) with a list of all html5
3
- // input types that have a text-based input, excluding textarea.
4
- // http://diveintohtml5.org/forms.html
5
- //************************************************************************//
6
- $inputs-list: 'input[type="email"]',
7
- 'input[type="number"]',
8
- 'input[type="password"]',
9
- 'input[type="search"]',
10
- 'input[type="tel"]',
11
- 'input[type="text"]',
12
- 'input[type="url"]',
13
-
14
- // Webkit & Gecko may change the display of these in the future
15
- 'input[type="color"]',
16
- 'input[type="date"]',
17
- 'input[type="datetime"]',
18
- 'input[type="datetime-local"]',
19
- 'input[type="month"]',
20
- 'input[type="time"]',
21
- 'input[type="week"]';
22
-
23
- // Bare inputs
24
- //************************************************************************//
25
- $all-text-inputs: assign-inputs($inputs-list);
26
-
27
- // Hover Pseudo-class
28
- //************************************************************************//
29
- $all-text-inputs-hover: assign-inputs($inputs-list, hover);
30
-
31
- // Focus Pseudo-class
32
- //************************************************************************//
33
- $all-text-inputs-focus: assign-inputs($inputs-list, focus);
34
-
35
- // Active Pseudo-class
36
- //************************************************************************//
37
- $all-text-inputs-active: assign-inputs($inputs-list, active);
38
-
39
-
40
- // You must use interpolation on the variable:
41
- // #{$all-text-inputs}
42
- // #{$all-text-inputs-hover}
43
- // #{$all-text-inputs-focus}
44
- // #{$all-text-inputs-active}
45
-
46
- // Example
47
- //************************************************************************//
48
- // #{$all-text-inputs}, textarea {
49
- // border: 1px solid red;
50
- // }
51
-
52
-
53
-
54
- //************************************************************************//
55
- // Generate a variable ($all-button-inputs) with a list of all html5
56
- // input types that have a button-based input, excluding button.
57
- //************************************************************************//
58
- $inputs-button-list: 'input[type="button"]',
59
- 'input[type="reset"]',
60
- 'input[type="submit"]';
61
-
62
- // Bare inputs
63
- //************************************************************************//
64
- $all-button-inputs: assign-inputs($inputs-button-list);
65
-
66
- // Hover Pseudo-class
67
- //************************************************************************//
68
- $all-button-inputs-hover: assign-inputs($inputs-button-list, hover);
69
-
70
- // Focus Pseudo-class
71
- //************************************************************************//
72
- $all-button-inputs-focus: assign-inputs($inputs-button-list, focus);
73
-
74
- // Active Pseudo-class
75
- //************************************************************************//
76
- $all-button-inputs-active: assign-inputs($inputs-button-list, active);
77
-
78
-
79
-
80
- // You must use interpolation on the variable:
81
- // #{$all-button-inputs}
82
- // #{$all-button-inputs-hover}
83
- // #{$all-button-inputs-focus}
84
- // #{$all-button-inputs-active}
85
-
86
- // Example
87
- //************************************************************************//
88
- // #{$all-button-inputs}, button {
89
- // border: 1px solid red;
90
- // }
@@ -1,22 +0,0 @@
1
- // Border Radius (Shorthand)
2
- // Provides a shorthand syntax to target and add border radii to both corners on one side of a box
3
-
4
- @mixin border-top-radius($radii) {
5
- border-top-left-radius: $radii;
6
- border-top-right-radius: $radii;
7
- }
8
-
9
- @mixin border-right-radius($radii) {
10
- border-bottom-right-radius: $radii;
11
- border-top-right-radius: $radii;
12
- }
13
-
14
- @mixin border-bottom-radius($radii) {
15
- border-bottom-left-radius: $radii;
16
- border-bottom-right-radius: $radii;
17
- }
18
-
19
- @mixin border-left-radius($radii) {
20
- border-bottom-left-radius: $radii;
21
- border-top-left-radius: $radii;
22
- }
@@ -1,4 +0,0 @@
1
- @mixin box-sizing ($box) {
2
- // content-box | border-box | inherit
3
- @include prefixer(box-sizing, $box, webkit moz spec);
4
- }
@@ -1,13 +0,0 @@
1
- // Programatically determines whether a color is light or dark
2
- // Returns a boolean
3
- // More details here http://robots.thoughtbot.com/closer-look-color-lightness
4
-
5
- @function is-light($hex-color) {
6
- $-local-red: red(rgba($hex-color, 1.0));
7
- $-local-green: green(rgba($hex-color, 1.0));
8
- $-local-blue: blue(rgba($hex-color, 1.0));
9
-
10
- $-local-lightness: ($-local-red * 0.2126 + $-local-green * 0.7152 + $-local-blue * 0.0722) / 255;
11
-
12
- @return $-local-lightness > .6;
13
- }
@@ -1,9 +0,0 @@
1
- // Add percentage of white to a color
2
- @function tint($color, $percent){
3
- @return mix(white, $color, $percent);
4
- }
5
-
6
- // Add percentage of black to a color
7
- @function shade($color, $percent){
8
- @return mix(black, $color, $percent);
9
- }
@@ -1,5 +0,0 @@
1
- // Check for a valid number
2
-
3
- @function _is-num($value) {
4
- @return contains('0' '1' '2' '3' '4' '5' '6' '7' '8' '9' 0 1 2 3 4 5 6 7 8 9, $value);
5
- }