semantic-rainbow 0.0.2 → 0.0.3

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 ADDED
@@ -0,0 +1,15 @@
1
+ ---
2
+ !binary "U0hBMQ==":
3
+ metadata.gz: !binary |-
4
+ YTYxNmMyZDU2NTJkYjczNDAwMmRlMmJjOTFjOGM4MGRiZTUzNzA0MQ==
5
+ data.tar.gz: !binary |-
6
+ M2ExMmYzMTUzZWYxNGI5ZDIzY2VmYmI5MDllMDk5NjQ0NTcyY2M4Ng==
7
+ !binary "U0hBNTEy":
8
+ metadata.gz: !binary |-
9
+ ZGU0YTg3ZTM3YmM2MTc3NzFhOTVhMWY3MWQ4Y2Y0NmM0MzJjYTI0MTI2Yjli
10
+ NGQ2OWZlZjE0ZjhmYzFmN2ViNTNhMDk3ZDQ3MGY1MDY2YmEyM2EyMTFmNjAx
11
+ ZDY3YWEzZGY1MTc5ZGE0ZTEyODA4MTNlMGQ5YzhjNTU2NjU3NTM=
12
+ data.tar.gz: !binary |-
13
+ M2QzMzJhYzFlMGJiMzE0NTg1NjI3NDczYzQzYWE2MDdkZjYwNTdlNGU3M2Nh
14
+ YjExZTY3NDY5ZjZiNTkzZTdkMGM3N2UxYjI1Zjg0YWY1Mzg1MzQ1OWJjNzc0
15
+ YTlhN2I2OWIzZTY3NmVhODRmYzMxZjRlZmRmZmU4YmJjMGVlMDg=
data/README.md CHANGED
@@ -1,42 +1,66 @@
1
1
  Semantic Rainbow
2
2
  ================
3
- Semantic Rainbow is a gem that gives you SASS variables for the main HSL values.
3
+ Semantic Rainbow is a gem that gives you easy-to-remember SASS variables for HSL values all around the colour wheel, and Pantone values.
4
4
 
5
- ##### Main Colour Names:
5
+ ## HSL
6
+
7
+ For HSL, there are 360 degrees on the colour wheel. Every variable in Semantic Rainbow HSL is 10 degrees away from the previous value on the colour wheel. The main colours are 30 degrees apart from each other, with
8
+ colour-mixes filling in the gaps.
9
+
10
+ ### Colour Names:
6
11
 
7
12
  The color names have been kept as simple and straight-forward as possible.
8
13
 
9
- - Red
10
- - Orange
11
- - Yellow
12
- - Lime
13
- - Green
14
- - Mint
15
- - Cyan
16
- - Azure
17
- - Blue
18
- - Violet
19
- - Magenta
20
- - Pink
14
+ - Red `0 degrees`
15
+ - Orange `30 degrees`
16
+ - Yellow `60 degrees`
17
+ - Lime `90 degrees`
18
+ - Green `120 degrees`
19
+ - Teal `150 degrees`
20
+ - Cyan `180 degrees`
21
+ - Azure `210 degrees`
22
+ - Blue `240 degrees`
23
+ - Violet `270 degrees`
24
+ - Magenta `300 degrees`
25
+ - Pink `330 degrees`
26
+
27
+ To use any one of these solid colours, just use its' name as you would a SASS variable.
21
28
 
22
- For any one of the main color names just use `$red` or `$orange` in your SASS file.
29
+ ```scss
30
+ color: $violet;
31
+ background: $teal;
32
+ ```
23
33
 
24
- color: $red;
34
+ For mixing these colours together and getting a *red-like orange* tone, or an *orange-like red*, use the format of `$red-orange` or `$orange-red` respectively.
25
35
 
26
- To get a *red-like orange* tone, or an *orange-like red*, use the format of `$red-orange` or `$orange-red` respectively.
36
+ ```scss
37
+ color: $orange-red;
38
+ background: $violet-magenta;
39
+ ```
27
40
 
28
- color: $orange-red;
41
+ ### Pantones
29
42
 
30
- Installing
31
- ----------
43
+ I'll be working my way through the Pantone Colour Bridge shortly.
44
+ I plan to use a syntax like:
45
+
46
+ ```sass
47
+ $pantone-250
48
+ $pantone-5875
49
+ $pantone-process-black
50
+ ```
51
+
52
+ How to Install
53
+ --------------
32
54
 
33
55
  If you're using Rails then just add `gem "semantic-rainbow"` to your gemfile, and then use the `bundle` command.
34
56
 
35
57
  Then in your SCSS file import the file:
36
-
37
- # app/assets/stylesheets/application.css.scss
38
- @import "semantic-rainbow";
39
- @import "other-file-that-will-use-it"
58
+
59
+ ```scss
60
+ /* app/assets/stylesheets/application.css.scss */
61
+ @import "semantic-rainbow";
62
+ @import "other-file-that-will-use-it";
63
+ ```
40
64
 
