bourbon 5.0.0.beta.5 → 5.0.0.beta.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.
Files changed (38) hide show
  1. checksums.yaml +4 -4
  2. data/.ruby-version +1 -0
  3. data/CHANGELOG.md +9 -1
  4. data/CONTRIBUTING.md +1 -0
  5. data/RELEASING.md +7 -4
  6. data/bourbon.gemspec +6 -6
  7. data/bower.json +1 -1
  8. data/circle.yml +6 -0
  9. data/core/_bourbon.scss +7 -3
  10. data/core/bourbon/helpers/_buttons-list.scss +14 -0
  11. data/core/bourbon/helpers/_text-inputs-list.scss +26 -0
  12. data/core/bourbon/library/_border-radius.scss +55 -18
  13. data/core/bourbon/library/_buttons.scss +56 -32
  14. data/core/bourbon/library/_contrast-switch.scss +14 -3
  15. data/core/bourbon/library/_font-face.scss +21 -16
  16. data/core/bourbon/library/_hide-visually.scss +1 -1
  17. data/core/bourbon/library/_margin.scss +15 -6
  18. data/core/bourbon/library/_modular-scale.scss +3 -3
  19. data/core/bourbon/library/_padding.scss +13 -4
  20. data/core/bourbon/library/_prefixer.scss +1 -1
  21. data/core/bourbon/library/_shade.scss +6 -1
  22. data/core/bourbon/library/_size.scss +2 -2
  23. data/core/bourbon/library/_text-inputs.scss +91 -53
  24. data/core/bourbon/{helpers → library}/_timing-functions.scss +0 -0
  25. data/core/bourbon/library/_tint.scss +6 -1
  26. data/core/bourbon/library/_triangle.scss +3 -0
  27. data/core/bourbon/library/_value-prefixer.scss +38 -0
  28. data/core/bourbon/settings/_settings.scss +11 -1
  29. data/core/bourbon/utilities/{_bourbon-get-setting.scss → _retrieve-bourbon-setting.scss} +2 -2
  30. data/core/bourbon/validators/_is-color.scss +13 -0
  31. data/lib/bourbon/version.rb +1 -1
  32. data/package.json +1 -1
  33. data/spec/bourbon/library/prefixer_spec.rb +34 -0
  34. data/spec/bourbon/utilities/{bourbon_get_setting_spec.rb → retrieve_bourbon_setting_spec.rb} +2 -2
  35. data/spec/fixtures/library/prefixer.scss +13 -0
  36. data/spec/fixtures/utilities/assign-inputs.scss +4 -4
  37. data/spec/fixtures/utilities/{bourbon-get-setting.scss → retrieve-bourbon-setting.scss} +2 -2
  38. metadata +29 -20
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: bbcabb0de4099a8e82cae3ba0717c5067ef6d5bc
4
- data.tar.gz: 23332a525fafb6e5b2febf8272829d6dbbc95a13
3
+ metadata.gz: 66a37a1717f902865940e47fb7f18d3dace53752
4
+ data.tar.gz: 9f9328eecf80cd88f1f43c2ccacb417521e98e06
5
5
  SHA512:
