modular-scale 1.0.2 → 1.0.3

Sign up to get free protection for your applications and to get access to all the features.
data/README.mdown CHANGED
@@ -24,7 +24,7 @@ Modular-scale is used as a function. Simply pass it through in place of any valu
24
24
  width: modular-scale(2); // two up the modular scale
25
25
  width: ms(2); // Shorthand for the line above
26
26
  width: modular-scale(2, 1em); // two up the modular scale with a base size of 1em
27
- width: modular-scale(2, 1em, $octave); // Same as above but on an octave scale
27
+ width: modular-scale(2, 1em, octave() ); // Same as above but on an octave scale
28
28
  ```
29
29
 
30
30
  You can output a list to your terminal to help you find out what values are on your scale.
@@ -50,7 +50,7 @@ Sassy Modular Scale can be used as a function, like so:
50
50
 
51
51
  ```scss
52
52
  // Use as a function. Fill in the multiple, base-size, and ratio
53
- height: modular-scale(7, 16px, $golden);
53
+ height: modular-scale(7, 16px, golden() );
54
54
  ```
55
55
 
56
56
 
@@ -59,7 +59,7 @@ You can also 'lace' multiple ratios together by passing them in as a list (space
59
59
 
60
60
  ```scss
61
61
  .lace {
62
- width: ms(7, 16px, $golden $fourth);
62
+ width: ms(7, 16px, golden() fourth() );
63
63
  }
64
64
  ```
65
65
 
@@ -68,7 +68,7 @@ You can also set the $base-size variable to a list to interrelate two significan
68
68
 
69
69
  ```scss
70
70
  .multibases {
71
- width: ms(7, 16px 300px, $golden);
71
+ width: ms(7, 16px 300px, golden() );
72
72
  }
73
73
  ```
74
74
 
@@ -76,39 +76,45 @@ You can use multiple $base-sizes and multiple $ratios together
76
76
 
77
77
  ```scss
78
78
  .multibase-multiratio {
79
- width: ms(7, 16px 300px, $golden $fourth);
79
+ width: ms(7, 16px 300px, golden() fourth() );
80
80
  }
81
81
  ```
82
82
 
83
-
84
83
  ## Ratios
85
84
 
86
- The included ratios are called by functions. You can add your own ratios as well.
87
-
88
- Below is a list of ratios to choose from. By default, the variable `$ratio` is set to `golden()`.
89
-
90
- * golden()
91
- * double-octave()
92
- * major-twelfth()
93
- * major-eleventh()
94
- * major-tenth()
95
- * octave()
96
- * major-seventh()
97
- * minor-seventh()
98
- * major-sixth()
99
- * minor-sixth()
100
- * fifth()
101
- * augfourth()
102
- * fourth()
103
- * major-third()
104
- * minor-third()
105
- * major-second()
106
- * minor-second()
85
+ Modular scale includes functions for a number of classic design and musical scale ratios. You can add your own ratios as well.
86
+
87
+ By default, the variable `$ratio` is set to `golden()`.
88
+
89
+ <table>
90
+
91
+ <tr><th>Function</th><th>Ratio</th><th>Decimal value</th></tr>
92
+
93
+ <tr><td>golden()</td><td>1:1.618</td><td>1.618</td></tr>
94
+ <tr><td>double-octave()</td><td>1:4</td><td>4</td></tr>
95
+ <tr><td>major-twelfth()</td><td>1:3</td><td>3</td></tr>
96
+ <tr><td>major-eleventh()</td><td>3:8</td><td>2.667</td></tr>
97
+ <tr><td>major-tenth()</td><td>2.5</td><td>2:5</td></tr>
98
+ <tr><td>octave()</td><td>1:2</td><td>2</td></tr>
99
+ <tr><td>major-seventh()</td><td>8:15</td><td>1.875</td></tr>
100
+ <tr><td>minor-seventh()</td><td>9:16</td><td>1.778</td></tr>
101
+ <tr><td>major-sixth()</td><td>3:5</td><td>1.667</td></tr>
102
+ <tr><td>minor-sixth()</td><td>5:8</td><td>1.6</td></tr>
103
+ <tr><td>fifth()</td><td>2:3</td><td>1.5</td></tr>
104
+ <tr><td>augmented-forth()</td><td>1:√2</td><td>1.414</td></tr>
105
+ <tr><td>fourth()</td><td>3:4</td><td>1.333</td></tr>
106
+ <tr><td>major-third()</td><td>4:5</td><td>1.25</td></tr>
107
+ <tr><td>minor-third()</td><td>5:6</td><td>1.2</td></tr>
108
+ <tr><td>major-second()</td><td>8:9</td><td>1.125</td></tr>
109
+ <tr><td>minor-second()</td><td>15:16</td><td>1.067</td></tr>
110
+
111
+ </table>
107
112
 
108
113
  Add your own ratio in Sass by setting a variable and passing that to modular-scale.
109
114
 
110
115
  ```scss