41
65
  Creative Commons License
42
66
  ------------------------
@@ -0,0 +1,2 @@
1
+ @import "semantic-rainbow/hsl";
2
+ @import "semantic-rainbow/pantones";
@@ -0,0 +1,40 @@
1
+ /*#####################
2
+ #### HSL Variables ####
3
+ #####################*/
4
+
5
+ $red: hsl(0, 100%, 50%);
6
+ $red-orange: hsl(10, 100%, 50%);
7
+ $orange-red: hsl(20, 100%, 50%);
8
+ $orange: hsl(30, 100%, 50%);
9
+ $orange-yellow: hsl(40, 100%, 50%);
10
+ $yellow-orange: hsl(50, 100%, 50%);
11
+ $yellow: hsl(60, 100%, 50%);
12
+ $yellow-lime: hsl(70, 100%, 50%);
13
+ $lime-yellow: hsl(80, 100%, 50%);
14
+ $lime: hsl(90, 100%, 50%);
15
+ $lime-green: hsl(100, 100%, 50%);
16
+ $green-lime: hsl(110, 100%, 50%);
17
+ $green: hsl(120, 100%, 50%);
18
+ $green-teal: hsl(130, 100%, 50%);
19
+ $teal-green: hsl(140, 100%, 50%);
20
+ $teal: hsl(150, 100%, 50%);
21
+ $teal-cyan: hsl(160, 100%, 50%);
22
+ $cyan-teal: hsl(170, 100%, 50%);
23
+ $cyan: hsl(180, 100%, 50%);
24
+ $cyan-azure: hsl(190, 100%, 50%);
25
+ $azure-cyan: hsl(200, 100%, 50%);
26
+ $azure: hsl(210, 100%, 50%);
27
+ $azure-blue: hsl(220, 100%, 50%);
28
+ $blue-azure: hsl(230, 100%, 50%);
29
+ $blue: hsl(240, 100%, 50%);
30
+ $blue-violet: hsl(250, 100%, 50%);
31
+ $violet-blue: hsl(260, 100%, 50%);
32
+ $violet: hsl(270, 100%, 50%);
33
+ $violet-magenta: hsl(280, 100%, 50%);
34
+ $magenta-blue: hsl(290, 100%, 50%);
35
+ $magenta: hsl(300, 100%, 50%);
36
+ $magenta-pink: hsl(310, 100%, 50%);
37
+ $pink-magenta: hsl(320, 100%, 50%);
38
+ $pink: hsl(330, 100%, 50%);
39
+ $pink-red: hsl(340, 100%, 50%);
40
+ $red-pink: hsl(350, 100%, 50%);
@@ -0,0 +1,36 @@
1
+ /*#########################
2
+ #### Pantone Variables ####
3
+ #########################*/
4
+
5
+ // Page 1
6
+ $pantone-process-yellow: rgb(255,229,43);
7
+ $pantone-process-magenta: rgb(213,63,119);
8
+ $pantone-process-cyan: rgb(0,151,219);
9
+ $pantone-process-black: rgb(78,74,71);
10
+
11
+ // Page 2
12
+ $pantone-100: rgb(254,243,128);
13
+ $pantone-101: rgb(255,241,102);
14
+ $pantone-102: rgb(255,236,45);
15
+ $pantone-yellow: rgb(255,232,0);
16
+ $pantone-103: rgb(180,159,41);
17
+ $pantone-104: rgb(155,141,57);
18
+ $pantone-105: rgb(125,117,71);
19
+
20
+ // Page 3
21
+ $pantone-7401: rgb(254,229,165);
22
+ $pantone-7402: rgb(243,218,154);
23
+ $pantone-7403: rgb(244,207,129);
24
+ $pantone-7404: rgb(253,207,65);
25
+ $pantone-7405: rgb(230,177,14);
26
+ $pantone-7406: rgb(241,184,40);
27
+ $pantone-7407: rgb(204,163,110);
28
+
29
+ // Page 4
30
+ $pantone-106: rgb(255,235,104);
31
+ $pantone-107: rgb(255,229,82);
32
+ $pantone-108: rgb(255,221,53);
33
+ $pantone-109: rgb(255,199,0);
34
+ $pantone-110: rgb(204,159,38);
35
+ $pantone-111: rgb(156,135,59);
36
+ $pantone-112: rgb(138,122,62);
@@ -0,0 +1,6 @@
1
+ module Semantic
2
+ module Rainbow
3
+ class Engine < ::Rails::Engine
4
+ end
5
+ end
6
+ end
@@ -0,0 +1,5 @@
1
+ module Semantic
2
+ module Rainbow
3
+ VERSION = "0.0.3"
4
+ end
5
+ end
@@ -0,0 +1,6 @@
1
+ module Semantic
2
+ module Rainbow
3
+ require "semantic-rainbow/engine"
4
+ require "semantic-rainbow/version"
5
+ end
6
+ end
Binary file
metadata CHANGED
@@ -1,8 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: semantic-rainbow
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.2
5
- prerelease:
4
+ version: 0.0.3
6
5
  platform: ruby
