shevy 2.0.0 → 2.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (27) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +5 -11
  3. data/bower.json +1 -1
  4. data/core/_shevy.scss +7 -9
  5. data/core/{_shevy_functions.scss → shevy/_functions.scss} +38 -3
  6. data/core/{_shevy_mixins.scss → shevy/_mixins.scss} +9 -8
  7. data/core/{_shevy_variables.scss → shevy/_variables.scss} +3 -1
  8. data/demo/css/style.css +136 -104
  9. data/demo/dist/style.css +136 -104
  10. data/demo/scss/style.scss +40 -35
  11. data/docs/assets/css/main.css +1 -0
  12. data/docs/assets/images/favicon.png +0 -0
  13. data/docs/assets/images/logo_full_compact.svg +1 -0
  14. data/docs/assets/images/logo_full_inline.svg +1 -0
  15. data/docs/assets/images/logo_light_compact.svg +1 -0
  16. data/docs/assets/images/logo_light_inline.svg +1 -0
  17. data/docs/assets/js/main.js +56 -0
  18. data/docs/assets/js/main.min.js +1 -0
  19. data/docs/assets/js/search.js +146 -0
  20. data/docs/assets/js/sidebar.js +163 -0
  21. data/docs/assets/js/vendor/fuse.min.js +20 -0
  22. data/docs/assets/js/vendor/jquery.min.js +4 -0
  23. data/docs/assets/js/vendor/prism.min.js +9 -0
  24. data/docs/index.html +163 -0
  25. data/lib/shevy/version.rb +1 -1
  26. data/package.json +7 -5
  27. metadata +19 -5