6
- metadata.gz: f5ef886f1e4b3b503550a20ceeb3e2183c9c38c6351c32c304298e75d260de4dddfa3ec4b91ec02ec3f63cd984033982080bc063dbafcfaad29da5dfe4f0f751
7
- data.tar.gz: cf1b84c963502b0c8f5909890a3cd72facc7f82f3100666fa80fd23d9901e26932a6793d3127e203b0ac7f21a34e68adfc51ebf1b85ee7c3412da88eecec5787
6
+ metadata.gz: dbfef29091ce21e562eb7c1d5835ffe076169f06e5c05448fa8526503859c52147cf0e46cccb9a6e464b589dd112b1530387f5161384c2468bfc5fbb72b3a53e
7
+ data.tar.gz: 102cdd8732e2e3ede64014ce3dd6ae098d42e352d23d6e778489aae4dfe06a7a4434a1df9405d283a959f582b3bad14894f892f5097cb7677d10a593657f4233
@@ -0,0 +1 @@
1
+ 2.3.0
@@ -5,7 +5,15 @@ project adheres to [Semantic Versioning](http://semver.org).
5
5
 
6
6
  ## [Unreleased]
7
7
 
8
- [Unreleased]: https://github.com/thoughtbot/bourbon/compare/v5.0.0.beta.5...HEAD
8
+ [Unreleased]: https://github.com/thoughtbot/bourbon/compare/v5.0.0.beta.6...HEAD
9
+
10
+ ## [5.0.0-beta.6] - 2016-06-06
11
+
12
+ ### Added
13
+
14
+ - Added a `value-prefixer` mixin for generating vendor prefixes on values.
15
+
16
+ [5.0.0-beta.6]: https://github.com/thoughtbot/bourbon/compare/v5.0.0.beta.5...v5.0.0.beta.6
9
17
 
10
18
  ## [5.0.0-beta.5] - 2016-03-23
11
19
 
@@ -49,6 +49,7 @@ We use [SassDoc] to document Bourbon. [Annotations] should be ordered:
49
49
  - `@see`
50
50
  - `@type`
51
51
  - `@argument`
52
+ - `@content`
52
53
  - `@property`
53
54
  - `@return`
54
55
  - `@example`
@@ -17,14 +17,17 @@
17
17
  1. Run `npm publish`, which pushes the new version to npm’s registry (if
18
18
  releasing a pre-release, run `npm publish --tag beta`).
19
19
 
20
- 1. Add a [new GitHub release][github-release].
20
+ 1. Draft a [new GitHub release][github-release]. Upon publishing, a tweet will
21
+ _automatically be sent_ on the [@bourbonsass] Twitter account via [Zapier].
22
+ It will look like this:
23
+
24
+ > We’ve released {release_title}: {release_link}
21
25
 
22
26
  1. Re-generate and publish the [documentation website], using the available
23
27
  Rake tasks.
24
28
 
25
- 1. Announce the new release, making sure to say “thank you” to the contributors
26
- who helped shape this version!
27
-
28
29
  [Keep a CHANGELOG]: http://keepachangelog.com
29
30
  [github-release]: https://github.com/thoughtbot/bourbon/releases/new
30
31
  [documentation website]: https://github.com/thoughtbot/bourbon.io
32
+ [@bourbonsass]: https://twitter.com/bourbonsass
33
+ [Zapier]: https://zapier.com
@@ -3,12 +3,12 @@ require "bourbon/version"
3
3
 
4
4
  Gem::Specification.new do |s|
5
5
  s.add_development_dependency "aruba", "~> 0.6.2"
6
- s.add_development_dependency "css_parser", "~> 1.3"
7
- s.add_development_dependency "rake", "~> 10.4"
8
- s.add_development_dependency "rspec", "~> 3.3"
9
- s.add_development_dependency "scss_lint", "0.47"
10
- s.add_runtime_dependency "sass", "~> 3.4"
11
- s.add_runtime_dependency "thor", "~> 0.19"
6
+ s.add_development_dependency "css_parser", "~> 1.4.1"
7
+ s.add_development_dependency "rake", "~> 11.1.2"
8
+ s.add_development_dependency "rspec", "~> 3.4.0"
9
+ s.add_development_dependency "scss_lint", "0.48.0"
10
+ s.add_runtime_dependency "sass", "~> 3.4.22"
11
+ s.add_runtime_dependency "thor", "~> 0.19.1"
12
12
  s.authors = [
13
13
  "Christian Reuter",
14
14
  "Damian Galarza",
data/bower.json CHANGED
@@ -34,5 +34,5 @@
34
34
  "type": "git",
35
35
  "url": "https://github.com/thoughtbot/bourbon.git"
36
36
  },
37
- "version": "5.0.0-beta.5"
37
+ "version": "5.0.0-beta.6"
38
38
  }
