griddyup 0.0.2 → 0.0.3

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,647 +1,647 @@
1
- /*! normalize-scss | MIT/GPLv2 License | bit.ly/normalize-scss */
2
-
3
- @import 'variables';
4
- @import 'vertical-rhythm';
5
-
6
- // If we've customized any font variables, we'll need extra properties.
7
- @if $base-line-height != 24px
8
- or $base-unit != 'em'
9
- or $h2-font-size != 1.5 * $base-font-size
10
- or $h3-font-size != 1.17 * $base-font-size
11
- or $h4-font-size != 1 * $base-font-size
12
- or $h5-font-size != 0.83 * $base-font-size
13
- or $h6-font-size != 0.67 * $base-font-size
14
- or $indent-amount != 40px {
15
- $normalize-vertical-rhythm: true !global;
16
- }
17
-
18
- /* Document
19
- ========================================================================== */
20
-
21
- /**
22
- * 1. Correct the line height in all browsers.
23
- * 2. Prevent adjustments of font size after orientation changes in
24
- * IE on Windows Phone and in iOS.
25
- */
26
-
27
- html {
28
- @if $base-font-family {
29
- /* Change the default font family in all browsers (opinionated). */
30
- font-family: $base-font-family;
31
- }
32
- @if $base-font-size != 16px or $normalize-vertical-rhythm {
33
- // Correct old browser bug that prevented accessible resizing of text
34
- // when root font-size is set with px or em.
35
- font-size: ($base-font-size / 16px) * 100%;
36
- }
37
- @if $normalize-vertical-rhythm {
38
- // Establish a vertical rhythm unit using $base-font-size and
39
- // $base-line-height variables.
40
- line-height: ($base-line-height / $base-font-size) * 1em; /* 1 */
41
- }
42
- @else {
43
- line-height: 1.15; /* 1 */
44
- }
45
- -ms-text-size-adjust: 100%; /* 2 */
46
- -webkit-text-size-adjust: 100%; /* 2 */
47
- }
48
-
49
- /* Sections
50
- ========================================================================== */
51
-
52
- /**
53
- * Remove the margin in all browsers (opinionated).
54
- */
55
-
56
- body {
57
- margin: 0;
58
- }
59
-
60
- /**
61
- * Add the correct display in IE 9-.
62
- */
63
-
64
- article,
65
- aside,
66
- footer,
67
- header,
68
- nav,
69
- section {
70
- display: block;
71
- }
72
-
73
- /**
74
- * Correct the font size and margin on `h1` elements within `section` and
75
- * `article` contexts in Chrome, Firefox, and Safari.
76
- */
77
-
78
- h1 {
79
- @include normalize-font-size($h1-font-size);
80
- @if $normalize-vertical-rhythm {
81
- @include normalize-line-height($h1-font-size);
82
- }
83
-
84
- @if $normalize-vertical-rhythm {
85
- /* Set 1 unit of vertical rhythm on the top and bottom margins. */
86
- @include normalize-margin(1 0, $h1-font-size);
87
- }
88
- @else {
89
- margin: 0.67em 0;
90
- }
91
- }
92
-
93
- @if $normalize-vertical-rhythm {
94
- h2 {
95
- @include normalize-font-size($h2-font-size);
96
- @include normalize-line-height($h2-font-size);
97
- @include normalize-margin(1 0, $h2-font-size);
98
- }
99
-
100
- h3 {
101
- @include normalize-font-size($h3-font-size);
102
- @include normalize-line-height($h3-font-size);
103
- @include normalize-margin(1 0, $h3-font-size);
104
- }
105
-
106
- h4 {
107
- @include normalize-font-size($h4-font-size);
108
- @include normalize-line-height($h4-font-size);
109
- @include normalize-margin(1 0, $h4-font-size);
110
- }
111
-
112
- h5 {
113
- @include normalize-font-size($h5-font-size);
114
- @include normalize-line-height($h5-font-size);
115
- @include normalize-margin(1 0, $h5-font-size);
116
- }
117
-
118
- h6 {
119
- @include normalize-font-size($h6-font-size);
120
- @include normalize-line-height($h6-font-size);
121
- @include normalize-margin(1 0, $h6-font-size);
122
- }
123
- }
124
-
125
- /* Grouping content
126
- ========================================================================== */
127
-
128
- @if $normalize-vertical-rhythm {
129
- /**
130
- * Set 1 unit of vertical rhythm on the top and bottom margin.
131
- */
132
-
133
- blockquote {
134
- @include normalize-margin(1 $indent-amount);
135
- }
136
-
137
- dl,
138
- ol,
139
- ul {
140
- @include normalize-margin(1 0);
141
- }
142
-
143
- /**
144
- * Turn off margins on nested lists.
145
- */
146
-
147
- ol,
148
- ul {
149
- ol,
150
- ul {
151
- margin: 0;
152
- }
153
- }
154
-
155
- dd {
156
- margin: 0 0 0 $indent-amount;
157
- }
158
-
159
- ol,
160
- ul {
161
- padding: 0 0 0 $indent-amount;
162
- }
163
- }
164
-
165
- /**
166
- * Add the correct display in IE 9-.
167
- */
168
-
169
- figcaption,
170
- figure {
171
- display: block;
172
- }
173
-
174
- /**
175
- * Add the correct margin in IE 8.
176
- */
177
-
178
- figure {
179
- @if $normalize-vertical-rhythm {
180
- @include normalize-margin(1 $indent-amount);
181
- }
182
- @else {
183
- margin: 1em $indent-amount;
184
- }
185
- }
186
-
187
- /**
188
- * 1. Add the correct box sizing in Firefox.
189
- * 2. Show the overflow in Edge and IE.
190
- */
191
-
192
- hr {
193
- box-sizing: content-box; /* 1 */
194
- height: 0; /* 1 */
195
- overflow: visible; /* 2 */
196
- }
197
-
198
- /**
199
- * Add the correct display in IE.
200
- */
201
-
202
- main {
203
- display: block;
204
- }
205
-
206
- @if $normalize-vertical-rhythm {
207
- /**
208
- * Set 1 unit of vertical rhythm on the top and bottom margin.
209
- */
210
-
211
- p,
212
- pre {
213
- @include normalize-margin(1 0);
214
- }
215
- }
216
-
217
- /**
218
- * 1. Correct the inheritance and scaling of font size in all browsers.
219
- * 2. Correct the odd `em` font sizing in all browsers.
220
- */
221
-
222
- %monospace {
223
- font-family: monospace, monospace; /* 1 */
224
- font-size: 1em; /* 2 */
225
- }
226
-
227
- pre {
228
- @extend %monospace;
229
- }
230
-
231
- /* Links
232
- ========================================================================== */
233
-
234
- /**
235
- * 1. Remove the gray background on active links in IE 10.
236
- * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
237
- */
238
-
239
- a {
240
- background-color: transparent; /* 1 */
241
- -webkit-text-decoration-skip: objects; /* 2 */
242
- }
243
-
244
- /* Text-level semantics
245
- ========================================================================== */
246
-
247
- /**
248
- * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
249
- * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
250
- */
251
-
252
- abbr[title] {
253
- border-bottom: none; /* 1 */
254
- text-decoration: underline; /* 2 */
255
- text-decoration: underline dotted; /* 2 */
256
- }
257
-
258
- /**
259
- * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
260
- */
261
-
262
- b,
263
- strong {
264
- font-weight: inherit;
265
- }
266
-
267
- /**
268
- * Add the correct font weight in Chrome, Edge, and Safari.
269
- */
270
-
271
- b,
272
- strong {
273
- font-weight: bolder;
274
- }
275
-
276
- code,
277
- kbd,
278
- samp {
279
- @extend %monospace;
280
- }
281
-
282
- /**
283
- * Add the correct font style in Android 4.3-.
284
- */
285
-
286
- dfn {
287
- font-style: italic;
288
- }
289
-
290
- /**
291
- * Add the correct background and color in IE 9-.
292
- */
293
-
294
- mark {
295
- background-color: #ff0;
296
- color: #000;
297
- }
298
-
299
- /**
300
- * Add the correct font size in all browsers.
301
- */
302
-
303
- small {
304
- font-size: 80%;
305
- }
306
-
307
- /**
308
- * Prevent `sub` and `sup` elements from affecting the line height in
309
- * all browsers.
310
- */
311
-
312
- sub,
313
- sup {
314
- font-size: 75%;
315
- line-height: 0;
316
- position: relative;
317
- vertical-align: baseline;
318
- }
319
-
320
- sub {
321
- bottom: -0.25em;
322
- }
323
-
324
- sup {
325
- top: -0.5em;
326
- }
327
-
328
- /* Embedded content
329
- ========================================================================== */
330
-
331
- /**
332
- * Add the correct display in IE 9-.
333
- */
334
-
335
- audio,
336
- video {
337
- display: inline-block;
338
- }
339
-
340
- /**
341
- * Add the correct display in iOS 4-7.
342
- */
343
-
344
- audio:not([controls]) {
345
- display: none;
346
- height: 0;
347
- }
348
-
349
- /**
350
- * Remove the border on images inside links in IE 10-.
351
- */
352
-
353
- img {
354
- border-style: none;
355
- }
356
-
357
- /**
358
- * Hide the overflow in IE.
359
- */
360
-
361
- svg:not(:root) {
362
- overflow: hidden;
363
- }
364
-
365
- /* Forms
366
- ========================================================================== */
367
-
368
- /**
369
- * Known issues:
370
- * - `select`:
371
- * By default, Chrome on OS X and Safari on OS X allow very limited styling of
372
- * select, unless a border property is set. The default font weight on
373
- * optgroup elements cannot safely be changed in Chrome on OSX and Safari on
374
- * OS X.
375
- * - `[type="checkbox"]`:
376
- * It is recommended that you do not style checkbox and radio inputs as
377
- * Firefox's implementation does not respect box-sizing, padding, or width.
378
- * - `[type="number"]`:
379
- * Certain font size values applied to number inputs cause the cursor style of
380
- * the decrement button to change from `default` to `text`.
381
- * - `[type="search"]`:
382
- * The search input is not fully stylable by default. In Chrome and Safari on
383
- * OSX/iOS you can't control `font`, `padding`, `border`, or `background`. In
384
- * Chrome and Safari on Windows you can't control `border` properly. It will
385
- * apply `border-width` but will only show a border color (which cannot be
386
- * controlled) for the outer 1px of that border. Applying
387
- * `-webkit-appearance: textfield` addresses these issues without removing the
388
- * benefits of search inputs (e.g. showing past searches). Safari (but not
389
- * Chrome) will clip the cancel button on when it has padding (and `textfield`
390
- * appearance).
391
- * - `::placeholder`:
392
- * In Edge, placeholders will disappear on `relative` or `absolute` positioned
393
- * `<input>` elements if you use `opacity` less than `1` due to a
394
- * [bug](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/3901363/).
395
- */
396
-
397
- /**
398
- * 1. Change the font styles in all browsers (opinionated).
399
- * 2. Remove the margin in Firefox and Safari.
400
- */
401
-
402
- button,
403
- input,
404
- optgroup,
405
- select,
406
- textarea {
407
- @if $normalize-vertical-rhythm {
408
- @include normalize-line-height($base-font-size); /* 1 */
409
- }
410
- @else {
411
- line-height: 1.15; /* 1 */
412
- }
413
- font-family: if($base-font-family, $base-font-family, sans-serif); /* 1 */
414
- font-size: 100%; /* 1 */
415
- margin: 0; /* 2 */
416
- }
417
-
418
- /**
419
- * Show the overflow in IE.
420
- */
421
-
422
- button {
423
- overflow: visible;
424
- }
425
-
426
- /**
427
- * Remove the inheritance of text transform in Edge, Firefox, and IE.
428
- * 1. Remove the inheritance of text transform in Firefox.
429
- */
430
-
431
- button,
432
- select { /* 1 */
433
- text-transform: none;
434
- }
435
-
436
- /**
437
- * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
438
- * controls in Android 4.
439
- * 2. Correct the inability to style clickable types in iOS and Safari.
440
- */
441
-
442
- button,
443
- html [type="button"], /* 1 */
444
- [type="reset"],
445
- [type="submit"] {
446
- -webkit-appearance: button; /* 2 */
447
- }
448
-
449
- button,
450
- [type="button"],
451
- [type="reset"],
452
- [type="submit"] {
453
-
454
- /**
455
- * Remove the inner border and padding in Firefox.
456
- */
457
-
458
- &::-moz-focus-inner {
459
- border-style: none;
460
- padding: 0;
461
- }
462
-
463
- /**
464
- * Restore the focus styles unset by the previous rule.
465
- */
466
-
467
- &:-moz-focusring {
468
- outline: 1px dotted ButtonText;
469
- }
470
- }
471
-
472
- /**
473
- * Show the overflow in Edge.
474
- */
475
-
476
- input {
477
- overflow: visible;
478
- }
479
-
480
- /**
481
- * 1. Add the correct box sizing in IE 10-.
482
- * 2. Remove the padding in IE 10-.
483
- */
484
-
485
- [type="checkbox"],
486
- [type="radio"] {
487
- box-sizing: border-box; /* 1 */
488
- padding: 0; /* 2 */
489
- }
490
-
491
- /**
492
- * Correct the cursor style of increment and decrement buttons in Chrome.
493
- */
494
-
495
- [type="number"]::-webkit-inner-spin-button,
496
- [type="number"]::-webkit-outer-spin-button {
497
- height: auto;
498
- }
499
-
500
- /**
501
- * 1. Correct the odd appearance in Chrome and Safari.
502
- * 2. Correct the outline style in Safari.
503
- */
504
-
505
- [type="search"] {
506
- -webkit-appearance: textfield; /* 1 */
507
- outline-offset: -2px; /* 2 */
508
-
509
- /**
510
- * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
511
- */
512
-
513
- &::-webkit-search-cancel-button,
514
- &::-webkit-search-decoration {
515
- -webkit-appearance: none;
516
- }
517
- }
518
-
519
- /**
520
- * 1. Correct the inability to style clickable types in iOS and Safari.
521
- * 2. Change font properties to `inherit` in Safari.
522
- */
523
-
524
- ::-webkit-file-upload-button {
525
- -webkit-appearance: button; /* 1 */
526
- font: inherit; /* 2 */
527
- }
528
-
529
- /**
530
- * Correct the padding in Firefox.
531
- */
532
-
533
- fieldset {
534
- padding: 0.35em 0.75em 0.625em;
535
- }
536
-
537
- /**
538
- * 1. Correct the text wrapping in Edge and IE.
539
- * 2. Correct the color inheritance from `fieldset` elements in IE.
540
- * 3. Remove the padding so developers are not caught out when they zero out
541
- * `fieldset` elements in all browsers.
542
- */
543
-
544
- legend {
545
- box-sizing: border-box; /* 1 */
546
- display: table; /* 1 */
547
- max-width: 100%; /* 1 */
548
- padding: 0; /* 3 */
549
- color: inherit; /* 2 */
550
- white-space: normal; /* 1 */
551
- }
552
-
553
- /**
554
- * 1. Add the correct display in IE 9-.
555
- * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
556
- */
557
-
558
- progress {
559
- display: inline-block; /* 1 */
560
- vertical-align: baseline; /* 2 */
561
- }
562
-
563
- /**
564
- * Remove the default vertical scrollbar in IE.
565
- */
566
-
567
- textarea {
568
- overflow: auto;
569
- }
570
-
571
- /* Interactive
572
- ========================================================================== */
573
-
574
- /*
575
- * Add the correct display in Edge, IE, and Firefox.
576
- */
577
-
578
- details {
579
- display: block;
580
- }
581
-
582
- /*
583
- * Add the correct display in all browsers.
584
- */
585
-
586
- summary {
587
- display: list-item;
588
- }
589
-
590
-
591
- /*
592
- * Add the correct display in IE 9-.
593
- */
594
-
595
- menu {
596
- display: block;
597
-
598
- @if $normalize-vertical-rhythm {
599
- /*
600
- * 1. Set 1 unit of vertical rhythm on the top and bottom margin.
601
- * 2. Set consistent space for the list style image.
602
- */
603
-
604
- @include normalize-margin(1 0); /* 1 */
605
- padding: 0 0 0 $indent-amount; /* 2 */
606
-
607
- /**
608
- * Turn off margins on nested lists.
609
- */
610
-
611
- menu &,
612
- ol &,
613
- ul & {
614
- margin: 0;
615
- }
616
- }
617
- }
618
-
619
- /* Scripting
620
- ========================================================================== */
621
-
622
- /**
623
- * Add the correct display in IE 9-.
624
- */
625
-
626
- canvas {
627
- display: inline-block;
628
- }
629
-
630
- /**
631
- * Add the correct display in IE.
632
- */
633
-
634
- template {
635
- display: none;
636
- }
637
-
638
- /* Hidden
639
- ========================================================================== */
640
-
641
- /**
642
- * Add the correct display in IE 10-.
643
- */
644
-
645
- [hidden] {
646
- display: none;
647
- }
1
+ /*! normalize-scss | MIT/GPLv2 License | bit.ly/normalize-scss */
2
+
3
+ @import 'variables';
4
+ @import 'vertical-rhythm';
5
+
6
+ // If we've customized any font variables, we'll need extra properties.
7
+ @if $base-line-height != 24px
8
+ or $base-unit != 'em'
9
+ or $h2-font-size != 1.5 * $base-font-size
10
+ or $h3-font-size != 1.17 * $base-font-size
11
+ or $h4-font-size != 1 * $base-font-size
12
+ or $h5-font-size != 0.83 * $base-font-size
13
+ or $h6-font-size != 0.67 * $base-font-size
14
+ or $indent-amount != 40px {
15
+ $normalize-vertical-rhythm: true !global;
16
+ }
17
+
18
+ /* Document
19
+ ========================================================================== */
20
+
21
+ /**
22
+ * 1. Correct the line height in all browsers.
23
+ * 2. Prevent adjustments of font size after orientation changes in
24
+ * IE on Windows Phone and in iOS.
25
+ */
26
+
27
+ html {
28
+ @if $base-font-family {
29
+ /* Change the default font family in all browsers (opinionated). */
30
+ font-family: $base-font-family;
31
+ }
32
+ @if $base-font-size != 16px or $normalize-vertical-rhythm {
33
+ // Correct old browser bug that prevented accessible resizing of text
34
+ // when root font-size is set with px or em.
35
+ font-size: ($base-font-size / 16px) * 100%;
36
+ }
37
+ @if $normalize-vertical-rhythm {
38
+ // Establish a vertical rhythm unit using $base-font-size and
39
+ // $base-line-height variables.
40
+ line-height: ($base-line-height / $base-font-size) * 1em; /* 1 */
41
+ }
42
+ @else {
43
+ line-height: 1.15; /* 1 */
44
+ }
45
+ -ms-text-size-adjust: 100%; /* 2 */
46
+ -webkit-text-size-adjust: 100%; /* 2 */
47
+ }
48
+
49
+ /* Sections
50
+ ========================================================================== */
51
+
52
+ /**
53
+ * Remove the margin in all browsers (opinionated).
54
+ */
55
+
56
+ body {
57
+ margin: 0;
58
+ }
59
+
60
+ /**
61
+ * Add the correct display in IE 9-.
62
+ */
63
+
64
+ article,
65
+ aside,
66
+ footer,
67
+ header,
68
+ nav,
69
+ section {
70
+ display: block;
71
+ }
72
+
73
+ /**
74
+ * Correct the font size and margin on `h1` elements within `section` and
75
+ * `article` contexts in Chrome, Firefox, and Safari.
76
+ */
77
+
78
+ h1 {
79
+ @include normalize-font-size($h1-font-size);
80
+ @if $normalize-vertical-rhythm {
81
+ @include normalize-line-height($h1-font-size);
82
+ }
83
+
84
+ @if $normalize-vertical-rhythm {
85
+ /* Set 1 unit of vertical rhythm on the top and bottom margins. */
86
+ @include normalize-margin(1 0, $h1-font-size);
87
+ }
88
+ @else {
89
+ margin: 0.67em 0;
90
+ }
91
+ }
92
+
93
+ @if $normalize-vertical-rhythm {
94
+ h2 {
95
+ @include normalize-font-size($h2-font-size);
96
+ @include normalize-line-height($h2-font-size);
97
+ @include normalize-margin(1 0, $h2-font-size);
98
+ }
99
+
100
+ h3 {
101
+ @include normalize-font-size($h3-font-size);
102
+ @include normalize-line-height($h3-font-size);
103
+ @include normalize-margin(1 0, $h3-font-size);
104
+ }
105
+
106
+ h4 {
107
+ @include normalize-font-size($h4-font-size);
108
+ @include normalize-line-height($h4-font-size);
109
+ @include normalize-margin(1 0, $h4-font-size);
110
+ }
111
+
112
+ h5 {
113
+ @include normalize-font-size($h5-font-size);
114
+ @include normalize-line-height($h5-font-size);
115
+ @include normalize-margin(1 0, $h5-font-size);
116
+ }
117
+
118
+ h6 {
119
+ @include normalize-font-size($h6-font-size);
120
+ @include normalize-line-height($h6-font-size);
121
+ @include normalize-margin(1 0, $h6-font-size);
122
+ }
123
+ }
124
+
125
+ /* Grouping content
126
+ ========================================================================== */
127
+
128
+ @if $normalize-vertical-rhythm {
129
+ /**
130
+ * Set 1 unit of vertical rhythm on the top and bottom margin.
131
+ */
132
+
133
+ blockquote {
134
+ @include normalize-margin(1 $indent-amount);
135
+ }
136
+
137
+ dl,
138
+ ol,
139
+ ul {
140
+ @include normalize-margin(1 0);
141
+ }
142
+
143
+ /**
144
+ * Turn off margins on nested lists.
145
+ */
146
+
147
+ ol,
148
+ ul {
149
+ ol,
150
+ ul {
151
+ margin: 0;
152
+ }
153
+ }
154
+
155
+ dd {
156
+ margin: 0 0 0 $indent-amount;
157
+ }
158
+
159
+ ol,
160
+ ul {
161
+ padding: 0 0 0 $indent-amount;
162
+ }
163
+ }
164
+
165
+ /**
166
+ * Add the correct display in IE 9-.
167
+ */
168
+
169
+ figcaption,
170
+ figure {
171
+ display: block;
172
+ }
173
+
174
+ /**
175
+ * Add the correct margin in IE 8.
176
+ */
177
+
178
+ figure {
179
+ @if $normalize-vertical-rhythm {
180
+ @include normalize-margin(1 $indent-amount);
181
+ }
182
+ @else {
183
+ margin: 1em $indent-amount;
184
+ }
185
+ }
186
+
187
+ /**
188
+ * 1. Add the correct box sizing in Firefox.
189
+ * 2. Show the overflow in Edge and IE.
190
+ */
191
+
192
+ hr {
193
+ box-sizing: content-box; /* 1 */
194
+ height: 0; /* 1 */
195
+ overflow: visible; /* 2 */
196
+ }
197
+
198
+ /**
199
+ * Add the correct display in IE.
200
+ */
201
+
202
+ main {
203
+ display: block;
204
+ }
205
+
206
+ @if $normalize-vertical-rhythm {
207
+ /**
208
+ * Set 1 unit of vertical rhythm on the top and bottom margin.
209
+ */
210
+
211
+ p,
212
+ pre {
213
+ @include normalize-margin(1 0);
214
+ }
215
+ }
216
+
217
+ /**
218
+ * 1. Correct the inheritance and scaling of font size in all browsers.
219
+ * 2. Correct the odd `em` font sizing in all browsers.
220
+ */
221
+
222
+ %monospace {
223
+ font-family: monospace, monospace; /* 1 */
224
+ font-size: 1em; /* 2 */
225
+ }
226
+
227
+ pre {
228
+ @extend %monospace;
229
+ }
230
+
231
+ /* Links
232
+ ========================================================================== */
233
+
234
+ /**
235
+ * 1. Remove the gray background on active links in IE 10.
236
+ * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
237
+ */
238
+
239
+ a {
240
+ background-color: transparent; /* 1 */
241
+ -webkit-text-decoration-skip: objects; /* 2 */
242
+ }
243
+
244
+ /* Text-level semantics
245
+ ========================================================================== */
246
+
247
+ /**
248
+ * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
249
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
250
+ */
251
+
252
+ abbr[title] {
253
+ border-bottom: none; /* 1 */
254
+ text-decoration: underline; /* 2 */
255
+ text-decoration: underline dotted; /* 2 */
256
+ }
257
+
258
+ /**
259
+ * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
260
+ */
261
+
262
+ b,
263
+ strong {
264
+ font-weight: inherit;
265
+ }
266
+
267
+ /**
268
+ * Add the correct font weight in Chrome, Edge, and Safari.
269
+ */
270
+
271
+ b,
272
+ strong {
273
+ font-weight: bolder;
274
+ }
275
+
276
+ code,
277
+ kbd,
278
+ samp {
279
+ @extend %monospace;
280
+ }
281
+
282
+ /**
283
+ * Add the correct font style in Android 4.3-.
284
+ */
285
+
286
+ dfn {
287
+ font-style: italic;
288
+ }
289
+
290
+ /**
291
+ * Add the correct background and color in IE 9-.
292
+ */
293
+
294
+ mark {
295
+ background-color: #ff0;
296
+ color: #000;
297
+ }
298
+
299
+ /**
300
+ * Add the correct font size in all browsers.
301
+ */
302
+
303
+ small {
304
+ font-size: 80%;
305
+ }
306
+
307
+ /**
308
+ * Prevent `sub` and `sup` elements from affecting the line height in
309
+ * all browsers.
310
+ */
311
+
312
+ sub,
313
+ sup {
314
+ font-size: 75%;
315
+ line-height: 0;
316
+ position: relative;
317
+ vertical-align: baseline;
318
+ }
319
+
320
+ sub {
321
+ bottom: -0.25em;
322
+ }
323
+
324
+ sup {
325
+ top: -0.5em;
326
+ }
327
+
328
+ /* Embedded content
329
+ ========================================================================== */
330
+
331
+ /**
332
+ * Add the correct display in IE 9-.
333
+ */
334
+
335
+ audio,
336
+ video {
337
+ display: inline-block;
338
+ }
339
+
340
+ /**
341
+ * Add the correct display in iOS 4-7.
342
+ */
343
+
344
+ audio:not([controls]) {
345
+ display: none;
346
+ height: 0;
347
+ }
348
+
349
+ /**
350
+ * Remove the border on images inside links in IE 10-.
351
+ */
352
+
353
+ img {
354
+ border-style: none;
355
+ }
356
+
357
+ /**
358
+ * Hide the overflow in IE.
359
+ */
360
+
361
+ svg:not(:root) {
362
+ overflow: hidden;
363
+ }
364
+
365
+ /* Forms
366
+ ========================================================================== */
367
+
368
+ /**
369
+ * Known issues:
370
+ * - `select`:
371
+ * By default, Chrome on OS X and Safari on OS X allow very limited styling of
372
+ * select, unless a border property is set. The default font weight on
373
+ * optgroup elements cannot safely be changed in Chrome on OSX and Safari on
374
+ * OS X.
375
+ * - `[type="checkbox"]`:
376
+ * It is recommended that you do not style checkbox and radio inputs as
377
+ * Firefox's implementation does not respect box-sizing, padding, or width.
378
+ * - `[type="number"]`:
379
+ * Certain font size values applied to number inputs cause the cursor style of
380
+ * the decrement button to change from `default` to `text`.
381
+ * - `[type="search"]`:
382
+ * The search input is not fully stylable by default. In Chrome and Safari on
383
+ * OSX/iOS you can't control `font`, `padding`, `border`, or `background`. In
384
+ * Chrome and Safari on Windows you can't control `border` properly. It will
385
+ * apply `border-width` but will only show a border color (which cannot be
386
+ * controlled) for the outer 1px of that border. Applying
387
+ * `-webkit-appearance: textfield` addresses these issues without removing the
388
+ * benefits of search inputs (e.g. showing past searches). Safari (but not
389
+ * Chrome) will clip the cancel button on when it has padding (and `textfield`
390
+ * appearance).
391
+ * - `::placeholder`:
392
+ * In Edge, placeholders will disappear on `relative` or `absolute` positioned
393
+ * `<input>` elements if you use `opacity` less than `1` due to a
394
+ * [bug](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/3901363/).
395
+ */
396
+
397
+ /**
398
+ * 1. Change the font styles in all browsers (opinionated).
399
+ * 2. Remove the margin in Firefox and Safari.
400
+ */
401
+
402
+ button,
403
+ input,
404
+ optgroup,
405
+ select,
406
+ textarea {
407
+ @if $normalize-vertical-rhythm {
408
+ @include normalize-line-height($base-font-size); /* 1 */
409
+ }
410
+ @else {
411
+ line-height: 1.15; /* 1 */
412
+ }
413
+ font-family: if($base-font-family, $base-font-family, sans-serif); /* 1 */
414
+ font-size: 100%; /* 1 */
415
+ margin: 0; /* 2 */
416
+ }
417
+
418
+ /**
419
+ * Show the overflow in IE.
420
+ */
421
+
422
+ button {
423
+ overflow: visible;
424
+ }
425
+
426
+ /**
427
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
428
+ * 1. Remove the inheritance of text transform in Firefox.
429
+ */
430
+
431
+ button,
432
+ select { /* 1 */
433
+ text-transform: none;
434
+ }
435
+
436
+ /**
437
+ * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
438
+ * controls in Android 4.
439
+ * 2. Correct the inability to style clickable types in iOS and Safari.
440
+ */
441
+
442
+ button,
443
+ html [type="button"], /* 1 */
444
+ [type="reset"],
445
+ [type="submit"] {
446
+ -webkit-appearance: button; /* 2 */
447
+ }
448
+
449
+ button,
450
+ [type="button"],
451
+ [type="reset"],
452
+ [type="submit"] {
453
+
454
+ /**
455
+ * Remove the inner border and padding in Firefox.
456
+ */
457
+
458
+ &::-moz-focus-inner {
459
+ border-style: none;
460
+ padding: 0;
461
+ }
462
+
463
+ /**
464
+ * Restore the focus styles unset by the previous rule.
465
+ */
466
+
467
+ &:-moz-focusring {
468
+ outline: 1px dotted ButtonText;
469
+ }
470
+ }
471
+
472
+ /**
473
+ * Show the overflow in Edge.
474
+ */
475
+
476
+ input {
477
+ overflow: visible;
478
+ }
479
+
480
+ /**
481
+ * 1. Add the correct box sizing in IE 10-.
482
+ * 2. Remove the padding in IE 10-.
483
+ */
484
+
485
+ [type="checkbox"],
486
+ [type="radio"] {
487
+ box-sizing: border-box; /* 1 */
488
+ padding: 0; /* 2 */
489
+ }
490
+
491
+ /**
492
+ * Correct the cursor style of increment and decrement buttons in Chrome.
493
+ */
494
+
495
+ [type="number"]::-webkit-inner-spin-button,
496
+ [type="number"]::-webkit-outer-spin-button {
497
+ height: auto;
498
+ }
499
+
500
+ /**
501
+ * 1. Correct the odd appearance in Chrome and Safari.
502
+ * 2. Correct the outline style in Safari.
503
+ */
504
+
505
+ [type="search"] {
506
+ -webkit-appearance: textfield; /* 1 */
507
+ outline-offset: -2px; /* 2 */
508
+
509
+ /**
510
+ * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
511
+ */
512
+
513
+ &::-webkit-search-cancel-button,
514
+ &::-webkit-search-decoration {
515
+ -webkit-appearance: none;
516
+ }
517
+ }
518
+
519
+ /**
520
+ * 1. Correct the inability to style clickable types in iOS and Safari.
521
+ * 2. Change font properties to `inherit` in Safari.
522
+ */
523
+
524
+ ::-webkit-file-upload-button {
525
+ -webkit-appearance: button; /* 1 */
526
+ font: inherit; /* 2 */
527
+ }
528
+
529
+ /**
530
+ * Correct the padding in Firefox.
531
+ */
532
+
533
+ fieldset {
534
+ padding: 0.35em 0.75em 0.625em;
535
+ }
536
+
537
+ /**
538
+ * 1. Correct the text wrapping in Edge and IE.
539
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
540
+ * 3. Remove the padding so developers are not caught out when they zero out
541
+ * `fieldset` elements in all browsers.
542
+ */
543
+
544
+ legend {
545
+ box-sizing: border-box; /* 1 */
546
+ display: table; /* 1 */
547
+ max-width: 100%; /* 1 */
548
+ padding: 0; /* 3 */
549
+ color: inherit; /* 2 */
550
+ white-space: normal; /* 1 */
551
+ }
552
+
553
+ /**
554
+ * 1. Add the correct display in IE 9-.
555
+ * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
556
+ */
557
+
558
+ progress {
559
+ display: inline-block; /* 1 */
560
+ vertical-align: baseline; /* 2 */
561
+ }
562
+
563
+ /**
564
+ * Remove the default vertical scrollbar in IE.
565
+ */
566
+
567
+ textarea {
568
+ overflow: auto;
569
+ }
570
+
571
+ /* Interactive
572
+ ========================================================================== */
573
+
574
+ /*
575
+ * Add the correct display in Edge, IE, and Firefox.
576
+ */
577
+
578
+ details {
579
+ display: block;
580
+ }
581
+
582
+ /*
583
+ * Add the correct display in all browsers.
584
+ */
585
+
586
+ summary {
587
+ display: list-item;
588
+ }
589
+
590
+
591
+ /*
592
+ * Add the correct display in IE 9-.
593
+ */
594
+
595
+ menu {
596
+ display: block;
597
+
598
+ @if $normalize-vertical-rhythm {
599
+ /*
600
+ * 1. Set 1 unit of vertical rhythm on the top and bottom margin.
601
+ * 2. Set consistent space for the list style image.
602
+ */
603
+
604
+ @include normalize-margin(1 0); /* 1 */
605
+ padding: 0 0 0 $indent-amount; /* 2 */
606
+
607
+ /**
608
+ * Turn off margins on nested lists.
609
+ */
610
+
611
+ menu &,
612
+ ol &,
613
+ ul & {
614
+ margin: 0;
615
+ }
616
+ }
617
+ }
618
+
619
+ /* Scripting
620
+ ========================================================================== */
621
+
622
+ /**
623
+ * Add the correct display in IE 9-.
624
+ */
625
+
626
+ canvas {
627
+ display: inline-block;
628
+ }
629
+
630
+ /**
631
+ * Add the correct display in IE.
632
+ */
633
+
634
+ template {
635
+ display: none;
636
+ }
637
+
638
+ /* Hidden
639
+ ========================================================================== */
640
+
641
+ /**
642
+ * Add the correct display in IE 10-.
643
+ */
644
+
645
+ [hidden] {
646
+ display: none;
647
+ }