middleman-gumby 0.0.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +7 -0
- data/.gitignore +18 -0
- data/Gemfile +4 -0
- data/LICENSE.txt +22 -0
- data/README.md +43 -0
- data/Rakefile +1 -0
- data/lib/middleman/gumby.rb +17 -0
- data/lib/middleman/gumby/version.rb +5 -0
- data/middleman-gumby.gemspec +25 -0
- data/vendor/assets/fonts/icons/entypo.eot +0 -0
- data/vendor/assets/fonts/icons/entypo.ttf +0 -0
- data/vendor/assets/fonts/icons/entypo.woff +0 -0
- data/vendor/assets/javascripts/gumby/libs/gumby.init.js +47 -0
- data/vendor/assets/javascripts/gumby/libs/gumby.js +258 -0
- data/vendor/assets/javascripts/gumby/libs/gumby.min.js +1 -0
- data/vendor/assets/javascripts/gumby/libs/jquery-1.10.1.min.js +6 -0
- data/vendor/assets/javascripts/gumby/libs/jquery-1.10.1.min.map +1 -0
- data/vendor/assets/javascripts/gumby/libs/jquery-2.0.2.min.js +6 -0
- data/vendor/assets/javascripts/gumby/libs/jquery-2.0.2.min.map +1 -0
- data/vendor/assets/javascripts/gumby/libs/jquery.mobile.custom.min.js +3 -0
- data/vendor/assets/javascripts/gumby/libs/modernizr-2.6.2.min.js +4 -0
- data/vendor/assets/javascripts/gumby/libs/ui/gumby.checkbox.js +101 -0
- data/vendor/assets/javascripts/gumby/libs/ui/gumby.fixed.js +240 -0
- data/vendor/assets/javascripts/gumby/libs/ui/gumby.navbar.js +111 -0
- data/vendor/assets/javascripts/gumby/libs/ui/gumby.radiobtn.js +90 -0
- data/vendor/assets/javascripts/gumby/libs/ui/gumby.retina.js +81 -0
- data/vendor/assets/javascripts/gumby/libs/ui/gumby.skiplink.js +157 -0
- data/vendor/assets/javascripts/gumby/libs/ui/gumby.tabs.js +80 -0
- data/vendor/assets/javascripts/gumby/libs/ui/gumby.toggleswitch.js +264 -0
- data/vendor/assets/javascripts/gumby/libs/ui/jquery.validation.js +142 -0
- data/vendor/assets/javascripts/gumby/main.js +23 -0
- data/vendor/assets/javascripts/gumby/plugins.js +4 -0
- data/vendor/assets/javascripts/gumby/production.js +3 -0
- data/vendor/assets/sass/_base.scss +49 -0
- data/vendor/assets/sass/_custom.scss +1 -0
- data/vendor/assets/sass/_fonts.scss +28 -0
- data/vendor/assets/sass/_grid.scss +339 -0
- data/vendor/assets/sass/_shame.scss +36 -0
- data/vendor/assets/sass/_typography.scss +272 -0
- data/vendor/assets/sass/extensions/modular-scale/lib/modular-scale.rb +128 -0
- data/vendor/assets/sass/extensions/modular-scale/stylesheets/_modular-scale.scss +310 -0
- data/vendor/assets/sass/extensions/sassy-math/lib/sassy-math.rb +159 -0
- data/vendor/assets/sass/extensions/sassy-math/stylesheets/_math.scss +310 -0
- data/vendor/assets/sass/functions/_all.scss +25 -0
- data/vendor/assets/sass/functions/_breakpoints.scss +11 -0
- data/vendor/assets/sass/functions/_button-size.scss +44 -0
- data/vendor/assets/sass/functions/_clearfix.scss +25 -0
- data/vendor/assets/sass/functions/_em.scss +11 -0
- data/vendor/assets/sass/functions/_even.scss +10 -0
- data/vendor/assets/sass/functions/_fade.scss +20 -0
- data/vendor/assets/sass/functions/_fancytiles.scss +29 -0
- data/vendor/assets/sass/functions/_fixed.scss +21 -0
- data/vendor/assets/sass/functions/_forms.scss +18 -0
- data/vendor/assets/sass/functions/_grid-calc.scss +82 -0
- data/vendor/assets/sass/functions/_height-calc.scss +6 -0
- data/vendor/assets/sass/functions/_icons.scss +35 -0
- data/vendor/assets/sass/functions/_line-and-height.scss +7 -0
- data/vendor/assets/sass/functions/_palette.scss +76 -0
- data/vendor/assets/sass/functions/_responsivity.scss +34 -0
- data/vendor/assets/sass/functions/_semantic-grid.scss +170 -0
- data/vendor/assets/sass/functions/_shapes.scss +22 -0
- data/vendor/assets/sass/functions/_strip-units.scss +5 -0
- data/vendor/assets/sass/functions/_tooltips.scss +98 -0
- data/vendor/assets/sass/functions/_typography.scss +15 -0
- data/vendor/assets/sass/functions/_visibility.scss +17 -0
- data/vendor/assets/sass/gumby.scss +39 -0
- data/vendor/assets/sass/ui/_all.scss +11 -0
- data/vendor/assets/sass/ui/_buttons.scss +154 -0
- data/vendor/assets/sass/ui/_forms.scss +392 -0
- data/vendor/assets/sass/ui/_icons.scss +23 -0
- data/vendor/assets/sass/ui/_images.scss +23 -0
- data/vendor/assets/sass/ui/_labels.scss +87 -0
- data/vendor/assets/sass/ui/_navbar.scss +440 -0
- data/vendor/assets/sass/ui/_tables.scss +89 -0
- data/vendor/assets/sass/ui/_tabs.scss +156 -0
- data/vendor/assets/sass/ui/_toggles.scss +73 -0
- data/vendor/assets/sass/ui/_tooltips.scss +12 -0
- data/vendor/assets/sass/ui/_video.scss +24 -0
- data/vendor/assets/sass/var/_lists.scss +20 -0
- data/vendor/assets/sass/var/_settings.scss +169 -0
- data/vendor/assets/sass/var/icons/_entypo-icon-list.scss +286 -0
- data/vendor/assets/sass/var/icons/_entypo.scss +294 -0
- metadata +167 -0
@@ -0,0 +1,36 @@
|
|
1
|
+
/* SHAME */
|
2
|
+
|
3
|
+
.ie8 {
|
4
|
+
//double input field fix
|
5
|
+
.xxwide,
|
6
|
+
.xwide,
|
7
|
+
.wide,
|
8
|
+
.normal,
|
9
|
+
.narrow,
|
10
|
+
.xnarrow {
|
11
|
+
display: inline;
|
12
|
+
&+input {
|
13
|
+
display: inline;
|
14
|
+
margin: 0 0 0 -.25em;
|
15
|
+
}
|
16
|
+
}
|
17
|
+
|
18
|
+
// tooltip 'fade' fix
|
19
|
+
.ttip {
|
20
|
+
&:before, &:after {
|
21
|
+
display: none;
|
22
|
+
}
|
23
|
+
&:hover {
|
24
|
+
&:before, &:after {
|
25
|
+
display: block;
|
26
|
+
}
|
27
|
+
}
|
28
|
+
}
|
29
|
+
}
|
30
|
+
|
31
|
+
.ie9 {
|
32
|
+
// IE9 checkbox fix
|
33
|
+
.radio.checked i, .checkbox.checked i {
|
34
|
+
top: 0;
|
35
|
+
}
|
36
|
+
}
|
@@ -0,0 +1,272 @@
|
|
1
|
+
/* Typography */
|
2
|
+
|
3
|
+
h1,h2,h3,h4,h5,h6 {
|
4
|
+
font-family: $font-family;
|
5
|
+
font-weight: $header-font-weight;
|
6
|
+
color: $header-font-color;
|
7
|
+
text-rendering: optimizeLegibility;
|
8
|
+
@include padding-leader($rhythm-spacing);
|
9
|
+
@include adjust-leading-to($rhythm-height);
|
10
|
+
@include padding-trailer($rhythm-spacing);
|
11
|
+
a {
|
12
|
+
color: $header-link-color;
|
13
|
+
}
|
14
|
+
}
|
15
|
+
|
16
|
+
@include respond(all-phones) {
|
17
|
+
|
18
|
+
h1,h2,h3,h4,h5,h6 { word-wrap: break-word;}
|
19
|
+
|
20
|
+
}
|
21
|
+
|
22
|
+
h1 {
|
23
|
+
@include font-size($xxxlarge);
|
24
|
+
&.xlarge {
|
25
|
+
@include font-size($reallybig);
|
26
|
+
}
|
27
|
+
&.xxlarge {
|
28
|
+
@include font-size($tremendous);
|
29
|
+
}
|
30
|
+
&.absurd {
|
31
|
+
@include font-size($absurd);
|
32
|
+
}
|
33
|
+
}
|
34
|
+
h2 { @include font-size($xlarge); }
|
35
|
+
h3 { @include font-size($larger);}
|
36
|
+
h4 { @include font-size($large);}
|
37
|
+
h5 { @include font-size($med);}
|
38
|
+
h6 { @include font-size($norm);}
|
39
|
+
|
40
|
+
@include respond(all-phones) {
|
41
|
+
|
42
|
+
h1 { @include font-size($xlarge);}
|
43
|
+
h2 { @include font-size($larger + 6);}
|
44
|
+
|
45
|
+
}
|
46
|
+
|
47
|
+
.subhead {
|
48
|
+
color: #777;
|
49
|
+
font-weight: normal;
|
50
|
+
margin-bottom: 20px;
|
51
|
+
}
|
52
|
+
|
53
|
+
/*=====================================================
|
54
|
+
|
55
|
+
Links & Paragraph styles
|
56
|
+
|
57
|
+
======================================================*/
|
58
|
+
|
59
|
+
p {
|
60
|
+
font-family: $font-family;
|
61
|
+
font-weight: $body-font-weight;
|
62
|
+
@include font-size($base-font-size);
|
63
|
+
margin-bottom: $base-line-height / 2;
|
64
|
+
@include adjust-leading-to(1);
|
65
|
+
&.lead {
|
66
|
+
@include font-size(ms(0) * 1.25);
|
67
|
+
margin-bottom: ms(1);
|
68
|
+
}
|
69
|
+
@include respond(portrait-tablets) {
|
70
|
+
@include font-size($base-font-size * 1.1);
|
71
|
+
@include adjust-leading-to(1);
|
72
|
+
}
|
73
|
+
}
|
74
|
+
|
75
|
+
a {
|
76
|
+
color: $body-link-color;
|
77
|
+
text-decoration: none;
|
78
|
+
outline: 0;
|
79
|
+
line-height: inherit;
|
80
|
+
&:hover {
|
81
|
+
color: $body-link-hover-color;
|
82
|
+
}
|
83
|
+
}
|
84
|
+
|
85
|
+
/*=====================================================
|
86
|
+
|
87
|
+
Lists
|
88
|
+
|
89
|
+
======================================================*/
|
90
|
+
|
91
|
+
ul, ol {
|
92
|
+
@include margin-trailer($rhythm-spacing);
|
93
|
+
}
|
94
|
+
|
95
|
+
ul {
|
96
|
+
list-style: none outside;
|
97
|
+
}
|
98
|
+
|
99
|
+
ol {
|
100
|
+
list-style: decimal;
|
101
|
+
margin-left: 30px;
|
102
|
+
}
|
103
|
+
|
104
|
+
ul {
|
105
|
+
&.square, &.circle, &.disc {
|
106
|
+
margin-left: 25px;
|
107
|
+
}
|
108
|
+
&.square {
|
109
|
+
list-style: square outside;
|
110
|
+
}
|
111
|
+
&.circle {
|
112
|
+
list-style: circle outside;
|
113
|
+
}
|
114
|
+
&.disc {
|
115
|
+
list-style: disc outside;
|
116
|
+
}
|
117
|
+
ul {
|
118
|
+
margin: 4px 0 5px 25px;
|
119
|
+
}
|
120
|
+
}
|
121
|
+
|
122
|
+
ol ol {
|
123
|
+
margin: 4px 0 5px 30px;
|
124
|
+
}
|
125
|
+
|
126
|
+
li {
|
127
|
+
@include padding-trailer($rhythm-spacing);
|
128
|
+
}
|
129
|
+
|
130
|
+
ul.large li {
|
131
|
+
line-height: 21px;
|
132
|
+
}
|
133
|
+
|
134
|
+
dl dt {
|
135
|
+
font-weight: bold;
|
136
|
+
@include font-size($norm);
|
137
|
+
}
|
138
|
+
|
139
|
+
@include respond(portrait-tablets) {
|
140
|
+
|
141
|
+
ul, ol, dl, p { text-align: left;}
|
142
|
+
|
143
|
+
}
|
144
|
+
|
145
|
+
/* Mobile */
|
146
|
+
|
147
|
+
em {
|
148
|
+
font-style: italic;
|
149
|
+
line-height: inherit;
|
150
|
+
}
|
151
|
+
|
152
|
+
strong {
|
153
|
+
font-weight: $font-weight-bold;
|
154
|
+
line-height: inherit;
|
155
|
+
}
|
156
|
+
|
157
|
+
small {
|
158
|
+
font-size: 56.4%;
|
159
|
+
line-height: inherit;
|
160
|
+
}
|
161
|
+
|
162
|
+
h1 small, h2 small, h3 small, h4 small, h5 small {
|
163
|
+
color: #777;
|
164
|
+
}
|
165
|
+
|
166
|
+
/* Blockquotes */
|
167
|
+
|
168
|
+
blockquote {
|
169
|
+
line-height: 20px;
|
170
|
+
color: #777;
|
171
|
+
p {
|
172
|
+
line-height: 20px;
|
173
|
+
color: #777;
|
174
|
+
}
|
175
|
+
margin: 0 0 18px;
|
176
|
+
padding: 9px 20px 0 19px;
|
177
|
+
border-left: 5px solid $horizontal-rule-color;
|
178
|
+
cite {
|
179
|
+
display: block;
|
180
|
+
font-size: 12px;
|
181
|
+
font-size: 1.2rem;
|
182
|
+
color: $body-font-color;
|
183
|
+
&:before {
|
184
|
+
content: "\2014 \0020";
|
185
|
+
}
|
186
|
+
a {
|
187
|
+
color: $body-font-color;
|
188
|
+
&:visited {
|
189
|
+
color: $body-font-color;
|
190
|
+
}
|
191
|
+
}
|
192
|
+
}
|
193
|
+
}
|
194
|
+
|
195
|
+
hr {
|
196
|
+
border: 1px solid $horizontal-rule-color;
|
197
|
+
clear: both;
|
198
|
+
margin: 16px 0 18px;
|
199
|
+
height: 0;
|
200
|
+
}
|
201
|
+
|
202
|
+
abbr, acronym {
|
203
|
+
text-transform: uppercase;
|
204
|
+
font-size: 90%;
|
205
|
+
color: #222;
|
206
|
+
border-bottom: 1px solid $horizontal-rule-color;
|
207
|
+
cursor: help;
|
208
|
+
}
|
209
|
+
|
210
|
+
abbr {
|
211
|
+
text-transform: none;
|
212
|
+
}
|
213
|
+
|
214
|
+
/**
|
215
|
+
* Print styles.
|
216
|
+
*
|
217
|
+
* Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/
|
218
|
+
* Credit to Paul Irish and HTML5 Boilerplate (html5boilerplate.com)
|
219
|
+
*/
|
220
|
+
|
221
|
+
@media print {
|
222
|
+
* {
|
223
|
+
background: transparent !important;
|
224
|
+
color: black !important;
|
225
|
+
text-shadow: none !important;
|
226
|
+
filter: none !important;
|
227
|
+
-ms-filter: none !important;
|
228
|
+
}
|
229
|
+
/* Black prints faster: sanbeiji.com/archives/953 */
|
230
|
+
p a {
|
231
|
+
color: $body-font-color !important;
|
232
|
+
text-decoration: underline;
|
233
|
+
&:visited {
|
234
|
+
color: $body-font-color !important;
|
235
|
+
text-decoration: underline;
|
236
|
+
}
|
237
|
+
&[href]:after {
|
238
|
+
content: " (" attr(href) ")";
|
239
|
+
}
|
240
|
+
}
|
241
|
+
abbr[title]:after {
|
242
|
+
content: " (" attr(title) ")";
|
243
|
+
}
|
244
|
+
a {
|
245
|
+
&[href^="javascript:"]:after, &[href^="#"]:after {
|
246
|
+
content: "";
|
247
|
+
}
|
248
|
+
}
|
249
|
+
/* Don't show links for images, or javascript/internal links */
|
250
|
+
pre, blockquote {
|
251
|
+
border: 1px solid #999;
|
252
|
+
page-break-inside: avoid;
|
253
|
+
}
|
254
|
+
thead {
|
255
|
+
display: table-header-group;
|
256
|
+
}
|
257
|
+
/* css-discuss.incutio.com/wiki/Printing_Tables */
|
258
|
+
tr, img {
|
259
|
+
page-break-inside: avoid;
|
260
|
+
}
|
261
|
+
@page {
|
262
|
+
margin: 0.5cm;
|
263
|
+
}
|
264
|
+
|
265
|
+
p, h2, h3 {
|
266
|
+
orphans: 3;
|
267
|
+
widows: 3;
|
268
|
+
}
|
269
|
+
h2, h3 {
|
270
|
+
page-break-after: avoid;
|
271
|
+
}
|
272
|
+
}
|
@@ -0,0 +1,128 @@
|
|
1
|
+
require 'compass'
|
2
|
+
# require 'sassy-math'
|
3
|
+
|
4
|
+
# This tells Compass what your Compass extension is called, and where to find
|
5
|
+
# its files
|
6
|
+
# Replace 'extension' with the name of your extension. Spaces allowed.
|
7
|
+
extension_path = File.expand_path(File.join(File.dirname(__FILE__), ".."))
|
8
|
+
Compass::Frameworks.register('modular-scale', :path => extension_path)
|
9
|
+
|
10
|
+
# Version and date of version for your Compass extension.
|
11
|
+
# Replace Extension with the name of your extension
|
12
|
+
# Letters, numbers, and underscores only
|
13
|
+
# Version is a number. If a version contains alphas, it will be created as
|
14
|
+
# a prerelease version
|
15
|
+
# Date is in the form of YYYY-MM-DD
|
16
|
+
module ModularScale
|
17
|
+
VERSION = "1.0.6"
|
18
|
+
DATE = "2012-08-13"
|
19
|
+
end
|
20
|
+
|
21
|
+
# This is where any custom SassScript should be placed. The functions will be
|
22
|
+
# available on require of your extension without the need for users to import
|
23
|
+
# any partials. Uncomment below.
|
24
|
+
|
25
|
+
# Modular Scale Sass Script
|
26
|
+
module Sass::Script
|
27
|
+
class Number < Literal
|
28
|
+
# Comparison
|
29
|
+
def <=>(other)
|
30
|
+
value <=> other.value
|
31
|
+
end
|
32
|
+
end
|
33
|
+
end
|
34
|
+
|
35
|
+
module Sass::Script::Functions
|
36
|
+
# Modular Scale
|
37
|
+
def double_octave
|
38
|
+
value = 4 / 1.0
|
39
|
+
Sass::Script::Number.new(value)
|
40
|
+
end
|
41
|
+
def major_twelfth
|
42
|
+
value = 3 / 1.0
|
43
|
+
Sass::Script::Number.new(value)
|
44
|
+
end
|
45
|
+
def major_eleventh
|
46
|
+
value = 8 / 3.0
|
47
|
+
Sass::Script::Number.new(value)
|
48
|
+
end
|
49
|
+
def major_tenth
|
50
|
+
value = 5 / 2.0
|
51
|
+
Sass::Script::Number.new(value)
|
52
|
+
end
|
53
|
+
def octave
|
54
|
+
value = 2 / 1.0
|
55
|
+
Sass::Script::Number.new(value)
|
56
|
+
end
|
57
|
+
def major_seventh
|
58
|
+
value = 15 / 8.0
|
59
|
+
Sass::Script::Number.new(value)
|
60
|
+
end
|
61
|
+
def minor_seventh
|
62
|
+
value = 16 /9.0
|
63
|
+
Sass::Script::Number.new(value)
|
64
|
+
end
|
65
|
+
def major_sixth
|
66
|
+
value = 5 / 3.0
|
67
|
+
Sass::Script::Number.new(value)
|
68
|
+
end
|
69
|
+
def minor_sixth
|
70
|
+
value = 8 / 5.0
|
71
|
+
Sass::Script::Number.new(value)
|
72
|
+
end
|
73
|
+
def fifth
|
74
|
+
value = 3 / 2.0
|
75
|
+
Sass::Script::Number.new(value)
|
76
|
+
end
|
77
|
+
def augmented_fourth
|
78
|
+
value = Math.sqrt(2) / 1.0
|
79
|
+
Sass::Script::Number.new(value)
|
80
|
+
end
|
81
|
+
def fourth
|
82
|
+
value = 4 / 3.0
|
83
|
+
Sass::Script::Number.new(value)
|
84
|
+
end
|
85
|
+
def major_third
|
86
|
+
value = 5 / 4.0
|
87
|
+
Sass::Script::Number.new(value)
|
88
|
+
end
|
89
|
+
def minor_third
|
90
|
+
value = 6 / 5.0
|
91
|
+
Sass::Script::Number.new(value)
|
92
|
+
end
|
93
|
+
def major_second
|
94
|
+
value = 9 / 8.0
|
95
|
+
Sass::Script::Number.new(value)
|
96
|
+
end
|
97
|
+
def minor_second
|
98
|
+
value = 16 / 15.0
|
99
|
+
Sass::Script::Number.new(value)
|
100
|
+
end
|
101
|
+
|
102
|
+
# Lists
|
103
|
+
def sort_list(list)
|
104
|
+
sep = list.separator if list.is_a?(Sass::Script::List)
|
105
|
+
list = list.to_a.sort
|
106
|
+
Sass::Script::List.new(list, sep)
|
107
|
+
end
|
108
|
+
def reverse_list(list)
|
109
|
+
sep = list.separator if list.is_a?(Sass::Script::List)
|
110
|
+
list = list.to_a.reverse
|
111
|
+
Sass::Script::List.new(list, sep)
|
112
|
+
end
|
113
|
+
def trim_list(list, threshold, ascending)
|
114
|
+
# remove list items above or below a threshold
|
115
|
+
sep = list.separator if list.is_a?(Sass::Script::List)
|
116
|
+
list = list.to_a
|
117
|
+
if ascending.value
|
118
|
+
list = list.delete_if {
|
119
|
+
|x| x.value <= threshold.value
|
120
|
+
}
|
121
|
+
else
|
122
|
+
list = list.delete_if {
|
123
|
+
|x| x.value >= threshold.value
|
124
|
+
}
|
125
|
+
end
|
126
|
+
Sass::Script::List.new(list, sep)
|
127
|
+
end
|
128
|
+
end
|
@@ -0,0 +1,310 @@
|
|
1
|
+
// SASSY MODULAR-SCALE
|
2
|
+
// https://github.com/scottkellum/modular-scale
|
3
|
+
|
4
|
+
// Defaults
|
5
|
+
$ratio: golden_ratio() !default;
|
6
|
+
$base-size: 16px !default;
|
7
|
+
$round-pixels: true !default;
|
8
|
+
|
9
|
+
// Modular Scale function
|
10
|
+
@function modular-scale($multiple, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels) {
|
11
|
+
|
12
|
+
// return the $base-size if $multiple is zero
|
13
|
+
@if $multiple == 0 {
|
14
|
+
@if type-of($base-size) == "list" {
|
15
|
+
$base-size: sort_list($base-size);
|
16
|
+
@return nth($base-size, 1);
|
17
|
+
}
|
18
|
+
|
19
|
+
// return just the simple $base-size value if it's not a list
|
20
|
+
@return $base-size;
|
21
|
+
}
|
22
|
+
|
23
|
+
// if multiple base-sizes are passed in as a list
|
24
|
+
// and multiple ratios are passed in as a list
|
25
|
+
// calculate values in using each base-size / ratio combination
|
26
|
+
@if type-of($base-size) == "list" and type-of($ratio) == "list" {
|
27
|
+
@if unit(ms-multibase-multiratio($multiple, $base-size, $ratio)) == "px" and $round-pixels == true {
|
28
|
+
@return round(ms-multibase-multiratio($multiple, $base-size, $ratio));
|
29
|
+
}
|
30
|
+
@return ms-multibase-multiratio($multiple, $base-size, $ratio);
|
31
|
+
}
|
32
|
+
|
33
|
+
// if multiple base-sizes are passed in as a list
|
34
|
+
// calculate values in using each base-size
|
35
|
+
@if type-of($base-size) == "list" and type-of($ratio) == "number" {
|
36
|
+
@if unit(ms-multibase($multiple, $base-size, $ratio)) == "px" and $round-pixels == true {
|
37
|
+
@return round(ms-multibase($multiple, $base-size, $ratio));
|
38
|
+
}
|
39
|
+
@return ms-multibase($multiple, $base-size, $ratio);
|
40
|
+
}
|
41
|
+
|
42
|
+
// if multiple ratios are passed in as a list
|
43
|
+
// calculate values in using each ratio
|
44
|
+
@if type-of($base-size) == "number" and type-of($ratio) == "list" {
|
45
|
+
@if unit(ms-multiratio($multiple, $base-size, $ratio)) == "px" and $round-pixels == true {
|
46
|
+
@return round(ms-multiratio($multiple, $base-size, $ratio));
|
47
|
+
}
|
48
|
+
@return ms-multiratio($multiple, $base-size, $ratio);
|
49
|
+
}
|
50
|
+
|
51
|
+
// If there are no lists just run the simple function
|
52
|
+
@if unit(power($ratio, $multiple) * $base-size) == "px" and $round-pixels == true {
|
53
|
+
@return round(power($ratio, $multiple) * $base-size);
|
54
|
+
}
|
55
|
+
@return power($ratio, $multiple) * $base-size;
|
56
|
+
}
|
57
|
+
|
58
|
+
// calculate values in using each base-size / ratio combination
|
59
|
+
@function ms-multibase-multiratio($multiple, $base-size: $base-size, $ratio: $ratio) {
|
60
|
+
|
61
|
+
// start with an empty list to place all values in
|
62
|
+
$scale-values: ();
|
63
|
+
|
64
|
+
// make sure base sizes are in ascending order
|
65
|
+
$base-size: sort_list($base-size);
|
66
|
+
|
67
|
+
// take each base-size in turn
|
68
|
+
$k: 1;
|
69
|
+
@while $k <= length($base-size) {
|
70
|
+
|
71
|
+
// add each $base-size to the list except the first
|
72
|
+
@if $k > 1 {
|
73
|
+
$scale-values: append($scale-values, nth($base-size, $k));
|
74
|
+
}
|
75
|
+
|
76
|
+
// take each ratio in turn
|
77
|
+
$j: 1;
|
78
|
+
@while $j <= length($ratio) {
|
79
|
+
|
80
|
+
// reset $modular-scale for each set
|
81
|
+
$modular-scale: nth($base-size, $k);
|
82
|
+
|
83
|
+
// do the scale for each base-size using this ratio
|
84
|
+
@if $multiple > 0 {
|
85
|
+
|
86
|
+
// up $multiple times
|
87
|
+
// and add the result to $scale-values
|
88
|
+
@for $i from 1 through $multiple {
|
89
|
+
$modular-scale: power(nth($ratio, $j), $i) * nth($base-size, $k);
|
90
|
+
$scale-values: append($scale-values, $modular-scale);
|
91
|
+
}
|
92
|
+
|
93
|
+
// and down until the value is lower than the lowest $base-size
|
94
|
+
// and add the result to $scale-values
|
95
|
+
$i: -1;
|
96
|
+
$modular-scale: nth($base-size, $k);
|
97
|
+
@while $modular-scale >= nth($base-size, 1) {
|
98
|
+
$modular-scale: power(nth($ratio, $j), $i) * nth($base-size, $k);
|
99
|
+
$scale-values: append($scale-values, $modular-scale);
|
100
|
+
$i: $i - 1;
|
101
|
+
}
|
102
|
+
}
|
103
|
+
@if $multiple < 0 {
|
104
|
+
|
105
|
+
// do the scale down for each set to below 1px
|
106
|
+
$i: 0;
|
107
|
+
$modular-scale: nth($base-size, $k);
|
108
|
+
@while $i >= $multiple {
|
109
|
+
$modular-scale: power(nth($ratio, $j), $i) * nth($base-size, $k);
|
110
|
+
$scale-values: append($scale-values, $modular-scale);
|
111
|
+
$i: $i - 1;
|
112
|
+
}
|
113
|
+
}
|
114
|
+
$j: $j + 1;
|
115
|
+
}
|
116
|
+
$k: $k + 1;
|
117
|
+
}
|
118
|
+
|
119
|
+
// return trimmed and sorted final list
|
120
|
+
@return trim-sort($multiple, $scale-values, $base-size);
|
121
|
+
}
|
122
|
+
|
123
|
+
// calculate values in using each base-size
|
124
|
+
@function ms-multibase($multiple, $base-size: $base-size, $ratio: $ratio) {
|
125
|
+
|
126
|
+
// start with an empty list to place all values in
|
127
|
+
$scale-values: ();
|
128
|
+
|
129
|
+
// make sure base sizes are in ascending order
|
130
|
+
$base-size: sort_list($base-size);
|
131
|
+
|
132
|
+
// take each base-size in turn
|
133
|
+
$k: 1;
|
134
|
+
@while $k <= length($base-size) {
|
135
|
+
|
136
|
+
// add each $base-size to the list except the first
|
137
|
+
@if $k > 1 {
|
138
|
+
$scale-values: append($scale-values, nth($base-size, $k));
|
139
|
+
}
|
140
|
+
|
141
|
+
// reset $modular-scale for each set
|
142
|
+
$modular-scale: nth($base-size, $k);
|
143
|
+
|
144
|
+
// do the scale for each base-size using this ratio
|
145
|
+
@if $multiple > 0 {
|
146
|
+
|
147
|
+
// up $multiple times
|
148
|
+
// and add the result to $scale-values
|
149
|
+
@for $i from 1 through $multiple {
|
150
|
+
$modular-scale: power($ratio, $i) * nth($base-size, $k);
|
151
|
+
$scale-values: append($scale-values, $modular-scale);
|
152
|
+
}
|
153
|
+
|
154
|
+
// and down until the value is lower than the lowest $base-size
|
155
|
+
// and add the result to $scale-values
|
156
|
+
$i: -1;
|
157
|
+
$modular-scale: nth($base-size, $k);
|
158
|
+
@while $modular-scale >= nth($base-size, 1) {
|
159
|
+
$modular-scale: power($ratio, $i) * nth($base-size, $k);
|
160
|
+
$scale-values: append($scale-values, $modular-scale);
|
161
|
+
$i: $i - 1;
|
162
|
+
}
|
163
|
+
}
|
164
|
+
@if $multiple < 0 {
|
165
|
+
|
166
|
+
// do the scale down for each set to below 1px
|
167
|
+
$i: 0;
|
168
|
+
$modular-scale: nth($base-size, $k);
|
169
|
+
@while $i >= $multiple {
|
170
|
+
$modular-scale: power($ratio, $i) * nth($base-size, $k);
|
171
|
+
$scale-values: append($scale-values, $modular-scale);
|
172
|
+
$i: $i - 1;
|
173
|
+
}
|
174
|
+
}
|
175
|
+
$k: $k + 1;
|
176
|
+
}
|
177
|
+
|
178
|
+
// return trimmed and sorted final list
|
179
|
+
@return trim-sort($multiple, $scale-values, $base-size);
|
180
|
+
}
|
181
|
+
|
182
|
+
// calculate values in using each ratio
|
183
|
+
@function ms-multiratio($multiple, $base-size: $base-size, $ratio: $ratio) {
|
184
|
+
|
185
|
+
// start with an empty list to place all values in
|
186
|
+
$scale-values: ();
|
187
|
+
|
188
|
+
// If $multiple is a positive integer (up the scale)
|
189
|
+
@if $multiple > 0 {
|
190
|
+
|
191
|
+
// take each ratio in turn
|
192
|
+
$j: 1;
|
193
|
+
@while $j <= length($ratio) {
|
194
|
+
|
195
|
+
// reset $modular-scale for each set
|
196
|
+
$modular-scale: $base-size;
|
197
|
+
|
198
|
+
// do the scale using this ratio thru the multiple, and add the result to $scale-values
|
199
|
+
@for $i from 1 through $multiple {
|
200
|
+
$modular-scale: power(nth($ratio, $j), $i) * $base-size;
|
201
|
+
$scale-values: append($scale-values, $modular-scale);
|
202
|
+
}
|
203
|
+
$j: $j + 1;
|
204
|
+
}
|
205
|
+
|
206
|
+
// sort acsending
|
207
|
+
$scale-values: sort_list($scale-values);
|
208
|
+
|
209
|
+
// return the final value using the laced list
|
210
|
+
@return nth($scale-values, $multiple);
|
211
|
+
}
|
212
|
+
|
213
|
+
// If $multiple is a negative integer (down the scale)
|
214
|
+
@if $multiple < 0 {
|
215
|
+
|
216
|
+
// take each ratio in turn
|
217
|
+
$j: 1;
|
218
|
+
@while $j <= length($ratio) {
|
219
|
+
|
220
|
+
// reset $modular-scale for each set
|
221
|
+
$modular-scale: $base-size;
|
222
|
+
|
223
|
+
// do the scale using this ratio thru the multiple, and add the result to $scale-values
|
224
|
+
@for $i from 1 through $multiple * -1 {
|
225
|
+
$modular-scale: power(nth($ratio, $j), -$i) * $base-size;
|
226
|
+
$scale-values: append($scale-values, $modular-scale);
|
227
|
+
}
|
228
|
+
$j: $j + 1;
|
229
|
+
}
|
230
|
+
|
231
|
+
// sort decending
|
232
|
+
$scale-values: reverse_list(sort_list($scale-values));
|
233
|
+
|
234
|
+
// return the final value using the laced list
|
235
|
+
@return nth($scale-values, $multiple * -1);
|
236
|
+
}
|
237
|
+
}
|
238
|
+
|
239
|
+
// trim and sort the final list
|
240
|
+
@function trim-sort($multiple, $scale-values: $scale-values, $base-size: $base-size) {
|
241
|
+
@if $multiple > 0 {
|
242
|
+
|
243
|
+
// trim list so we can count from the lowest $base-size
|
244
|
+
$scale-values: trim_list($scale-values, nth($base-size, 1), true);
|
245
|
+
|
246
|
+
// sort acsending
|
247
|
+
$scale-values: sort_list($scale-values);
|
248
|
+
|
249
|
+
// return the final value using the laced list
|
250
|
+
@return nth($scale-values, $multiple);
|
251
|
+
}
|
252
|
+
@else {
|
253
|
+
|
254
|
+
// trim list so we can count from the lowest $base-size
|
255
|
+
$scale-values: trim_list($scale-values, nth($base-size, 1), false);
|
256
|
+
|
257
|
+
// sort acsending
|
258
|
+
$scale-values: reverse_list(sort_list($scale-values));
|
259
|
+
|
260
|
+
// return the final value using the laced list
|
261
|
+
@return nth($scale-values, -$multiple);
|
262
|
+
}
|
263
|
+
}
|
264
|
+
|
265
|
+
/////////////////////////////////////////////////////////////////////////
|
266
|
+
|
267
|
+
// alias for golden_ratio()
|
268
|
+
@function golden() {
|
269
|
+
@return golden_ratio();
|
270
|
+
}
|
271
|
+
|
272
|
+
// Shortcut
|
273
|
+
@function ms($multiple, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels) {
|
274
|
+
// Return the value from the Modular Scale function
|
275
|
+
@return modular-scale($multiple, $base-size, $ratio, $round-pixels);
|
276
|
+
}
|
277
|
+
|
278
|
+
// Write Modular Scale List
|
279
|
+
@function modular-scale-list($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels) {
|
280
|
+
$ms-list: unquote("MS-LIST:");
|
281
|
+
@for $i from $start through $finish {
|
282
|
+
$ms-list: append($ms-list, ms($i, $base-size, $ratio, $round-pixels));
|
283
|
+
}
|
284
|
+
@return $ms-list;
|
285
|
+
}
|
286
|
+
|
287
|
+
@function ms-list($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels) {
|
288
|
+
@return modular-scale-list($start, $finish, $base-size, $ratio, $round-pixels);
|
289
|
+
}
|
290
|
+
|
291
|
+
@mixin modular-scale-list($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels) {
|
292
|
+
@debug modular-scale-list($start, $finish, $base-size, $ratio, $round-pixels);
|
293
|
+
}
|
294
|
+
|
295
|
+
@mixin ms-list($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels) {
|
296
|
+
@debug modular-scale-list($start, $finish, $base-size, $ratio, $round-pixels);
|
297
|
+
}
|
298
|
+
|
299
|
+
@mixin modular-scale-list-output($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels) {
|
300
|
+
MODULAR-SCALE-LIST {
|
301
|
+
ms-list: modular-scale-list($start, $finish, $base-size, $ratio, $round-pixels);
|
302
|
+
}
|
303
|
+
}
|
304
|
+
|
305
|
+
@mixin ms-list-output($start: 0, $finish: 20, $base-size: $base-size, $ratio: $ratio, $round-pixels: $round-pixels) {
|
306
|
+
@include modular-scale-list-output($start, $finish, $base-size, $ratio, $round-pixels);
|
307
|
+
}
|
308
|
+
|
309
|
+
// Other libraries can easily query if this function is avalible
|
310
|
+
$modular-scale-loaded: true;
|