data/circle.yml CHANGED
@@ -1,3 +1,7 @@
1
+ dependencies:
2
+ override:
3
+ - bundle install
4
+ - npm install -g sassdoc
1
5
  general:
2
6
  branches:
3
7
  ignore:
@@ -5,3 +9,5 @@ general:
5
9
  test:
6
10
  override:
7
11
  - bundle exec rake
12
+ post:
13
+ - sassdoc core/ --parse --verbose --strict
@@ -1,25 +1,27 @@
1
- // Bourbon 5.0.0-beta.5
1
+ // Bourbon 5.0.0-beta.6
2
2
  // http://bourbon.io
3
3
  // Copyright 2011 thoughtbot, inc.
4
4
  // MIT License
5
5
 
6
+ @import "bourbon/helpers/buttons-list";
6
7
  @import "bourbon/helpers/scales";
7
- @import "bourbon/helpers/timing-functions";
8
+ @import "bourbon/helpers/text-inputs-list";
8
9
 
9
10
  @import "bourbon/settings/settings";
10
11
 
11
12
  @import "bourbon/validators/contains";
12
13
  @import "bourbon/validators/contains-falsy";
14
+ @import "bourbon/validators/is-color";
13
15
  @import "bourbon/validators/is-length";
14
16
  @import "bourbon/validators/is-light";
15
17
  @import "bourbon/validators/is-number";
16
18
  @import "bourbon/validators/is-size";
17
19
 
18
20
  @import "bourbon/utilities/assign-inputs";
19
- @import "bourbon/utilities/bourbon-get-setting";
20
21
  @import "bourbon/utilities/collapse-directionals";
21
22
  @import "bourbon/utilities/directional-values";
22
23
  @import "bourbon/utilities/font-source-declaration";
24
+ @import "bourbon/utilities/retrieve-bourbon-setting";
23
25
  @import "bourbon/utilities/unpack";
24
26
 
25
27
  @import "bourbon/library/border-color";
@@ -43,6 +45,8 @@
43
45
  @import "bourbon/library/size";
44
46
  @import "bourbon/library/strip-unit";
45
47
  @import "bourbon/library/text-inputs";
48
+ @import "bourbon/library/timing-functions";
46
49
  @import "bourbon/library/tint";
47
50
  @import "bourbon/library/triangle";
51
+ @import "bourbon/library/value-prefixer";
48
52
  @import "bourbon/library/word-wrap";
@@ -0,0 +1,14 @@
1
+ @charset "UTF-8";
2
+
3
+ /// A list of all HTML button elements.
4
+ ///
5
+ /// @type list
6
+ ///
7
+ /// @access private
8
+
9
+ $_buttons-list: (
10
+ "button",
11
+ "[type='button']",
12
+ "[type='reset']",
13
+ "[type='submit']",
14
+ );
@@ -0,0 +1,26 @@
1
+ @charset "UTF-8";
2
+
3
+ /// A list of all _text-based_ HTML inputs.
4
+ ///
5
+ /// @type list
6
+ ///
7
+ /// @access private
8
+
9
+ $_text-inputs-list: (
10
+ "[type='color']",
11
+ "[type='date']",
12
+ "[type='datetime']",
13
+ "[type='datetime-local']",
14
+ "[type='email']",
15
+ "[type='month']",
16
+ "[type='number']",
17
+ "[type='password']",
18
+ "[type='search']",
19
+ "[type='tel']",
20
+ "[type='text']",
21
+ "[type='time']",
22
+ "[type='url']",
23
+ "[type='week']",
24
+ "input:not([type])",
25
+ "textarea",
26
+ );
@@ -1,47 +1,84 @@
1
1
  @charset "UTF-8";
2
2
 
3
- /// Provides a quick method for targeting `border-radius` on both corners on the
4
- /// side of a box.
3
+ /// Provides a shorthand syntax to add `border-radius` to both the top-left and
4
+ /// top-right of an element.
5
5
  ///
6
- /// @argument {number} $radii
6
+ /// @argument {number (with unit)} $radii
7
7
  ///
8
8
  /// @example scss
