@transferwise/neptune-css 14.9.2 → 14.9.3

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 (49) hide show
  1. package/dist/css/border-radius.css +0 -8
  2. package/dist/css/flex.css +253 -417
  3. package/dist/css/navbar-base.css +339 -168
  4. package/dist/css/navbar.css +107 -41
  5. package/dist/css/neptune-addons.css +893 -421
  6. package/dist/css/neptune-core.css +200 -163
  7. package/dist/css/neptune.css +15471 -14675
  8. package/dist/css/utilities.css +72 -1202
  9. package/package.json +1 -1
  10. package/src/less/addons/_display-utilities.less +159 -0
  11. package/src/less/addons/_spacing-utilities.less +26 -3
  12. package/src/less/addons/_utilities.less +147 -0
  13. package/src/less/border-radius.less +3 -1
  14. package/src/less/core/_scaffolding.less +27 -7
  15. package/src/less/core/_typography-utilities.less +237 -17
  16. package/src/less/flex.less +18 -9
  17. package/src/less/{addons → mixins}/_center-block.less +4 -2
  18. package/src/less/mixins/_flex.less +105 -0
  19. package/src/less/navbar.less +2 -10
  20. package/src/less/neptune-addons.less +1 -4
  21. package/src/less/utilities.less +141 -29
  22. package/src/less/utilities/align-items.less +0 -107
  23. package/src/less/utilities/align-self.less +0 -107
  24. package/src/less/utilities/border-radius.less +0 -11
  25. package/src/less/utilities/color.less +0 -70
  26. package/src/less/utilities/cursor.less +0 -3
  27. package/src/less/utilities/display.less +0 -178
  28. package/src/less/utilities/flex-direction.less +0 -47
  29. package/src/less/utilities/flex-grow.less +0 -27
  30. package/src/less/utilities/flex-wrap.less +0 -47
  31. package/src/less/utilities/float.less +0 -77
  32. package/src/less/utilities/font-weight.less +0 -11
  33. package/src/less/utilities/gap.less +0 -3
  34. package/src/less/utilities/justify-content.less +0 -107
  35. package/src/less/utilities/margin.less +0 -192
  36. package/src/less/utilities/max-width.less +0 -3
  37. package/src/less/utilities/order.less +0 -87
  38. package/src/less/utilities/outline-style.less +0 -8
  39. package/src/less/utilities/overflow-wrap.less +0 -3
  40. package/src/less/utilities/padding.less +0 -179
  41. package/src/less/utilities/position.less +0 -3
  42. package/src/less/utilities/rotate.less +0 -12
  43. package/src/less/utilities/screen-reader.less +0 -24
  44. package/src/less/utilities/text-align.less +0 -87
  45. package/src/less/utilities/text-decoration-line.less +0 -8
  46. package/src/less/utilities/text-overflow.less +0 -7
  47. package/src/less/utilities/text-transform.less +0 -11
  48. package/src/less/utilities/visibility.less +0 -3
  49. package/src/less/utilities/white-space.less +0 -27
