rapido-css 0.1.1 → 0.1.2
Sign up to get free protection for your applications and to get access to all the features.
- 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;
|