9
- /// .element-one {
10
- /// @include border-top-radius(5px);
9
+ /// .element {
10
+ /// @include border-top-radius(4px);
11
11
  /// }
12
12
  ///
13
13
  /// @example css
14
- /// .element-one {
15
- /// border-top-left-radius: 5px;
16
- /// border-top-right-radius: 5px;
14
+ /// .element {
15
+ /// border-top-left-radius: 4px;
16
+ /// border-top-right-radius: 4px;
17
17
  /// }
18
+
19
+ @mixin border-top-radius($radii) {
20
+ border-top-left-radius: $radii;
21
+ border-top-right-radius: $radii;
22
+ }
23
+
24
+ /// Provides a shorthand syntax to add `border-radius` to both the top-right and
25
+ /// bottom-right of an element.
26
+ ///
27
+ /// @argument {number (with unit)} $radii
18
28
  ///
19
29
  /// @example scss
20
- /// .element-two {
21
- /// @include border-left-radius(3px);
30
+ /// .element {
31
+ /// @include border-right-radius(3px);
22
32
  /// }
23
33
  ///
24
34
  /// @example css
25
- /// .element-two {
26
- /// border-bottom-left-radius: 3px;
27
- /// border-top-left-radius: 3px;
35
+ /// .element {
36
+ /// border-bottom-right-radius: 3px;
37
+ /// border-top-right-radius: 3px;
28
38
  /// }
29
39
 
30
- @mixin border-top-radius($radii) {
31
- border-top-left-radius: $radii;
32
- border-top-right-radius: $radii;
33
- }
34
-
35
40
  @mixin border-right-radius($radii) {
36
41
  border-bottom-right-radius: $radii;
37
42
  border-top-right-radius: $radii;
38
43
  }
39
44
 
45
+ /// Provides a shorthand syntax to add `border-radius` to both the bottom-left
46
+ /// and bottom-right of an element.
47
+ ///
48
+ /// @argument {number (with unit)} $radii
49
+ ///
50
+ /// @example scss
51
+ /// .element {
52
+ /// @include border-bottom-radius(2px);
53
+ /// }
54
+ ///
55
+ /// @example css
56
+ /// .element {
57
+ /// border-bottom-left-radius: 2px;
58
+ /// border-bottom-right-radius: 2px;
59
+ /// }
60
+
40
61
  @mixin border-bottom-radius($radii) {
41
62
  border-bottom-left-radius: $radii;
42
63
  border-bottom-right-radius: $radii;
43
64
  }
44
65
 