data/demo/dist/style.css CHANGED
@@ -57,31 +57,36 @@ h3 {
57
57
 
58
58
  h4 {
59
59
  font-size: 1.5em;
60
- line-height: 1;
60
+ line-height: 1.5em;
61
61
  margin-bottom: 1em;
62
62
  }
63
63
 
64
64
  h5 {
65
65
  font-size: 1.25em;
66
- line-height: 1.2;
66
+ line-height: 1.5em;
67
67
  margin-bottom: 1.2em;
68
68
  }
69
69
 
70
70
  h6 {
71
71
  font-size: 1em;
72
- line-height: 1.5;
72
+ line-height: 1.5em;
73
73
  margin-bottom: 1.5em;
74
74
  }
75
75
 
76
- p {
76
+ body {
77
77
  font-size: 1em;
78
- line-height: 1.5em;
79
- margin-bottom: 1.5em;
78
+ line-height: 1.5;
80
79
  }
81
80
 
82
- .shevy {
83
- background-image: url(http://basehold.it/i/24/);
81
+ p,
82
+ ol,
83
+ ul,
84
+ pre {
85
+ font-size: 1em;
86
+ line-height: 1.5;
87
+ margin-bottom: 1.5em;
84
88
  }
89
+
85
90
  .shevy h1 {
86
91
  font-size: 3em;
87
92
  line-height: 1.25;
@@ -99,287 +104,314 @@ p {
99
104
  }
100
105
  .shevy h4 {
101
106
  font-size: 1.5em;
102
- line-height: 1;
107
+ line-height: 1.5em;
103
108
  margin-bottom: 1em;
104
109
  }
105
110
  .shevy h5 {
106
111
  font-size: 1.25em;
107
- line-height: 1.2;
112
+ line-height: 1.5em;
108
113
  margin-bottom: 1.2em;
109
114
  }
110
115
  .shevy h6 {
111
116
  font-size: 1em;
112
- line-height: 1.5;
117
+ line-height: 1.5em;
113
118
  margin-bottom: 1.5em;
114
119
  }
115
- .shevy p {
120
+ .shevy body {
116
121
  font-size: 1em;
117
- line-height: 1.5em;
122
+ line-height: 1.5;
123
+ }
124
+ .shevy p,
125
+ .shevy ol,
126
+ .shevy ul,
127
+ .shevy pre {
128
+ font-size: 1em;
129
+ line-height: 1.5;
118
130
  margin-bottom: 1.5em;
119
131
  }
120
132
 
121
- .large {
122
- background-image: url(http://basehold.it/i/30/);
123
- }
124
133
  .large h1 {
125
134
  font-size: 90px;
126
135
  line-height: 105px;
127
- margin-bottom: 30px;
136
+ margin-bottom: 21px;
128
137
  }
129
138
  .large h2 {
130
139
  font-size: 75px;
131
140
  line-height: 90px;
132
- margin-bottom: 30px;
141
+ margin-bottom: 21px;
133
142
  }
134
143
  .large h3 {
135
144
  font-size: 60px;
136
145
  line-height: 75px;
137
- margin-bottom: 30px;
146
+ margin-bottom: 21px;
138
147
  }
139
148
  .large h4 {
140
149
  font-size: 45px;
141
150
  line-height: 60px;
142
- margin-bottom: 30px;
151
+ margin-bottom: 21px;
143
152
  }
144
153
  .large h5 {
145
154
  font-size: 30px;
146
155
  line-height: 30px;
147
- margin-bottom: 30px;
156
+ margin-bottom: 21px;
148
157
  }
149
158
  .large h6 {
150
159
  font-size: 15px;
151
160
  line-height: 30px;
152
- margin-bottom: 30px;
161
+ margin-bottom: 21px;
153
162
  }
154
- .large p {
163
+ .large body {
155
164
  font-size: 15px;
156
- line-height: 30px;
157
- margin-bottom: 30px;
165
+ line-height: 2;
166
+ }
167
+ .large p,
168
+ .large ol,
169
+ .large ul,
170
+ .large pre {
171
+ font-size: 15px;
172
+ line-height: 2;
173
+ margin-bottom: 21px;
158
174
  }
159
175
  .large h6 {
160
- /* If you're clever and look at this and notice it's different,
161
- let me tell you why. Shevy supports a half base-space so that large headings
162
- don't have obnoxiously big margins. When you're using basehold.it,
163
- it's nice to bump up a margin manually to get the text below back on the baseline. Kudos for finding this */
164
- margin-bottom: 45px;
176
+ margin-bottom: 31.5px;
165
177
  }
166
178
  @media only screen and (min-width: 478px) {
167
179
  .large h6 {
168
- margin-bottom: 30px;
180
+ margin-bottom: 21px;
169
181
  }
170
182
  }
171
183
 
172
- .responsive {
173
- background-image: url(http://basehold.it/i/21/);
174
- }
175
184
  .responsive h1 {
176
185
  font-size: 28px;
177
186
  line-height: 31.5px;
178
- margin-bottom: 21px;
187
+ margin-bottom: 17.85px;
179
188
  }
180
189
  .responsive h2 {
181
190
  font-size: 24.5px;
182
191
  line-height: 31.5px;
183
- margin-bottom: 21px;
192
+ margin-bottom: 17.85px;
184
193
  }
185
194
  .responsive h3 {
186
195
  font-size: 21px;
187
196
  line-height: 21px;
188
- margin-bottom: 21px;
197
+ margin-bottom: 17.85px;
189
198
  }
190
199
  .responsive h4 {
191
200
  font-size: 17.5px;
192
201
  line-height: 21px;
193
- margin-bottom: 21px;
202
+ margin-bottom: 17.85px;
194
203
  }
195
204
  .responsive h5 {
196
205
  font-size: 14px;
197
206
  line-height: 21px;
198
- margin-bottom: 21px;
207
+ margin-bottom: 17.85px;
199
208
  }
200
209
  .responsive h6 {
201
210
  font-size: 10.5px;
202
211
  line-height: 21px;
203
- margin-bottom: 21px;
212
+ margin-bottom: 17.85px;
204
213
  }
205
- .responsive p {
206
- font-size: 10.5px;
207
- line-height: 21px;
208
- margin-bottom: 21px;
214
+ .responsive body {
215
+ font-size: 14px;
216
+ line-height: 1.5;
217
+ }
218
+ .responsive p,
219
+ .responsive ol,
220
+ .responsive ul,
221
+ .responsive pre {
222
+ font-size: 14px;
223
+ line-height: 1.5;
224
+ margin-bottom: 17.85px;
209
225
  }
210
226
  @media only screen and (min-width: 520px) {
211
- .responsive {
212
- background-image: url(http://basehold.it/i/24/);
213
- }
214
227
  .responsive h1 {
215
228
  font-size: 32px;
216
229
  line-height: 36px;
217
- margin-bottom: 24px;
230
+ margin-bottom: 20.4px;
218
231
  }
219
232
  .responsive h2 {
220
233
  font-size: 28px;
221
234
  line-height: 36px;
222
- margin-bottom: 24px;
235
+ margin-bottom: 20.4px;
223
236
  }
224
237
  .responsive h3 {
225
238
  font-size: 24px;
226
239
  line-height: 24px;
227
- margin-bottom: 24px;
240
+ margin-bottom: 20.4px;
228
241
  }
229
242
  .responsive h4 {
230
243
  font-size: 20px;
231
244
  line-height: 24px;
232
- margin-bottom: 24px;
245
+ margin-bottom: 20.4px;
233
246
  }
234
247
  .responsive h5 {
235
248
  font-size: 16px;
236
249
  line-height: 24px;
237
- margin-bottom: 24px;
250
+ margin-bottom: 20.4px;
238
251
  }
239
252
  .responsive h6 {
240
253
  font-size: 12px;
241
254
  line-height: 24px;
242
- margin-bottom: 24px;
255
+ margin-bottom: 20.4px;
243
256
  }
244
- .responsive p {
245
- font-size: 12px;
246
- line-height: 24px;
247
- margin-bottom: 24px;
257
+ .responsive body {
258
+ font-size: 16px;
259
+ line-height: 1.5;
260
+ }
261
+ .responsive p,
262
+ .responsive ol,
263
+ .responsive ul,
264
+ .responsive pre {
265
+ font-size: 16px;
266
+ line-height: 1.5;
267
+ margin-bottom: 20.4px;
248
268
  }
249
269
  }
250
270
  @media only screen and (min-width: 769px) {
251
- .responsive {
252
- background-image: url(http://basehold.it/i/54/);
253
- }
254
271
  .responsive h1 {
255
272
  font-size: 3.75em;
256
- line-height: 1.35;
257
- margin-bottom: 0.9em;
273
+ line-height: 1.2;
274
+ margin-bottom: 0.51em;
258
275
  }
259
276
  .responsive h2 {
260
277
  font-size: 3.3em;
261
278
  line-height: 1.02273;
262
- margin-bottom: 1.02273em;
279
+ margin-bottom: 0.57955em;
263
280
  }
264
281
  .responsive h3 {
265
282
  font-size: 3em;
266
283
  line-height: 1.125;
267
- margin-bottom: 1.125em;
284
+ margin-bottom: 0.6375em;
268
285
  }
269
286
  .responsive h4 {
270
287
  font-size: 2.625em;
271
288
  line-height: 1.28571;
272
- margin-bottom: 1.28571em;
289
+ margin-bottom: 0.72857em;
273
290
  }
274
291
  .responsive h5 {
275
292
  font-size: 1.875em;
276
- line-height: 1.8;
277
- margin-bottom: 1.8em;
293
+ line-height: 2.25em;
294
+ margin-bottom: 1.02em;
278
295
  }
279
296
  .responsive h6 {
280
297
  font-size: 1.5em;
281
- line-height: 2.25;
282
- margin-bottom: 2.25em;
298
+ line-height: 2.25em;
299
+ margin-bottom: 1.275em;
283
300
  }
284
- .responsive p {
301
+ .responsive body {
285
302
  font-size: 1.5em;
286
- line-height: 2.25em;
287
- margin-bottom: 2.25em;
303
+ line-height: 1.5;
304
+ }
305
+ .responsive p,
306
+ .responsive ol,
307
+ .responsive ul,
308
+ .responsive pre {
309
+ font-size: 1.5em;
310
+ line-height: 1.5;
311
+ margin-bottom: 1.275em;
288
312
  }
289
313
  }
290
314
  @media only screen and (min-width: 1025px) {
291
- .responsive {
292
- background-image: url(http://basehold.it/i/54/);
293
- }
294
315
  .responsive h1 {
295
316
  font-size: 90px;
296
317
  line-height: 108px;
297
- margin-bottom: 54px;
318
+ margin-bottom: 45.9px;
298
319
  }
299
320
  .responsive h2 {
300
321
  font-size: 79.2px;
301
322
  line-height: 81px;
302
- margin-bottom: 54px;
323
+ margin-bottom: 45.9px;
303
324
  }
304
325
  .responsive h3 {
305
326
  font-size: 72px;
306
327
  line-height: 81px;
307
- margin-bottom: 54px;
328
+ margin-bottom: 45.9px;
308
329
  }
309
330
  .responsive h4 {
310
331
  font-size: 63px;
311
332
  line-height: 81px;
312
- margin-bottom: 54px;
333
+ margin-bottom: 45.9px;
313
334
  }
314
335
  .responsive h5 {
315
336
  font-size: 45px;
316
337
  line-height: 54px;
317
- margin-bottom: 54px;
338
+ margin-bottom: 45.9px;
318
339
  }
319
340
  .responsive h6 {
320
341
  font-size: 36px;
321
342
  line-height: 54px;
322
- margin-bottom: 54px;
343
+ margin-bottom: 45.9px;
323
344
  }
324
- .responsive p {
345
+ .responsive body {
325
346
  font-size: 36px;
326
- line-height: 54px;
327
- margin-bottom: 54px;
347
+ line-height: 1.5;
348
+ }
349
+ .responsive p,
350
+ .responsive ol,
351
+ .responsive ul,
352
+ .responsive pre {
353
+ font-size: 36px;
354
+ line-height: 1.5;
355
+ margin-bottom: 45.9px;
328
356
  }
329
357
  }
330
358
  @media only screen and (min-width: 1350px) {
331
- .responsive {
332
- background-image: url(http://basehold.it/i/72/);
333
- }
334
359
  .responsive h1 {
335
360
  font-size: 144px;
336
361
  line-height: 180px;
337
- margin-bottom: 72px;
362
+ margin-bottom: 61.2px;
338
363
  }
339
364
  .responsive h2 {
340
365
  font-size: 120px;
341
366
  line-height: 144px;
342
- margin-bottom: 72px;
367
+ margin-bottom: 61.2px;
343
368
  }
344
369
  .responsive h3 {
345
370
  font-size: 96px;
346
371
  line-height: 108px;
347
- margin-bottom: 72px;
372
+ margin-bottom: 61.2px;
348
373
  }
349
374
  .responsive h4 {
350
375
  font-size: 84px;
351
376
  line-height: 108px;
352
- margin-bottom: 72px;
377
+ margin-bottom: 61.2px;
353
378
  }
354
379
  .responsive h5 {
355
380
  font-size: 60px;
356
381
  line-height: 72px;
357
- margin-bottom: 72px;
382
+ margin-bottom: 61.2px;
358
383
  }
359
384
  .responsive h6 {
360
385
  font-size: 48px;
361
386
  line-height: 72px;
362
- margin-bottom: 72px;
387
+ margin-bottom: 61.2px;
363
388
  }
364
- .responsive p {
389
+ .responsive body {
365
390
  font-size: 48px;
366
- line-height: 72px;
367
- margin-bottom: 72px;
391
+ line-height: 1.5;
392
+ }
393
+ .responsive p,
394
+ .responsive ol,
395
+ .responsive ul,
396
+ .responsive pre {
397
+ font-size: 48px;
398
+ line-height: 1.5;
399
+ margin-bottom: 61.2px;
368
400
  }
369
401
  }
370
402
  @media only screen and (min-width: 769px) {
371
403
  .responsive p:first-child {
372
- margin-bottom: 1.125em;
404
+ margin-bottom: 0.95625em;
373
405
  }
374
406
  }
375
407
  @media only screen and (min-width: 1025px) {
376
408
  .responsive p:first-child {
377
- margin-bottom: 27px;
409
+ margin-bottom: 22.95px;
378
410
  }
379
411
  }
380
412
  @media only screen and (min-width: 1350px) {
381
413
  .responsive p:first-child {
382
- margin-bottom: 36px;
414
+ margin-bottom: 30.6px;
383
415
  }
384
416
  }
385
417
 
@@ -389,25 +421,25 @@ p {
389
421
  margin-bottom: 1.5em;
390
422
  }
391
423
  .responsive .box {
392
- padding: 42px;
424
+ padding: 35.7px;
393
425
  }
394
426
  @media only screen and (min-width: 520px) {
395
427
  .responsive .box {
396
- padding: 48px;
428
+ padding: 40.8px;
397
429
  }
398
430
  }
399
431
  @media only screen and (min-width: 769px) {
400
432
  .responsive .box {
401
- padding: 4.5em;
433
+ padding: 3.825em;
402
434
  }
403
435
  }
404
436
  @media only screen and (min-width: 1025px) {
405
437
  .responsive .box {
406
- padding: 108px;
438
+ padding: 91.8px;
407
439
  }
408
440
  }
409
441
  @media only screen and (min-width: 1350px) {
410
442
  .responsive .box {
411
- padding: 144px;
443
+ padding: 122.4px;
412
444
  }
413
445
  }