@@ -1,518 +1,53 @@
1
- .center-block {
2
- margin-left: auto;
3
- margin-right: auto;
4
- display: block;
5
- }
6
- .align-items-start {
7
- align-items: flex-start;
8
- }
9
- .align-items-end {
10
- align-items: flex-end;
11
- }
12
- .align-items-center {
13
- align-items: center;
14
- }
15
- .align-items-baseline {
16
- align-items: baseline;
17
- }
18
- .align-items-stretch {
19
- align-items: stretch;
20
- }
21
- @media (min-width: 576px) {
22
- .align-items-start--sm {
23
- align-items: flex-start;
24
- }
25
- .align-items-end--sm {
26
- align-items: flex-end;
27
- }
28
- .align-items-center--sm {
29
- align-items: center;
30
- }
31
- .align-items-baseline--sm {
32
- align-items: baseline;
33
- }
34
- .align-items-stretch--sm {
35
- align-items: stretch;
36
- }
37
- }
38
- @media (min-width: 768px) {
39
- .align-items-start--md {
40
- align-items: flex-start;
41
- }
42
- .align-items-end--md {
43
- align-items: flex-end;
44
- }
45
- .align-items-center--md {
46
- align-items: center;
47
- }
48
- .align-items-baseline--md {
49
- align-items: baseline;
50
- }
51
- .align-items-stretch--md {
52
- align-items: stretch;
53
- }
54
- }
55
- @media (min-width: 992px) {
56
- .align-items-start--lg {
57
- align-items: flex-start;
58
- }
59
- .align-items-end--lg {
60
- align-items: flex-end;
61
- }
62
- .align-items-center--lg {
63
- align-items: center;
64
- }
65
- .align-items-baseline--lg {
66
- align-items: baseline;
67
- }
68
- .align-items-stretch--lg {
69
- align-items: stretch;
70
- }
71
- }
72
- @media (min-width: 1200px) {
73
- .align-items-start--xl {
74
- align-items: flex-start;
75
- }
76
- .align-items-end--xl {
77
- align-items: flex-end;
78
- }
79
- .align-items-center--xl {
80
- align-items: center;
81
- }
82
- .align-items-baseline--xl {
83
- align-items: baseline;
84
- }
85
- .align-items-stretch--xl {
86
- align-items: stretch;
87
- }
88
- }
89
- .align-self-start {
90
- align-self: flex-start;
91
- }
92
- .align-self-end {
93
- align-self: flex-end;
94
- }
95
- .align-self-center {
96
- align-self: center;
97
- }
98
- .align-self-stretch {
99
- align-self: stretch;
100
- }
101
- .align-self-baseline {
102
- align-self: baseline;
103
- }
104
- @media (min-width: 576px) {
105
- .align-self-start--sm {
106
- align-self: flex-start;
107
- }
108
- .align-self-end--sm {
109
- align-self: flex-end;
110
- }
111
- .align-self-center--sm {
112
- align-self: center;
113
- }
114
- .align-self-stretch--sm {
115
- align-self: stretch;
116
- }
117
- .align-self-baseline--sm {
118
- align-self: baseline;
119
- }
120
- }
121
- @media (min-width: 768px) {
122
- .align-self-start--md {
123
- align-self: flex-start;
124
- }
125
- .align-self-end--md {
126
- align-self: flex-end;
127
- }
128
- .align-self-center--md {
129
- align-self: center;
130
- }
131
- .align-self-stretch--md {
132
- align-self: stretch;
133
- }
134
- .align-self-baseline--md {
135
- align-self: baseline;
136
- }
137
- }
138
- @media (min-width: 992px) {
139
- .align-self-start--lg {
140
- align-self: flex-start;
141
- }
142
- .align-self-end--lg {
143
- align-self: flex-end;
144
- }
145
- .align-self-center--lg {
146
- align-self: center;
147
- }
148
- .align-self-stretch--lg {
149
- align-self: stretch;
150
- }
151
- .align-self-baseline--lg {
152
- align-self: baseline;
153
- }
154
- }
155
- @media (min-width: 1200px) {
156
- .align-self-start--xl {
157
- align-self: flex-start;
158
- }
159
- .align-self-end--xl {
160
- align-self: flex-end;
161
- }
162
- .align-self-center--xl {
163
- align-self: center;
164
- }
165
- .align-self-stretch--xl {
166
- align-self: stretch;
167
- }
168
- .align-self-baseline--xl {
169
- align-self: baseline;
170
- }
171
- }
172
- .rounded-sm {
173
- border-radius: 2px;
174
- }
175
- .rounded {
176
- border-radius: 10px;
177
- border-radius: var(--radius-small);
178
- }
179
- .rounded-full {
180
- border-radius: 9999px;
181
- border-radius: var(--radius-full);
182
- }
183
- .text-primary {
184
- color: #37517e !important;
185
- color: var(--color-content-primary) !important;
186
- /* @DEPRECATED: .bg-primary use .bg-elevated or ThemeProvider with theme="forest-green" instead */
187
- }
188
- .bg-primary .text-primary {
189
- color: #ffffff !important;
190
- }
191
- .text-secondary {
192
- color: #5d7079 !important;
193
- color: var(--color-content-secondary) !important;
194
- }
195
- .text-muted {
196
- color: #768e9c !important;
197
- color: var(--color-content-tertiary) !important;
198
- }
199
- .text-accent,
200
- .text-info {
201
- color: var(--color-interactive-primary) !important;
202
- /* @DEPRECATED: .bg-primary use .bg-elevated or ThemeProvider with theme="forest-green" instead */
203
- }
204
- .bg-primary .text-accent,
205
- .bg-primary .text-info {
206
- color: #00b9ff !important;
207
- }
208
- .text-negative,
209
- .text-danger {
210
- color: var(--color-sentiment-negative) !important;
211
- /* @DEPRECATED: .bg-primary use .bg-elevated or ThemeProvider with theme="forest-green" instead */
212
- }
213
- .bg-primary .text-negative,
214
- .bg-primary .text-danger {
215
- color: #ffa6a9 !important;
216
- }
217
- .text-positive,
218
- .text-success {
219
- color: var(--color-sentiment-positive) !important;
220
- /* @DEPRECATED: .bg-primary use .bg-elevated or ThemeProvider with theme="forest-green" instead */
221
- }
222
- .bg-primary .text-positive,
223
- .bg-primary .text-success {
224
- color: #6fd698 !important;
225
- }
226
- /**
227
- * @deprecated This makes text inaccessible. Use background color in combination with `.text-primary` instead.
228
- */
229
- .text-warning {
230
- color: var(--color-sentiment-warning) !important;
231
- /* @DEPRECATED: .bg-primary use .bg-elevated or ThemeProvider with theme="forest-green" instead */
232
- }
233
- .bg-primary .text-warning {
234
- color: #ffd184 !important;
235
- }
236
- /**
237
- * @deprecated Navy colors are obsolete.
238
- */
239
- .text-inverse {
240
- color: #ffffff !important;
241
- }
242
- a.text-inverse:hover,
243
- a.text-inverse:focus {
244
- color: #c9cbce !important;
245
- }
246
- .clickable {
247
- cursor: pointer;
248
- }
249
- .d-block,
250
- .show {
251
- display: block !important;
252
- }
253
1
  .d-inline-block {
254
- display: inline-block !important;
2
+ display: inline-block;
255
3
  }
256
4
  .d-inline {
257
5
  display: inline;
258
6
  }