7
6
  authors:
8
7
  - Brandon J McKay
@@ -14,7 +13,6 @@ dependencies:
14
13
  - !ruby/object:Gem::Dependency
15
14
  name: bundler
16
15
  requirement: !ruby/object:Gem::Requirement
17
- none: false
18
16
  requirements:
19
17
  - - ~>
20
18
  - !ruby/object:Gem::Version
@@ -22,7 +20,6 @@ dependencies:
22
20
  type: :development
23
21
  prerelease: false
24
22
  version_requirements: !ruby/object:Gem::Requirement
25
- none: false
26
23
  requirements:
27
24
  - - ~>
28
25
  - !ruby/object:Gem::Version
@@ -30,7 +27,6 @@ dependencies:
30
27
  - !ruby/object:Gem::Dependency
31
28
  name: rake
32
29
  requirement: !ruby/object:Gem::Requirement
33
- none: false
34
30
  requirements:
35
31
  - - ! '>='
36
32
  - !ruby/object:Gem::Version
@@ -38,7 +34,6 @@ dependencies:
38
34
  type: :development
39
35
  prerelease: false
40
36
  version_requirements: !ruby/object:Gem::Requirement
41
- none: false
42
37
  requirements:
43
38
  - - ! '>='
44
39
  - !ruby/object:Gem::Version
@@ -46,7 +41,6 @@ dependencies:
46
41
  - !ruby/object:Gem::Dependency
47
42
  name: railties
48
43
  requirement: !ruby/object:Gem::Requirement
49
- none: false
50
44
  requirements:
51
45
  - - ! '>='
52
46
  - !ruby/object:Gem::Version
@@ -54,7 +48,6 @@ dependencies:
54
48
  type: :runtime
55
49
  prerelease: false
56
50
  version_requirements: !ruby/object:Gem::Requirement
57
- none: false
58
51
  requirements:
59
52
  - - ! '>='
60
53
  - !ruby/object:Gem::Version
@@ -62,7 +55,6 @@ dependencies:
62
55
  - !ruby/object:Gem::Dependency
63
56
  name: sass-rails
64
57
  requirement: !ruby/object:Gem::Requirement
65
- none: false
66
58
  requirements:
67
59
  - - ! '>='
68
60
  - !ruby/object:Gem::Version
@@ -70,7 +62,6 @@ dependencies:
70
62
  type: :runtime
71
63
  prerelease: false
72
64
  version_requirements: !ruby/object:Gem::Requirement
73
- none: false
74
65
  requirements:
75
66
  - - ! '>='
76
67
  - !ruby/object:Gem::Version
@@ -87,30 +78,36 @@ files:
87
78
  - LICENSE.txt
88
79
  - README.md
89
80
  - Rakefile
81
+ - app/assets/stylesheets/_semantic-rainbow.css.scss
82
+ - app/assets/stylesheets/semantic-rainbow/_hsl.css.scss
83
+ - app/assets/stylesheets/semantic-rainbow/_pantones.css.scss
84
+ - lib/semantic-rainbow.rb
85
+ - lib/semantic-rainbow/engine.rb
86
+ - lib/semantic-rainbow/version.rb
87
+ - semantic-rainbow-0.0.2.gem
90
88
  - semantic-rainbow.gemspec
91
89
  homepage: https://github.com/brandonjmckay/semantic-rainbow
92
90
  licenses:
93
91
  - MIT
92
+ metadata: {}
94
93
  post_install_message:
95
94
  rdoc_options: []
96
95
  require_paths:
97
96
  - lib
98
97
  required_ruby_version: !ruby/object:Gem::Requirement
99
- none: false
100
98
  requirements:
101
99
  - - ! '>='
102
100
  - !ruby/object:Gem::Version
103
101
  version: '0'
104
102
  required_rubygems_version: !ruby/object:Gem::Requirement
105
- none: false
106
103
  requirements:
107
104
  - - ! '>='
108
105
  - !ruby/object:Gem::Version
109
106
  version: '0'
110
107
  requirements: []
111
108
  rubyforge_project:
112
- rubygems_version: 1.8.23
109
+ rubygems_version: 2.0.7
113
110
  signing_key:
114
- specification_version: 3
111
+ specification_version: 4
115
112
  summary: Simple SASS colour variables.
116
113
  test_files: []