rapido-css 0.1.1 → 0.1.2
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.
- data/stylesheets/_default-styles.scss +352 -352
- data/stylesheets/_functions.scss +77 -50
- data/stylesheets/_susy.scss +15 -12
- data/stylesheets/components/_alerts.scss +21 -21
- data/stylesheets/components/_breadcrumbs.scss +15 -15
- data/stylesheets/components/_button-groups.scss +51 -53
- data/stylesheets/components/_buttons.scss +94 -97
- data/stylesheets/components/_captions.scss +45 -45
- data/stylesheets/components/_close.scss +27 -27
- data/stylesheets/components/_dropdowns.scss +121 -121
- data/stylesheets/components/_forms.scss +246 -248
- data/stylesheets/components/_grids.scss +35 -35
- data/stylesheets/components/_labels.scss +38 -38
- data/stylesheets/components/_modals.scss +242 -248
- data/stylesheets/components/_navs.scss +86 -91
- data/stylesheets/components/_pager.scss +53 -53
- data/stylesheets/components/_pagination.scss +83 -85
- data/stylesheets/components/_responsive-navs.scss +84 -84
- data/stylesheets/components/_sliders.scss +54 -58
- data/stylesheets/components/_tables.scss +69 -74
- data/stylesheets/components/_tabs.scss +54 -54
- data/stylesheets/components/_type.scss +134 -140
- data/stylesheets/{_rapido.scss → rapido.scss} +0 -8
- data/stylesheets/settings/_base.scss +23 -23
- data/stylesheets/settings/_colors.scss +13 -13
- data/stylesheets/settings/_components.scss +43 -42
- data/stylesheets/settings/_dimensions.scss +91 -91
- data/stylesheets/settings/_effects.scss +28 -14
- data/stylesheets/susy/{_susy_background.scss → _background.scss} +0 -0
- data/stylesheets/susy/{_susy_functions.scss → _functions.scss} +0 -0
- data/stylesheets/susy/{_susy_grid.scss → _grid.scss} +0 -0
- data/stylesheets/susy/{_susy_isolation.scss → _isolation.scss} +1 -0
- data/stylesheets/susy/{_susy_margin.scss → _margin.scss} +0 -0
- data/stylesheets/susy/{_susy_media.scss → _media.scss} +0 -0
- data/stylesheets/susy/{_susy_padding.scss → _padding.scss} +0 -0
- data/stylesheets/susy/{_susy_settings.scss → _settings.scss} +0 -0
- data/stylesheets/susy/{_susy_support.scss → _support.scss} +0 -0
- data/stylesheets/susy/{_susy_units.scss → _units.scss} +0 -0
- data/stylesheets/utilities/_animations.scss +638 -597
- data/stylesheets/utilities/_debug.scss +43 -43
- data/stylesheets/utilities/_helper-classes.scss +70 -54
- data/stylesheets/utilities/_icon-fonts.scss +90 -90
- data/stylesheets/utilities/_mixins.scss +390 -357
- metadata +20 -17
- checksums.yaml +0 -15
- data/stylesheets/config.rb +0 -8
|
@@ -1,38 +1,37 @@
|
|
|
1
|
-
/*
|
|
1
|
+
/*
|
|
2
2
|
|
|
3
3
|
Type
|
|
4
4
|
|
|
5
5
|
Styleguide 19
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
*/
|
|
8
8
|
|
|
9
9
|
// Base
|
|
10
|
-
// --------------------------------------------------------------------------------------------------------------------
|
|
11
10
|
|
|
12
11
|
*, *:before, *:after {
|
|
13
|
-
|
|
14
|
-
|
|
12
|
+
@include box-sizing(border-box);
|
|
13
|
+
outline: none;
|
|
15
14
|
}
|
|
16
15
|
|
|
17
16
|
html {
|
|
18
|
-
|
|
17
|
+
@if $responsive-font-size {
|
|
19
18
|
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
19
|
+
@each $step in $responsive-font-size {
|
|
20
|
+
@include media(nth($step, 1)) {
|
|
21
|
+
font-size: 100% * nth($step, 2) / 16px;
|
|
22
|
+
}
|
|
23
|
+
}
|
|
25
24
|
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
25
|
+
} @else {
|
|
26
|
+
font-size: 100% * $base-font-size / 16px;
|
|
27
|
+
}
|
|
29
28
|
}
|
|
30
29
|
|
|
31
30
|
body {
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
31
|
+
@include adjust-font-size-to($base-font-size);
|
|
32
|
+
margin: 0;
|
|
33
|
+
font-family: $base-font-family;
|
|
34
|
+
color: $text-color;
|
|
36
35
|
}
|
|
37
36
|
|
|
38
37
|
img {max-width: 100%;}
|
|
@@ -40,22 +39,21 @@ img {max-width: 100%;}
|
|
|
40
39
|
a, button, textarea, input { outline: none; }
|
|
41
40
|
|
|
42
41
|
// Links
|
|
43
|
-
// --------------------------------------------------------------------------------------------------------------------
|
|
44
42
|
|
|
45
43
|
a {
|
|
46
|
-
|
|
47
|
-
|
|
44
|
+
color: $link-color;
|
|
45
|
+
text-decoration: none;
|
|
48
46
|
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
47
|
+
&:hover,
|
|
48
|
+
&:focus {
|
|
49
|
+
color: $link-color-hover;
|
|
50
|
+
text-decoration: none;
|
|
51
|
+
}
|
|
54
52
|
|
|
55
53
|
}
|
|
56
54
|
|
|
57
55
|
|
|
58
|
-
/*
|
|
56
|
+
/*
|
|
59
57
|
|
|
60
58
|
Body text
|
|
61
59
|
|
|
@@ -66,13 +64,12 @@ Markup:
|
|
|
66
64
|
|
|
67
65
|
Styleguide 19.1
|
|
68
66
|
|
|
69
|
-
|
|
67
|
+
*/
|
|
70
68
|
|
|
71
69
|
|
|
72
70
|
p { margin: 0 0 rhythm(1);}
|
|
73
71
|
|
|
74
72
|
// Emphasis & misc
|
|
75
|
-
// --------------------------------------------------------------------------------------------------------------------
|
|
76
73
|
|
|
77
74
|
small { @include adjust-font-size-to($milli-size); }
|
|
78
75
|
|
|
@@ -80,7 +77,7 @@ strong { font-weight: bold; }
|
|
|
80
77
|
em { font-style: italic; }
|
|
81
78
|
cite { font-style: normal; }
|
|
82
79
|
|
|
83
|
-
/*
|
|
80
|
+
/*
|
|
84
81
|
|
|
85
82
|
Headings
|
|
86
83
|
|
|
@@ -94,49 +91,49 @@ Markup:
|
|
|
94
91
|
|
|
95
92
|
Styleguide 19.2
|
|
96
93
|
|
|
97
|
-
|
|
94
|
+
*/
|
|
98
95
|
|
|
99
96
|
h1, h2, h3, h4, h5, h6 {
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
97
|
+
margin: 0 0 rhythm();
|
|
98
|
+
text-rendering: optimizelegibility;
|
|
99
|
+
font-family: $titles-font-family;
|
|
100
|
+
color: $title-color;
|
|
101
|
+
|
|
102
|
+
small {
|
|
103
|
+
font-weight: normal;
|
|
104
|
+
line-height: rhythm();
|
|
105
|
+
color: $grayLight;
|
|
106
|
+
}
|
|
110
107
|
}
|
|
111
108
|
|
|
112
109
|
h1, .h1 {
|
|
113
|
-
|
|
114
|
-
|
|
110
|
+
@include adjust-font-size-to($h1-size, $h1-line-height);
|
|
111
|
+
@extend %h1 !optional;
|
|
115
112
|
}
|
|
116
113
|
|
|
117
114
|
h2, .h2 {
|
|
118
|
-
|
|
119
|
-
|
|
115
|
+
@include adjust-font-size-to($h2-size, $h2-line-height);
|
|
116
|
+
@extend %h2 !optional;
|
|
120
117
|
}
|
|
121
118
|
|
|
122
119
|
h3, .h3 {
|
|
123
|
-
|
|
124
|
-
|
|
120
|
+
@include adjust-font-size-to($h3-size, $h3-line-height);
|
|
121
|
+
@extend %h3 !optional;
|
|
125
122
|
}
|
|
126
123
|
|
|
127
124
|
h4, .h4 {
|
|
128
|
-
|
|
129
|
-
|
|
125
|
+
@include adjust-font-size-to($h4-size, $h4-line-height);
|
|
126
|
+
@extend %h4 !optional;
|
|
130
127
|
}
|
|
131
128
|
|
|
132
129
|
h5, .h5 {
|
|
133
|
-
|
|
134
|
-
|
|
130
|
+
@include adjust-font-size-to($h5-size, $h5-line-height);
|
|
131
|
+
@extend %h5 !optional;
|
|
135
132
|
}
|
|
136
133
|
|
|
137
134
|
h6, .h6 {
|
|
138
|
-
|
|
139
|
-
|
|
135
|
+
@include adjust-font-size-to($h6-size, $h6-line-height);
|
|
136
|
+
@extend %h6 !optional;
|
|
140
137
|
}
|
|
141
138
|
|
|
142
139
|
h1 small { @include adjust-font-size-to($h3-size); }
|
|
@@ -144,7 +141,7 @@ h2 small { @include adjust-font-size-to($h4-size); }
|
|
|
144
141
|
h3 small { @include adjust-font-size-to($h5-size); }
|
|
145
142
|
h4 small { @include adjust-font-size-to($h6-size); }
|
|
146
143
|
|
|
147
|
-
/*
|
|
144
|
+
/*
|
|
148
145
|
|
|
149
146
|
Lists
|
|
150
147
|
|
|
@@ -162,44 +159,44 @@ Markup:
|
|
|
162
159
|
|
|
163
160
|
Styleguide 19.3
|
|
164
161
|
|
|
165
|
-
|
|
162
|
+
*/
|
|
166
163
|
|
|
167
164
|
.list_style_none, .list-style-none {
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
165
|
+
padding-left: 0;
|
|
166
|
+
margin-left: 0;
|
|
167
|
+
list-style: none;
|
|
171
168
|
}
|
|
172
169
|
|
|
173
170
|
// Unordered and Ordered lists
|
|
174
171
|
|
|
175
172
|
ul, ol {
|
|
176
|
-
|
|
177
|
-
|
|
173
|
+
padding: 0;
|
|
174
|
+
margin: 0 0 rhythm(1) 25px;
|
|
178
175
|
}
|
|
179
176
|
|
|
180
177
|
ul ul,
|
|
181
178
|
ul ol,
|
|
182
179
|
ol ol,
|
|
183
180
|
ol ul {
|
|
184
|
-
|
|
181
|
+
margin-bottom: 0;
|
|
185
182
|
}
|
|
186
183
|
|
|
187
184
|
ul.unstyled,
|
|
188
185
|
ol.unstyled {
|
|
189
|
-
|
|
190
|
-
|
|
186
|
+
margin-left: 0;
|
|
187
|
+
list-style: none;
|
|
191
188
|
}
|
|
192
189
|
|
|
193
190
|
ul.inline,
|
|
194
191
|
ol.inline {
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
192
|
+
margin-left: 0;
|
|
193
|
+
list-style: none;
|
|
194
|
+
> li {
|
|
195
|
+
@include inline-block();
|
|
196
|
+
}
|
|
200
197
|
}
|
|
201
198
|
|
|
202
|
-
/*
|
|
199
|
+
/*
|
|
203
200
|
|
|
204
201
|
Definition lists
|
|
205
202
|
|
|
@@ -211,14 +208,14 @@ Markup:
|
|
|
211
208
|
|
|
212
209
|
Styleguide 19.4
|
|
213
210
|
|
|
214
|
-
|
|
211
|
+
*/
|
|
215
212
|
|
|
216
|
-
dl
|
|
217
|
-
dt, dd
|
|
218
|
-
dt
|
|
219
|
-
dd
|
|
213
|
+
dl { margin-bottom: rhythm(1); }
|
|
214
|
+
dt, dd { }
|
|
215
|
+
dt { font-weight: bold; }
|
|
216
|
+
dd { margin-left: 0; }
|
|
220
217
|
|
|
221
|
-
/*
|
|
218
|
+
/*
|
|
222
219
|
|
|
223
220
|
Horizontal definition list
|
|
224
221
|
|
|
@@ -230,22 +227,22 @@ Markup:
|
|
|
230
227
|
|
|
231
228
|
Styleguide 19.4.1
|
|
232
229
|
|
|
233
|
-
|
|
230
|
+
*/
|
|
234
231
|
|
|
235
232
|
.dl-horizontal {
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
233
|
+
@extend .clearfix;
|
|
234
|
+
dt {
|
|
235
|
+
@include text-overflow();
|
|
236
|
+
clear: left;
|
|
237
|
+
float: left;
|
|
238
|
+
text-align: right;
|
|
239
|
+
width: em($horizontal-offset) - 20;
|
|
240
|
+
}
|
|
241
|
+
|
|
242
|
+
dd { padding-left: em($horizontal-offset); }
|
|
246
243
|
}
|
|
247
244
|
|
|
248
|
-
/*
|
|
245
|
+
/*
|
|
249
246
|
|
|
250
247
|
Horizontal line
|
|
251
248
|
|
|
@@ -253,28 +250,27 @@ Markup: <hr />
|
|
|
253
250
|
|
|
254
251
|
Styleguide 19.5
|
|
255
252
|
|
|
256
|
-
|
|
253
|
+
*/
|
|
257
254
|
|
|
258
255
|
hr {
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
256
|
+
margin: rhythm(1) 0;
|
|
257
|
+
border: 0;
|
|
258
|
+
border-bottom: 1px solid $gray;
|
|
262
259
|
}
|
|
263
260
|
|
|
264
261
|
// Abbreviations and acronyms
|
|
265
|
-
// --------------------------------------------------------------------------------------------------------------------
|
|
266
262
|
|
|
267
263
|
abbr[title],
|
|
268
264
|
abbr[data-original-title] {
|
|
269
|
-
|
|
270
|
-
|
|
265
|
+
cursor: help;
|
|
266
|
+
border-bottom: 1px dotted $grayLight;
|
|
271
267
|
}
|
|
272
268
|
abbr.initialism {
|
|
273
|
-
|
|
274
|
-
|
|
269
|
+
font-size: 90%;
|
|
270
|
+
text-transform: uppercase;
|
|
275
271
|
}
|
|
276
272
|
|
|
277
|
-
/*
|
|
273
|
+
/*
|
|
278
274
|
|
|
279
275
|
Blockquotes
|
|
280
276
|
|
|
@@ -286,62 +282,60 @@ Markup:
|
|
|
286
282
|
|
|
287
283
|
Styleguide 19.6
|
|
288
284
|
|
|
289
|
-
|
|
285
|
+
*/
|
|
290
286
|
|
|
291
287
|
blockquote {
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
288
|
+
padding: 0 0 0 rhythm(1);
|
|
289
|
+
margin: 0;
|
|
290
|
+
margin: 0 0 rhythm(1);
|
|
291
|
+
border-left: 5px solid $grayLighter;
|
|
292
|
+
|
|
293
|
+
p {
|
|
294
|
+
margin-bottom: 0;
|
|
295
|
+
font-weight: 300;
|
|
296
|
+
}
|
|
297
|
+
|
|
298
|
+
small, cite {
|
|
299
|
+
display: block;
|
|
300
|
+
color: $grayLight;
|
|
301
|
+
&:before {
|
|
302
|
+
content: '\2014 \00A0';
|
|
303
|
+
}
|
|
304
|
+
}
|
|
305
|
+
|
|
306
|
+
&.pull-right {
|
|
307
|
+
float: right;
|
|
308
|
+
padding-right: 15px;
|
|
309
|
+
padding-left: 0;
|
|
310
|
+
border-right: 5px solid $grayLighter;
|
|
311
|
+
border-left: 0;
|
|
312
|
+
|
|
313
|
+
p,
|
|
314
|
+
small {
|
|
315
|
+
text-align: right;
|
|
316
|
+
}
|
|
317
|
+
|
|
318
|
+
small {
|
|
319
|
+
&:before { content: ''; }
|
|
320
|
+
&:after { content: '\00A0 \2014'; }
|
|
321
|
+
}
|
|
322
|
+
}
|
|
327
323
|
}
|
|
328
324
|
|
|
329
325
|
// Quotes
|
|
330
|
-
// --------------------------------------------------------------------------------------------------------------------
|
|
331
326
|
|
|
332
327
|
q:before,
|
|
333
328
|
q:after,
|
|
334
329
|
blockquote:before,
|
|
335
330
|
blockquote:after {
|
|
336
|
-
|
|
331
|
+
content: "";
|
|
337
332
|
}
|
|
338
333
|
|
|
339
334
|
// Addresses
|
|
340
|
-
// --------------------------------------------------------------------------------------------------------------------
|
|
341
335
|
|
|
342
336
|
address {
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
337
|
+
display: block;
|
|
338
|
+
margin-bottom: rhythm(1);
|
|
339
|
+
font-style: normal;
|
|
340
|
+
line-height: rhythm(1);
|
|
347
341
|
}
|
|
@@ -1,18 +1,14 @@
|
|
|
1
1
|
// Rapido Css | http://git.io/rapido
|
|
2
|
-
// ====================================================================================================================
|
|
3
2
|
|
|
4
3
|
// Normalize
|
|
5
|
-
// --------------------------------------------------------------------------------------------------------------------
|
|
6
4
|
|
|
7
5
|
@import "normalize";
|
|
8
6
|
|
|
9
7
|
// Functions
|
|
10
|
-
// --------------------------------------------------------------------------------------------------------------------
|
|
11
8
|
|
|
12
9
|
@import "functions";
|
|
13
10
|
|
|
14
11
|
// Settings
|
|
15
|
-
// --------------------------------------------------------------------------------------------------------------------
|
|
16
12
|
|
|
17
13
|
@import "settings/base";
|
|
18
14
|
@import "settings/colors";
|
|
@@ -21,13 +17,11 @@
|
|
|
21
17
|
@import "settings/effects";
|
|
22
18
|
|
|
23
19
|
// External Frameworks
|
|
24
|
-
// --------------------------------------------------------------------------------------------------------------------
|
|
25
20
|
|
|
26
21
|
@import "compass";
|
|
27
22
|
@import "susy";
|
|
28
23
|
|
|
29
24
|
// Utilities
|
|
30
|
-
// --------------------------------------------------------------------------------------------------------------------
|
|
31
25
|
|
|
32
26
|
@import "utilities/mixins";
|
|
33
27
|
@import "utilities/helper-classes";
|
|
@@ -36,7 +30,6 @@
|
|
|
36
30
|
@import "utilities/icon-fonts";
|
|
37
31
|
|
|
38
32
|
// Components
|
|
39
|
-
// --------------------------------------------------------------------------------------------------------------------
|
|
40
33
|
|
|
41
34
|
@import "components/type";
|
|
42
35
|
@import "components/forms";
|
|
@@ -63,6 +56,5 @@
|
|
|
63
56
|
@import "components/tabs";
|
|
64
57
|
|
|
65
58
|
// Default styles
|
|
66
|
-
// --------------------------------------------------------------------------------------------------------------------
|
|
67
59
|
|
|
68
60
|
@import "default-styles";
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
/*
|
|
1
|
+
/*
|
|
2
2
|
|
|
3
3
|
Base Settings
|
|
4
4
|
|
|
5
5
|
Styleguide 25
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
*/
|
|
8
8
|
|
|
9
|
-
/*
|
|
9
|
+
/*
|
|
10
10
|
|
|
11
11
|
Debug Mode
|
|
12
12
|
|
|
@@ -15,13 +15,13 @@ Debug Mode
|
|
|
15
15
|
|
|
16
16
|
Styleguide 25.1
|
|
17
17
|
|
|
18
|
-
|
|
18
|
+
*/
|
|
19
19
|
|
|
20
|
-
$debug-mode:
|
|
21
|
-
$default-styles:
|
|
20
|
+
$debug-mode: false !default;
|
|
21
|
+
$default-styles: true !default;
|
|
22
22
|
|
|
23
23
|
|
|
24
|
-
/*
|
|
24
|
+
/*
|
|
25
25
|
|
|
26
26
|
Text body size
|
|
27
27
|
|
|
@@ -36,16 +36,16 @@ on `palm` (smartphone) change the base size to 16px, it will be automatically co
|
|
|
36
36
|
|
|
37
37
|
Styleguide 25.2
|
|
38
38
|
|
|
39
|
-
|
|
39
|
+
*/
|
|
40
40
|
|
|
41
|
-
$base-font-size:
|
|
42
|
-
$base-line-height:
|
|
43
|
-
$round-to-nearest-half-line:
|
|
41
|
+
$base-font-size: 14px !default;
|
|
42
|
+
$base-line-height: $base-font-size * 1.5 !default;
|
|
43
|
+
$round-to-nearest-half-line: true !default;
|
|
44
44
|
|
|
45
|
-
$responsive-font-size:
|
|
45
|
+
$responsive-font-size: lap-and-up $base-font-size, palm 16px !default;
|
|
46
46
|
|
|
47
47
|
|
|
48
|
-
/*
|
|
48
|
+
/*
|
|
49
49
|
|
|
50
50
|
Font families
|
|
51
51
|
|
|
@@ -58,28 +58,28 @@ Font families
|
|
|
58
58
|
|
|
59
59
|
Styleguide 25.3
|
|
60
60
|
|
|
61
|
-
|
|
61
|
+
*/
|
|
62
62
|
|
|
63
|
-
$font-sans:
|
|
64
|
-
$font-serif:
|
|
65
|
-
$font-mono:
|
|
63
|
+
$font-sans: "Helvetica Neue", Helvetica, Arial, sans-serif !default;
|
|
64
|
+
$font-serif: Georgia, "Times New Roman", Times, serif !default;
|
|
65
|
+
$font-mono: Monaco, Menlo, Consolas, "Courier New", monospace !default;
|
|
66
66
|
|
|
67
|
-
$base-font-family:
|
|
68
|
-
$titles-font-family:
|
|
67
|
+
$base-font-family: $font-sans !default;
|
|
68
|
+
$titles-font-family: $font-sans !default;
|
|
69
69
|
|
|
70
70
|
|
|
71
|
-
/*
|
|
71
|
+
/*
|
|
72
72
|
|
|
73
73
|
em()
|
|
74
74
|
|
|
75
75
|
To convert `PX` to `EM` using the `$base-font-size` as font size.
|
|
76
76
|
|
|
77
|
-
|
|
77
|
+
width: em(20px);
|
|
78
78
|
|
|
79
79
|
Styleguide 24.1
|
|
80
80
|
|
|
81
|
-
|
|
81
|
+
*/
|
|
82
82
|
|
|
83
83
|
@function em($to-size, $from-size: $base-font-size) {
|
|
84
|
-
|
|
84
|
+
@return ($to-size / $from-size) + 0em;
|
|
85
85
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/*
|
|
1
|
+
/*
|
|
2
2
|
|
|
3
3
|
Base Colors
|
|
4
4
|
|
|
@@ -14,17 +14,17 @@ Used for scaffolding
|
|
|
14
14
|
|
|
15
15
|
Styleguide 26
|
|
16
16
|
|
|
17
|
-
|
|
17
|
+
*/
|
|
18
18
|
|
|
19
|
-
$black:
|
|
20
|
-
$grayDarker:
|
|
21
|
-
$grayDark:
|
|
22
|
-
$gray:
|
|
23
|
-
$grayLight:
|
|
24
|
-
$grayLighter:
|
|
25
|
-
$white:
|
|
19
|
+
$black: #000;
|
|
20
|
+
$grayDarker: lighten($black, 15);
|
|
21
|
+
$grayDark: lighten($black, 30);
|
|
22
|
+
$gray: lighten($black, 60);
|
|
23
|
+
$grayLight: lighten($black, 85);
|
|
24
|
+
$grayLighter: lighten($black, 95);
|
|
25
|
+
$white: lighten($black, 100);
|
|
26
26
|
|
|
27
|
-
/*
|
|
27
|
+
/*
|
|
28
28
|
|
|
29
29
|
Default colors
|
|
30
30
|
|
|
@@ -35,10 +35,10 @@ Default colors
|
|
|
35
35
|
|
|
36
36
|
Styleguide 26.1
|
|
37
37
|
|
|
38
|
-
|
|
38
|
+
*/
|
|
39
39
|
|
|
40
|
-
$text-color:
|
|
41
|
-
$title-color:
|
|
40
|
+
$text-color: #333 !default;
|
|
41
|
+
$title-color: #333 !default;
|
|
42
42
|
|
|
43
43
|
$link-color: #0066cc !default;
|
|
44
44
|
$link-color-hover: darken($link-color, 10) !default;
|