259
- .d-flex {
260
- display: flex;
261
- }
262
- .d-inline-flex {
263
- display: inline-flex;
264
- }
265
- .hidden,
266
- .hide,
267
- .visible-xs,
268
- .visible-xs-block,
269
- .visible-xs-inline-block,
270
- .visible-xs-inline,
271
- .visible-sm,
272
- .visible-sm-block,
273
- .visible-sm-inline-block,
274
- .visible-sm-inline,
275
- .visible-md,
276
- .visible-md-block,
277
- .visible-md-inline-block,
278
- .visible-md-inline,
279
- .visible-lg,
280
- .visible-lg-block,
281
- .visible-lg-inline-block,
282
- .visible-lg-inline,
283
- .visible-xl,
284
- .visible-xl-block,
285
- .visible-xl-inline-block,
286
- .visible-xl-inline {
287
- display: none !important;
288
- }
289
- @media (max-width: 575px) {
290
- .hidden-xs {
291
- display: none !important;
292
- }
293
- .visible-xs,
294
- .visible-xs-block {
295
- display: block !important;
296
- }
297
- .visible-xs-inline-block {
298
- display: inline-block !important;
299
- }
300
- .visible-xs-inline {
301
- display: inline !important;
302
- }
303
- }
304
- @media (min-width: 576px) {
305
- .d-flex--sm {
306
- display: flex;
307
- }
308
- .d-inline-flex--sm {
309
- display: inline-flex;
310
- }
311
- }
312
- @media (min-width: 576px) and (max-width: 767px) {
313
- .hidden-sm {
314
- display: none !important;
315
- }
316
- .visible-sm,
317
- .visible-sm-block {
318
- display: block !important;
319
- }
320
- .visible-sm-inline-block {
321
- display: inline-block !important;
322
- }
323
- .visible-sm-inline {
324
- display: inline !important;
325
- }
326
- }
327
- @media (min-width: 768px) {
328
- .d-flex--md {
329
- display: flex;
330
- }
331
- .d-inline-flex--md {
332
- display: inline-flex;
333
- }
334
- }
335
- @media (min-width: 768px) and (max-width: 991px) {
336
- .hidden-md {
337
- display: none !important;
338
- }
339
- .visible-md,
340
- .visible-md-block {
341
- display: block !important;
342
- }
343
- .visible-md-inline-block {
344
- display: inline-block !important;
345
- }
346
- .visible-md-inline {
347
- display: inline !important;
348
- }
349
- }
350
- @media (min-width: 992px) {
351
- .d-flex--lg {
352
- display: flex;
353
- }
354
- .d-inline-flex--lg {
355
- display: inline-flex;
356
- }
357
- }
358
- @media (min-width: 992px) and (max-width: 1199px) {
359
- .hidden-lg {
360
- display: none !important;
361
- }
362
- .visible-lg,
363
- .visible-lg-block {
364
- display: block !important;
365
- }
366
- .visible-lg-inline-block {
367
- display: inline-block !important;
368
- }
369
- .visible-lg-inline {
370
- display: inline !important;
371
- }
372
- }
373
- @media (min-width: 1200px) {
374
- .d-flex--xl {
375
- display: flex;
376
- }
377
- .d-inline-flex--xl {
378
- display: inline-flex;
379
- }
380
- .hidden-xl {
381
- display: none !important;
382
- }
383
- .visible-xl,
384
- .visible-xl-block {
385
- display: block !important;
386
- }
387
- .visible-xl-inline-block {
388
- display: inline-block !important;
389
- }
390
- .visible-xl-inline {
391
- display: inline !important;
392
- }
393
- }
394
- .flex-row {
395
- flex-direction: row;
396
- }
397
- .flex-column {
398
- flex-direction: column;
399
- }
400
- @media (min-width: 576px) {
401
- .flex-row--sm {
402
- flex-direction: row;
403
- }
404
- .flex-column--sm {
405
- flex-direction: column;
406
- }
407
- }
408
- @media (min-width: 768px) {
409
- .flex-row--md {
410
- flex-direction: row;
411
- }
412
- .flex-column--md {
413
- flex-direction: column;
414
- }
415
- }
416
- @media (min-width: 992px) {
417
- .flex-row--lg {
418
- flex-direction: row;
419
- }
420
- .flex-column--lg {
421
- flex-direction: column;
422
- }
423
- }
424
- @media (min-width: 1200px) {
425
- .flex-row--xl {
426
- flex-direction: row;
427
- }
428
- .flex-column--xl {
429
- flex-direction: column;
430
- }
431
- }
432
- .flex-grow-1 {
433
- flex-grow: 1;
434
- }
435
- @media (min-width: 576px) {
436
- .flex-grow-1--sm {
437
- flex-grow: 1;
438
- }
439
- }
440
- @media (min-width: 768px) {
441
- .flex-grow-1--md {
442
- flex-grow: 1;
443
- }
444
- }
445
- @media (min-width: 992px) {
446
- .flex-grow-1--lg {
447
- flex-grow: 1;
448
- }
449
- }
450
- @media (min-width: 1200px) {
451
- .flex-grow-1--xl {
452
- flex-grow: 1;
453
- }
454
- }
455
- .flex-wrap {
456
- flex-wrap: wrap;
457
- }
458
- .flex-nowrap {
459
- flex-wrap: nowrap;
7
+ .clearfix::before,
8
+ .clearfix::after {
9
+ content: " ";
10
+ display: table;
460
11
  }
461
- @media (min-width: 576px) {
462
- .flex-wrap--sm {
463
- flex-wrap: wrap;
464
- }
465
- .flex-nowrap--sm {
466
- flex-wrap: nowrap;
467
- }
12
+ .clearfix::after {
13
+ clear: both;
468
14
  }
469
- @media (min-width: 768px) {
470
- .flex-wrap--md {
471
- flex-wrap: wrap;
472
- }
473
- .flex-nowrap--md {
474
- flex-wrap: nowrap;
475
- }
15
+ .center-block {
16
+ display: block;
17
+ margin-left: auto;
18
+ margin-right: auto;
476
19
  }
477
- @media (min-width: 992px) {
478
- .flex-wrap--lg {
479
- flex-wrap: wrap;
480
- }
481
- .flex-nowrap--lg {
482
- flex-wrap: nowrap;
483
- }
20
+ .pull-right,
21
+ .pull-xs-right {
22
+ float: right !important;
484
23
  }
485
- @media (min-width: 1200px) {
486
- .flex-wrap--xl {
487
- flex-wrap: wrap;
488
- }
489
- .flex-nowrap--xl {
490
- flex-wrap: nowrap;
491
- }
24
+ [dir="rtl"] .pull-right,
25
+ [dir="rtl"] .pull-xs-right {
26
+ float: left !important;
492
27
  }
493
28
  .pull-left,
494
29
  .pull-xs-left {
495
- float: inline-start !important;
496
- }
497
- .pull-right,
498
- .pull-xs-right {
499
- float: inline-end !important;
30
+ float: left !important;
500
31
  }
501
- .pull-right-single-direction {
32
+ [dir="rtl"] .pull-left,
33
+ [dir="rtl"] .pull-xs-left {
502
34
  float: right !important;
503
35
  }
504
- .pull-left-single-direction {
505
- float: left !important;
506
- }
507
36
  .pull-xs-none {
508
37
  float: none !important;
509
38
  }
510
39
  @media (min-width: 576px) {
511
40
  .pull-sm-left {
512
- float: inline-start !important;
41
+ float: left !important;
42
+ }
43
+ [dir="rtl"] .pull-sm-left {
44
+ float: right !important;
513
45
  }
514
46
  .pull-sm-right {
515
- float: inline-end !important;
47
+ float: right !important;
48
+ }
49
+ [dir="rtl"] .pull-sm-right {
50
+ float: left !important;
516
51
  }
517
52
  .pull-sm-none {
518
53
  float: none !important;
@@ -520,10 +55,16 @@ a.text-inverse:focus {
520
55
  }
521
56
  @media (min-width: 768px) {
522
57
  .pull-md-left {
523
- float: inline-start !important;
58
+ float: left !important;
59
+ }
60
+ [dir="rtl"] .pull-md-left {
61
+ float: right !important;
524
62
  }
525
63
  .pull-md-right {
526
- float: inline-end !important;
64
+ float: right !important;
65
+ }
66
+ [dir="rtl"] .pull-md-right {
67
+ float: left !important;
527
68
  }
528
69
  .pull-md-none {
529
70
  float: none !important;
@@ -531,10 +72,16 @@ a.text-inverse:focus {
531
72
  }
532
73
  @media (min-width: 992px) {
533
74
  .pull-lg-left {
534
- float: inline-start !important;
75
+ float: left !important;
76
+ }
77
+ [dir="rtl"] .pull-lg-left {
78
+ float: right !important;
535
79
  }
536
80
  .pull-lg-right {
537
- float: inline-end !important;
81
+ float: right !important;
82
+ }
83
+ [dir="rtl"] .pull-lg-right {
84
+ float: left !important;
538
85
  }
539
86
  .pull-lg-none {
540
87
  float: none !important;
@@ -542,571 +89,44 @@ a.text-inverse:focus {
542
89
  }
543
90
  @media (min-width: 1200px) {
544
91
  .pull-xl-left {
545
- float: inline-start !important;
92
+ float: left !important;
93
+ }
94
+ [dir="rtl"] .pull-xl-left {
95
+ float: right !important;
546
96
  }
547
97
  .pull-xl-right {
548
- float: inline-end !important;
98
+ float: right !important;
99
+ }
100
+ [dir="rtl"] .pull-xl-right {
101
+ float: left !important;
549
102
  }
550
103
  .pull-xl-none {
551
104
  float: none !important;
552
105
  }
553
106
  }
554
- .font-weight-normal {
555
- font-weight: 400 !important;
556
- font-weight: var(--font-weight-regular) !important;
557
- }
558
- .font-weight-semi-bold {
559
- font-weight: 600 !important;
560
- font-weight: var(--font-weight-semi-bold) !important;
561
- }
562
- .font-weight-bold {
563
- font-weight: 800 !important;
564
- font-weight: var(--font-weight-bold) !important;
565
- }
566
- .gap-y-1 {
567
- row-gap: 8px;
568
- row-gap: var(--size-8);
569
- }
570
- .justify-content-start {
571
- justify-content: flex-start;
572
- }
573
- .justify-content-end {
574
- justify-content: flex-end;
575
- }
576
- .justify-content-center {
577
- justify-content: center;
578
- }
579
- .justify-content-between {
580
- justify-content: space-between;
581
- }
582
- .justify-content-around {
583
- justify-content: space-around;
584
- }
585
- @media (min-width: 576px) {
586
- .justify-content-start--sm {
587
- justify-content: flex-start;
588
- }
589
- .justify-content-end--sm {
590
- justify-content: flex-end;
591
- }
592
- .justify-content-center--sm {
593
- justify-content: center;
594
- }
595
- .justify-content-between--sm {
596
- justify-content: space-between;
597
- }
598
- .justify-content-around--sm {
599
- justify-content: space-around;
600
- }
601
- }
602
- @media (min-width: 768px) {
603
- .justify-content-start--md {
604
- justify-content: flex-start;
605
- }
606
- .justify-content-end--md {
607
- justify-content: flex-end;
608
- }
609
- .justify-content-center--md {
610
- justify-content: center;
611
- }
612
- .justify-content-between--md {
613
- justify-content: space-between;
614
- }
615
- .justify-content-around--md {
616
- justify-content: space-around;
617
- }
618
- }
619
- @media (min-width: 992px) {
620
- .justify-content-start--lg {
621
- justify-content: flex-start;
622
- }
623
- .justify-content-end--lg {
624
- justify-content: flex-end;
625
- }
626
- .justify-content-center--lg {
627
- justify-content: center;
628
- }
629
- .justify-content-between--lg {
630
- justify-content: space-between;
631
- }
632
- .justify-content-around--lg {
633
- justify-content: space-around;
634
- }
635
- }
636
- @media (min-width: 1200px) {
637
- .justify-content-start--xl {
638
- justify-content: flex-start;
639
- }
640
- .justify-content-end--xl {
641
- justify-content: flex-end;
642
- }
643
- .justify-content-center--xl {
644
- justify-content: center;
645
- }
646
- .justify-content-between--xl {
647
- justify-content: space-between;
648
- }
649
- .justify-content-around--xl {
650
- justify-content: space-around;
651
- }
652
- }
653
- .m-a-0 {
654
- margin: 0px !important;
655
- }
656
- .m-a-1 {
657
- margin: 8px !important;
658
- margin: var(--size-8) !important;
659
- }
660
- .m-a-2 {
661
- margin: 16px !important;
662
- margin: var(--size-16) !important;
663
- }
664
- .m-a-3 {
665
- margin: 24px !important;
666
- margin: var(--size-24) !important;
667
- }
668
- .m-a-4 {
669
- margin: 32px !important;
670
- margin: var(--size-32) !important;
671
- }
672
- .m-a-5 {
673
- margin: 40px !important;
674
- margin: var(--size-40) !important;
675
- }
676
- .m-x-0 {
677
- margin-left: 0px !important;
678
- margin-right: 0px !important;
679
- }
680
- .m-x-1 {
681
- margin-left: 8px !important;
682
- margin-left: var(--size-8) !important;
683
- margin-right: 8px !important;
684
- margin-right: var(--size-8) !important;
685
- }
686
- .m-x-2 {
687
- margin-left: 16px !important;
688
- margin-left: var(--size-16) !important;
689
- margin-right: 16px !important;
690
- margin-right: var(--size-16) !important;
691
- }
692
- .m-x-3 {
693
- margin-left: 24px !important;
694
- margin-left: var(--size-24) !important;
695
- margin-right: 24px !important;
696
- margin-right: var(--size-24) !important;
697
- }
698
- .m-x-4 {
699
- margin-left: 32px !important;
700
- margin-left: var(--size-32) !important;
701
- margin-right: 32px !important;
702
- margin-right: var(--size-32) !important;
703
- }
704
- .m-x-5 {
705
- margin-left: 40px !important;
706
- margin-left: var(--size-40) !important;
707
- margin-right: 40px !important;
708
- margin-right: var(--size-40) !important;
709
- }
710
- .m-x-auto {
711
- margin-left: auto !important;
712
- margin-right: auto !important;
713
- }
714
- .m-y-0 {
715
- margin-top: 0px !important;
716
- margin-bottom: 0px !important;
717
- }
718
- .m-y-1 {
719
- margin-top: 8px !important;
720
- margin-top: var(--size-8) !important;
721
- margin-bottom: 8px !important;
722
- margin-bottom: var(--size-8) !important;
723
- }
724
- .m-y-2 {
725
- margin-top: 16px !important;
726
- margin-top: var(--size-16) !important;
727
- margin-bottom: 16px !important;
728
- margin-bottom: var(--size-16) !important;
729
- }
730
- .m-y-3 {
731
- margin-top: 24px !important;
732
- margin-top: var(--size-24) !important;
733
- margin-bottom: 24px !important;
734
- margin-bottom: var(--size-24) !important;
735
- }
736
- .m-y-4 {
737
- margin-top: 32px !important;
738
- margin-top: var(--size-32) !important;
739
- margin-bottom: 32px !important;
740
- margin-bottom: var(--size-32) !important;
741
- }
742
- .m-y-5 {
743
- margin-top: 40px !important;
744
- margin-top: var(--size-40) !important;
745
- margin-bottom: 40px !important;
746
- margin-bottom: var(--size-40) !important;
747
- }
748
- .m-l-0 {
749
- margin-inline-start: 0px !important;
750
- }
751
- .m-l-1 {
752
- margin-inline-start: 8px !important;
753
- margin-inline-start: var(--size-8) !important;
754
- }
755
- .m-l-2 {
756
- margin-inline-start: 16px !important;
757
- margin-inline-start: var(--size-16) !important;
758
- }
759
- .m-l-3 {
760
- margin-inline-start: 24px !important;
761
- margin-inline-start: var(--size-24) !important;
762
- }
763
- .m-l-4 {
764
- margin-inline-start: 32px !important;
765
- margin-inline-start: var(--size-32) !important;
766
- }
767
- .m-l-5 {
768
- margin-inline-start: 40px !important;
769
- margin-inline-start: var(--size-40) !important;
770
- }
771
- .m-l-auto {
772
- margin-inline-start: auto !important;
773
- }
774
- .m-r-0 {
775
- margin-inline-end: 0px !important;
776
- }
777
- .m-r-1 {
778
- margin-inline-end: 8px !important;
779
- margin-inline-end: var(--size-8) !important;
780
- }
781
- .m-r-2 {
782
- margin-inline-end: 16px !important;
783
- margin-inline-end: var(--size-16) !important;
784
- }
785
- .m-r-3 {
786
- margin-inline-end: 24px !important;
787
- margin-inline-end: var(--size-24) !important;
788
- }
789
- .m-r-4 {
790
- margin-inline-end: 32px !important;
791
- margin-inline-end: var(--size-32) !important;
792
- }
793
- .m-r-5 {
794
- margin-inline-end: 40px !important;
795
- margin-inline-end: var(--size-40) !important;
796
- }
797
- .m-r-auto {
798
- margin-inline-end: auto !important;
799
- }
800
- .m-t-0 {
801
- margin-top: 0px !important;
802
- }
803
- .m-t-1 {
804
- margin-top: 8px !important;
805
- margin-top: var(--size-8) !important;
806
- }
807
- .m-t-2 {
808
- margin-top: 16px !important;
809
- margin-top: var(--size-16) !important;
810
- }
811
- .m-t-3 {
812
- margin-top: 24px !important;
813
- margin-top: var(--size-24) !important;
814
- }
815
- .m-t-4 {
816
- margin-top: 32px !important;
817
- margin-top: var(--size-32) !important;
818
- }
819
- .m-t-5 {
820
- margin-top: 40px !important;
821
- margin-top: var(--size-40) !important;
822
- }
823
- .m-b-0 {
824
- margin-bottom: 0px !important;
825
- }
826
- .m-b-1 {
827
- margin-bottom: 8px !important;
828
- margin-bottom: var(--size-8) !important;
829
- }
830
- .m-b-2 {
831
- margin-bottom: 16px !important;
832
- margin-bottom: var(--size-16) !important;
833
- }
834
- .m-b-3 {
835
- margin-bottom: 24px !important;
836
- margin-bottom: var(--size-24) !important;
837
- }
838
- .m-b-4 {
839
- margin-bottom: 32px !important;
840
- margin-bottom: var(--size-32) !important;
841
- }
842
- .m-b-5 {
843
- margin-bottom: 40px !important;
844
- margin-bottom: var(--size-40) !important;
845
- }
846
- .text-max-width {
847
- max-width: 600px;
848
- }
849
- .order-1 {
850
- order: 1;
851
- }
852
- .order-2 {
853
- order: 2;
854
- }
855
- .order-3 {
856
- order: 3;
857
- }
858
- .order-0 {
859
- order: 0;
860
- }
861
- @media (min-width: 576px) {
862
- .order-1--sm {
863
- order: 1;
864
- }
865
- .order-2--sm {
866
- order: 2;
867
- }
868
- .order-3--sm {
869
- order: 3;
870
- }
871
- .order-0--sm {
872
- order: 0;
873
- }
874
- }
875
- @media (min-width: 768px) {
876
- .order-1--md {
877
- order: 1;
878
- }
879
- .order-2--md {
880
- order: 2;
881
- }
882
- .order-3--md {
883
- order: 3;
884
- }
885
- .order-0--md {
886
- order: 0;
887
- }
888
- }
889
- @media (min-width: 992px) {
890
- .order-1--lg {
891
- order: 1;
892
- }
893
- .order-2--lg {
894
- order: 2;
895
- }
896
- .order-3--lg {
897
- order: 3;
898
- }
899
- .order-0--lg {
900
- order: 0;
901
- }
902
- }
903
- @media (min-width: 1200px) {
904
- .order-1--xl {
905
- order: 1;
906
- }
907
- .order-2--xl {
908
- order: 2;
909
- }
910
- .order-3--xl {
911
- order: 3;
912
- }
913
- .order-0--xl {
914
- order: 0;
915
- }
916
- }
917
- .outline-none {
918
- outline: none;
919
- /*
920
- TODO: Support Windows High Contrast mode
921
- outline: 2px solid transparent;
922
- outline-offset: 2px;
923
- */
924
- }
925
- .text-word-break {
926
- word-wrap: break-word;
927
- }
928
- .p-a-0 {
929
- padding: 0px !important;
930
- }
931
- .p-a-1 {
932
- padding: 8px !important;
933
- padding: var(--size-8) !important;
934
- }
935
- .p-a-2 {
936
- padding: 16px !important;
937
- padding: var(--size-16) !important;
938
- }
939
- .p-a-3 {
940
- padding: 24px !important;
941
- padding: var(--size-24) !important;
942
- }
943
- .p-a-4 {
944
- padding: 32px !important;
945
- padding: var(--size-32) !important;
946
- }
947
- .p-a-5 {
948
- padding: 40px !important;
949
- padding: var(--size-40) !important;
950
- }
951
- .p-x-0 {
952
- padding-left: 0px !important;
953
- padding-right: 0px !important;
954
- }
955
- .p-x-1 {
956
- padding-left: 8px !important;
957
- padding-left: var(--size-8) !important;
958
- padding-right: 8px !important;
959
- padding-right: var(--size-8) !important;
960
- }
961
- .p-x-2 {
962
- padding-left: 16px !important;
963
- padding-left: var(--size-16) !important;
964
- padding-right: 16px !important;
965
- padding-right: var(--size-16) !important;
966
- }
967
- .p-x-3 {
968
- padding-left: 24px !important;
969
- padding-left: var(--size-24) !important;
970
- padding-right: 24px !important;
971
- padding-right: var(--size-24) !important;
972
- }
973
- .p-x-4 {
974
- padding-left: 32px !important;
975
- padding-left: var(--size-32) !important;
976
- padding-right: 32px !important;
977
- padding-right: var(--size-32) !important;
978
- }
979
- .p-x-5 {
980
- padding-left: 40px !important;
981
- padding-left: var(--size-40) !important;
982
- padding-right: 40px !important;
983
- padding-right: var(--size-40) !important;
984
- }
985
- .p-y-0 {
986
- padding-top: 0px !important;
987
- padding-bottom: 0px !important;
988
- }
989
- .p-y-1 {
990
- padding-top: 8px !important;
991
- padding-top: var(--size-8) !important;
992
- padding-bottom: 8px !important;
993
- padding-bottom: var(--size-8) !important;
994
- }
995
- .p-y-2 {
996
- padding-top: 16px !important;
997
- padding-top: var(--size-16) !important;
998
- padding-bottom: 16px !important;
999
- padding-bottom: var(--size-16) !important;
1000
- }
1001
- .p-y-3 {
1002
- padding-top: 24px !important;
1003
- padding-top: var(--size-24) !important;
1004
- padding-bottom: 24px !important;
1005
- padding-bottom: var(--size-24) !important;
1006
- }
1007
- .p-y-4 {
1008
- padding-top: 32px !important;
1009
- padding-top: var(--size-32) !important;
1010
- padding-bottom: 32px !important;
1011
- padding-bottom: var(--size-32) !important;
1012
- }
1013
- .p-y-5 {
1014
- padding-top: 40px !important;
1015
- padding-top: var(--size-40) !important;
1016
- padding-bottom: 40px !important;
1017
- padding-bottom: var(--size-40) !important;
1018
- }
1019
- .p-l-0 {
1020
- padding-inline-start: 0px !important;
1021
- }
1022
- .p-l-1 {
1023
- padding-inline-start: 8px !important;
1024
- padding-inline-start: var(--size-8) !important;
1025
- }
1026
- .p-l-2 {
1027
- padding-inline-start: 16px !important;
1028
- padding-inline-start: var(--size-16) !important;
1029
- }
1030
- .p-l-3 {
1031
- padding-inline-start: 24px !important;
1032
- padding-inline-start: var(--size-24) !important;
1033
- }
1034
- .p-l-4 {
1035
- padding-inline-start: 32px !important;
1036
- padding-inline-start: var(--size-32) !important;
1037
- }
1038
- .p-l-5 {
1039
- padding-inline-start: 40px !important;
1040
- padding-inline-start: var(--size-40) !important;
1041
- }
1042
- .p-r-0 {
1043
- padding-inline-end: 0px !important;
1044
- }
1045
- .p-r-1 {
1046
- padding-inline-end: 8px !important;
1047
- padding-inline-end: var(--size-8) !important;
1048
- }
1049
- .p-r-2 {
1050
- padding-inline-end: 16px !important;
1051
- padding-inline-end: var(--size-16) !important;
1052
- }
1053
- .p-r-3 {
1054
- padding-inline-end: 24px !important;
1055
- padding-inline-end: var(--size-24) !important;
1056
- }
1057
- .p-r-4 {
1058
- padding-inline-end: 32px !important;
1059
- padding-inline-end: var(--size-32) !important;
1060
- }
1061
- .p-r-5 {
1062
- padding-inline-end: 40px !important;
1063
- padding-inline-end: var(--size-40) !important;
1064
- }
1065
- .p-t-0 {
1066
- padding-top: 0px !important;
1067
- }
1068
- .p-t-1 {
1069
- padding-top: 8px !important;
1070
- padding-top: var(--size-8) !important;
1071
- }
1072
- .p-t-2 {
1073
- padding-top: 16px !important;
1074
- padding-top: var(--size-16) !important;
1075
- }
1076
- .p-t-3 {
1077
- padding-top: 24px !important;
1078
- padding-top: var(--size-24) !important;
1079
- }
1080
- .p-t-4 {
1081
- padding-top: 32px !important;
1082
- padding-top: var(--size-32) !important;
1083
- }
1084
- .p-t-5 {
1085
- padding-top: 40px !important;
1086
- padding-top: var(--size-40) !important;
107
+ .pull-left-single-direction {
108
+ float: left !important;
1087
109
  }
1088
- .p-b-0 {
1089
- padding-bottom: 0px !important;
110
+ .pull-right-single-direction {
111
+ float: right !important;
1090
112
  }
1091
- .p-b-1 {
1092
- padding-bottom: 8px !important;
1093
- padding-bottom: var(--size-8) !important;
113
+ .hide {
114
+ display: none !important;
1094
115
  }
1095
- .p-b-2 {
1096
- padding-bottom: 16px !important;
1097
- padding-bottom: var(--size-16) !important;
116
+ .show {
117
+ display: block !important;
1098
118
  }
1099
- .p-b-3 {
1100
- padding-bottom: 24px !important;
1101
- padding-bottom: var(--size-24) !important;
119
+ .invisible {
120
+ visibility: hidden;
1102
121
  }
1103
- .p-b-4 {
1104
- padding-bottom: 32px !important;
1105
- padding-bottom: var(--size-32) !important;
122
+ .text-hide {
123
+ color: transparent;
124
+ text-shadow: none;
125
+ background-color: transparent;
126
+ border: 0;
1106
127
  }
1107
- .p-b-5 {
1108
- padding-bottom: 40px !important;
1109
- padding-bottom: var(--size-40) !important;
128
+ .hidden {
129
+ display: none !important;
1110
130
  }
1111
131
  .affix {
1112
132
  position: fixed;
@@ -1117,159 +137,9 @@ a.text-inverse:focus {
1117
137
  .rotate180 {
1118
138
  transform: rotate(180deg);
1119
139
  }
1120
- .rotate270,
140
+ .rotate270 {
141
+ transform: rotate(270deg);
142
+ }
1121
143
  .rotate-90 {
1122
144
  transform: rotate(-90deg);
1123
145
  }
1124
- .sr-only {
1125
- position: absolute;
1126
- width: 1px;
1127
- height: 1px;
1128
- padding: 0;
1129
- margin: -1px;
1130
- overflow: hidden;
1131
- clip: rect(0, 0, 0, 0);
1132
- white-space: nowrap;
1133
- border-width: 0;
1134
- }
1135
- .sr-only-focusable:focus {
1136
- position: static;
1137
- width: auto;
1138
- height: auto;
1139
- padding: 0;
1140
- margin: 0;
1141
- overflow: visible;
1142
- clip: auto;
1143
- white-space: normal;
1144
- }
1145
- .text-xs-center {
1146
- text-align: center;
1147
- }
1148
- .text-xs-justify {
1149
- text-align: justify;
1150
- }
1151
- .text-xs-left {
1152
- text-align: start;
1153
- }
1154
- .text-xs-right {
1155
- text-align: end;
1156
- }
1157
- @media (min-width: 576px) {
1158
- .text-sm-center {
1159
- text-align: center;
1160
- }
1161
- .text-sm-justify {
1162
- text-align: justify;
1163
- }
1164
- .text-sm-left {
1165
- text-align: start;
1166
- }
1167
- .text-sm-right {
1168
- text-align: end;
1169
- }
1170
- }
1171
- @media (min-width: 768px) {
1172
- .text-md-center {
1173
- text-align: center;
1174
- }
1175
- .text-md-justify {
1176
- text-align: justify;
1177
- }
1178
- .text-md-left {
1179
- text-align: start;
1180
- }
1181
- .text-md-right {
1182
- text-align: end;
1183
- }
1184
- }
1185
- @media (min-width: 992px) {
1186
- .text-lg-center {
1187
- text-align: center;
1188
- }
1189
- .text-lg-justify {
1190
- text-align: justify;
1191
- }
1192
- .text-lg-left {
1193
- text-align: start;
1194
- }
1195
- .text-lg-right {
1196
- text-align: end;
1197
- }
1198
- }
1199
- @media (min-width: 1200px) {
1200
- .text-xl-center {
1201
- text-align: center;
1202
- }
1203
- .text-xl-justify {
1204
- text-align: justify;
1205
- }
1206
- .text-xl-left {
1207
- text-align: start;
1208
- }
1209
- .text-xl-right {
1210
- text-align: end;
1211
- }
1212
- }
1213
- .text-underline {
1214
- text-decoration-line: underline !important;
1215
- text-underline-offset: 2px;
1216
- }
1217
- .text-no-decoration {
1218
- text-decoration-line: none !important;
1219
- }
1220
- .text-ellipsis,
1221
- .text-ellipses {
1222
- display: block;
1223
- overflow: hidden;
1224
- text-overflow: ellipsis;
1225
- white-space: nowrap;
1226
- }
1227
- .text-uppercase {
1228
- text-transform: uppercase;
1229
- }
1230
- .text-lowercase {
1231
- text-transform: lowercase;
1232
- }
1233
- .text-capitalize {
1234
- text-transform: capitalize;
1235
- }
1236
- .invisible {
1237
- visibility: hidden;
1238
- }
1239
- .text-xs-nowrap {
1240
- white-space: nowrap;
1241
- }
1242
- @media (min-width: 576px) {
1243
- .text-sm-nowrap {
1244
- white-space: nowrap;
1245
- }
1246
- }
1247
- @media (min-width: 768px) {
1248
- .text-md-nowrap {
1249
- white-space: nowrap;
1250
- }
1251
- }
1252
- @media (min-width: 992px) {
1253
- .text-lg-nowrap {
1254
- white-space: nowrap;
1255
- }
1256
- }
1257
- @media (min-width: 1200px) {
1258
- .text-xl-nowrap {
1259
- white-space: nowrap;
1260
- }
1261
- }
1262
- .clearfix::before,
1263
- .clearfix::after {
1264
- content: " ";
1265
- display: table;
1266
- }
1267
- .clearfix::after {
1268
- clear: both;
1269
- }
1270
- .text-hide {
1271
- color: transparent;
1272
- text-shadow: none;
1273
- background-color: transparent;
1274
- border: 0;
1275
- }