chroma-sass 1.0.0.beta.3 → 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: d790126ea8171eb7be69c7cd459e9efbdd9d970d
4
- data.tar.gz: 0c4ca0e76a0d4e5152150e11b75c3be5f19a8451
3
+ metadata.gz: f8985848e269073f03fd0cd6ddf52227cbed3dc9
4
+ data.tar.gz: 72cde7143265b4cfe705ec41e32f8dd1541366bd
5
5
  SHA512:
6
- metadata.gz: b4e4963fa9803e6c83d586369009431cfc8cef440503829a8011ecdcadcc9d2724e73a3470e8425b726bedfd3c73d4f192e1205cb1827faae9b12c3f36fc13d8
7
- data.tar.gz: f963d961e3c581f6831a668d377e3b0523834abf698409716c8add0b22f9641dc2c88fafb9d8a140d5f0abcaf44a90ffd446794b7e0ffa6cbdb8d926034bc65b
6
+ metadata.gz: b67c868cd3824776ee517a14d2ab52b8ccf315401194af5c3e319884ea506e1440d6e24d22acf5a0689b0cc9eeeb0a3e2f0cd52a5659e59201c57d62bbb42222
7
+ data.tar.gz: 42b4faa8bfbf1aefa8b4a8a57cb8419d71242aef39c6ab07299813f6a7f3e16ef45c904d574152dad74f4284ed6ed2a3611b97bca183b64c1bed3c29605c84b8
data/README.md CHANGED
@@ -4,8 +4,7 @@ Chroma is a Sass library that manages a project's color names, color variations,
4
4
 
5
5
  ## USAGE
6
6
 
7
- Betters docs are coming, but here's some documentation in the form of example
8
- code.
7
+ ~~Betters docs are coming, but~~ Better docs are now available at http://johnalbin.github.io/chroma/ and here's some quick documentation in the form of example code.
9
8
 
10
9
  ```scss
11
10
  @import "chroma";
@@ -82,7 +81,7 @@ gem install chroma-sass
82
81
  If you are using Bundler (and you should!) then you can add it to an existing project by editing the project's Gemfile and adding this line:
83
82
 
84
83
  ```ruby
