bullframe.css 3.8.1 → 4.0.1

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.
Files changed (103) hide show
  1. package/.browserslistrc +10 -6
  2. package/.stylelintrc.json +10 -0
  3. package/CHANGELOG.md +20 -4
  4. package/LICENSE +20 -20
  5. package/README.md +28 -179
  6. package/dist/css/bullframe-classless-dark-prefers.css +357 -425
  7. package/dist/css/bullframe-classless-dark-prefers.min.css +2 -3
  8. package/dist/css/bullframe-classless-dark-prefers.min.css.map +1 -1
  9. package/dist/css/bullframe-classless-dark.css +328 -412
  10. package/dist/css/bullframe-classless-dark.min.css +2 -3
  11. package/dist/css/bullframe-classless-dark.min.css.map +1 -1
  12. package/dist/css/bullframe-classless.css +237 -293
  13. package/dist/css/bullframe-classless.min.css +2 -2
  14. package/dist/css/bullframe-classless.min.css.map +1 -1
  15. package/dist/css/bullframe-dark-prefers.css +468 -633
  16. package/dist/css/bullframe-dark-prefers.min.css +2 -2
  17. package/dist/css/bullframe-dark-prefers.min.css.map +1 -1
  18. package/dist/css/bullframe-dark.css +402 -593
  19. package/dist/css/bullframe-dark.min.css +2 -2
  20. package/dist/css/bullframe-dark.min.css.map +1 -1
  21. package/dist/css/bullframe-utilities.css +87 -125
  22. package/dist/css/bullframe-utilities.min.css +1 -1
  23. package/dist/css/bullframe-utilities.min.css.map +1 -1
  24. package/dist/css/bullframe.css +288 -455
  25. package/dist/css/bullframe.min.css +1 -1
  26. package/dist/css/bullframe.min.css.map +1 -1
  27. package/docs/test/css/style.css +130 -130
  28. package/docs/test/icons/safari-pinned-tab.svg +28 -28
  29. package/docs/test/js/vendor/html5shiv.js +335 -335
  30. package/docs/test/js/vendor/ie10-viewport-bug-workaround.js +20 -20
  31. package/gulpfile.js +5 -2
  32. package/index.html +1214 -1223
  33. package/package.json +14 -11
  34. package/src/scss/bullframe-classless-dark-prefers.scss +5 -5
  35. package/src/scss/bullframe-classless-dark.scss +5 -5
  36. package/src/scss/bullframe-classless.scss +1 -9
  37. package/src/scss/bullframe-dark-prefers.scss +4 -4
  38. package/src/scss/bullframe-dark.scss +4 -4
  39. package/src/scss/bullframe-utilities.scss +1 -1
  40. package/src/scss/bullframe.scss +0 -7
  41. package/src/scss/forms/_forms-normalization.scss +4 -2
  42. package/src/scss/forms/_forms-styling-radio-checkbox.scss +84 -85
  43. package/src/scss/forms/_forms-styling-range.scss +99 -103
  44. package/src/scss/forms/_forms-styling-select.scss +63 -63
  45. package/src/scss/forms/_forms-styling.scss +119 -121
  46. package/src/scss/miscellaneous/_misc-focus.scss +0 -1
  47. package/src/scss/miscellaneous/_misc-layout.scss +1 -24
  48. package/src/scss/mixins/_mixin-grid-flex.scss +83 -83
  49. package/src/scss/mixins/_mixin-layout.scss +42 -42
  50. package/src/scss/mixins/_mixin-texts.scss +38 -37
  51. package/src/scss/typography/_typography-blockquotes.scss +23 -23
  52. package/src/scss/typography/_typography-headings.scss +43 -43
  53. package/src/scss/typography/_typography-html-body.scss +72 -72
  54. package/src/scss/typography/_typography-misc.scss +3 -3
  55. package/src/scss/typography/_typography-monospaced-elements.scss +50 -56
  56. package/src/scss/utilities/_utility-buttons.scss +71 -71
  57. package/src/scss/utilities/_utility-embeds.scss +34 -34
  58. package/src/scss/utilities/_utility-filters.scss +24 -24
  59. package/src/scss/utilities/_utility-form-states.scss +80 -80
  60. package/src/scss/utilities/_utility-global-dark-classless.scss +157 -169
  61. package/src/scss/utilities/_utility-global-dark-prefers-classless.scss +3 -3
  62. package/src/scss/utilities/_utility-global-dark-prefers.scss +3 -3
  63. package/src/scss/utilities/_utility-global-dark-scrollbars.scss +29 -29
  64. package/src/scss/utilities/_utility-global-dark.scss +213 -224
  65. package/src/scss/utilities/_utility-grid-system.scss +204 -204
  66. package/src/scss/utilities/_utility-layout.scss +195 -196
  67. package/src/scss/utilities/_utility-lists.scss +17 -17
  68. package/src/scss/utilities/_utility-print.scss +101 -111
  69. package/src/scss/utilities/_utility-reduced-motion.scss +29 -29
  70. package/src/scss/utilities/_utility-tables.scss +40 -40
  71. package/src/scss/utilities/_utility-texts.scss +199 -199
  72. package/src/scss/utilities/_utility-z-index.scss +82 -82
  73. package/src/scss/variables/_variables-breakpoints.scss +5 -5
  74. package/src/scss/variables/_variables-colors.scss +31 -31
  75. package/src/scss/variables/_variables-spacing.scss +25 -25
  76. package/src/scss/variables/_variables-texts.scss +12 -12
  77. package/dist/css/bullframe-classless-dark-ie10+.css +0 -1321
  78. package/dist/css/bullframe-classless-dark-ie10+.min.css +0 -4
  79. package/dist/css/bullframe-classless-dark-ie10+.min.css.map +0 -1
  80. package/dist/css/bullframe-classless-dark-prefers-ie10+.css +0 -1301
  81. package/dist/css/bullframe-classless-dark-prefers-ie10+.min.css +0 -4
  82. package/dist/css/bullframe-classless-dark-prefers-ie10+.min.css.map +0 -1
  83. package/dist/css/bullframe-classless-ie10+.css +0 -1084
  84. package/dist/css/bullframe-classless-ie10+.min.css +0 -3
  85. package/dist/css/bullframe-classless-ie10+.min.css.map +0 -1
  86. package/dist/css/bullframe-dark-ie10+.css +0 -2569
  87. package/dist/css/bullframe-dark-ie10+.min.css +0 -3
  88. package/dist/css/bullframe-dark-ie10+.min.css.map +0 -1
  89. package/dist/css/bullframe-dark-prefers-ie10+.css +0 -2541
  90. package/dist/css/bullframe-dark-prefers-ie10+.min.css +0 -3
  91. package/dist/css/bullframe-dark-prefers-ie10+.min.css.map +0 -1
  92. package/dist/css/bullframe-ie10+.css +0 -2250
  93. package/dist/css/bullframe-ie10+.min.css +0 -2
  94. package/dist/css/bullframe-ie10+.min.css.map +0 -1
  95. package/docs/images-readme/browserstack-logo.png +0 -0
  96. package/src/scss/bullframe-classless-dark-ie10+.scss +0 -5
  97. package/src/scss/bullframe-classless-dark-prefers-ie10+.scss +0 -5
  98. package/src/scss/bullframe-classless-ie10+.scss +0 -43
  99. package/src/scss/bullframe-dark-ie10+.scss +0 -4
  100. package/src/scss/bullframe-dark-prefers-ie10+.scss +0 -4
  101. package/src/scss/bullframe-ie10+.scss +0 -121
  102. package/src/scss/forms/_forms-styling-ie-hacks.scss +0 -56
  103. package/src/scss/forms/_forms-styling-select-ie-hacks.scss +0 -30