111
116
  $my-variable: 1 / 3.14159265;
117
+ $ratio: $my-variable;
112
118
  ```
113
119
 
114
120
  ## Inspiration
data/lib/modular-scale.rb CHANGED
@@ -7,7 +7,7 @@ Compass::Frameworks.register("modular-scale", :path => "#{File.dirname(__FILE__)
7
7
  # end
8
8
 
9
9
  module ModularScale
10
- VERSION = "1.0.2"
10
+ VERSION = "1.0.3"
11
11
  DATE = "2012-08-13"
12
12
  end
13
13
 
@@ -4,10 +4,10 @@
4
4
  // Defaults
5
5
  $ratio: golden_ratio() !default
6
6
  $base-size: 16px !default
7
- $round_pixels: true !default
7
+ $round-pixels: true !default
8
8
 
9
9
  // Modular Scale function
10
- @function modular-scale($multiple, $base-size: $base-size, $ratio: $ratio, $round_pixels: $round_pixels)
10
+ @function modular-scale($multiple, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels)
11
11
  // return the $base-size if $multiple is zero
12
12
  @if $multiple == 0
13
13
  @if type-of($base-size) == 'list'
@@ -20,32 +20,32 @@ $round_pixels: true !default
20
20
  // and multiple ratios are passed in as a list
21
21
  // calculate values in using each base-size / ratio combination
22
22
  @if type-of($base-size) == 'list' and type-of($ratio) == 'list'
23
- @if unit(ms-multibase-multiratio($multiple, $base-size, $ratio)) == 'px' and $round_pixels == true
23
+ @if unit(ms-multibase-multiratio($multiple, $base-size, $ratio)) == 'px' and $round-pixels == true
24
24
  @return round(ms-multibase-multiratio($multiple, $base-size, $ratio))
25
25
  @return ms-multibase-multiratio($multiple, $base-size, $ratio)
26
26
 
27
27
  // if multiple base-sizes are passed in as a list
28
28
  // calculate values in using each base-size
29
29
  @if type-of($base-size) == 'list' and type-of($ratio) == 'number'
30
- @if unit(ms-multibase($multiple, $base-size, $ratio)) == 'px' and $round_pixels == true
30
+ @if unit(ms-multibase($multiple, $base-size, $ratio)) == 'px' and $round-pixels == true
31
31
  @return round(ms-multibase($multiple, $base-size, $ratio))
32
32
  @return ms-multibase($multiple, $base-size, $ratio)
33
33
 
34
34
  // if multiple ratios are passed in as a list
35
35
  // calculate values in using each ratio
36
36
  @if type-of($base-size) == 'number' and type-of($ratio) == 'list'
37
- @if unit(ms-multiratio($multiple, $base-size, $ratio)) == 'px' and $round_pixels == true
37
+ @if unit(ms-multiratio($multiple, $base-size, $ratio)) == 'px' and $round-pixels == true
38
38
  @return round(ms-multiratio($multiple, $base-size, $ratio))
39
39
  @return ms-multiratio($multiple, $base-size, $ratio)
40
40
 
41
41
  // If there are no lists just run the simple function
42
- @if unit(power($ratio, $multiple) * $base-size) == 'px' and $round_pixels == true
42
+ @if unit(power($ratio, $multiple) * $base-size) == 'px' and $round-pixels == true
43
43
  @return round(power($ratio, $multiple) * $base-size)
44
44
  @return power($ratio, $multiple) * $base-size
45
45
 
46
46
 
47
47
  // calculate values in using each base-size / ratio combination
48
- @function ms-multibase-multiratio($multiple, $base-size, $ratio)
48
+ @function ms-multibase-multiratio($multiple, $base-size: $base-size, $ratio: $ratio)
49
49
  // start with an empty list to place all values in
50
50
  $scale-values: ()
51
51
  // make sure base sizes are in ascending order
@@ -91,7 +91,7 @@ $round_pixels: true !default
91
91
 
92
92
 
93
93
  // calculate values in using each base-size
94
- @function ms-multibase($multiple, $base-size, $ratio)
94
+ @function ms-multibase($multiple, $base-size: $base-size, $ratio: $ratio)
95
95
  // start with an empty list to place all values in
96
96
  $scale-values: ()
97
97
  // make sure base sizes are in ascending order
@@ -133,7 +133,7 @@ $round_pixels: true !default
133
133
 
134
134
 
135
135
  // calculate values in using each ratio
136
- @function ms-multiratio($multiple, $base-size, $ratio)
136
+ @function ms-multiratio($multiple, $base-size: $base-size, $ratio: $ratio)
137
137
  // start with an empty list to place all values in
138
138
  $scale-values: ()
139
139
  // If $multiple is a positive integer (up the scale)
@@ -171,7 +171,7 @@ $round_pixels: true !default
171
171
 
172
172
 
173
173
  // trim and sort the final list
174
- @function trim-sort($multiple, $scale-values, $base-size)
174
+ @function trim-sort($multiple, $scale-values: $scale-values, $base-size: $base-size)
175
175
  @if $multiple > 0
176
176
  // trim list so we can count from the lowest $base-size
177
177
  $scale-values: trim_list($scale-values, nth($base-size, 1), true)
@@ -195,26 +195,32 @@ $round_pixels: true !default
195
195
  @return golden_ratio()
196
196
 
197
197
  // Shortcut
198
- @function ms($args...)
198
+ @function ms($multiple, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels)
199
199
  // Return the value from the Modular Scale function
200
- @return modular-scale($args...)
200
+ @return modular-scale($multiple, $base-size, $ratio, $round-pixels)
201
201
 
202
202
  // Write Modular Scale List
203
- @function modular-scale-list($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio)
203
+ @function modular-scale-list($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels)
204
204
  $ms-list: unquote("MS-LIST:")
205
205
  @for $i from $start through $finish
206
- $ms-list: append($ms-list, ms($i, $base-size, $ratio))
206
+ $ms-list: append($ms-list, ms($i, $base-size, $ratio, $round-pixels))
207
207
  @return $ms-list
208
208
 
209
- @function ms-list($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio)
210
- @return modular-scale-list($start, $finish, $base-size, $ratio)
209
+ @function ms-list($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels)
210
+ @return modular-scale-list($start, $finish, $base-size, $ratio, $round-pixels)
211
211
 
212
- =modular-scale-list($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio)
213
- @debug modular-scale-list($start, $finish, $base-size, $ratio)
212
+ =modular-scale-list($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels)
213
+ @debug modular-scale-list($start, $finish, $base-size, $ratio, $round-pixels)
214
214
 
215
- =ms-list($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio)
216
- @debug modular-scale-list($start, $finish, $base-size, $ratio)
215
+ =ms-list($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels)
216
+ @debug modular-scale-list($start, $finish, $base-size, $ratio, $round-pixels)
217
217
 
218
+ =modular-scale-list-output($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels)
219
+ MODULAR-SCALE-LIST
220
+ •: modular-scale-list($start, $finish, $base-size, $ratio, $round-pixels)
221
+
222
+ =ms-list-output($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels)
223
+ +modular-scale-list-output($start, $finish, $base-size, $ratio, $round-pixels)
218
224
 
219
225
  // Other libraries can easily query if this function is avalible
220
226
  $modular-scale-loaded: true
metadata CHANGED
@@ -1,97 +1,87 @@
1
- --- !ruby/object:Gem::Specification
1
+ --- !ruby/object:Gem::Specification
2
2
  name: modular-scale
3
- version: !ruby/object:Gem::Version
4
- prerelease: false
5
- segments:
6
- - 1
7
- - 0
8
- - 2
9
- version: 1.0.2
3
+ version: !ruby/object:Gem::Version
4
+ version: 1.0.3
5
+ prerelease:
10
6
  platform: ruby
11
- authors:
7
+ authors:
12
8
  - Scott Kellum
13
9
  - Adam Stacoviak
14
10
  - Mason Wendell
15
11
  autorequire:
16
12
  bindir: bin
17
13
  cert_chain: []
18
-
19
- date: 2012-08-13 00:00:00 -04:00
20
- default_executable:
21
- dependencies:
22
- - !ruby/object:Gem::Dependency
14
+ date: 2012-08-13 00:00:00.000000000 Z
15
+ dependencies:
16
+ - !ruby/object:Gem::Dependency
23
17
  name: compass
24
- prerelease: false
25
- requirement: &id001 !ruby/object:Gem::Requirement
26
- requirements:
27
- - - ">="
28
- - !ruby/object:Gem::Version
29
- segments:
30
- - 0
31
- - 11
32
- - 5
18
+ requirement: !ruby/object:Gem::Requirement
19
+ none: false
20
+ requirements:
21
+ - - ! '>='
22
+ - !ruby/object:Gem::Version
33
23
  version: 0.11.5
34
24
  type: :runtime
35
- version_requirements: *id001
36
- - !ruby/object:Gem::Dependency
37
- name: sassy-math
38
25
  prerelease: false
39
- requirement: &id002 !ruby/object:Gem::Requirement
40
- requirements:
41
- - - ">="
42
- - !ruby/object:Gem::Version
43
- segments:
44
- - 1
45
- - 2
46
- version: "1.2"
26
+ version_requirements: !ruby/object:Gem::Requirement
27
+ none: false
28
+ requirements:
29
+ - - ! '>='
30
+ - !ruby/object:Gem::Version
31
+ version: 0.11.5
32
+ - !ruby/object:Gem::Dependency
33
+ name: sassy-math
34
+ requirement: !ruby/object:Gem::Requirement
35
+ none: false
36
+ requirements:
37
+ - - ! '>='
38
+ - !ruby/object:Gem::Version
39
+ version: '1.2'
47
40
  type: :runtime
48
- version_requirements: *id002
49
- description: Sassy Modular Scale calculates the incremental values of the modular scale.
50
- email:
41
+ prerelease: false
42
+ version_requirements: !ruby/object:Gem::Requirement
43
+ none: false
44
+ requirements:
45
+ - - ! '>='
46
+ - !ruby/object:Gem::Version
47
+ version: '1.2'
48
+ description: Sassy Modular Scale calculates the incremental values of the modular
49
+ scale.
50
+ email:
51
51
  - scott@scottkellum.com
52
52
  - adam@stacoviak.com
53
53
  - mason@canarypromo.com
54
54
  executables: []
55
-
56
55
  extensions: []
57
-
58
56
  extra_rdoc_files: []
59
-
60
- files:
57
+ files:
61
58
  - README.mdown
62
59
  - lib/modular-scale.rb
63
60
  - stylesheets/_modular-scale.sass
64
- has_rdoc: true
65
61
  homepage: https://github.com/scottkellum/modular-scale
66
62
  licenses: []
67
-
68
63
  post_install_message:
69
64
  rdoc_options: []
70
-
71
- require_paths:
65
+ require_paths:
72
66
  - lib
73
- required_ruby_version: !ruby/object:Gem::Requirement
74
- requirements:
75
- - - ">="
76
- - !ruby/object:Gem::Version
77
- segments:
78
- - 0
79
- version: "0"
80
- required_rubygems_version: !ruby/object:Gem::Requirement
81
- requirements:
82
- - - ">="
83
- - !ruby/object:Gem::Version
84
- segments:
85
- - 1
86
- - 3
87
- - 6
67
+ required_ruby_version: !ruby/object:Gem::Requirement
68
+ none: false
69
+ requirements:
70
+ - - ! '>='
71
+ - !ruby/object:Gem::Version
72
+ version: '0'
73
+ required_rubygems_version: !ruby/object:Gem::Requirement
74
+ none: false
75
+ requirements:
76
+ - - ! '>='
77
+ - !ruby/object:Gem::Version
88
78
  version: 1.3.6
89
79
  requirements: []
90
-
91
80
  rubyforge_project:
92
- rubygems_version: 1.3.6
81
+ rubygems_version: 1.8.24
93
82
  signing_key:
94
83
  specification_version: 3
95
- summary: Sassy Modular Scale calculates the incremental values of the modular scale in proportion to a set size and ratio. Inspired by and adapted from Tim Brown's modularscale.com.
84
+ summary: Sassy Modular Scale calculates the incremental values of the modular scale
85
+ in proportion to a set size and ratio. Inspired by and adapted from Tim Brown's
86
+ modularscale.com.
96
87
  test_files: []
97
-