85
- gem 'chroma-sass', '~> 1.0.0.beta.3'
84
+ gem 'chroma-sass', '~> 1.0.0'
86
85
  ```
87
86
 
88
87
  If you are using Compass, edit your project's config.rb and add this line:
@@ -101,6 +100,10 @@ You can then start using Chroma in your Sass files. Just add this line to one of
101
100
 
102
101
  * Sass 3.4.0 or later
103
102
 
103
+ Note: libsass 3.2.5 or earlier does not work with chroma-sass due to a bug in
104
+ libsass. ☹ libsass 3.3.0 should fix the bug, but it has not been tested. See
105
+ https://github.com/JohnAlbin/chroma/issues/10
106
+
104
107
  ## LICENSE
105
108
 
106
109
  Available under the GPL v2 license. See [LICENSE.txt](https://github.com/JohnAlbin/chroma/blob/master/LICENSE.txt).
data/chroma-sass.gemspec CHANGED
@@ -9,8 +9,8 @@ Gem::Specification.new do |spec|
9
9
  spec.homepage = 'http://github.com/JohnAlbin/chroma'
10
10
  spec.rubyforge_project =
11
11
 
12
- spec.version = '1.0.0.beta.3'
13
- spec.date = '2015-08-17'
12
+ spec.version = '1.0.0'
13
+ spec.date = '2015-08-31'
14
14
  spec.licenses = ['GPL-2']
15
15
 
16
16
  spec.authors = ['John Albin Wilkins']
data/sass/_chroma.scss CHANGED
@@ -1,3 +1,4 @@
1
1
  // Import the required partials for Chroma.
2
2
 
3
3
  @import './chroma/functions';
4
+ @import './chroma/skin';
@@ -60,7 +60,7 @@ $_chroma-spelling: 'colour';
60
60
  //
61
61
  // See `add-colors()` for the documentation.
62
62
  //
63
- // Style guide: functions.add-colours
63
+ // Style guide: colour.add-colours
64
64
  @function add-colours($scheme, $colours: null) {
65
65
  @return add-colors($scheme, $colours);
66
66
  }
@@ -2,6 +2,8 @@
2
2
  //
3
3
  // The main module for Chroma.
4
4
  //
5
+ // Weight: -1
6
+ //
5
7
  // Style guide: functions
6
8
 
7
9
  // Import the global variables and internal functions needed by all of Chroma.
@@ -311,3 +313,53 @@ $chroma: _chroma-init();
311
313
 
312
314
  @return $chroma;
313
315
  }
316
+
317
+ // define-skin($scheme, $selector)
318
+ //
319
+ // Defines that the specified color scheme can be used as a skin when the
320
+ // given parent selector matches our HTML. See the `skin()` mixin.
321
+ //
322
+ // Usage:
323
+ // ```scss
324
+ // $chroma: define-skin('scheme1', '.is-scheme1-skin');
325
+ // ```
326
+ //
327
+ // $scheme - Name of the color scheme to use when the `$selector` matches our
328
+ // HTML.
329
+ // $selector - A CSS parent selector that triggers the use of the defined
330
+ // `$scheme` instead of the default color scheme. We recommend using
331
+ // a simple CSS selector like `.is-CUSTOMNAME-skin`.
332
+ //
333
+ // Style guide: skin.define-skin
334
+ @function define-skin($scheme, $selector) {
335
+ $skins: map-merge(
336
+ map-get($chroma, 'skins'),
337
+ ($scheme: $selector)
338
+ );
339
+
340
+ @return map-merge(
341
+ $chroma,
342
+ ('skins': $skins)
343
+ );
344
+ }
345
+
346
+ // define-skins($skins)
347
+ //
348
+ // Helper function to define multiple skins at once.
349
+ //
350
+ // Usage:
351
+ // ```scss
352
+ // $chroma: define-skins((
353
+ // 'scheme1': '.is-scheme1-skin',
354
+ // 'scheme2': '.is-scheme2-skin',
355
+ // 'scheme3': 'html > body.this-works-but-is.way.too.specific.IMHO',
356
+ // ));
357
+ // ```
358
+ //
359
+ // $skins - A list of color schemes and their
360
+ @function define-skins($skins) {
361
+ @each $scheme, $selector in $skins {
362
+ $chroma: define-skin($scheme, $selector) !global;
363
+ }
364
+ @return $chroma;
365
+ }
@@ -3,6 +3,8 @@
3
3
  // Helper functions that query the internal data structure in $chroma. These are
4
4
  // not part of the public API and are subject to change at any time.
5
5
  //
6
+ // Weight: 10
7
+ //
6
8
  // Style guide: internals
7
9
 
8
10
  // Import the global variables needed by all of Chroma.
@@ -69,7 +71,7 @@
69
71
  // _chroma-init()
70
72
  //
71
73
  // Private function that sets up the initial data structure of the $chroma
72
- // variable.
74
+ // variable. Can be called repeatedly without damaging existing data.
73
75
  //
74
76
  // Style guide: internals._chroma-init
75
77
  @function _chroma-init() {
@@ -81,6 +83,7 @@
81
83
  'parent': false,
82
84
  ),
83
85
  ),
86
+ 'skins': (),
84
87
  'names': (),
85
88
  );
86
89
  }
