chroma-sass 1.0.0 → 1.0.1
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 +4 -4
- data/README.md +2 -24
- data/chroma-sass.gemspec +2 -2
- data/sass/chroma/_colour.scss +3 -3
- data/sass/chroma/_functions.scss +56 -13
- data/sass/chroma/_variables.scss +16 -2
- metadata +4 -4
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: c2805923b354ea2912ee2510ae926166569821f7
|
4
|
+
data.tar.gz: 94bfffb798c22174513e3c47c562b4f566f02d98
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 7d842b907fd6adc6b5957f92f1d3d67da70d47d11667e4f19aae34960466789e441a84c2d609bda42aadd347f090f00b63d3256039bfd8c6fa11d24fe51d1d09
|
7
|
+
data.tar.gz: 0c973e1dbeaff8632a37f7aabd5756af2f272a44e7fb68105f1371755428c958485579a3496877f5a0e464ac6bb776f7af0285bd986842015b7ba7fd53651cc9
|
data/README.md
CHANGED
@@ -4,7 +4,7 @@ Chroma is a Sass library that manages a project's color names, color variations,
|
|
4
4
|
|
5
5
|
## USAGE
|
6
6
|
|
7
|
-
|
7
|
+
Full documentation is available at [http://johnalbin.github.io/chroma/](http://johnalbin.github.io/chroma/). But here are some quick examples to give you an idea of what Chroma can do.
|
8
8
|
|
9
9
|
```scss
|
10
10
|
@import "chroma";
|
@@ -72,29 +72,7 @@ $chroma-active-scheme: 'functional';
|
|
72
72
|
|
73
73
|
## INSTALLATION
|
74
74
|
|
75
|
-
Chroma
|
76
|
-
|
77
|
-
```sh
|
78
|
-
gem install chroma-sass
|
79
|
-
```
|
80
|
-
|
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:
|
82
|
-
|
83
|
-
```ruby
|
84
|
-
gem 'chroma-sass', '~> 1.0.0'
|
85
|
-
```
|
86
|
-
|
87
|
-
If you are using Compass, edit your project's config.rb and add this line:
|
88
|
-
|
89
|
-
```ruby
|
90
|
-
require 'chroma'
|
91
|
-
```
|
92
|
-
|
93
|
-
You can then start using Chroma in your Sass files. Just add this line to one of your .sass or .scss files and start creating!
|
94
|
-
|
95
|
-
```scss
|
96
|
-
@import "chroma";
|
97
|
-
```
|
75
|
+
Chroma can be installed either as a Ruby Gem, as a Bower component, or as a NPM module. See [Chroma’s online documentation](http://johnalbin.github.io/chroma/) for more information.
|
98
76
|
|
99
77
|
## REQUIREMENTS
|
100
78
|
|
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.
|
13
|
-
spec.date = '2015-
|
12
|
+
spec.version = '1.0.1'
|
13
|
+
spec.date = '2015-09-09'
|
14
14
|
spec.licenses = ['GPL-2']
|
15
15
|
|
16
16
|
spec.authors = ['John Albin Wilkins']
|
data/sass/chroma/_colour.scss
CHANGED
@@ -47,13 +47,13 @@ $_chroma-spelling: 'colour';
|
|
47
47
|
@return define-color-scheme($scheme, $description, $parent);
|
48
48
|
}
|
49
49
|
|
50
|
-
// define-default-colour-scheme($description)
|
50
|
+
// define-default-colour-scheme([$name,] $description)
|
51
51
|
//
|
52
52
|
// See `define-default-color-scheme()` for the documentation.
|
53
53
|
//
|
54
54
|
// Style guide: colour.define-default-colour-scheme
|
55
|
-
@function define-default-colour-scheme($description) {
|
56
|
-
@return define-color-scheme($
|
55
|
+
@function define-default-colour-scheme($name, $description: null) {
|
56
|
+
@return define-default-color-scheme($name, $description);
|
57
57
|
}
|
58
58
|
|
59
59
|
// add-colours([$scheme,] $colours)
|
data/sass/chroma/_functions.scss
CHANGED
@@ -56,7 +56,7 @@ $chroma: _chroma-init();
|
|
56
56
|
// Check if Sass _has_ converted the color into a hex value that we can't
|
57
57
|
// convert back to a keyword.
|
58
58
|
@else if map-has-key($_chroma-dangerous-converted-keywords, $name) {
|
59
|
-
@error "Sass has converted a
|
59
|
+
@error "Sass has converted a #{$_chroma-spelling} keyword into the hexidecimal value, #{$name}, and Chroma was not be able to determine if the original name was #{map-get($_chroma-dangerous-converted-keywords, $name)}. To prevent this error, use quotes around the keyword.";
|
60
60
|
}
|
61
61
|
}
|
62
62
|
@return false;
|
@@ -75,16 +75,20 @@ $chroma: _chroma-init();
|
|
75
75
|
// hexadecimal value before we can read the name. And some hex values map to
|
76
76
|
// more than one keyword (e.g. gray and grey), so the original name would be
|
77
77
|
// irretrievable.
|
78
|
-
|
79
|
-
|
80
|
-
|
78
|
+
//
|
79
|
+
// While is-dangerous-color-keyword() would normally @error before it
|
80
|
+
// returned, if it does return a true value, we should continue inspecting
|
81
|
+
// $name so we can convert it to a string.
|
82
|
+
$is-dangerous: is-dangerous-color-keyword($name);
|
81
83
|
|
82
84
|
// Convert the color to a string.
|
83
85
|
@if type-of($name) == 'color' {
|
84
86
|
$name: inspect($name);
|
87
|
+
|
88
|
+
@return if(map-has-key($_chroma-css4-color-keywords, $name), map-get($_chroma-css4-color-keywords, $name), false);
|
85
89
|
}
|
86
90
|
|
87
|
-
@return
|
91
|
+
@return false;
|
88
92
|
}
|
89
93
|
|
90
94
|
// chroma-to-string($name)
|
@@ -145,9 +149,10 @@ $chroma: _chroma-init();
|
|
145
149
|
@return map-get($color, 'value');
|
146
150
|
}
|
147
151
|
@else {
|
148
|
-
// The value of $actual-scheme::$name is based on
|
149
|
-
// But one or more of the
|
150
|
-
// to check the full
|
152
|
+
// The value of $actual-scheme::$name is based on colors in $actual-scheme
|
153
|
+
// and its parent schemes. But one or more of the parent colors may be
|
154
|
+
// defined (overridden) in $scheme too, so we need to check the full
|
155
|
+
// reference chain.
|
151
156
|
$ref: map-get($color, 'reference');
|
152
157
|
@while $ref {
|
153
158
|
$actual-scheme: chroma-has-color($ref, $scheme);
|
@@ -208,20 +213,56 @@ $chroma: _chroma-init();
|
|
208
213
|
);
|
209
214
|
}
|
210
215
|
|
211
|
-
// define-default-color-scheme($description)
|
216
|
+
// define-default-color-scheme([$name,] $description)
|
212
217
|
//
|
213
218
|
// Sets the description of the default color scheme.
|
214
219
|
//
|
215
220
|
// Usage:
|
216
221
|
// ```scss
|
217
222
|
// $chroma: define-default-color-scheme('Default colors');
|
223
|
+
// // or:
|
224
|
+
// $chroma: define-default-color-scheme('branding', 'Basic branding colors');
|
218
225
|
// ```
|
219
226
|
//
|
227
|
+
// $name - Optional: default color scheme name; defaults to `default`.
|
220
228
|
// $description - Description of the default color scheme.
|
221
229
|
//
|
222
230
|
// Style guide: functions.define-default-color-scheme
|
223
|
-
@function define-default-color-scheme($description) {
|
224
|
-
@
|
231
|
+
@function define-default-color-scheme($name, $description: null) {
|
232
|
+
@if type-of($description) == 'null' {
|
233
|
+
// The shortcut syntax was used since $description is null. Move the actual
|
234
|
+
// description to the $description parameter.
|
235
|
+
$description: $name;
|
236
|
+
@return define-color-scheme($CHROMA_DEFAULT_SCHEME, $description);
|
237
|
+
}
|
238
|
+
|
239
|
+
// Remove the old default.
|
240
|
+
$schemes: map-remove(map-get($chroma, 'schemes'), $CHROMA_DEFAULT_SCHEME);
|
241
|
+
// Update all child schemes of the default.
|
242
|
+
@each $scheme-name, $map in $schemes {
|
243
|
+
@if map-get($map, 'parent') == $CHROMA_DEFAULT_SCHEME {
|
244
|
+
$schemes: map-merge(
|
245
|
+
$schemes,
|
246
|
+
($scheme-name: (
|
247
|
+
'description': map-get($map, 'description'),
|
248
|
+
'parent': $name,
|
249
|
+
))
|
250
|
+
);
|
251
|
+
}
|
252
|
+
}
|
253
|
+
// Set the new default scheme name.
|
254
|
+
$CHROMA_DEFAULT_SCHEME: $name !global;
|
255
|
+
// Add the default scheme (and the updated schemes) back into $chroma.
|
256
|
+
@return map-merge(
|
257
|
+
$chroma,
|
258
|
+
('schemes': map-merge(
|
259
|
+
$schemes,
|
260
|
+
($name: (
|
261
|
+
'description': $description,
|
262
|
+
'parent': false,
|
263
|
+
))
|
264
|
+
))
|
265
|
+
);
|
225
266
|
}
|
226
267
|
|
227
268
|
// add-colors([$scheme,] $colors)
|
@@ -307,7 +348,7 @@ $chroma: _chroma-init();
|
|
307
348
|
}
|
308
349
|
}
|
309
350
|
@else {
|
310
|
-
@error 'Unexpected value given for
|
351
|
+
@error 'Unexpected value, "#{$color-value}", given for #{$_chroma-spelling} "#{$color-name}".';
|
311
352
|
}
|
312
353
|
}
|
313
354
|
|
@@ -356,7 +397,9 @@ $chroma: _chroma-init();
|
|
356
397
|
// ));
|
357
398
|
// ```
|
358
399
|
//
|
359
|
-
// $skins - A list of color schemes and their
|
400
|
+
// $skins - A list of color schemes and their A CSS parent selectors
|
401
|
+
//
|
402
|
+
// Style guide: skin.define-skins
|
360
403
|
@function define-skins($skins) {
|
361
404
|
@each $scheme, $selector in $skins {
|
362
405
|
$chroma: define-skin($scheme, $selector) !global;
|
data/sass/chroma/_variables.scss
CHANGED
@@ -17,13 +17,27 @@
|
|
17
17
|
//
|
18
18
|
// The colors and meta-data managed by Chroma.
|
19
19
|
//
|
20
|
+
// Chroma stores all of its colors, color schemes, skins etc. in the global
|
21
|
+
// sass variable, `$chroma`. All of Chroma's configuration functions are
|
22
|
+
// designed to save their changes to the system by changing the value of the
|
23
|
+
// `$chroma` variable. For example: `$chroma: add-colors((kermit, #70af00));`
|
24
|
+
//
|
25
|
+
// Note: since the `$chroma` variable is a complex map of data structures, it
|
26
|
+
// is highly recommended to only access `$chroma` through the functions and
|
27
|
+
// mixins provided and not attempt to read data from `$chroma` with Sass'
|
28
|
+
// `map-get()` and `map-set()` functions. (If you find you need more helper
|
29
|
+
// functions, submit a feature request! We're happy to help.)
|
30
|
+
//
|
20
31
|
// Style guide: variables.chroma
|
21
32
|
$chroma: () !default;
|
22
33
|
|
23
34
|
// $CHROMA_DEFAULT_SCHEME
|
24
35
|
//
|
25
|
-
// The name of the default color scheme
|
26
|
-
//
|
36
|
+
// The name of the default color scheme; defaults to `default`. This variable
|
37
|
+
// is READ ONLY; changing its value will break Chroma.
|
38
|
+
//
|
39
|
+
// If you want to change this variable's value, you must use the
|
40
|
+
// `define-default-color-scheme()` function instead.
|
27
41
|
//
|
28
42
|
// Style guide: variables.CHROMA_DEFAULT_SCHEME
|
29
43
|
$CHROMA_DEFAULT_SCHEME: 'default';
|
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.
|
4
|
+
version: 1.0.1
|
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-
|
11
|
+
date: 2015-09-09 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: sass
|
@@ -61,8 +61,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
61
61
|
- !ruby/object:Gem::Version
|
62
62
|
version: '0'
|
63
63
|
requirements: []
|
64
|
-
rubyforge_project: 1.0.
|
65
|
-
rubygems_version: 2.4.
|
64
|
+
rubyforge_project: 1.0.1
|
65
|
+
rubygems_version: 2.4.8
|
66
66
|
signing_key:
|
67
67
|
specification_version: 4
|
68
68
|
summary: Chroma is the Sass color manager.
|