@@ -1,1301 +0,0 @@
1
- /*! bullframe.css v3.8.0 | MIT License | https://github.com/marcop135/bullframe.css */
2
- /*! custom build: bullframe-classless-dark-prefers-ie10+ */
3
- /*! custom build: bullframe-classless-ie10+ */
4
- *,
5
- *::before,
6
- *::after {
7
- box-sizing: border-box;
8
- }
9
-
10
- article,
11
- aside,
12
- dialog,
13
- figcaption,
14
- figure,
15
- footer,
16
- header,
17
- hgroup,
18
- main,
19
- menu,
20
- nav,
21
- section,
22
- details {
23
- display: block;
24
- }
25
-
26
- template {
27
- display: none;
28
- }
29
-
30
- a,
31
- area,
32
- button,
33
- input,
34
- label,
35
- select,
36
- summary,
37
- textarea,
38
- [tabindex] {
39
- -ms-touch-action: manipulation;
40
- }
41
-
42
- [hidden] {
43
- display: none !important;
44
- }
45
-
46
- @-ms-viewport {
47
- width: device-width;
48
- }
49
-
50
- html {
51
- -webkit-text-size-adjust: 100%;
52
- -moz-text-size-adjust: 100%;
53
- text-size-adjust: 100%;
54
- font-size: 62.5%;
55
- color: #222;
56
- font-family: sans-serif;
57
- line-height: 1.15;
58
- -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
59
- }
60
-
61
- body {
62
- margin: 0;
63
- font-size: 16px;
64
- font-size: 1.6rem;
65
- line-height: 1.5;
66
- font-weight: 400;
67
- text-align: left;
68
- font-family: BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
69
- text-rendering: optimizeLegibility;
70
- word-wrap: break-word;
71
- background-color: #fff;
72
- }
73
-
74
- h1,
75
- h2,
76
- h3,
77
- h4,
78
- h5,
79
- h6 {
80
- margin-top: 0;
81
- font-weight: 700;
82
- font-weight: 600;
83
- font-family: inherit;
84
- color: inherit;
85
- line-height: 1.25;
86
- margin-bottom: 10px;
87
- margin-bottom: 1rem;
88
- }
89
-
90
- h1 {
91
- font-size: 36px;
92
- font-size: 3.6rem;
93
- }
94
-
95
- h2 {
96
- font-size: 30px;
97
- font-size: 3rem;
98
- }
99
-
100
- h3 {
101
- font-size: 24px;
102
- font-size: 2.4rem;
103
- }
104
-
105
- h4 {
106
- font-size: 20px;
107
- font-size: 2rem;
108
- }
109
-
110
- h5,
111
- h6 {
112
- font-size: 16px;
113
- font-size: 1.6rem;
114
- }
115
-
116
- blockquote {
117
- margin: 0 0 20px 0;
118
- margin-bottom: 2rem;
119
- padding-left: 0;
120
- font-style: italic;
121
- }
122
-
123
- blockquote p {
124
- margin-bottom: 0;
125
- }
126
-
127
- blockquote small {
128
- color: #999;
129
- display: block;
130
- }
131
-
132
- blockquote small:before {
133
- content: '\2014 \00A0';
134
- }
135
-
136
- q {
137
- quotes: "“" "”" "‘" "’";
138
- }
139
-
140
- pre {
141
- margin: 0 0 20px 0;
142
- margin: 0 0 2rem 0;
143
- }
144
-
145
- pre {
146
- display: block;
147
- overflow: auto;
148
- word-break: break-all;
149
- word-wrap: break-word;
150
- white-space: pre;
151
- -webkit-hyphens: none;
152
- -ms-hyphens: none;
153
- hyphens: none;
154
- -ms-overflow-style: auto;
155
- display: block;
156
- }
157
-
158
- pre,
159
- code,
160
- kbd,
161
- samp {
162
- font-family: "Menlo", "Consolas", "Roboto Mono", "Ubuntu Monospace", "Noto Mono", "Oxygen Mono", "Liberation Mono", monospace, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
163
- font-size: .875em;
164
- }
165
-
166
- code {
167
- word-wrap: break-word;
168
- }
169
-
170
- a > code {
171
- color: inherit;
172
- }
173
-
174
- pre code {
175
- font-size: inherit;
176
- color: inherit;
177
- word-break: normal;
178
- }
179
-
180
- p {
181
- margin: 0 0 20px 0;
182
- margin: 0 0 2rem 0;
183
- }
184
-
185
- abbr[title],
186
- abbr[data-original-title] {
187
- cursor: help;
188
- text-decoration: underline;
189
- -webkit-text-decoration: underline dotted;
190
- text-decoration: underline dotted;
191
- cursor: help;
192
- border-bottom: 0;
193
- }
194
-
195
- mark {
196
- background-color: #ff0;
197
- color: #000;
198
- }
199
-
200
- ins {
201
- background-color: #ff9;
202
- color: #000;
203
- text-decoration: none;
204
- }
205
-
206
- b,
207
- strong {
208
- font-weight: inherit;
209
- }
210
-
211
- b,
212
- strong {
213
- font-weight: bolder;
214
- }
215
-
216
- dfn {
217
- font-style: italic;
218
- }
219
-
220
- sub,
221
- sup {
222
- font-size: 75%;
223
- line-height: 0;
224
- position: relative;
225
- vertical-align: baseline;
226
- }
227
-
228
- sup {
229
- top: -8px;
230
- top: -.8rem;
231
- }
232
-
233
- sub {
234
- bottom: -4px;
235
- bottom: -.4rem;
236
- }
237
-
238
- small {
239
- font-size: 80%;
240
- }
241
-
242
- hr {
243
- box-sizing: content-box;
244
- display: block;
245
- height: 0;
246
- border-style: solid;
247
- border-width: 1px 0 0;
248
- color: inherit;
249
- margin: 20px 0;
250
- margin: 2rem 0;
251
- padding: 0;
252
- overflow: visible;
253
- }
254
-
255
- address {
256
- font-style: normal;
257
- margin-bottom: 10px;
258
- margin-bottom: 1rem;
259
- line-height: inherit;
260
- }
261
-
262
- summary {
263
- display: list-item;
264
- cursor: pointer;
265
- }
266
-
267
- a {
268
- color: #007bff;
269
- text-decoration: none;
270
- background-color: transparent;
271
- }
272
-
273
- a:hover, a:focus {
274
- text-decoration: underline;
275
- color: #0056b3;
276
- }
277
-
278
- a:not([href]):not([tabindex]) {
279
- color: inherit;
280
- text-decoration: none;
281
- }
282
-
283
- a:not([href]):not([tabindex]):hover,
284
- a:not([href]):not([tabindex]):focus,
285
- a:not([href]):not([class]),
286
- a:not([href]):not([class]):hover {
287
- color: inherit;
288
- text-decoration: none;
289
- }
290
-
291
- a:not([href]):not([tabindex]):focus {
292
- outline: 0;
293
- }
294
-
295
- menu,
296
- ol,
297
- ul,
298
- dl {
299
- margin: 0 0 20px 0;
300
- margin: 0 0 2rem 0;
301
- padding: 0;
302
- }
303
-
304
- menu ul,
305
- menu ol,
306
- ul ul,
307
- ul ol,
308
- ol ol,
309
- ol ul,
310
- dd {
311
- margin-bottom: 0;
312
- }
313
-
314
- ul,
315
- ol {
316
- margin-left: 20px;
317
- margin-left: 2rem;
318
- }
319
-
320
- nav ol,
321
- nav ul {
322
- list-style: none;
323
- list-style-image: none;
324
- margin-left: 0;
325
- }
326
-
327
- dt {
328
- font-weight: 700;
329
- }
330
-
331
- dd {
332
- margin-left: 0;
333
- }
334
-
335
- nav li:before {
336
- content: '\200B';
337
- position: absolute;
338
- }
339
-
340
- audio,
341
- canvas,
342
- progress,
343
- video {
344
- display: inline-block;
345
- }
346
-
347
- img,
348
- canvas,
349
- audio,
350
- video,
351
- iframe,
352
- object,
353
- embed {
354
- max-width: 100%;
355
- }
356
-
357
- audio,
358
- video,
359
- canvas,
360
- img,
361
- svg {
362
- vertical-align: middle;
363
- }
364
-
365
- img {
366
- height: auto;
367
- border-style: none;
368
- }
369
-
370
- figure {
371
- margin: 0;
372
- }
373
-
374
- figure,
375
- figcaption {
376
- display: block;
377
- }
378
-
379
- figcaption {
380
- line-height: 1.375;
381
- font-size: 90%;
382
- }
383
-
384
- video {
385
- height: auto;
386
- }
387
-
388
- audio {
389
- width: 100%;
390
- }
391
-
392
- audio:not([controls]) {
393
- display: none;
394
- height: 0;
395
- }
396
-
397
- svg:not(:root) {
398
- overflow: hidden;
399
- }
400
-
401
- svg:not([fill]) {
402
- fill: currentColor;
403
- }
404
-
405
- progress,
406
- meter {
407
- display: inline-block;
408
- vertical-align: baseline;
409
- width: 100%;
410
- max-width: 100%;
411
- }
412
-
413
- progress[value] {
414
- -webkit-appearance: none;
415
- -moz-appearance: none;
416
- appearance: none;
417
- border: none;
418
- height: 20px;
419
- height: 2rem;
420
- background: #ccc;
421
- color: #007bff;
422
- }
423
-
424
- progress[value]::-webkit-progress-bar {
425
- background: #ccc;
426
- }
427
-
428
- progress[value]::-webkit-progress-value {
429
- background: #007bff;
430
- }
431
-
432
- iframe {
433
- border-style: none;
434
- }
435
-
436
- html input,
437
- button,
438
- select,
439
- optgroup,
440
- textarea {
441
- color: inherit;
442
- font-family: inherit;
443
- font-size: inherit;
444
- line-height: inherit;
445
- }
446
-
447
- html input,
448
- button,
449
- [type='radio'],
450
- [type='checkbox'],
451
- select,
452
- optgroup,
453
- textarea {
454
- margin: 0;
455
- }
456
-
457
- html input,
458
- select,
459
- textarea,
460
- legend {
461
- width: 100%;
462
- }
463
-
464
- html label,
465
- button,
466
- [type='image'],
467
- [type='submit'],
468
- [type='reset'],
469
- html [type='button'],
470
- [type='radio'],
471
- [type='checkbox'] {
472
- width: auto;
473
- }
474
-
475
- html input,
476
- label,
477
- select,
478
- textarea,
479
- button,
480
- html [type='button'],
481
- [type='reset'],
482
- [type='submit'],
483
- output {
484
- display: inline-block;
485
- }
486
-
487
- [type='file'] {
488
- display: block;
489
- background-color: transparent;
490
- }
491
-
492
- button,
493
- html input,
494
- select,
495
- textarea {
496
- background-image: none;
497
- }
498
-
499
- input,
500
- select,
501
- textarea {
502
- vertical-align: baseline;
503
- }
504
-
505
- form {
506
- margin: 0;
507
- }
508
-
509
- fieldset {
510
- border: 0;
511
- padding: 0;
512
- margin: 0;
513
- min-width: 0;
514
- }
515
-
516
- legend {
517
- display: table;
518
- max-width: 100%;
519
- white-space: normal;
520
- border: 0;
521
- padding: 0;
522
- font-weight: 400;
523
- margin-bottom: 5px;
524
- margin-bottom: 0.5rem;
525
- font-size: inherit;
526
- line-height: 1.375;
527
- color: inherit;
528
- }
529
-
530
- label {
531
- font-weight: 400;
532
- font-size: 90%;
533
- line-height: 1.375;
534
- margin-bottom: 5px;
535
- margin-bottom: 0.5rem;
536
- }
537
-
538
- label input,
539
- label select,
540
- label textarea {
541
- font-size: 110%;
542
- }
543
-
544
- [type='number']::-webkit-outer-spin-button,
545
- [type='number']::-webkit-inner-spin-button {
546
- height: auto;
547
- }
548
-
549
- ::-webkit-datetime-edit-fields-wrapper,
550
- ::-webkit-datetime-edit-text,
551
- ::-webkit-datetime-edit-minute,
552
- ::-webkit-datetime-edit-hour-field,
553
- ::-webkit-datetime-edit-day-field,
554
- ::-webkit-datetime-edit-month-field,
555
- ::-webkit-datetime-edit-year-field {
556
- padding: 0;
557
- }
558
-
559
- ::-webkit-color-swatch-wrapper {
560
- padding: 0;
561
- }
562
-
563
- [type='search'] {
564
- outline-offset: -2.5px;
565
- outline-offset: -0.25rem;
566
- }
567
-
568
- output {
569
- vertical-align: middle;
570
- }
571
-
572
- button,
573
- select {
574
- text-transform: none;
575
- }
576
-
577
- select {
578
- word-wrap: normal;
579
- }
580
-
581
- [list]::-webkit-calendar-picker-indicator {
582
- display: none;
583
- }
584
-
585
- optgroup {
586
- font-family: inherit;
587
- font-size: inherit;
588
- font-style: inherit;
589
- font-weight: 700;
590
- font-weight: 600;
591
- }
592
-
593
- button,
594
- html [type="button"],
595
- [type="reset"],
596
- [type="submit"],
597
- [type="email"],
598
- [type="number"],
599
- [type="text"],
600
- [type="tel"],
601
- [type="date"],
602
- [type="datetime-local"],
603
- [type="month"],
604
- [type="week"],
605
- [type="url"],
606
- [type="image"],
607
- [type="password"],
608
- [type="search"],
609
- [type="search"]::-webkit-search-decoration,
610
- [type="search"]::-webkit-search-cancel-button,
611
- input[list],
612
- textarea {
613
- -webkit-appearance: none;
614
- }
615
-
616
- ::-webkit-file-upload-button {
617
- -webkit-appearance: button;
618
- font: inherit;
619
- }
620
-
621
- button,
622
- input,
623
- select,
624
- textarea {
625
- border-radius: 2.5px;
626
- border-radius: 0.25rem;
627
- }
628
-
629
- [type='radio'] {
630
- border-radius: 50%;
631
- }
632
-
633
- [type='checkbox'] {
634
- border-radius: 5px;
635
- border-radius: 0.5rem;
636
- }
637
-
638
- [type='radio'],
639
- [type='checkbox'] {
640
- padding: 0;
641
- background-color: #fff;
642
- }
643
-
644
- [type='range'] {
645
- background-color: transparent;
646
- }
647
-
648
- select[size],
649
- select[multiple] {
650
- height: auto;
651
- }
652
-
653
- select[multiple] {
654
- background-image: none;
655
- }
656
-
657
- textarea {
658
- height: auto;
659
- min-height: 60px;
660
- min-height: 6rem;
661
- overflow: auto;
662
- vertical-align: top;
663
- resize: vertical;
664
- }
665
-
666
- ::-moz-focus-inner {
667
- padding: 0;
668
- border-style: none;
669
- }
670
-
671
- button,
672
- [type='button'],
673
- [type='reset'],
674
- [type='submit'] {
675
- line-height: normal;
676
- text-align: center;
677
- margin: 0;
678
- background-clip: padding-box;
679
- vertical-align: baseline;
680
- overflow: visible;
681
- -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
682
- -webkit-user-select: none;
683
- -moz-user-select: none;
684
- -ms-user-select: none;
685
- user-select: none;
686
- border: 0;
687
- background-image: none;
688
- }
689
-
690
- button:hover, button:active, button:focus,
691
- [type='button']:hover,
692
- [type='button']:active,
693
- [type='button']:focus,
694
- [type='reset']:hover,
695
- [type='reset']:active,
696
- [type='reset']:focus,
697
- [type='submit']:hover,
698
- [type='submit']:active,
699
- [type='submit']:focus {
700
- text-decoration: none;
701
- color: #222;
702
- }
703
-
704
- button,
705
- select,
706
- input[type='submit'],
707
- input[type='button'],
708
- [type='checkbox'],
709
- [type='range'],
710
- [type='radio'],
711
- [role='button'] {
712
- cursor: pointer;
713
- }
714
-
715
- input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
716
- color: #666;
717
- }
718
-
719
- input::-moz-placeholder, textarea::-moz-placeholder {
720
- color: #666;
721
- }
722
-
723
- input:-ms-input-placeholder, textarea:-ms-input-placeholder {
724
- color: #666;
725
- }
726
-
727
- input::placeholder,
728
- textarea::placeholder {
729
- color: #666;
730
- }
731
-
732
- :-moz-ui-invalid {
733
- box-shadow: none;
734
- }
735
-
736
- [type='email'],
737
- [type='number'],
738
- [type='password'],
739
- [type='tel'],
740
- [type='search'],
741
- [type='text'],
742
- [type='date'],
743
- [type='datetime-local'],
744
- [type='month'],
745
- [type='time'],
746
- [type='week'],
747
- [type='time'],
748
- [type='url'],
749
- input[list],
750
- select,
751
- textarea {
752
- background-color: #fff;
753
- border: 1px solid #999;
754
- padding: 5px 7.5px;
755
- padding: 0.5rem 0.75rem;
756
- }
757
-
758
- [type='email']:active, [type='email']:focus,
759
- [type='number']:active,
760
- [type='number']:focus,
761
- [type='password']:active,
762
- [type='password']:focus,
763
- [type='tel']:active,
764
- [type='tel']:focus,
765
- [type='search']:active,
766
- [type='search']:focus,
767
- [type='text']:active,
768
- [type='text']:focus,
769
- [type='date']:active,
770
- [type='date']:focus,
771
- [type='datetime-local']:active,
772
- [type='datetime-local']:focus,
773
- [type='month']:active,
774
- [type='month']:focus,
775
- [type='time']:active,
776
- [type='time']:focus,
777
- [type='week']:active,
778
- [type='week']:focus,
779
- [type='time']:active,
780
- [type='time']:focus,
781
- [type='url']:active,
782
- [type='url']:focus,
783
- input[list]:active,
784
- input[list]:focus,
785
- select:active,
786
- select:focus,
787
- textarea:active,
788
- textarea:focus,
789
- [type='radio']:active,
790
- [type='radio']:focus,
791
- [type='checkbox']:active,
792
- [type='checkbox']:focus {
793
- transition: border .2s, background-color .2s, box-shadow .2s;
794
- border-color: #007bff;
795
- box-shadow: 0 0 0 3px rgba(0, 86, 179, 0.25);
796
- }
797
-
798
- button,
799
- [type='button'],
800
- [type='reset'],
801
- [type='submit'] {
802
- color: #222;
803
- padding: 6.66667px 13.33333px;
804
- padding: 0.66667rem 1.33333rem;
805
- background: #ccc;
806
- transition: color .2s, background .2s, box-shadow .2s;
807
- }
808
-
809
- button:hover, button:active, button:focus,
810
- [type='button']:hover,
811
- [type='button']:active,
812
- [type='button']:focus,
813
- [type='reset']:hover,
814
- [type='reset']:active,
815
- [type='reset']:focus,
816
- [type='submit']:hover,
817
- [type='submit']:active,
818
- [type='submit']:focus {
819
- text-decoration: none;
820
- color: #222;
821
- background: #b3b3b3;
822
- }
823
-
824
- button:active, button:focus,
825
- [type='button']:active,
826
- [type='button']:focus,
827
- [type='reset']:active,
828
- [type='reset']:focus,
829
- [type='submit']:active,
830
- [type='submit']:focus {
831
- box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.15);
832
- }
833
-
834
- fieldset[disabled] button,
835
- fieldset[disabled] input,
836
- fieldset[disabled] input:after,
837
- fieldset[disabled] input:before,
838
- fieldset[disabled] input:checked,
839
- fieldset[disabled] select,
840
- fieldset[disabled] textarea,
841
- fieldset[disabled] label,
842
- button[disabled],
843
- input[disabled],
844
- input[disabled]:after,
845
- input[disabled]:before,
846
- input[disabled]:checked,
847
- select[disabled],
848
- textarea[disabled],
849
- label[disabled],
850
- button:disabled,
851
- input:disabled,
852
- input:disabled:after,
853
- input:disabled:before,
854
- input:disabled:checked,
855
- select:disabled,
856
- textarea:disabled,
857
- label:disabled,
858
- button[aria-disabled="true"],
859
- input[aria-disabled="true"],
860
- input[aria-disabled="true"]:after,
861
- input[aria-disabled="true"]:before,
862
- input[aria-disabled="true"]:checked,
863
- select[aria-disabled="true"],
864
- textarea[aria-disabled="true"],
865
- label[aria-disabled="true"] {
866
- cursor: default !important;
867
- cursor: not-allowed !important;
868
- pointer-events: none !important;
869
- -webkit-user-select: none !important;
870
- -moz-user-select: none !important;
871
- -ms-user-select: none !important;
872
- user-select: none !important;
873
- box-shadow: none !important;
874
- opacity: .5 !important;
875
- }
876
-
877
- select:not([size]):not([multiple]) {
878
- -webkit-appearance: none;
879
- -moz-appearance: none;
880
- appearance: none;
881
- }
882
-
883
- select::-ms-expand {
884
- display: none;
885
- }
886
-
887
- select:not([size]):not([multiple]) {
888
- background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.85rem center/8px 10px;
889
- padding-right: 20px;
890
- padding-right: 2rem;
891
- }
892
-
893
- *[dir='rtl'] select:not([size]):not([multiple]),
894
- select[dir='rtl']:not([size]):not([multiple]) {
895
- background-position: left .85rem top 50%;
896
- padding-right: 7.5px;
897
- padding-right: 0.75rem;
898
- padding-left: 20px;
899
- padding-left: 2rem;
900
- }
901
-
902
- @supports ((-webkit-appearance: none) or (-moz-appearance: none) or (appearance: none)) {
903
- [type='checkbox'],
904
- [type='radio'] {
905
- -webkit-appearance: none;
906
- -moz-appearance: none;
907
- appearance: none;
908
- height: 1.8rem;
909
- width: 1.8rem;
910
- vertical-align: top;
911
- position: relative;
912
- border: 1px solid #999;
913
- }
914
- [type='checkbox'] + label,
915
- [type='radio'] + label {
916
- line-height: 1.8rem;
917
- vertical-align: top;
918
- margin-left: 5px;
919
- margin-left: 0.5rem;
920
- }
921
- *[dir='rtl'] [type='checkbox'] + label,
922
- [type='checkbox'][dir='rtl'] + label, *[dir='rtl']
923
- [type='radio'] + label,
924
- [type='radio'][dir='rtl'] + label {
925
- margin-left: 0;
926
- margin-right: 5px;
927
- margin-right: 0.5rem;
928
- }
929
- [type='checkbox']:after,
930
- [type='radio']:after {
931
- content: '';
932
- display: block;
933
- position: absolute;
934
- }
935
- [type='checkbox']:checked,
936
- [type='radio']:checked {
937
- background-color: #007bff;
938
- border-color: #000;
939
- }
940
- [type='radio']:after {
941
- width: 1.8rem;
942
- height: 1.8rem;
943
- left: -.05rem;
944
- top: -.05rem;
945
- border-radius: 50%;
946
- background: #fff;
947
- -webkit-transform: scale(0.35);
948
- transform: scale(0.35);
949
- }
950
- [type='checkbox']:after {
951
- width: .6rem;
952
- height: .8rem;
953
- border: 2px solid #fff;
954
- border-top: 0;
955
- border-left: 0;
956
- left: 35%;
957
- top: 20%;
958
- -webkit-transform: rotate(43deg);
959
- transform: rotate(43deg);
960
- }
961
- }
962
-
963
- @supports ((-webkit-appearance: none) or (-moz-appearance: none) or (appearance: none)) {
964
- [type='range'] {
965
- -webkit-appearance: none;
966
- -moz-appearance: none;
967
- appearance: none;
968
- width: 100%;
969
- height: 1.4rem;
970
- }
971
- [type='range']::-webkit-slider-thumb {
972
- border: 0;
973
- -webkit-appearance: none;
974
- appearance: none;
975
- width: 1.5rem;
976
- height: 1.5rem;
977
- margin-top: -.25rem;
978
- background-color: #007bff;
979
- border-radius: 1.5rem;
980
- -webkit-transition: background-color .15s ease-in-out,
981
  border-color .15s ease-in-out, box-shadow .15s ease-in-out;
982
- transition: background-color .15s ease-in-out,
983
1
  border-color .15s ease-in-out, box-shadow .15s ease-in-out;
984
- }
985
- [type='range']::-webkit-slider-thumb:active {
986
- background-color: #007bff;
987
- }
988
- [type='range']::-moz-range-thumb {
989
- border: 0;
990
- -moz-appearance: none;
991
- appearance: none;
992
- width: 1.5rem;
993
- height: 1.5rem;
994
- background-color: #007bff;
995
- border-radius: 1.5rem;
996
- -moz-transition: background-color .15s ease-in-out,
997
2
  border-color .15s ease-in-out, box-shadow .15s ease-in-out;
998
- transition: background-color .15s ease-in-out,
999
3
  border-color .15s ease-in-out, box-shadow .15s ease-in-out;
1000
- }
1001
- [type='range']::-moz-range-thumb:active {
1002
- background-color: #007bff;
1003
- }
1004
- [type='range']::-webkit-slider-runnable-track {
1005
- color: transparent;
1006
- border-color: transparent;
1007
- width: 100%;
1008
- height: .65rem;
1009
- cursor: pointer;
1010
- background-color: #e9e9e9;
1011
- }
1012
- [type='range']::-moz-range-track {
1013
- color: transparent;
1014
- border-color: transparent;
1015
- width: 100%;
1016
- height: .65rem;
1017
- cursor: pointer;
1018
- background-color: #e9e9e9;
1019
- }
1020
- [type='range']:focus {
1021
- outline: none;
1022
- }
1023
- [type='range']:focus::-webkit-slider-thumb {
1024
- box-shadow: 0 0 0 0.1rem #fff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
1025
- }
1026
- [type='range']:focus::-moz-slider-thumb {
1027
- box-shadow: 0 0 0 0.1rem #fff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
1028
- }
1029
- [type='range']::-moz-focus-outer {
1030
- border: 0;
1031
- }
1032
- [type='range']:focus::-webkit-slider-thumb {
1033
- box-shadow: 0 0 0 0.1rem #fff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
1034
- }
1035
- [type='range']:focus::-moz-range-thumb {
1036
- box-shadow: 0 0 0 0.1rem #fff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
1037
- }
1038
- [type='range']:disabled {
1039
- pointer-events: none;
1040
- }
1041
- [type='range']:disabled::-webkit-slider-thumb {
1042
- background-color: #ccc;
1043
- }
1044
- [type='range']:disabled::-moz-slider-thumb {
1045
- background-color: #ccc;
1046
- }
1047
- }
1048
-
1049
- table {
1050
- max-width: 100%;
1051
- border-collapse: collapse;
1052
- }
1053
-
1054
- thead,
1055
- tbody,
1056
- tfoot,
1057
- tr,
1058
- td,
1059
- th {
1060
- border-color: inherit;
1061
- border-style: solid;
1062
- border-width: 0;
1063
- }
1064
-
1065
- thead th {
1066
- vertical-align: bottom;
1067
- }
1068
-
1069
- th,
1070
- td {
1071
- vertical-align: top;
1072
- }
1073
-
1074
- th {
1075
- text-align: inherit;
1076
- font-weight: 700;
1077
- }
1078
-
1079
- caption {
1080
- padding-top: 5px;
1081
- padding-top: 0.5rem;
1082
- padding-bottom: 5px;
1083
- padding-bottom: 0.5rem;
1084
- color: #999;
1085
- text-align: left;
1086
- caption-side: bottom;
1087
- line-height: 1.375;
1088
- font-size: 90%;
1089
- }
1090
-
1091
- @media (prefers-color-scheme: dark) {
1092
- html {
1093
- scrollbar-color: #595959 #111;
1094
- }
1095
- ::-webkit-scrollbar {
1096
- width: 1.5rem;
1097
- height: 1.5rem;
1098
- }
1099
- ::-webkit-scrollbar-thumb {
1100
- background-color: #595959;
1101
- }
1102
- ::-webkit-scrollbar-thumb:hover {
1103
- background-color: gray;
1104
- }
1105
- ::-webkit-scrollbar-track {
1106
- background-color: #111;
1107
- }
1108
- html {
1109
- color: #f0f0f0;
1110
- }
1111
- body {
1112
- background-color: #242424;
1113
- }
1114
- a {
1115
- color: #66b0ff;
1116
- }
1117
- a:hover, a:focus {
1118
- color: #1a88ff;
1119
- }
1120
- mark {
1121
- background-color: #cccc00;
1122
- }
1123
- ins {
1124
- background-color: #b3b300;
1125
- }
1126
- [type='email'],
1127
- [type='number'],
1128
- [type='password'],
1129
- [type='tel'],
1130
- [type='search'],
1131
- [type='text'],
1132
- [type='date'],
1133
- [type='datetime-local'],
1134
- [type='month'],
1135
- [type='time'],
1136
- [type='week'],
1137
- [type='time'],
1138
- [type='url'],
1139
- [type='range'],
1140
- input[list],
1141
- select,
1142
- select:not([size]):not([multiple]),
1143
- textarea {
1144
- background-color: #111;
1145
- border-color: #000;
1146
- color: #ccc;
1147
- }
1148
- [type='email']:active, [type='email']:focus,
1149
- [type='number']:active,
1150
- [type='number']:focus,
1151
- [type='password']:active,
1152
- [type='password']:focus,
1153
- [type='tel']:active,
1154
- [type='tel']:focus,
1155
- [type='search']:active,
1156
- [type='search']:focus,
1157
- [type='text']:active,
1158
- [type='text']:focus,
1159
- [type='date']:active,
1160
- [type='date']:focus,
1161
- [type='datetime-local']:active,
1162
- [type='datetime-local']:focus,
1163
- [type='month']:active,
1164
- [type='month']:focus,
1165
- [type='time']:active,
1166
- [type='time']:focus,
1167
- [type='week']:active,
1168
- [type='week']:focus,
1169
- [type='time']:active,
1170
- [type='time']:focus,
1171
- [type='url']:active,
1172
- [type='url']:focus,
1173
- [type='range']:active,
1174
- [type='range']:focus,
1175
- input[list]:active,
1176
- input[list]:focus,
1177
- select:active,
1178
- select:focus,
1179
- select:not([size]):not([multiple]):active,
1180
- select:not([size]):not([multiple]):focus,
1181
- textarea:active,
1182
- textarea:focus {
1183
- background-color: #111;
1184
- border-color: #3395ff;
1185
- }
1186
- [type='email']:active, [type='email']:focus,
1187
- [type='number']:active,
1188
- [type='number']:focus,
1189
- [type='password']:active,
1190
- [type='password']:focus,
1191
- [type='tel']:active,
1192
- [type='tel']:focus,
1193
- [type='search']:active,
1194
- [type='search']:focus,
1195
- [type='text']:active,
1196
- [type='text']:focus,
1197
- [type='date']:active,
1198
- [type='date']:focus,
1199
- [type='datetime-local']:active,
1200
- [type='datetime-local']:focus,
1201
- [type='month']:active,
1202
- [type='month']:focus,
1203
- [type='time']:active,
1204
- [type='time']:focus,
1205
- [type='week']:active,
1206
- [type='week']:focus,
1207
- [type='time']:active,
1208
- [type='time']:focus,
1209
- [type='url']:active,
1210
- [type='url']:focus,
1211
- input[list]:active,
1212
- input[list]:focus,
1213
- select:active,
1214
- select:focus,
1215
- select:not([size]):not([multiple]):active,
1216
- select:not([size]):not([multiple]):focus,
1217
- textarea:active,
1218
- textarea:focus {
1219
- box-shadow: 0 0 0 3px rgba(3, 102, 214, 0.5);
1220
- }
1221
- select:not([size]):not([multiple]) {
1222
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23f0f0f0' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e");
1223
- }
1224
- }
1225
-
1226
- @media screen and (prefers-color-scheme: dark) and (min-width: 0\0) and (min-resolution: 0.001dpcm) {
1227
- select:not([size]):not([multiple]),
1228
- *[dir="rtl"] select:not([size]):not([multiple]),
1229
- select[dir="rtl"]:not([size]):not([multiple]) {
1230
- background-image: none;
1231
- }
1232
- }
1233
-
1234
- @media (prefers-color-scheme: dark) {
1235
- @supports ((-webkit-appearance: none) or (-moz-appearance: none) or (appearance: none)) {
1236
- [type='range'] {
1237
- background-color: transparent;
1238
- }
1239
- [type='range']:focus {
1240
- background-color: transparent;
1241
- }
1242
- [type='range']::-webkit-slider-runnable-track {
1243
- background-color: #111;
1244
- }
1245
- [type='range']::-moz-range-track {
1246
- background-color: #111;
1247
- }
1248
- }
1249
- input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
1250
- color: #999;
1251
- }
1252
- input::-moz-placeholder, textarea::-moz-placeholder {
1253
- color: #999;
1254
- }
1255
- input:-ms-input-placeholder, textarea:-ms-input-placeholder {
1256
- color: #999;
1257
- }
1258
- input::placeholder,
1259
- textarea::placeholder {
1260
- color: #999;
1261
- }
1262
- button,
1263
- [type='button'],
1264
- [type='reset'],
1265
- [type='submit'] {
1266
- background: #ccc;
1267
- }
1268
- button:hover, button:active, button:focus,
1269
- [type='button']:hover,
1270
- [type='button']:active,
1271
- [type='button']:focus,
1272
- [type='reset']:hover,
1273
- [type='reset']:active,
1274
- [type='reset']:focus,
1275
- [type='submit']:hover,
1276
- [type='submit']:active,
1277
- [type='submit']:focus {
1278
- background: #b3b3b3;
1279
- }
1280
- button:active, button:focus,
1281
- [type='button']:active,
1282
- [type='button']:focus,
1283
- [type='reset']:active,
1284
- [type='reset']:focus,
1285
- [type='submit']:active,
1286
- [type='submit']:focus {
1287
- box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.45);
1288
- }
1289
- button:active, button:focus,
1290
- [type='button']:active,
1291
- [type='button']:focus,
1292
- [type='reset']:active,
1293
- [type='reset']:focus,
1294
- [type='submit']:active,
1295
- [type='submit']:focus {
1296
- box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.45);
1297
- }
1298
- a:focus,
1299
- input:focus {
1300
- outline-color: #b37400;
1301
- }
1302
- :focus-visible {
1303
- outline-color: #b37400;
1304
- }
1305
- }