@@ -0,0 +1,71 @@
1
+ // Skin module
2
+ //
3
+ // A "Skin" module for Chroma.
4
+ //
5
+ // Sometimes design and engineering requirements mean that we need to:
6
+ // - output the colors for default color scheme and one or more additional color
7
+ // schemes into the same CSS file
8
+ // - and to control which color scheme is used via a "global" CSS class name set
9
+ // on the web pages's `html` or `body` element.
10
+ //
11
+ // For example, the `.my-complexion` component may output a blue text color on
12
+ // most pages, but on pages with a `<html class="skin-wicked-witch">`, the
13
+ // `.my-complexion` component will output a green text color.
14
+ //
15
+ // The Skin module will help with this requirement.
16
+ //
17
+ // After defining your color schemes and their colors, you can define one or
18
+ // more of those schemes as skins while providing the proper CSS parent selector
19
+ // to use for that skin.
20
+ //
21
+ // Weight: -1
22
+ //
23
+ // Style guide: skin
24
+
25
+ @import "./functions";
26
+
27
+ // skin([$skins])
28
+ //
29
+ // Output the default color and all the colors needed for defined skins.
30
+ //
31
+ // Usage:
32
+ // ```scss
33
+ // h1 {
34
+ // @include skin() {
35
+ // color: color(heading);
36
+ // }
37
+ // }
38
+ // ```
39
+ //
40
+ // $skins - An optional list of color scheme names and selectors to use instead
41
+ // of the skins defined with `define-skin()`. The format of this list
42
+ // should match that of the `$skins` parameter in `define-skins()`.
43
+ //
44
+ // Style guide: skin.skin
45
+ @mixin skin($skins: null) {
46
+ @if type-of($skins) == 'null' {
47
+ $skins: map-get($chroma, 'skins');
48
+ }
49
+
50
+ // Save the current active scheme.
51
+ $original-active-scheme: $chroma-active-scheme;
52
+
53
+ // Output the default color property.
54
+ @content;
55
+
56
+ @if length($skins) == 0 {
57
+ @warn "skin() mixin used, but no skins have been defined in Chroma.";
58
+ }
59
+
60
+ // Output the color property for each scheme.
61
+ @each $scheme, $selector in $skins {
62
+ $chroma-active-scheme: $scheme !global;
63
+
64
+ #{$selector} & {
65
+ @content
66
+ }
67
+ }
68
+
69
+ // Restore the original active scheme.
70
+ $chroma-active-scheme: $original-active-scheme !global;
71
+ }
@@ -5,6 +5,8 @@
5
5
  //
6
6
  // Auto-imported by other modules.
7
7
  //
8
+ // Weight: -2
9
+ //
8
10
  // Style guide: variables
9
11
 
10
12
  //
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: chroma-sass
3
3
  version: !ruby/object:Gem::Version
4
- version: 1.0.0.beta.3
4
+ version: 1.0.0
5
5
  platform: ruby
6
6
  authors:
7
7
  - John Albin Wilkins
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2015-08-17 00:00:00.000000000 Z
11
+ date: 2015-08-31 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: sass
@@ -40,6 +40,7 @@ files:
40
40
  - sass/chroma/_functions.scss
41
41
  - sass/chroma/_internals.scss
42
42
  - sass/chroma/_kss.scss
43
+ - sass/chroma/_skin.scss
43
44
  - sass/chroma/_variables.scss
44
45
  homepage: http://github.com/JohnAlbin/chroma
45
46
  licenses:
@@ -56,12 +57,12 @@ required_ruby_version: !ruby/object:Gem::Requirement
56
57
  version: '0'
57
58
  required_rubygems_version: !ruby/object:Gem::Requirement
58
59
  requirements:
59
- - - ">"
60
+ - - ">="
60
61
  - !ruby/object:Gem::Version
61
- version: 1.3.1
62
+ version: '0'
62
63
  requirements: []
63
- rubyforge_project: 1.0.0.beta.3
64
- rubygems_version: 2.4.8
64
+ rubyforge_project: 1.0.0
65
+ rubygems_version: 2.4.5.1
65
66
  signing_key:
66
67
  specification_version: 4
67
68
  summary: Chroma is the Sass color manager.