66
+ /// Provides a shorthand syntax to add `border-radius` to both the top-left
67
+ /// and bottom-left of an element.
68
+ ///
69
+ /// @argument {number (with unit)} $radii
70
+ ///
71
+ /// @example scss
72
+ /// .element {
73
+ /// @include border-left-radius(1px);
74
+ /// }
75
+ ///
76
+ /// @example css
77
+ /// .element {
78
+ /// border-bottom-left-radius: 1px;
79
+ /// border-top-left-radius: 1px;
80
+ /// }
81
+
45
82
  @mixin border-left-radius($radii) {
46
83
  border-bottom-left-radius: $radii;
47
84
  border-top-left-radius: $radii;
@@ -1,60 +1,84 @@
1
1
  @charset "UTF-8";
2
2
 
3
- /// Generates variables for all buttons. Please note that you must use
4
- /// interpolation on the variable: `#{$all-buttons}`.
5
- ///
3
+ ////
6
4
  /// @type list
7
5
  ///
6
+ /// @require {function} _assign-inputs
7
+ ///
8
+ /// @require {variable} $_buttons-list
9
+ ////
10
+
11
+ /// A list of all HTML button elements. Please note that you must interpolate
12
+ /// the variable (`#{}`) to use it as a selector.
13
+ ///
8
14
  /// @example scss
9
15
  /// #{$all-buttons} {
10
16
  /// background-color: #f00;
11
17
  /// }
12
18
  ///
13
- /// #{$all-buttons-focus},
14
- /// #{$all-buttons-hover} {
15
- /// background-color: #0f0;
19
+ /// @example css
20
+ /// button,
21
+ /// [type='button'],
22
+ /// [type='reset'],
23
+ /// [type='submit'] {
24
+ /// background-color: #f00;
16
25
  /// }
26
+
27
+ $all-buttons: _assign-inputs($_buttons-list);
28
+
29
+ /// A list of all HTML button elements with the `:active` pseudo-class applied.
30
+ /// Please note that you must interpolate the variable (`#{}`) to use it as a
31
+ /// selector.
17
32
  ///
33
+ /// @example scss
18
34
  /// #{$all-buttons-active} {
19
35
  /// background-color: #00f;
20
36
  /// }
21
37
  ///
22
38
  /// @example css
23
- /// button,
24
- /// [type='button'],
25
- /// [type='reset'],
26
- /// [type='submit'] {
27
- /// background-color: #f00;
39
+ /// button:active,
40
+ /// [type='button']:active,
41
+ /// [type='reset']:active,
42
+ /// [type='submit']:active {
43
+ /// background-color: #00f;
28
44
  /// }
45
+
46
+ $all-buttons-active: _assign-inputs($_buttons-list, active);
47
+
48
+ /// A list of all HTML button elements with the `:focus` pseudo-class applied.
49
+ /// Please note that you must interpolate the variable (`#{}`) to use it as a
50
+ /// selector.
29
51
  ///
52
+ /// @example scss
53
+ /// #{$all-buttons-focus} {
54
+ /// background-color: #0f0;
55
+ /// }
56
+ ///
57
+ /// @example css
30
58
  /// button:focus,
31
59
  /// [type='button']:focus,
32
60
  /// [type='reset']:focus,
33
- /// [type='submit']:focus,
61
+ /// [type='submit']:focus {
62
+ /// background-color: #0f0;
63
+ /// }
64
+
65
+ $all-buttons-focus: _assign-inputs($_buttons-list, focus);
66
+
67
+ /// A list of all HTML button elements with the `:hover` pseudo-class applied.
68
+ /// Please note that you must interpolate the variable (`#{}`) to use it as a
69
+ /// selector.
70
+ ///
71
+ /// @example scss
72
+ /// #{$all-buttons-hover} {
73
+ /// background-color: #0f0;
74
+ /// }
75
+ ///
76
+ /// @example css
34
77
  /// button:hover,
35
78
  /// [type='button']:hover,
36
79
  /// [type='reset']:hover,
37
80
  /// [type='submit']:hover {
38
81
  /// background-color: #0f0;
39
82
  /// }
40
- ///
41
- /// button:active,
42
- /// [type='button']:active,
43
- /// [type='reset']:active,
44
- /// [type='submit']:active {
45
- /// background-color: #00f;
46
- /// }
47
- ///
48
- /// @require {function} _assign-inputs
49
83
 
50
- $buttons-list: (
51
- "button",
52
- "[type='button']",
53
- "[type='reset']",
54
- "[type='submit']",
55
- );
56
-
57
- $all-buttons: _assign-inputs($buttons-list);
58
- $all-buttons-active: _assign-inputs($buttons-list, active);
59
- $all-buttons-focus: _assign-inputs($buttons-list, focus);
60
- $all-buttons-hover: _assign-inputs($buttons-list, hover);
84
+ $all-buttons-hover: _assign-inputs($_buttons-list, hover);
@@ -41,9 +41,20 @@
41
41
 
42
42
  @function contrast-switch(
43
43
  $base-color,
44
- $dark-color: _bourbon-get-setting("contrast-switch-dark-color"),
45
- $light-color: _bourbon-get-setting("contrast-switch-light-color")
44
+ $dark-color: _retrieve-bourbon-setting("contrast-switch-dark-color"),
45
+ $light-color: _retrieve-bourbon-setting("contrast-switch-light-color")
46
46
  ) {
47
47
 
48
- @return if(_is-light($base-color), $dark-color, $light-color);
48
+ @if not _is-color($base-color) {
49
+ @error "`#{$base-color}` is not a valid color for the `$base-color` " +
50
+ "argument in the `contrast-switch` function.";
51
+ } @else if not _is-color($dark-color) {
52
+ @error "`#{$dark-color}` is not a valid color for the `$dark-color` " +
53
+ "argument in the `contrast-switch` function.";
54
+ } @else if not _is-color($light-color) {
55
+ @error "`#{$light-color}` is not a valid color for the `$light-color` " +
56
+ "argument in the `contrast-switch` function.";
57
+ } @else {
58
+ @return if(_is-light($base-color), $dark-color, $light-color);
59
+ }
49
60
  }
@@ -4,9 +4,6 @@
4
4
  /// formats you need to output; the mixin supports `eot`, `ttf`, `svg`, `woff2`
5
5
  /// and `woff`. The mixin also supports usage with the Rails Asset Pipeline,
6
6
  /// which you can enable per use, or globally in the `$bourbon()` settings.
7
- /// Finally, any additional CSS properties that are included in the `@include`
8
- /// directive will be output within the `@font-face` declaration, e.g. you can
9
- /// pass in `font-weight`, `font-style` and/or `unicode-range`.
10
7
  ///
11
8
  /// @argument {string} $font-family
12
9
  ///
@@ -16,35 +13,43 @@
16
13
  /// Set to `true` if you’re using the Rails Asset Pipeline (place the fonts
17
14
  /// in `app/assets/fonts/`).
18
15
  ///
19
- /// @argument {list} $file-formats [("ttf", "woff2", "woff")]
16
+ /// @argument {string | list} $file-formats [("ttf", "woff2", "woff")]
20
17
  /// Pass a list of file formats to support,
21
- /// for example ("eot", "ttf", "svg", "woff2", woff").
18
+ /// for example ("eot", "ttf", "svg", "woff2", "woff").
19
+ ///
20
+ /// @content
21
+ /// Any additional CSS properties that are included in the `@include`
22
+ /// directive will be output within the `@font-face` declaration, e.g. you can
23
+ /// pass in `font-weight`, `font-style` and/or `unicode-range`.
22
24
  ///
23
25
  /// @example scss
24
26
  /// @include font-face(
25
- /// "source-sans-pro",
26
- /// "fonts/source-sans-pro-regular",
27
- /// $file-formats: ("eot", "ttf")
28
- /// );
27
+ /// "source-sans-pro",
28
+ /// "fonts/source-sans-pro-regular",
29
+ /// ("woff2", "woff")
30
+ /// ) {
31
+ /// font-style: normal;
32
+ /// font-weight: 400;
33
+ /// }
29
34
  ///
30
35
  /// @example css
31
36
  /// @font-face {
32
37
  /// font-family: "source-sans-pro";
33
- /// src: url("fonts/source-sans-pro-regular.eot?#iefix")
34
- /// format("embedded-opentype"),
35
- /// url("fonts/source-sans-pro-regular.ttf")
36
- /// format("truetype");
38
+ /// src: url("fonts/source-sans-pro-regular.woff2") format("woff2"),
39
+ /// url("fonts/source-sans-pro-regular.woff") format("woff");
40
+ /// font-style: normal;
41
+ /// font-weight: 400;
37
42
  /// }
38
43
  ///
39
44
  /// @require {function} _font-source-declaration
40
45
  ///
41
- /// @require {function} _bourbon-get-setting
46
+ /// @require {function} _retrieve-bourbon-setting
42
47
 
43
48
  @mixin font-face(
44
49
  $font-family,
45
50
  $file-path,
46
- $file-formats: _bourbon-get-setting("global-font-file-formats"),
47
- $asset-pipeline: _bourbon-get-setting("rails-asset-pipeline")
51
+ $file-formats: _retrieve-bourbon-setting("global-font-file-formats"),
52
+ $asset-pipeline: _retrieve-bourbon-setting("rails-asset-pipeline")
48
53
  ) {
49
54
 
50
55
  @font-face {