@stackoverflow/stacks 1.3.0 → 1.3.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.
- package/dist/controllers/s-expandable-control.d.ts +1 -1
- package/dist/controllers/s-tooltip.d.ts +16 -1
- package/dist/css/stacks.css +848 -559
- package/dist/css/stacks.min.css +1 -1
- package/dist/js/stacks.js +153 -84
- package/dist/js/stacks.min.js +1 -1
- package/lib/css/atomic/borders.less +1 -0
- package/lib/css/atomic/colors.less +1 -0
- package/lib/css/atomic/misc.less +1 -1
- package/lib/css/atomic/typography.less +0 -6
- package/lib/css/components/activity-indicator.less +18 -17
- package/lib/css/components/avatars.less +50 -131
- package/lib/css/components/breadcrumbs.less +4 -4
- package/lib/css/components/buttons.less +8 -48
- package/lib/css/components/empty-states.less +15 -0
- package/lib/css/components/{collapsible.less → expandable.less} +0 -0
- package/lib/css/components/inputs.less +37 -101
- package/lib/css/components/labels.less +98 -0
- package/lib/css/components/links.less +15 -3
- package/lib/css/components/notices.less +190 -163
- package/lib/css/components/post-summary.less +98 -35
- package/lib/css/components/progress-bars.less +1 -1
- package/lib/css/components/prose.less +4 -4
- package/lib/css/components/spinner.less +39 -1
- package/lib/css/components/tables.less +1 -5
- package/lib/css/components/uploader.less +70 -84
- package/lib/css/exports/constants-colors.less +19 -0
- package/lib/css/stacks-dynamic.less +0 -1
- package/lib/css/stacks-static.less +3 -2
- package/lib/ts/controllers/s-expandable-control.ts +23 -19
- package/lib/ts/controllers/s-modal.ts +16 -16
- package/lib/ts/controllers/s-navigation-tablist.ts +13 -13
- package/lib/ts/controllers/s-popover.ts +26 -18
- package/lib/ts/controllers/s-table.ts +31 -29
- package/lib/ts/controllers/s-tooltip.ts +62 -23
- package/lib/ts/stacks.ts +8 -4
- package/package.json +17 -17
- package/lib/css/components/banners.less +0 -80
- package/lib/css/components/blank-states.less +0 -26
package/dist/css/stacks.css
CHANGED
|
@@ -400,45 +400,86 @@ template {
|
|
|
400
400
|
fill: currentColor;
|
|
401
401
|
}
|
|
402
402
|
.s-activity-indicator {
|
|
403
|
+
--_focus-ring: var(--focus-ring);
|
|
404
|
+
--_bg-color: var(--theme-secondary-400);
|
|
403
405
|
display: inline-block;
|
|
404
406
|
min-width: var(--su-static12);
|
|
405
407
|
min-height: var(--su-static12);
|
|
406
408
|
padding: var(--su2) var(--su4);
|
|
407
409
|
line-height: 1.1;
|
|
408
|
-
background-color: var(--
|
|
409
|
-
box-shadow: 0 0 0 var(--su-static4) var(--
|
|
410
|
+
background-color: var(--_bg-color);
|
|
411
|
+
box-shadow: 0 0 0 var(--su-static4) var(--_focus-ring);
|
|
410
412
|
border-radius: 1000px;
|
|
411
413
|
font-size: var(--fs-fine);
|
|
412
414
|
font-weight: 600;
|
|
413
415
|
color: hsl(0, 0%, 100%);
|
|
414
416
|
text-transform: uppercase;
|
|
415
417
|
}
|
|
416
|
-
|
|
417
|
-
color: var(--
|
|
418
|
+
.s-activity-indicator.s-activity-indicator__success {
|
|
419
|
+
--_bg-color: var(--green-500);
|
|
420
|
+
--_focus-ring: var(--focus-ring-success);
|
|
418
421
|
}
|
|
419
|
-
.s-activity-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
+
.s-activity-indicator.s-activity-indicator__warning {
|
|
423
|
+
--_bg-color: var(--yellow-600);
|
|
424
|
+
--_focus-ring: var(--focus-ring-warning);
|
|
422
425
|
}
|
|
423
|
-
.s-activity-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
+
.s-activity-indicator.s-activity-indicator__danger {
|
|
427
|
+
--_bg-color: var(--red-500);
|
|
428
|
+
--_focus-ring: var(--focus-ring-error);
|
|
426
429
|
}
|
|
427
|
-
.s-activity-
|
|
428
|
-
|
|
429
|
-
box-shadow: 0 0 0 var(--su-static4) var(--focus-ring-error);
|
|
430
|
+
body.theme-highcontrast .s-activity-indicator {
|
|
431
|
+
color: var(--white);
|
|
430
432
|
}
|
|
431
433
|
.s-avatar {
|
|
434
|
+
--_size: var(--su-static16);
|
|
435
|
+
--_br: var(--br-sm);
|
|
436
|
+
--_fs-letter: calc(var(--su-static12) - var(--su-static1));
|
|
437
|
+
--_scale-badge: 1;
|
|
432
438
|
display: inline-block;
|
|
433
439
|
position: relative;
|
|
434
|
-
width: var(--
|
|
435
|
-
height: var(--
|
|
436
|
-
border-radius: var(--
|
|
440
|
+
width: var(--_size);
|
|
441
|
+
height: var(--_size);
|
|
442
|
+
border-radius: var(--_br);
|
|
437
443
|
background-color: hsl(0, 0%, 100%);
|
|
438
444
|
background-repeat: no-repeat;
|
|
439
445
|
background-size: 100%;
|
|
440
446
|
vertical-align: bottom;
|
|
441
447
|
}
|
|
448
|
+
.s-avatar.s-avatar__24 {
|
|
449
|
+
--_size: var(--su-static24);
|
|
450
|
+
--_fs-letter: var(--su-static16);
|
|
451
|
+
--_scale-badge: 1.1;
|
|
452
|
+
}
|
|
453
|
+
.s-avatar.s-avatar__32 {
|
|
454
|
+
--_size: var(--su-static32);
|
|
455
|
+
--_br: var(--br-md);
|
|
456
|
+
--_fs-letter: calc(var(--su-static24) - var(--su-static2));
|
|
457
|
+
--_scale-badge: 1.3;
|
|
458
|
+
}
|
|
459
|
+
.s-avatar.s-avatar__48 {
|
|
460
|
+
--_size: var(--su-static48);
|
|
461
|
+
--_br: var(--br-md);
|
|
462
|
+
--_fs-letter: calc(var(--su-static32) + var(--su-static2));
|
|
463
|
+
--_scale-badge: 1.6;
|
|
464
|
+
}
|
|
465
|
+
.s-avatar.s-avatar__64 {
|
|
466
|
+
--_size: var(--su-static64);
|
|
467
|
+
--_br: var(--br-lg);
|
|
468
|
+
--_fs-letter: calc(var(--su-static48) - var(--su-static4));
|
|
469
|
+
--_scale-badge: 2.4;
|
|
470
|
+
}
|
|
471
|
+
.s-avatar.s-avatar__96 {
|
|
472
|
+
--_size: var(--su-static96);
|
|
473
|
+
--_br: calc(var(--br-lg) + var(--br-sm));
|
|
474
|
+
--_fs-letter: calc(var(--su-static64) + var(--su-static2));
|
|
475
|
+
--_scale-badge: 3;
|
|
476
|
+
}
|
|
477
|
+
.s-avatar.s-avatar__128 {
|
|
478
|
+
--_size: var(--su-static128);
|
|
479
|
+
--_br: calc(var(--br-lg) + var(--br-sm));
|
|
480
|
+
--_fs-letter: calc(var(--su-static96) - var(--su-static8));
|
|
481
|
+
--_scale-badge: 3;
|
|
482
|
+
}
|
|
442
483
|
body.theme-highcontrast .s-avatar {
|
|
443
484
|
background-color: var(--black);
|
|
444
485
|
box-shadow: 0 0 0 1px var(--black);
|
|
@@ -450,7 +491,7 @@ body.theme-highcontrast .s-avatar .s-avatar--letter {
|
|
|
450
491
|
.s-avatar .s-avatar--letter {
|
|
451
492
|
display: block;
|
|
452
493
|
color: hsl(0, 0%, 100%);
|
|
453
|
-
font-size:
|
|
494
|
+
font-size: var(--_fs-letter);
|
|
454
495
|
font-weight: bold;
|
|
455
496
|
line-height: 1.4;
|
|
456
497
|
text-align: center;
|
|
@@ -464,113 +505,15 @@ body.theme-highcontrast .s-avatar .s-avatar--letter {
|
|
|
464
505
|
position: absolute;
|
|
465
506
|
right: -4px;
|
|
466
507
|
bottom: -4px;
|
|
508
|
+
-webkit-transform: scale(var(--_scale-badge));
|
|
509
|
+
transform: scale(var(--_scale-badge));
|
|
467
510
|
}
|
|
468
511
|
.s-avatar .s-avatar--image {
|
|
469
|
-
width: var(--
|
|
470
|
-
height: var(--
|
|
471
|
-
border-radius: var(--
|
|
512
|
+
width: var(--_size);
|
|
513
|
+
height: var(--_size);
|
|
514
|
+
border-radius: var(--_br);
|
|
472
515
|
display: block;
|
|
473
516
|
}
|
|
474
|
-
.s-avatar.s-avatar__24 {
|
|
475
|
-
width: var(--su-static24);
|
|
476
|
-
height: var(--su-static24);
|
|
477
|
-
}
|
|
478
|
-
.s-avatar.s-avatar__24 .s-avatar--letter {
|
|
479
|
-
font-size: 16px;
|
|
480
|
-
}
|
|
481
|
-
.s-avatar.s-avatar__24 .s-avatar--badge {
|
|
482
|
-
-webkit-transform: scale(1.1);
|
|
483
|
-
transform: scale(1.1);
|
|
484
|
-
}
|
|
485
|
-
.s-avatar.s-avatar__24 .s-avatar--image {
|
|
486
|
-
width: var(--su-static24);
|
|
487
|
-
height: var(--su-static24);
|
|
488
|
-
}
|
|
489
|
-
.s-avatar.s-avatar__32 {
|
|
490
|
-
width: var(--su-static32);
|
|
491
|
-
height: var(--su-static32);
|
|
492
|
-
border-radius: var(--br-md);
|
|
493
|
-
}
|
|
494
|
-
.s-avatar.s-avatar__32 .s-avatar--letter {
|
|
495
|
-
font-size: 22px;
|
|
496
|
-
}
|
|
497
|
-
.s-avatar.s-avatar__32 .s-avatar--badge {
|
|
498
|
-
-webkit-transform: scale(1.3);
|
|
499
|
-
transform: scale(1.3);
|
|
500
|
-
}
|
|
501
|
-
.s-avatar.s-avatar__32 .s-avatar--image {
|
|
502
|
-
width: var(--su-static32);
|
|
503
|
-
height: var(--su-static32);
|
|
504
|
-
border-radius: var(--br-md);
|
|
505
|
-
}
|
|
506
|
-
.s-avatar.s-avatar__48 {
|
|
507
|
-
width: var(--su-static48);
|
|
508
|
-
height: var(--su-static48);
|
|
509
|
-
border-radius: var(--br-md);
|
|
510
|
-
}
|
|
511
|
-
.s-avatar.s-avatar__48 .s-avatar--letter {
|
|
512
|
-
font-size: 34px;
|
|
513
|
-
}
|
|
514
|
-
.s-avatar.s-avatar__48 .s-avatar--badge {
|
|
515
|
-
-webkit-transform: scale(1.6);
|
|
516
|
-
transform: scale(1.6);
|
|
517
|
-
}
|
|
518
|
-
.s-avatar.s-avatar__48 .s-avatar--image {
|
|
519
|
-
width: var(--su-static48);
|
|
520
|
-
height: var(--su-static48);
|
|
521
|
-
border-radius: var(--br-md);
|
|
522
|
-
}
|
|
523
|
-
.s-avatar.s-avatar__64 {
|
|
524
|
-
width: var(--su-static64);
|
|
525
|
-
height: var(--su-static64);
|
|
526
|
-
border-radius: var(--br-lg);
|
|
527
|
-
}
|
|
528
|
-
.s-avatar.s-avatar__64 .s-avatar--letter {
|
|
529
|
-
font-size: 44px;
|
|
530
|
-
}
|
|
531
|
-
.s-avatar.s-avatar__64 .s-avatar--badge {
|
|
532
|
-
-webkit-transform: scale(2.4);
|
|
533
|
-
transform: scale(2.4);
|
|
534
|
-
}
|
|
535
|
-
.s-avatar.s-avatar__64 .s-avatar--image {
|
|
536
|
-
width: var(--su-static64);
|
|
537
|
-
height: var(--su-static64);
|
|
538
|
-
border-radius: var(--br-lg);
|
|
539
|
-
}
|
|
540
|
-
.s-avatar.s-avatar__96 {
|
|
541
|
-
width: var(--su-static96);
|
|
542
|
-
height: var(--su-static96);
|
|
543
|
-
border-radius: calc(var(--br-lg) + var(--br-sm));
|
|
544
|
-
}
|
|
545
|
-
.s-avatar.s-avatar__96 .s-avatar--letter {
|
|
546
|
-
font-size: 66px;
|
|
547
|
-
}
|
|
548
|
-
.s-avatar.s-avatar__96 .s-avatar--badge {
|
|
549
|
-
-webkit-transform: scale(3);
|
|
550
|
-
transform: scale(3);
|
|
551
|
-
}
|
|
552
|
-
.s-avatar.s-avatar__96 .s-avatar--image {
|
|
553
|
-
width: var(--su-static96);
|
|
554
|
-
height: var(--su-static96);
|
|
555
|
-
border-radius: calc(var(--br-lg) + var(--br-sm));
|
|
556
|
-
}
|
|
557
|
-
.s-avatar.s-avatar__128 {
|
|
558
|
-
width: var(--su-static128);
|
|
559
|
-
height: var(--su-static128);
|
|
560
|
-
border-radius: calc(var(--br-lg) + var(--br-lg));
|
|
561
|
-
}
|
|
562
|
-
.s-avatar.s-avatar__128 .s-avatar--letter {
|
|
563
|
-
font-size: 88px;
|
|
564
|
-
}
|
|
565
|
-
.s-avatar.s-avatar__128 .s-avatar--badge {
|
|
566
|
-
-webkit-transform: scale(3);
|
|
567
|
-
transform: scale(3);
|
|
568
|
-
}
|
|
569
|
-
.s-avatar.s-avatar__128 .s-avatar--image {
|
|
570
|
-
width: var(--su-static128);
|
|
571
|
-
height: var(--su-static128);
|
|
572
|
-
border-radius: calc(var(--br-lg) + var(--br-lg));
|
|
573
|
-
}
|
|
574
517
|
.s-badge,
|
|
575
518
|
.s-topbar--notice {
|
|
576
519
|
display: inline-flex;
|
|
@@ -800,7 +743,7 @@ body.theme-highcontrast .s-badge__danger.s-badge__filled {
|
|
|
800
743
|
display: flex;
|
|
801
744
|
flex-wrap: wrap;
|
|
802
745
|
align-items: start;
|
|
803
|
-
color: var(--black-
|
|
746
|
+
color: var(--black-200);
|
|
804
747
|
font-size: var(--fs-caption);
|
|
805
748
|
}
|
|
806
749
|
.s-breadcrumbs .s-breadcrumbs--item {
|
|
@@ -815,7 +758,7 @@ body.theme-highcontrast .s-badge__danger.s-badge__filled {
|
|
|
815
758
|
margin-left: var(--su4);
|
|
816
759
|
}
|
|
817
760
|
body.theme-highcontrast .s-breadcrumbs .s-breadcrumbs--divider {
|
|
818
|
-
color: var(--
|
|
761
|
+
color: var(--fc-light);
|
|
819
762
|
}
|
|
820
763
|
@media (max-width: 640px) {
|
|
821
764
|
.s-breadcrumbs .s-breadcrumbs--divider {
|
|
@@ -824,10 +767,10 @@ body.theme-highcontrast .s-breadcrumbs .s-breadcrumbs--divider {
|
|
|
824
767
|
}
|
|
825
768
|
}
|
|
826
769
|
.s-breadcrumbs .s-breadcrumbs--link {
|
|
827
|
-
color: var(--
|
|
770
|
+
color: var(--fc-light);
|
|
828
771
|
}
|
|
829
772
|
.s-breadcrumbs .s-breadcrumbs--link:hover {
|
|
830
|
-
color: var(--
|
|
773
|
+
color: var(--fc-medium);
|
|
831
774
|
}
|
|
832
775
|
.s-btn-group {
|
|
833
776
|
display: flex;
|
|
@@ -1217,81 +1160,28 @@ fieldset[disabled] a,
|
|
|
1217
1160
|
fieldset[disabled] .s-btn,
|
|
1218
1161
|
fieldset[disabled] .s-link {
|
|
1219
1162
|
box-shadow: none !important;
|
|
1220
|
-
opacity:
|
|
1163
|
+
opacity: var(--_o-disabled-static);
|
|
1221
1164
|
pointer-events: none;
|
|
1222
1165
|
}
|
|
1223
1166
|
fieldset[disabled] .s-checkbox,
|
|
1224
1167
|
fieldset[disabled] .s-input-message,
|
|
1225
|
-
fieldset[disabled] .s-label,
|
|
1226
1168
|
fieldset[disabled] .s-radio,
|
|
1227
1169
|
fieldset[disabled] .s-toggle-switch,
|
|
1228
1170
|
fieldset[disabled] .s-toggle-switch label {
|
|
1229
1171
|
cursor: not-allowed;
|
|
1230
|
-
opacity:
|
|
1172
|
+
opacity: var(--_o-disabled-static);
|
|
1231
1173
|
}
|
|
1232
1174
|
fieldset[disabled] .s-input,
|
|
1233
1175
|
fieldset[disabled] .s-textarea,
|
|
1234
1176
|
fieldset[disabled] .s-select > select {
|
|
1235
1177
|
cursor: not-allowed;
|
|
1236
|
-
opacity:
|
|
1237
|
-
}
|
|
1238
|
-
.s-label {
|
|
1239
|
-
padding: 0 var(--su2);
|
|
1240
|
-
color: var(--fc-dark);
|
|
1241
|
-
font-family: inherit;
|
|
1242
|
-
font-size: var(--fs-body2);
|
|
1243
|
-
font-weight: 600;
|
|
1244
|
-
}
|
|
1245
|
-
.s-label[for] {
|
|
1246
|
-
cursor: pointer;
|
|
1247
|
-
}
|
|
1248
|
-
.s-label--status {
|
|
1249
|
-
margin-left: var(--su4);
|
|
1250
|
-
padding: var(--su2) var(--su8);
|
|
1251
|
-
border-radius: 1000px;
|
|
1252
|
-
background-color: var(--black-050);
|
|
1253
|
-
color: var(--fc-medium);
|
|
1254
|
-
font-size: var(--fs-caption);
|
|
1255
|
-
font-weight: 400;
|
|
1256
|
-
vertical-align: text-bottom;
|
|
1257
|
-
}
|
|
1258
|
-
body.theme-highcontrast .s-label--status {
|
|
1259
|
-
border: 1px solid currentColor;
|
|
1260
|
-
}
|
|
1261
|
-
.s-label--status.s-label--status__required {
|
|
1262
|
-
background-color: var(--red-100);
|
|
1263
|
-
color: var(--red-600);
|
|
1264
|
-
}
|
|
1265
|
-
@media (prefers-color-scheme: dark) {
|
|
1266
|
-
body.theme-system .s-label--status.s-label--status__required {
|
|
1267
|
-
color: var(--red-800);
|
|
1268
|
-
}
|
|
1269
|
-
}
|
|
1270
|
-
body.theme-dark .s-label--status.s-label--status__required,
|
|
1271
|
-
.theme-dark__forced .s-label--status.s-label--status__required,
|
|
1272
|
-
body.theme-system .theme-dark__forced .s-label--status.s-label--status__required {
|
|
1273
|
-
color: var(--red-800);
|
|
1274
|
-
}
|
|
1275
|
-
.s-label--status.s-label--status__new {
|
|
1276
|
-
background-color: var(--green-100);
|
|
1277
|
-
color: var(--green-700);
|
|
1278
|
-
}
|
|
1279
|
-
.s-label--status.s-label--status__beta {
|
|
1280
|
-
background-color: var(--blue-100);
|
|
1281
|
-
color: var(--blue-700);
|
|
1178
|
+
opacity: var(--_o-disabled-static);
|
|
1282
1179
|
}
|
|
1283
1180
|
.s-description {
|
|
1284
1181
|
padding: 0 var(--su2);
|
|
1285
1182
|
color: var(--fc-medium);
|
|
1286
1183
|
font-size: var(--fs-caption);
|
|
1287
1184
|
}
|
|
1288
|
-
.s-label .s-description,
|
|
1289
|
-
.s-label .s-input-message {
|
|
1290
|
-
padding: 0;
|
|
1291
|
-
margin-top: 4px;
|
|
1292
|
-
margin-bottom: 0;
|
|
1293
|
-
font-weight: normal;
|
|
1294
|
-
}
|
|
1295
1185
|
.s-input-fill {
|
|
1296
1186
|
padding: 0.6em 0.7em;
|
|
1297
1187
|
border: 1px solid var(--bc-darker);
|
|
@@ -1412,7 +1302,7 @@ body.theme-system .theme-dark__forced .s-label--status.s-label--status__required
|
|
|
1412
1302
|
}
|
|
1413
1303
|
.s-checkbox[disabled],
|
|
1414
1304
|
.s-radio[disabled] {
|
|
1415
|
-
opacity:
|
|
1305
|
+
opacity: var(--_o-disabled-static);
|
|
1416
1306
|
cursor: not-allowed;
|
|
1417
1307
|
}
|
|
1418
1308
|
@supports ((-webkit-appearance: none) or (-moz-appearance: none) or (appearance: none)) {
|
|
@@ -1503,52 +1393,59 @@ body.theme-highcontrast .s-input:focus-within {
|
|
|
1503
1393
|
}
|
|
1504
1394
|
.s-input[disabled],
|
|
1505
1395
|
.s-textarea[disabled],
|
|
1506
|
-
.s-select > select[disabled],
|
|
1507
|
-
.s-input[read-only],
|
|
1508
|
-
.s-textarea[read-only],
|
|
1509
|
-
.s-select > select[read-only] {
|
|
1510
|
-
cursor: not-allowed;
|
|
1511
|
-
opacity: 0.5;
|
|
1512
|
-
}
|
|
1513
|
-
body.theme-highcontrast .s-input[disabled],
|
|
1514
|
-
body.theme-highcontrast .s-textarea[disabled],
|
|
1515
|
-
body.theme-highcontrast .s-select > select[disabled],
|
|
1516
|
-
body.theme-highcontrast .s-input[read-only],
|
|
1517
|
-
body.theme-highcontrast .s-textarea[read-only],
|
|
1518
|
-
body.theme-highcontrast .s-select > select[read-only] {
|
|
1519
|
-
opacity: 0.5;
|
|
1520
|
-
}
|
|
1521
|
-
.s-input[disabled],
|
|
1522
|
-
.s-textarea[disabled],
|
|
1523
1396
|
.s-select > select[disabled] {
|
|
1524
1397
|
cursor: not-allowed;
|
|
1525
|
-
opacity:
|
|
1398
|
+
opacity: var(--_o-disabled-static);
|
|
1399
|
+
}
|
|
1400
|
+
.s-input[readonly],
|
|
1401
|
+
.s-textarea[readonly],
|
|
1402
|
+
.s-select > select[readonly],
|
|
1403
|
+
.is-readonly .s-input,
|
|
1404
|
+
.is-readonly .s-textarea,
|
|
1405
|
+
.is-readonly .s-select > select {
|
|
1406
|
+
border-color: var(--bc-light);
|
|
1407
|
+
background-color: var(--black-050);
|
|
1408
|
+
color: var(--black-200);
|
|
1409
|
+
cursor: not-allowed;
|
|
1410
|
+
}
|
|
1411
|
+
body.theme-highcontrast .s-input[readonly],
|
|
1412
|
+
body.theme-highcontrast .s-textarea[readonly],
|
|
1413
|
+
body.theme-highcontrast .s-select > select[readonly],
|
|
1414
|
+
body.theme-highcontrast .is-readonly .s-input,
|
|
1415
|
+
body.theme-highcontrast .is-readonly .s-textarea,
|
|
1416
|
+
body.theme-highcontrast .is-readonly .s-select > select {
|
|
1417
|
+
color: var(--fc-light);
|
|
1526
1418
|
}
|
|
1527
1419
|
.is-disabled,
|
|
1420
|
+
.is-readonly,
|
|
1528
1421
|
.has-success,
|
|
1529
1422
|
.has-error,
|
|
1530
1423
|
.has-warning {
|
|
1531
1424
|
position: relative;
|
|
1532
1425
|
}
|
|
1533
1426
|
.is-disabled .s-input,
|
|
1427
|
+
.is-readonly .s-input,
|
|
1534
1428
|
.has-success .s-input,
|
|
1535
1429
|
.has-error .s-input,
|
|
1536
1430
|
.has-warning .s-input {
|
|
1537
1431
|
padding-right: var(--su32);
|
|
1538
1432
|
}
|
|
1539
1433
|
.is-disabled .s-select .s-input-icon,
|
|
1434
|
+
.is-readonly .s-select .s-input-icon,
|
|
1540
1435
|
.has-success .s-select .s-input-icon,
|
|
1541
1436
|
.has-error .s-select .s-input-icon,
|
|
1542
1437
|
.has-warning .s-select .s-input-icon {
|
|
1543
1438
|
right: var(--su32);
|
|
1544
1439
|
}
|
|
1545
1440
|
.is-disabled .s-textarea,
|
|
1441
|
+
.is-readonly .s-textarea,
|
|
1546
1442
|
.has-success .s-textarea,
|
|
1547
1443
|
.has-error .s-textarea,
|
|
1548
1444
|
.has-warning .s-textarea {
|
|
1549
1445
|
padding-right: var(--su48);
|
|
1550
1446
|
}
|
|
1551
1447
|
.is-disabled .s-textarea ~ .s-input-icon,
|
|
1448
|
+
.is-readonly .s-textarea ~ .s-input-icon,
|
|
1552
1449
|
.has-success .s-textarea ~ .s-input-icon,
|
|
1553
1450
|
.has-error .s-textarea ~ .s-input-icon,
|
|
1554
1451
|
.has-warning .s-textarea ~ .s-input-icon {
|
|
@@ -1556,6 +1453,7 @@ body.theme-highcontrast .s-select > select[read-only] {
|
|
|
1556
1453
|
right: 1.5em;
|
|
1557
1454
|
}
|
|
1558
1455
|
.is-disabled .s-input-message a,
|
|
1456
|
+
.is-readonly .s-input-message a,
|
|
1559
1457
|
.has-success .s-input-message a,
|
|
1560
1458
|
.has-error .s-input-message a,
|
|
1561
1459
|
.has-warning .s-input-message a {
|
|
@@ -1640,19 +1538,17 @@ body.theme-highcontrast .s-select > select[read-only] {
|
|
|
1640
1538
|
.is-disabled .s-select:after {
|
|
1641
1539
|
border-color: var(--bc-darker) transparent;
|
|
1642
1540
|
}
|
|
1643
|
-
.is-disabled .s-label,
|
|
1644
1541
|
.is-disabled .s-description {
|
|
1645
|
-
opacity:
|
|
1646
|
-
}
|
|
1647
|
-
.is-disabled .s-label .s-description,
|
|
1648
|
-
.is-disabled .s-description .s-description {
|
|
1649
|
-
opacity: unset;
|
|
1542
|
+
opacity: var(--_o-disabled-static);
|
|
1650
1543
|
}
|
|
1651
1544
|
.is-disabled .s-input-icon {
|
|
1652
1545
|
color: var(--black-400);
|
|
1653
1546
|
}
|
|
1654
|
-
.is-
|
|
1655
|
-
|
|
1547
|
+
.is-readonly .s-input-icon {
|
|
1548
|
+
color: var(--black-200);
|
|
1549
|
+
}
|
|
1550
|
+
body.theme-highcontrast .is-readonly .s-input-icon {
|
|
1551
|
+
color: var(--fc-light);
|
|
1656
1552
|
}
|
|
1657
1553
|
.s-input-icon {
|
|
1658
1554
|
position: absolute;
|
|
@@ -1673,25 +1569,21 @@ body.theme-highcontrast .s-select > select[read-only] {
|
|
|
1673
1569
|
}
|
|
1674
1570
|
.s-input__sm,
|
|
1675
1571
|
.s-textarea__sm,
|
|
1676
|
-
.s-label__sm,
|
|
1677
1572
|
.s-select__sm > select {
|
|
1678
1573
|
font-size: var(--fs-caption);
|
|
1679
1574
|
}
|
|
1680
1575
|
.s-input__md,
|
|
1681
1576
|
.s-textarea__md,
|
|
1682
|
-
.s-label__md,
|
|
1683
1577
|
.s-select__md > select {
|
|
1684
1578
|
font-size: var(--fs-body3);
|
|
1685
1579
|
}
|
|
1686
1580
|
.s-input__lg,
|
|
1687
1581
|
.s-textarea__lg,
|
|
1688
|
-
.s-label__lg,
|
|
1689
1582
|
.s-select__lg > select {
|
|
1690
1583
|
font-size: var(--fs-title);
|
|
1691
1584
|
}
|
|
1692
1585
|
.s-input__xl,
|
|
1693
1586
|
.s-textarea__xl,
|
|
1694
|
-
.s-label__xl,
|
|
1695
1587
|
.s-select__xl > select {
|
|
1696
1588
|
font-size: var(--fs-headline1);
|
|
1697
1589
|
}
|
|
@@ -1726,6 +1618,101 @@ body.theme-highcontrast .s-select > select[read-only] {
|
|
|
1726
1618
|
padding-bottom: 0.4em;
|
|
1727
1619
|
}
|
|
1728
1620
|
}
|
|
1621
|
+
.s-label {
|
|
1622
|
+
--_fs: var(--fs-body2);
|
|
1623
|
+
color: var(--fc-dark);
|
|
1624
|
+
font-family: inherit;
|
|
1625
|
+
font-size: var(--_fs);
|
|
1626
|
+
font-weight: 600;
|
|
1627
|
+
padding: 0 var(--su2);
|
|
1628
|
+
}
|
|
1629
|
+
.s-label[for] {
|
|
1630
|
+
cursor: pointer;
|
|
1631
|
+
}
|
|
1632
|
+
fieldset[disabled] .s-label,
|
|
1633
|
+
.is-disabled .s-label {
|
|
1634
|
+
cursor: not-allowed;
|
|
1635
|
+
opacity: var(--_o-disabled-static);
|
|
1636
|
+
}
|
|
1637
|
+
fieldset[disabled] .s-label .s-description,
|
|
1638
|
+
.is-disabled .s-label .s-description {
|
|
1639
|
+
opacity: unset;
|
|
1640
|
+
}
|
|
1641
|
+
.is-readonly .s-label {
|
|
1642
|
+
cursor: not-allowed;
|
|
1643
|
+
}
|
|
1644
|
+
.s-label .s-description,
|
|
1645
|
+
.s-label .s-input-message {
|
|
1646
|
+
font-weight: normal;
|
|
1647
|
+
margin-bottom: 0;
|
|
1648
|
+
margin-top: var(--su4);
|
|
1649
|
+
padding: 0;
|
|
1650
|
+
}
|
|
1651
|
+
.s-label.s-label__sm {
|
|
1652
|
+
--_fs: var(--fs-caption);
|
|
1653
|
+
}
|
|
1654
|
+
.s-label.s-label__md {
|
|
1655
|
+
--_fs: var(--fs-body3);
|
|
1656
|
+
}
|
|
1657
|
+
.s-label.s-label__lg {
|
|
1658
|
+
--_fs: var(--fs-title);
|
|
1659
|
+
}
|
|
1660
|
+
.s-label.s-label__xl {
|
|
1661
|
+
--_fs: var(--fs-headline1);
|
|
1662
|
+
}
|
|
1663
|
+
.s-label--status {
|
|
1664
|
+
--_b: none;
|
|
1665
|
+
--_bg: var(--black-050);
|
|
1666
|
+
--_fc: var(--fc-medium);
|
|
1667
|
+
background-color: var(--_bg);
|
|
1668
|
+
border: var(--_b);
|
|
1669
|
+
border-radius: 1000px;
|
|
1670
|
+
color: var(--_fc);
|
|
1671
|
+
font-size: var(--fs-caption);
|
|
1672
|
+
font-weight: 400;
|
|
1673
|
+
margin-left: var(--su4);
|
|
1674
|
+
padding: var(--su2) var(--su8);
|
|
1675
|
+
vertical-align: text-bottom;
|
|
1676
|
+
}
|
|
1677
|
+
body.theme-highcontrast .s-label--status {
|
|
1678
|
+
--_b: var(--su-static1) solid currentColor;
|
|
1679
|
+
}
|
|
1680
|
+
.s-label--status.s-label--status__required {
|
|
1681
|
+
--_bg: var(--red-100);
|
|
1682
|
+
--_fc: var(--red-700);
|
|
1683
|
+
}
|
|
1684
|
+
@media (prefers-color-scheme: dark) {
|
|
1685
|
+
body.theme-system .s-label--status.s-label--status__required {
|
|
1686
|
+
--_bg: var(--red-050);
|
|
1687
|
+
--_fc: var(--red-800);
|
|
1688
|
+
}
|
|
1689
|
+
}
|
|
1690
|
+
body.theme-dark .s-label--status.s-label--status__required,
|
|
1691
|
+
.theme-dark__forced .s-label--status.s-label--status__required,
|
|
1692
|
+
body.theme-system .theme-dark__forced .s-label--status.s-label--status__required {
|
|
1693
|
+
--_bg: var(--red-050);
|
|
1694
|
+
--_fc: var(--red-800);
|
|
1695
|
+
}
|
|
1696
|
+
.s-label--status.s-label--status__new {
|
|
1697
|
+
--_bg: var(--green-100);
|
|
1698
|
+
--_fc: var(--green-700);
|
|
1699
|
+
}
|
|
1700
|
+
@media (prefers-color-scheme: dark) {
|
|
1701
|
+
body.theme-system .s-label--status.s-label--status__new {
|
|
1702
|
+
--_bg: var(--green-050);
|
|
1703
|
+
--_fc: var(--green-800);
|
|
1704
|
+
}
|
|
1705
|
+
}
|
|
1706
|
+
body.theme-dark .s-label--status.s-label--status__new,
|
|
1707
|
+
.theme-dark__forced .s-label--status.s-label--status__new,
|
|
1708
|
+
body.theme-system .theme-dark__forced .s-label--status.s-label--status__new {
|
|
1709
|
+
--_bg: var(--green-050);
|
|
1710
|
+
--_fc: var(--green-800);
|
|
1711
|
+
}
|
|
1712
|
+
.s-label--status.s-label--status__beta {
|
|
1713
|
+
--_bg: var(--blue-100);
|
|
1714
|
+
--_fc: var(--blue-700);
|
|
1715
|
+
}
|
|
1729
1716
|
.s-menu {
|
|
1730
1717
|
list-style: none;
|
|
1731
1718
|
margin: 0;
|
|
@@ -2312,29 +2299,26 @@ body.theme-system .theme-dark__forced .s-popover--arrow {
|
|
|
2312
2299
|
padding: var(--su2) var(--su4);
|
|
2313
2300
|
}
|
|
2314
2301
|
.s-post-summary--stats .s-post-summary--stats-item.has-answers {
|
|
2315
|
-
color: var(--green-
|
|
2316
|
-
border: 1px solid var(--green-
|
|
2302
|
+
color: var(--green-700);
|
|
2303
|
+
border: 1px solid var(--green-700);
|
|
2317
2304
|
}
|
|
2318
2305
|
.s-post-summary--stats .s-post-summary--stats-item.has-answers.has-accepted-answer {
|
|
2319
|
-
color: hsl(0, 0%, 100%);
|
|
2320
|
-
background-color: var(--green-500);
|
|
2321
|
-
border-color: var(--green-500);
|
|
2322
|
-
}
|
|
2323
|
-
body.theme-highcontrast .s-post-summary--stats .s-post-summary--stats-item.has-answers.has-accepted-answer {
|
|
2324
2306
|
color: var(--white);
|
|
2307
|
+
background-color: var(--green-700);
|
|
2308
|
+
border-color: var(--green-700);
|
|
2325
2309
|
}
|
|
2326
2310
|
.s-post-summary--stats .s-post-summary--stats-item.has-bounty {
|
|
2327
2311
|
color: var(--white);
|
|
2328
2312
|
background-color: var(--blue-600);
|
|
2329
2313
|
}
|
|
2330
2314
|
.s-post-summary--stats .s-post-summary--stats-item.is-warm {
|
|
2331
|
-
color: var(--
|
|
2315
|
+
color: var(--yellow-800);
|
|
2332
2316
|
}
|
|
2333
2317
|
.s-post-summary--stats .s-post-summary--stats-item.is-hot {
|
|
2334
|
-
color: var(--orange-
|
|
2318
|
+
color: var(--orange-800);
|
|
2335
2319
|
}
|
|
2336
2320
|
.s-post-summary--stats .s-post-summary--stats-item.is-supernova {
|
|
2337
|
-
color: var(--
|
|
2321
|
+
color: var(--red-800);
|
|
2338
2322
|
}
|
|
2339
2323
|
.s-post-summary--stats .s-post-summary--stats-item.is-published {
|
|
2340
2324
|
color: var(--black-800);
|
|
@@ -2384,7 +2368,6 @@ body.theme-highcontrast .s-post-summary--stats .s-post-summary--stats-item.has-a
|
|
|
2384
2368
|
line-height: var(--lh-md);
|
|
2385
2369
|
font-weight: normal;
|
|
2386
2370
|
word-break: break-word !important;
|
|
2387
|
-
word-wrap: break-word !important;
|
|
2388
2371
|
overflow-wrap: break-word !important;
|
|
2389
2372
|
-webkit-hyphens: auto !important;
|
|
2390
2373
|
-moz-hyphens: auto !important;
|
|
@@ -2401,7 +2384,6 @@ body.theme-highcontrast .s-post-summary--stats .s-post-summary--stats-item.has-a
|
|
|
2401
2384
|
}
|
|
2402
2385
|
.s-post-summary--content .s-post-summary--content-title a {
|
|
2403
2386
|
word-break: break-word !important;
|
|
2404
|
-
word-wrap: break-word !important;
|
|
2405
2387
|
overflow-wrap: break-word !important;
|
|
2406
2388
|
-webkit-hyphens: auto !important;
|
|
2407
2389
|
-moz-hyphens: auto !important;
|
|
@@ -2435,7 +2417,6 @@ body.theme-highcontrast .s-post-summary--stats .s-post-summary--stats-item.has-a
|
|
|
2435
2417
|
-webkit-box-orient: vertical;
|
|
2436
2418
|
overflow: hidden;
|
|
2437
2419
|
word-break: break-word !important;
|
|
2438
|
-
word-wrap: break-word !important;
|
|
2439
2420
|
overflow-wrap: break-word !important;
|
|
2440
2421
|
-webkit-hyphens: auto !important;
|
|
2441
2422
|
-moz-hyphens: auto !important;
|
|
@@ -2517,35 +2498,72 @@ body.theme-highcontrast .s-post-summary--answer:before {
|
|
|
2517
2498
|
.s-post-summary__watched {
|
|
2518
2499
|
background-color: var(--yellow-050);
|
|
2519
2500
|
}
|
|
2501
|
+
.s-post-summary__watched .s-post-summary--stats {
|
|
2502
|
+
color: var(--black-500);
|
|
2503
|
+
}
|
|
2504
|
+
.s-post-summary__watched .s-user-card .s-user-card--rep,
|
|
2505
|
+
.s-post-summary__watched .s-user-card .s-user-card--time {
|
|
2506
|
+
color: var(--black-600);
|
|
2507
|
+
}
|
|
2520
2508
|
.s-post-summary__deleted {
|
|
2521
|
-
background-color: var(--red-
|
|
2509
|
+
background-color: var(--red-025);
|
|
2510
|
+
}
|
|
2511
|
+
.s-post-summary__deleted .s-badge__filled {
|
|
2512
|
+
color: var(--white);
|
|
2513
|
+
}
|
|
2514
|
+
@media (prefers-color-scheme: dark) {
|
|
2515
|
+
body.theme-system .s-post-summary__deleted .s-badge__filled {
|
|
2516
|
+
background-color: var(--red-800);
|
|
2517
|
+
}
|
|
2518
|
+
}
|
|
2519
|
+
body.theme-dark .s-post-summary__deleted .s-badge__filled,
|
|
2520
|
+
.theme-dark__forced .s-post-summary__deleted .s-badge__filled,
|
|
2521
|
+
body.theme-system .theme-dark__forced .s-post-summary__deleted .s-badge__filled {
|
|
2522
|
+
background-color: var(--red-800);
|
|
2522
2523
|
}
|
|
2523
2524
|
.s-post-summary__deleted .is-deleted {
|
|
2524
|
-
color:
|
|
2525
|
-
background-color: var(--red-
|
|
2525
|
+
color: var(--white);
|
|
2526
|
+
background-color: var(--red-600);
|
|
2526
2527
|
}
|
|
2527
|
-
.s-post-
|
|
2528
|
-
.s-post-summary__deleted .s-post-summary--
|
|
2529
|
-
|
|
2528
|
+
.s-post-summary__deleted .s-post-summary--meta-tags > .s-tag,
|
|
2529
|
+
.s-post-summary__deleted .s-post-summary--meta-tags > .s-tag:hover,
|
|
2530
|
+
.s-post-summary__deleted .s-post-summary--meta-tags > .s-tag:active,
|
|
2531
|
+
.s-post-summary__deleted .s-post-summary--meta-tags > .s-tag:focus {
|
|
2532
|
+
background-color: var(--black-075);
|
|
2530
2533
|
}
|
|
2531
|
-
.s-post-summary__ignored .s-post-summary--stats
|
|
2532
|
-
|
|
2533
|
-
opacity: 0.6;
|
|
2534
|
-
filter: grayscale(100%);
|
|
2534
|
+
.s-post-summary__ignored .s-post-summary--stats {
|
|
2535
|
+
color: var(--black-500);
|
|
2535
2536
|
}
|
|
2536
|
-
.s-post-summary__ignored .s-post-summary--
|
|
2537
|
-
.s-post-summary__deleted .s-post-summary--content-title a {
|
|
2537
|
+
.s-post-summary__ignored .s-post-summary--stats .s-post-summary--stats-item.has-answers {
|
|
2538
2538
|
color: var(--black-600);
|
|
2539
|
+
border: 1px solid var(--black-075);
|
|
2540
|
+
background-color: var(--black-075);
|
|
2539
2541
|
}
|
|
2540
|
-
.s-post-summary__ignored .s-post-summary--
|
|
2541
|
-
|
|
2542
|
-
|
|
2543
|
-
|
|
2542
|
+
.s-post-summary__ignored .s-post-summary--stats .s-post-summary--stats-item.has-answers .has-accepted-answer {
|
|
2543
|
+
color: var(--black-600);
|
|
2544
|
+
background-color: var(--black-075);
|
|
2545
|
+
border-color: var(--black-075);
|
|
2546
|
+
}
|
|
2547
|
+
.s-post-summary__ignored .s-post-summary--stats .s-post-summary--stats-item__emphasized {
|
|
2544
2548
|
color: var(--black-500);
|
|
2545
2549
|
}
|
|
2546
|
-
.s-post-summary__ignored .s-post-summary--
|
|
2547
|
-
.s-post-
|
|
2548
|
-
|
|
2550
|
+
.s-post-summary__ignored .s-post-summary--meta-tags > .s-tag,
|
|
2551
|
+
.s-post-summary__ignored .s-post-summary--meta-tags > .s-tag:hover,
|
|
2552
|
+
.s-post-summary__ignored .s-post-summary--meta-tags > .s-tag:active,
|
|
2553
|
+
.s-post-summary__ignored .s-post-summary--meta-tags > .s-tag:focus {
|
|
2554
|
+
background-color: var(--black-050);
|
|
2555
|
+
}
|
|
2556
|
+
.s-post-summary__ignored .s-post-summary--content-title > a,
|
|
2557
|
+
.s-post-summary__deleted .s-post-summary--content-title > a {
|
|
2558
|
+
color: var(--black-500);
|
|
2559
|
+
}
|
|
2560
|
+
.s-post-summary__ignored .s-post-summary--content-title > a:hover,
|
|
2561
|
+
.s-post-summary__deleted .s-post-summary--content-title > a:hover,
|
|
2562
|
+
.s-post-summary__ignored .s-post-summary--content-title > a:active,
|
|
2563
|
+
.s-post-summary__deleted .s-post-summary--content-title > a:active,
|
|
2564
|
+
.s-post-summary__ignored .s-post-summary--content-title > a:visited,
|
|
2565
|
+
.s-post-summary__deleted .s-post-summary--content-title > a:visited {
|
|
2566
|
+
color: var(--black-500);
|
|
2549
2567
|
}
|
|
2550
2568
|
.s-post-summary__ignored .s-post-summary--content-excerpt,
|
|
2551
2569
|
.s-post-summary__deleted .s-post-summary--content-excerpt {
|
|
@@ -2553,13 +2571,27 @@ body.theme-highcontrast .s-post-summary--answer:before {
|
|
|
2553
2571
|
}
|
|
2554
2572
|
.s-post-summary__ignored .s-post-summary--meta > *:not(.s-post-summary--meta-tags),
|
|
2555
2573
|
.s-post-summary__deleted .s-post-summary--meta > *:not(.s-post-summary--meta-tags) {
|
|
2556
|
-
|
|
2557
|
-
filter: grayscale(100%);
|
|
2574
|
+
color: var(--black-600);
|
|
2558
2575
|
}
|
|
2559
|
-
.s-post-summary__ignored .s-post-summary--meta-tags >
|
|
2560
|
-
.s-post-summary__deleted .s-post-summary--meta-tags >
|
|
2561
|
-
|
|
2562
|
-
|
|
2576
|
+
.s-post-summary__ignored .s-post-summary--meta-tags > .s-tag,
|
|
2577
|
+
.s-post-summary__deleted .s-post-summary--meta-tags > .s-tag,
|
|
2578
|
+
.s-post-summary__ignored .s-post-summary--meta-tags > .s-tag:hover,
|
|
2579
|
+
.s-post-summary__deleted .s-post-summary--meta-tags > .s-tag:hover,
|
|
2580
|
+
.s-post-summary__ignored .s-post-summary--meta-tags > .s-tag:active,
|
|
2581
|
+
.s-post-summary__deleted .s-post-summary--meta-tags > .s-tag:active,
|
|
2582
|
+
.s-post-summary__ignored .s-post-summary--meta-tags > .s-tag:focus,
|
|
2583
|
+
.s-post-summary__deleted .s-post-summary--meta-tags > .s-tag:focus {
|
|
2584
|
+
color: var(--black-600);
|
|
2585
|
+
}
|
|
2586
|
+
.s-post-summary__ignored .s-user-card .s-user-card--link,
|
|
2587
|
+
.s-post-summary__deleted .s-user-card .s-user-card--link {
|
|
2588
|
+
color: var(--black-500);
|
|
2589
|
+
}
|
|
2590
|
+
.s-post-summary__ignored .s-user-card .s-user-card--rep,
|
|
2591
|
+
.s-post-summary__deleted .s-user-card .s-user-card--rep,
|
|
2592
|
+
.s-post-summary__ignored .s-user-card .s-user-card--time,
|
|
2593
|
+
.s-post-summary__deleted .s-user-card .s-user-card--time {
|
|
2594
|
+
color: var(--black-500);
|
|
2563
2595
|
}
|
|
2564
2596
|
.s-progress,
|
|
2565
2597
|
.s-progress--bar {
|
|
@@ -2699,7 +2731,7 @@ body.theme-highcontrast .s-progress__privilege .s-progress--bar {
|
|
|
2699
2731
|
border-radius: 0;
|
|
2700
2732
|
padding: var(--su12) var(--su6) 0 var(--su6);
|
|
2701
2733
|
text-align: center;
|
|
2702
|
-
color: var(--black-
|
|
2734
|
+
color: var(--black-500);
|
|
2703
2735
|
z-index: var(--zi-base);
|
|
2704
2736
|
}
|
|
2705
2737
|
.s-progress.s-progress__stepped .s-progress--stop {
|
|
@@ -2791,13 +2823,13 @@ body.theme-highcontrast .s-progress.s-progress__stepped .s-progress--stop {
|
|
|
2791
2823
|
--s-prose-spacing-condensed: calc(var(--s-prose-spacing) / 2);
|
|
2792
2824
|
font-size: 15px;
|
|
2793
2825
|
line-height: var(--s-prose-line-height);
|
|
2794
|
-
|
|
2826
|
+
overflow-wrap: break-word;
|
|
2795
2827
|
}
|
|
2796
2828
|
.s-prose p {
|
|
2797
2829
|
margin-bottom: var(--s-prose-spacing);
|
|
2798
2830
|
}
|
|
2799
2831
|
.s-prose pre {
|
|
2800
|
-
|
|
2832
|
+
overflow-wrap: normal;
|
|
2801
2833
|
}
|
|
2802
2834
|
.s-prose code {
|
|
2803
2835
|
font-size: var(--fs-body1);
|
|
@@ -2819,10 +2851,10 @@ body.theme-highcontrast .s-prose hr {
|
|
|
2819
2851
|
background-color: var(--black-500);
|
|
2820
2852
|
}
|
|
2821
2853
|
.s-prose li {
|
|
2822
|
-
|
|
2854
|
+
overflow-wrap: break-word;
|
|
2823
2855
|
}
|
|
2824
2856
|
.s-prose li pre {
|
|
2825
|
-
|
|
2857
|
+
overflow-wrap: normal;
|
|
2826
2858
|
}
|
|
2827
2859
|
.s-prose p:last-child,
|
|
2828
2860
|
.s-prose dl:last-child,
|
|
@@ -3347,6 +3379,39 @@ body.theme-system .theme-dark__forced .s-prose kbd {
|
|
|
3347
3379
|
}
|
|
3348
3380
|
}
|
|
3349
3381
|
}
|
|
3382
|
+
.is-loading {
|
|
3383
|
+
position: relative;
|
|
3384
|
+
padding-left: 2.2em;
|
|
3385
|
+
}
|
|
3386
|
+
.is-loading:before {
|
|
3387
|
+
content: "";
|
|
3388
|
+
position: absolute;
|
|
3389
|
+
opacity: 0.3;
|
|
3390
|
+
left: 0.6em;
|
|
3391
|
+
top: calc(50% - 0.6em);
|
|
3392
|
+
width: 1.23076923em;
|
|
3393
|
+
height: 1.23076923em;
|
|
3394
|
+
border-width: 2px;
|
|
3395
|
+
border-style: solid;
|
|
3396
|
+
border-color: currentColor;
|
|
3397
|
+
border-radius: var(--br-circle);
|
|
3398
|
+
}
|
|
3399
|
+
.is-loading:after {
|
|
3400
|
+
content: "";
|
|
3401
|
+
position: absolute;
|
|
3402
|
+
left: 0.6em;
|
|
3403
|
+
top: calc(50% - 0.6em);
|
|
3404
|
+
width: 1.23076923em;
|
|
3405
|
+
height: 1.23076923em;
|
|
3406
|
+
border-width: 2px;
|
|
3407
|
+
border-style: solid;
|
|
3408
|
+
border-color: transparent;
|
|
3409
|
+
border-left-color: currentColor;
|
|
3410
|
+
border-radius: var(--br-circle);
|
|
3411
|
+
animation: s-spinner-rotate 0.9s infinite cubic-bezier(0.5, 0.1, 0.5, 0.9);
|
|
3412
|
+
filter: invert(0);
|
|
3413
|
+
transform-origin: 50% 50% 1px;
|
|
3414
|
+
}
|
|
3350
3415
|
@keyframes s-spinner-rotate {
|
|
3351
3416
|
from {
|
|
3352
3417
|
transform: rotate(0deg);
|
|
@@ -3541,11 +3606,7 @@ body.theme-system .theme-dark__forced .s-prose kbd {
|
|
|
3541
3606
|
}
|
|
3542
3607
|
.s-table tr.is-disabled th:not(.is-enabled),
|
|
3543
3608
|
.s-table tr.is-disabled td:not(.is-enabled) {
|
|
3544
|
-
opacity: 0.
|
|
3545
|
-
}
|
|
3546
|
-
body.theme-highcontrast .s-table tr.is-disabled th:not(.is-enabled),
|
|
3547
|
-
body.theme-highcontrast .s-table tr.is-disabled td:not(.is-enabled) {
|
|
3548
|
-
opacity: 0.8;
|
|
3609
|
+
opacity: calc(var(--_o-disabled) * 0.6);
|
|
3549
3610
|
}
|
|
3550
3611
|
.s-table--cell1 {
|
|
3551
3612
|
width: 8.33333333%;
|
|
@@ -4021,84 +4082,77 @@ body.theme-highcontrast .s-topbar__dark .s-badge {
|
|
|
4021
4082
|
}
|
|
4022
4083
|
}
|
|
4023
4084
|
.s-uploader {
|
|
4024
|
-
|
|
4025
|
-
|
|
4026
|
-
|
|
4027
|
-
|
|
4028
|
-
|
|
4029
|
-
justify-content: center;
|
|
4030
|
-
padding: var(--su8) var(--su16);
|
|
4085
|
+
--_bg: var(--black-025);
|
|
4086
|
+
--_bg-focus: var(--black-050);
|
|
4087
|
+
--_bg-bc: var(--black-150);
|
|
4088
|
+
--_focus-ring-color: var(--focus-ring);
|
|
4089
|
+
--_bg-b-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='5' ry='5' stroke='%23000000' stroke-width='8' stroke-dasharray='7%2c 22' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
|
|
4031
4090
|
position: relative;
|
|
4032
|
-
text-align: center;
|
|
4033
4091
|
}
|
|
4034
|
-
.s-uploader
|
|
4035
|
-
--
|
|
4036
|
-
content: '';
|
|
4037
|
-
display: block;
|
|
4038
|
-
position: absolute;
|
|
4039
|
-
top: 0;
|
|
4040
|
-
left: 0;
|
|
4041
|
-
right: 0;
|
|
4042
|
-
bottom: 0;
|
|
4043
|
-
background-color: var(--black-150);
|
|
4044
|
-
-webkit-mask-image: var(--s-uploader-background-image);
|
|
4045
|
-
mask-image: var(--s-uploader-background-image);
|
|
4046
|
-
border-radius: var(--br-lg);
|
|
4047
|
-
}
|
|
4048
|
-
body.theme-highcontrast .s-uploader:before {
|
|
4049
|
-
background-color: var(--black-400);
|
|
4092
|
+
body.theme-highcontrast .s-uploader {
|
|
4093
|
+
--_bg-bc-hc: var(--black-400);
|
|
4050
4094
|
}
|
|
4051
|
-
.s-uploader.
|
|
4052
|
-
|
|
4053
|
-
|
|
4054
|
-
.s-uploader.has-error:before {
|
|
4055
|
-
background-color: var(--red-400);
|
|
4095
|
+
.s-uploader.is-active {
|
|
4096
|
+
--_bg: var(--black-050);
|
|
4097
|
+
--_bg-bc: var(--black-200);
|
|
4056
4098
|
}
|
|
4057
|
-
|
|
4058
|
-
|
|
4099
|
+
.s-uploader.is-disabled {
|
|
4100
|
+
opacity: var(--_o-disabled-static);
|
|
4059
4101
|
}
|
|
4060
|
-
.s-uploader.has-error
|
|
4061
|
-
|
|
4102
|
+
.s-uploader.has-error {
|
|
4103
|
+
--_bg: var(--red-050);
|
|
4104
|
+
--_bg-focus: var(--red-100);
|
|
4105
|
+
--_bg-bc: var(--red-400);
|
|
4106
|
+
--_bg-bc-hc-state: var(--red-400);
|
|
4107
|
+
--_focus-ring-color: var(--focus-ring-error);
|
|
4108
|
+
--_link-fc: var(--red-900);
|
|
4062
4109
|
}
|
|
4063
4110
|
.s-uploader.has-success {
|
|
4064
|
-
|
|
4065
|
-
|
|
4066
|
-
|
|
4067
|
-
|
|
4068
|
-
|
|
4069
|
-
|
|
4070
|
-
background-color: var(--green-400);
|
|
4071
|
-
}
|
|
4072
|
-
.s-uploader.has-success .s-link {
|
|
4073
|
-
color: var(--green-900);
|
|
4111
|
+
--_bg: var(--green-025);
|
|
4112
|
+
--_bg-focus: var(--green-050);
|
|
4113
|
+
--_bg-bc: var(--green-400);
|
|
4114
|
+
--_bg-bc-hc-state: var(--green-400);
|
|
4115
|
+
--_focus-ring-color: var(--focus-ring-success);
|
|
4116
|
+
--_link-fc: var(--green-900);
|
|
4074
4117
|
}
|
|
4075
4118
|
.s-uploader.has-warning {
|
|
4076
|
-
|
|
4077
|
-
|
|
4078
|
-
|
|
4079
|
-
|
|
4080
|
-
|
|
4081
|
-
|
|
4082
|
-
|
|
4083
|
-
|
|
4119
|
+
--_bg: var(--yellow-050);
|
|
4120
|
+
--_bg-focus: var(--yellow-100);
|
|
4121
|
+
--_bg-bc: var(--yellow-400);
|
|
4122
|
+
--_bg-bc-hc-state: var(--yellow-400);
|
|
4123
|
+
--_focus-ring-color: var(--focus-ring-warning);
|
|
4124
|
+
--_link-fc: var(--yellow-900);
|
|
4125
|
+
}
|
|
4126
|
+
.s-uploader.has-error .s-link,
|
|
4127
|
+
.s-uploader.has-success .s-link,
|
|
4084
4128
|
.s-uploader.has-warning .s-link {
|
|
4085
|
-
color: var(--
|
|
4086
|
-
}
|
|
4087
|
-
.s-uploader.is-active {
|
|
4088
|
-
background-color: var(--black-050);
|
|
4089
|
-
}
|
|
4090
|
-
.s-uploader.is-active:before {
|
|
4091
|
-
background-color: var(--black-200);
|
|
4092
|
-
}
|
|
4093
|
-
body.theme-highcontrast .s-uploader.is-active:before {
|
|
4094
|
-
background-color: var(--black);
|
|
4095
|
-
}
|
|
4096
|
-
.s-uploader.is-disabled {
|
|
4097
|
-
opacity: 0.5;
|
|
4129
|
+
color: var(--_link-fc);
|
|
4098
4130
|
}
|
|
4099
4131
|
.s-uploader input[type="file"]::file-selector-button {
|
|
4100
4132
|
cursor: pointer;
|
|
4101
4133
|
}
|
|
4134
|
+
.s-uploader .s-uploader--container {
|
|
4135
|
+
align-items: center;
|
|
4136
|
+
background-color: var(--_bg);
|
|
4137
|
+
border-radius: var(--br-lg);
|
|
4138
|
+
display: flex;
|
|
4139
|
+
flex-direction: column;
|
|
4140
|
+
justify-content: center;
|
|
4141
|
+
min-height: var(--su-static128);
|
|
4142
|
+
padding: var(--su8) var(--su16);
|
|
4143
|
+
position: relative;
|
|
4144
|
+
text-align: center;
|
|
4145
|
+
}
|
|
4146
|
+
.s-uploader .s-uploader--container:before {
|
|
4147
|
+
-webkit-mask-image: var(--_bg-b-image);
|
|
4148
|
+
mask-image: var(--_bg-b-image);
|
|
4149
|
+
background-color: var(--_bg-bc-hc-state, var(--_bg-bc-hc, var(--_bg-bc)));
|
|
4150
|
+
content: '';
|
|
4151
|
+
border-radius: var(--br-lg);
|
|
4152
|
+
display: block;
|
|
4153
|
+
position: absolute;
|
|
4154
|
+
inset: 0;
|
|
4155
|
+
}
|
|
4102
4156
|
.s-uploader .s-uploader--input {
|
|
4103
4157
|
cursor: pointer;
|
|
4104
4158
|
height: 100%;
|
|
@@ -4106,10 +4160,11 @@ body.theme-highcontrast .s-uploader.is-active:before {
|
|
|
4106
4160
|
opacity: 0;
|
|
4107
4161
|
position: absolute;
|
|
4108
4162
|
width: 100%;
|
|
4163
|
+
z-index: var(--zi-selected);
|
|
4109
4164
|
}
|
|
4110
4165
|
.s-uploader .s-uploader--input:focus:focus-visible + .s-uploader--container {
|
|
4111
|
-
background-color: var(--
|
|
4112
|
-
box-shadow: 0 0 0 var(--su-static4) var(--
|
|
4166
|
+
background-color: var(--_bg-focus);
|
|
4167
|
+
box-shadow: 0 0 0 var(--su-static4) var(--_focus-ring-color);
|
|
4113
4168
|
}
|
|
4114
4169
|
.s-uploader .s-uploader--preview {
|
|
4115
4170
|
max-width: 100%;
|
|
@@ -4170,8 +4225,7 @@ body.theme-highcontrast .s-uploader .s-uploader--preview-thumbnail {
|
|
|
4170
4225
|
object-fit: cover;
|
|
4171
4226
|
}
|
|
4172
4227
|
.s-uploader .s-uploader--previews.has-multiple .s-uploader--preview-thumbnail:not(img) {
|
|
4173
|
-
|
|
4174
|
-
background-image: var(--s-uploader--preview-document-icon);
|
|
4228
|
+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' fill='%23535A60' width='18' height='18' viewBox='0 0 18 18'%3E%3Cpath d='M3 3a2 2 0 012-2h6l4 4v10a2 2 0 01-2 2H5a2 2 0 01-2-2V3zm7-1.5V6h4.5L10 1.5z'%3E%3C/path%3E%3C/svg%3E");
|
|
4175
4229
|
background-position: center;
|
|
4176
4230
|
background-repeat: no-repeat;
|
|
4177
4231
|
}
|
|
@@ -4865,6 +4919,7 @@ body.theme-system .theme-light__forced {
|
|
|
4865
4919
|
--yellow-700: hsl(47, 79%, 40%);
|
|
4866
4920
|
--yellow-800: hsl(47, 82%, 34%);
|
|
4867
4921
|
--yellow-900: hsl(47, 84%, 28%);
|
|
4922
|
+
--red-025: hsl(358, 80%, 98%);
|
|
4868
4923
|
--red-050: hsl(358, 75%, 97%);
|
|
4869
4924
|
--red-100: hsl(358, 76%, 90%);
|
|
4870
4925
|
--red-200: hsl(358, 74%, 83%);
|
|
@@ -4897,6 +4952,8 @@ body.theme-system .theme-light__forced {
|
|
|
4897
4952
|
--focus-ring-warning: hsla(47, 79%, 58%, 0.4);
|
|
4898
4953
|
--focus-ring-error: hsla(358, 62%, 47%, 0.15);
|
|
4899
4954
|
--focus-ring-muted: hsla(210, 8%, 15%, 0.1);
|
|
4955
|
+
--_o-disabled: 0.5;
|
|
4956
|
+
--_o-disabled-static: 0.5;
|
|
4900
4957
|
--bs-sm: 0 1px 2px hsla(0, 0%, 0%, 0.05), 0 1px 4px hsla(0, 0%, 0%, 0.05), 0 2px 8px hsla(0, 0%, 0%, 0.05);
|
|
4901
4958
|
--bs-md: 0 1px 3px hsla(0, 0%, 0%, 0.06), 0 2px 6px hsla(0, 0%, 0%, 0.06), 0 3px 8px hsla(0, 0%, 0%, 0.09);
|
|
4902
4959
|
--bs-lg: 0 1px 4px hsla(0, 0%, 0%, 0.09), 0 3px 8px hsla(0, 0%, 0%, 0.09), 0 4px 13px hsla(0, 0%, 0%, 0.13);
|
|
@@ -5036,6 +5093,7 @@ body:not(.theme-dark) .theme-dark__forced {
|
|
|
5036
5093
|
--yellow-700: hsl(47, 84.5%, 64%);
|
|
5037
5094
|
--yellow-800: hsl(47, 90%, 72.5%);
|
|
5038
5095
|
--yellow-900: hsl(47, 93%, 83.5%);
|
|
5096
|
+
--red-025: hsl(1, 10%, 24%);
|
|
5039
5097
|
--red-050: hsl(1, 30%, 26.5%);
|
|
5040
5098
|
--red-100: hsl(1, 35%, 33%);
|
|
5041
5099
|
--red-200: hsl(1, 37%, 38.5%);
|
|
@@ -5068,6 +5126,8 @@ body:not(.theme-dark) .theme-dark__forced {
|
|
|
5068
5126
|
--focus-ring-warning: hsla(47, 79%, 58%, 0.4);
|
|
5069
5127
|
--focus-ring-error: hsla(358, 62%, 52%, 0.3);
|
|
5070
5128
|
--focus-ring-muted: hsla(0, 0%, 100%, 0.1);
|
|
5129
|
+
--_o-disabled: 0.5;
|
|
5130
|
+
--_o-disabled-static: 0.5;
|
|
5071
5131
|
--bs-sm: 0 1px 2px hsla(0, 0%, 0%, 0.1), 0 1px 4px hsla(0, 0%, 0%, 0.1), 0 2px 8px hsla(0, 0%, 0%, 0.1);
|
|
5072
5132
|
--bs-md: 0 1px 3px hsla(0, 0%, 0%, 0.11), 0 2px 6px hsla(0, 0%, 0%, 0.11), 0 3px 8px hsla(0, 0%, 0%, 0.14);
|
|
5073
5133
|
--bs-lg: 0 1px 4px hsla(0, 0%, 0%, 0.14), 0 3px 8px hsla(0, 0%, 0%, 0.14), 0 4px 13px hsla(0, 0%, 0%, 0.18);
|
|
@@ -5205,6 +5265,7 @@ body:not(.theme-dark) .theme-dark__forced .themed {
|
|
|
5205
5265
|
--yellow-700: hsl(47, 84.5%, 64%);
|
|
5206
5266
|
--yellow-800: hsl(47, 90%, 72.5%);
|
|
5207
5267
|
--yellow-900: hsl(47, 93%, 83.5%);
|
|
5268
|
+
--red-025: hsl(1, 10%, 24%);
|
|
5208
5269
|
--red-050: hsl(1, 30%, 26.5%);
|
|
5209
5270
|
--red-100: hsl(1, 35%, 33%);
|
|
5210
5271
|
--red-200: hsl(1, 37%, 38.5%);
|
|
@@ -5237,6 +5298,8 @@ body:not(.theme-dark) .theme-dark__forced .themed {
|
|
|
5237
5298
|
--focus-ring-warning: hsla(47, 79%, 58%, 0.4);
|
|
5238
5299
|
--focus-ring-error: hsla(358, 62%, 52%, 0.3);
|
|
5239
5300
|
--focus-ring-muted: hsla(0, 0%, 100%, 0.1);
|
|
5301
|
+
--_o-disabled: 0.5;
|
|
5302
|
+
--_o-disabled-static: 0.5;
|
|
5240
5303
|
--bs-sm: 0 1px 2px hsla(0, 0%, 0%, 0.1), 0 1px 4px hsla(0, 0%, 0%, 0.1), 0 2px 8px hsla(0, 0%, 0%, 0.1);
|
|
5241
5304
|
--bs-md: 0 1px 3px hsla(0, 0%, 0%, 0.11), 0 2px 6px hsla(0, 0%, 0%, 0.11), 0 3px 8px hsla(0, 0%, 0%, 0.14);
|
|
5242
5305
|
--bs-lg: 0 1px 4px hsla(0, 0%, 0%, 0.14), 0 3px 8px hsla(0, 0%, 0%, 0.14), 0 4px 13px hsla(0, 0%, 0%, 0.18);
|
|
@@ -5374,6 +5437,7 @@ body.theme-system.theme-highcontrast .theme-light__forced {
|
|
|
5374
5437
|
--yellow-700: hsl(47, 100%, 19%);
|
|
5375
5438
|
--yellow-800: hsl(47, 100%, 13%);
|
|
5376
5439
|
--yellow-900: hsl(47, 100%, 7%);
|
|
5440
|
+
--red-025: hsl(358, 100%, 97%);
|
|
5377
5441
|
--red-050: hsl(358, 100%, 94%);
|
|
5378
5442
|
--red-100: hsl(358, 100%, 92%);
|
|
5379
5443
|
--red-200: hsl(358, 100%, 89%);
|
|
@@ -5407,6 +5471,7 @@ body.theme-system.theme-highcontrast .theme-light__forced {
|
|
|
5407
5471
|
--focus-ring-warning: hsla(47, 76%, 46%, 0.9);
|
|
5408
5472
|
--focus-ring-error: hsla(358, 62%, 47%, 0.9);
|
|
5409
5473
|
--focus-ring-muted: hsla(210, 8%, 55%, 0.95);
|
|
5474
|
+
--_o-disabled: 0.8;
|
|
5410
5475
|
--bs-sm: none;
|
|
5411
5476
|
--bs-md: none;
|
|
5412
5477
|
--bs-lg: none;
|
|
@@ -5495,6 +5560,7 @@ body.theme-highcontrast:not(.theme-dark) .theme-dark__forced {
|
|
|
5495
5560
|
--yellow-700: hsl(47, 100%, 79%);
|
|
5496
5561
|
--yellow-800: hsl(47, 100%, 87%);
|
|
5497
5562
|
--yellow-900: hsl(47, 100%, 95%);
|
|
5563
|
+
--red-025: hsl(358, 100%, 7%);
|
|
5498
5564
|
--red-050: hsl(358, 100%, 9%);
|
|
5499
5565
|
--red-100: hsl(358, 100%, 12%);
|
|
5500
5566
|
--red-200: hsl(358, 100%, 17%);
|
|
@@ -5528,6 +5594,7 @@ body.theme-highcontrast:not(.theme-dark) .theme-dark__forced {
|
|
|
5528
5594
|
--fc-dark: var(--black-900);
|
|
5529
5595
|
--fc-medium: var(--black-700);
|
|
5530
5596
|
--fc-light: var(--black-500);
|
|
5597
|
+
--_o-disabled: 0.8;
|
|
5531
5598
|
--bs-sm: none;
|
|
5532
5599
|
--bs-md: none;
|
|
5533
5600
|
--bs-lg: none;
|
|
@@ -5616,6 +5683,7 @@ body.theme-highcontrast:not(.theme-dark) .theme-dark__forced {
|
|
|
5616
5683
|
--yellow-700: hsl(47, 100%, 79%);
|
|
5617
5684
|
--yellow-800: hsl(47, 100%, 87%);
|
|
5618
5685
|
--yellow-900: hsl(47, 100%, 95%);
|
|
5686
|
+
--red-025: hsl(358, 100%, 7%);
|
|
5619
5687
|
--red-050: hsl(358, 100%, 9%);
|
|
5620
5688
|
--red-100: hsl(358, 100%, 12%);
|
|
5621
5689
|
--red-200: hsl(358, 100%, 17%);
|
|
@@ -5649,6 +5717,7 @@ body.theme-highcontrast:not(.theme-dark) .theme-dark__forced {
|
|
|
5649
5717
|
--fc-dark: var(--black-900);
|
|
5650
5718
|
--fc-medium: var(--black-700);
|
|
5651
5719
|
--fc-light: var(--black-500);
|
|
5720
|
+
--_o-disabled: 0.8;
|
|
5652
5721
|
--bs-sm: none;
|
|
5653
5722
|
--bs-md: none;
|
|
5654
5723
|
--bs-lg: none;
|
|
@@ -6175,6 +6244,9 @@ body.theme-highcontrast .bc-black-200 {
|
|
|
6175
6244
|
.bc-green-900 {
|
|
6176
6245
|
border-color: var(--green-900) !important;
|
|
6177
6246
|
}
|
|
6247
|
+
.bc-red-025 {
|
|
6248
|
+
border-color: var(--red-025) !important;
|
|
6249
|
+
}
|
|
6178
6250
|
.bc-red-050 {
|
|
6179
6251
|
border-color: var(--red-050) !important;
|
|
6180
6252
|
}
|
|
@@ -9487,6 +9559,38 @@ body.theme-dark .d\:bg-green-025,
|
|
|
9487
9559
|
body.theme-system .theme-dark__forced .d\:bg-green-025 {
|
|
9488
9560
|
background-color: var(--green-025) !important;
|
|
9489
9561
|
}
|
|
9562
|
+
.fc-red-025,
|
|
9563
|
+
.h\:fc-red-025:hover,
|
|
9564
|
+
.f\:fc-red-025:focus,
|
|
9565
|
+
.f\:fc-red-025:focus-within {
|
|
9566
|
+
color: var(--red-025) !important;
|
|
9567
|
+
}
|
|
9568
|
+
@media (prefers-color-scheme: dark) {
|
|
9569
|
+
body.theme-system .d\:fc-red-025 {
|
|
9570
|
+
color: var(--red-025) !important;
|
|
9571
|
+
}
|
|
9572
|
+
}
|
|
9573
|
+
body.theme-dark .d\:fc-red-025,
|
|
9574
|
+
.theme-dark__forced .d\:fc-red-025,
|
|
9575
|
+
body.theme-system .theme-dark__forced .d\:fc-red-025 {
|
|
9576
|
+
color: var(--red-025) !important;
|
|
9577
|
+
}
|
|
9578
|
+
.bg-red-025,
|
|
9579
|
+
.h\:bg-red-025:hover,
|
|
9580
|
+
.f\:bg-red-025:focus,
|
|
9581
|
+
.f\:bg-red-025:focus-within {
|
|
9582
|
+
background-color: var(--red-025) !important;
|
|
9583
|
+
}
|
|
9584
|
+
@media (prefers-color-scheme: dark) {
|
|
9585
|
+
body.theme-system .d\:bg-red-025 {
|
|
9586
|
+
background-color: var(--red-025) !important;
|
|
9587
|
+
}
|
|
9588
|
+
}
|
|
9589
|
+
body.theme-dark .d\:bg-red-025,
|
|
9590
|
+
.theme-dark__forced .d\:bg-red-025,
|
|
9591
|
+
body.theme-system .theme-dark__forced .d\:bg-red-025 {
|
|
9592
|
+
background-color: var(--red-025) !important;
|
|
9593
|
+
}
|
|
9490
9594
|
.fc-theme-primary-350,
|
|
9491
9595
|
.h\:fc-theme-primary-350:hover,
|
|
9492
9596
|
.f\:fc-theme-primary-350:focus,
|
|
@@ -13214,23 +13318,18 @@ p {
|
|
|
13214
13318
|
}
|
|
13215
13319
|
.ow-normal {
|
|
13216
13320
|
overflow-wrap: normal !important;
|
|
13217
|
-
word-wrap: normal !important;
|
|
13218
13321
|
}
|
|
13219
13322
|
.ow-break-word {
|
|
13220
13323
|
overflow-wrap: break-word !important;
|
|
13221
|
-
word-wrap: break-word !important;
|
|
13222
13324
|
}
|
|
13223
13325
|
.ow-inherit {
|
|
13224
13326
|
overflow-wrap: inherit !important;
|
|
13225
|
-
word-wrap: inherit !important;
|
|
13226
13327
|
}
|
|
13227
13328
|
.ow-initial {
|
|
13228
13329
|
overflow-wrap: initial !important;
|
|
13229
|
-
word-wrap: initial !important;
|
|
13230
13330
|
}
|
|
13231
13331
|
.ow-unset {
|
|
13232
13332
|
overflow-wrap: unset !important;
|
|
13233
|
-
word-wrap: unset !important;
|
|
13234
13333
|
}
|
|
13235
13334
|
.hyphens-none {
|
|
13236
13335
|
hyphens: none !important;
|
|
@@ -13245,7 +13344,6 @@ p {
|
|
|
13245
13344
|
}
|
|
13246
13345
|
.break-word {
|
|
13247
13346
|
word-break: break-word !important;
|
|
13248
|
-
word-wrap: break-word !important;
|
|
13249
13347
|
overflow-wrap: break-word !important;
|
|
13250
13348
|
-webkit-hyphens: auto !important;
|
|
13251
13349
|
-moz-hyphens: auto !important;
|
|
@@ -13486,7 +13584,7 @@ ol {
|
|
|
13486
13584
|
padding: 0;
|
|
13487
13585
|
position: absolute;
|
|
13488
13586
|
width: 1px;
|
|
13489
|
-
|
|
13587
|
+
overflow-wrap: normal;
|
|
13490
13588
|
}
|
|
13491
13589
|
.float-left {
|
|
13492
13590
|
float: left !important;
|
|
@@ -19126,51 +19224,6 @@ body *:before,
|
|
|
19126
19224
|
body *:after {
|
|
19127
19225
|
box-sizing: inherit;
|
|
19128
19226
|
}
|
|
19129
|
-
.s-banner__body-pt {
|
|
19130
|
-
padding-top: 93px;
|
|
19131
|
-
}
|
|
19132
|
-
.s-banner {
|
|
19133
|
-
position: fixed;
|
|
19134
|
-
z-index: calc(var(--zi-navigation-fixed) - 1);
|
|
19135
|
-
top: 0;
|
|
19136
|
-
right: 0;
|
|
19137
|
-
left: 0;
|
|
19138
|
-
width: 100%;
|
|
19139
|
-
padding: var(--su12);
|
|
19140
|
-
border-top: 1px solid transparent;
|
|
19141
|
-
border-bottom: 1px solid transparent;
|
|
19142
|
-
border-radius: 0;
|
|
19143
|
-
box-shadow: none;
|
|
19144
|
-
color: var(--fc-medium);
|
|
19145
|
-
font-size: var(--fs-body1);
|
|
19146
|
-
}
|
|
19147
|
-
.s-banner[aria-hidden="true"] {
|
|
19148
|
-
visibility: hidden;
|
|
19149
|
-
opacity: 0;
|
|
19150
|
-
-webkit-transform: translate3d(0, -50px, 0);
|
|
19151
|
-
transform: translate3d(0, -50px, 0);
|
|
19152
|
-
}
|
|
19153
|
-
.s-banner[aria-hidden="false"] {
|
|
19154
|
-
visibility: visible;
|
|
19155
|
-
opacity: 1;
|
|
19156
|
-
-webkit-transform: translate3d(0, 49px, 0);
|
|
19157
|
-
transform: translate3d(0, 49px, 0);
|
|
19158
|
-
}
|
|
19159
|
-
.s-banner.is-pinned {
|
|
19160
|
-
z-index: calc(var(--zi-navigation-fixed) + 1);
|
|
19161
|
-
-webkit-transform: translate3d(0, 0, 0);
|
|
19162
|
-
transform: translate3d(0, 0, 0);
|
|
19163
|
-
}
|
|
19164
|
-
.s-banner.s-banner__important {
|
|
19165
|
-
border-color: transparent;
|
|
19166
|
-
color: var(--white);
|
|
19167
|
-
}
|
|
19168
|
-
.s-banner--container {
|
|
19169
|
-
position: relative;
|
|
19170
|
-
width: 100%;
|
|
19171
|
-
max-width: calc(var(--s-step) * 10);
|
|
19172
|
-
margin: 0 auto;
|
|
19173
|
-
}
|
|
19174
19227
|
.s-btn {
|
|
19175
19228
|
position: relative;
|
|
19176
19229
|
display: inline-block;
|
|
@@ -19218,7 +19271,7 @@ button[type="reset"] .s-btn {
|
|
|
19218
19271
|
box-shadow: 0 0 0 var(--su-static4) var(--focus-ring);
|
|
19219
19272
|
}
|
|
19220
19273
|
.s-btn[disabled] {
|
|
19221
|
-
opacity:
|
|
19274
|
+
opacity: var(--_o-disabled-static);
|
|
19222
19275
|
pointer-events: none;
|
|
19223
19276
|
box-shadow: none !important;
|
|
19224
19277
|
}
|
|
@@ -19282,7 +19335,7 @@ button[type="reset"] .s-btn {
|
|
|
19282
19335
|
border-bottom-width: 0;
|
|
19283
19336
|
}
|
|
19284
19337
|
.s-btn .s-btn--badge {
|
|
19285
|
-
opacity:
|
|
19338
|
+
opacity: var(--_o-disabled);
|
|
19286
19339
|
display: inline-block;
|
|
19287
19340
|
border-radius: var(--br-sm);
|
|
19288
19341
|
padding: var(--su2) calc(var(--su4) - var(--su1));
|
|
@@ -19290,9 +19343,6 @@ button[type="reset"] .s-btn {
|
|
|
19290
19343
|
line-height: var(--lh-xs);
|
|
19291
19344
|
background-color: currentColor;
|
|
19292
19345
|
}
|
|
19293
|
-
body.theme-highcontrast .s-btn .s-btn--badge {
|
|
19294
|
-
opacity: 0.8;
|
|
19295
|
-
}
|
|
19296
19346
|
.s-btn .s-btn--number {
|
|
19297
19347
|
color: var(--white);
|
|
19298
19348
|
}
|
|
@@ -19772,38 +19822,6 @@ body.theme-highcontrast .s-btn__link {
|
|
|
19772
19822
|
margin-bottom: -0.3em;
|
|
19773
19823
|
transition: opacity 200ms var(--te-smooth);
|
|
19774
19824
|
}
|
|
19775
|
-
.s-btn.is-loading {
|
|
19776
|
-
padding-left: 2.2em;
|
|
19777
|
-
}
|
|
19778
|
-
.s-btn.is-loading:before {
|
|
19779
|
-
content: "";
|
|
19780
|
-
position: absolute;
|
|
19781
|
-
opacity: 0.3;
|
|
19782
|
-
left: 0.6em;
|
|
19783
|
-
top: calc(50% - 0.6em);
|
|
19784
|
-
width: 1.23076923em;
|
|
19785
|
-
height: 1.23076923em;
|
|
19786
|
-
border-width: 2px;
|
|
19787
|
-
border-style: solid;
|
|
19788
|
-
border-color: currentColor;
|
|
19789
|
-
border-radius: var(--br-circle);
|
|
19790
|
-
}
|
|
19791
|
-
.s-btn.is-loading:after {
|
|
19792
|
-
content: "";
|
|
19793
|
-
position: absolute;
|
|
19794
|
-
left: 0.6em;
|
|
19795
|
-
top: calc(50% - 0.6em);
|
|
19796
|
-
width: 1.23076923em;
|
|
19797
|
-
height: 1.23076923em;
|
|
19798
|
-
border-width: 2px;
|
|
19799
|
-
border-style: solid;
|
|
19800
|
-
border-color: transparent;
|
|
19801
|
-
border-left-color: currentColor;
|
|
19802
|
-
border-radius: var(--br-circle);
|
|
19803
|
-
animation: s-spinner-rotate 0.9s infinite cubic-bezier(0.5, 0.1, 0.5, 0.9);
|
|
19804
|
-
filter: invert(0);
|
|
19805
|
-
transform-origin: 50% 50% 1px;
|
|
19806
|
-
}
|
|
19807
19825
|
.s-btn.is-loading .svg-icon:first-child {
|
|
19808
19826
|
margin-left: -23px;
|
|
19809
19827
|
opacity: 0;
|
|
@@ -20125,6 +20143,7 @@ button.s-link:focus {
|
|
|
20125
20143
|
box-shadow: 0 0 0 var(--su-static4) var(--focus-ring-muted);
|
|
20126
20144
|
}
|
|
20127
20145
|
.s-block-link.is-selected {
|
|
20146
|
+
--_block-bs: inset var(--_block-bs-offset-x, 3px) 0 0 var(--theme-primary-color);
|
|
20128
20147
|
color: var(--black-800);
|
|
20129
20148
|
font-weight: bold;
|
|
20130
20149
|
background-color: var(--black-050);
|
|
@@ -20140,10 +20159,21 @@ body.theme-system .theme-dark__forced .s-block-link.is-selected {
|
|
|
20140
20159
|
background-color: var(--black-025);
|
|
20141
20160
|
}
|
|
20142
20161
|
.s-block-link.is-selected.s-block-link__right {
|
|
20143
|
-
|
|
20162
|
+
--_block-bs-offset-x: -3px;
|
|
20163
|
+
}
|
|
20164
|
+
.s-block-link.is-selected.s-block-link__left,
|
|
20165
|
+
.s-block-link.is-selected.s-block-link__right {
|
|
20166
|
+
box-shadow: var(--_block-bs);
|
|
20167
|
+
}
|
|
20168
|
+
.s-block-link.is-selected.s-block-link__left:focus:not(:focus-visible),
|
|
20169
|
+
.s-block-link.is-selected.s-block-link__right:focus:not(:focus-visible),
|
|
20170
|
+
.s-block-link.is-selected.s-block-link__left:focus-visible,
|
|
20171
|
+
.s-block-link.is-selected.s-block-link__right:focus-visible {
|
|
20172
|
+
outline: none;
|
|
20144
20173
|
}
|
|
20145
|
-
.s-block-link.is-selected.s-block-link__left
|
|
20146
|
-
|
|
20174
|
+
.s-block-link.is-selected.s-block-link__left:focus-visible,
|
|
20175
|
+
.s-block-link.is-selected.s-block-link__right:focus-visible {
|
|
20176
|
+
box-shadow: var(--_block-bs), 0 0 0 var(--su-static4) var(--focus-ring-muted);
|
|
20147
20177
|
}
|
|
20148
20178
|
.s-block-link.s-block-link__danger {
|
|
20149
20179
|
color: var(--red-500);
|
|
@@ -20271,188 +20301,439 @@ body.theme-highcontrast a.s-link-preview--title.s-link__visited:active {
|
|
|
20271
20301
|
.s-link-preview--footer a:focus {
|
|
20272
20302
|
color: var(--black-600);
|
|
20273
20303
|
}
|
|
20274
|
-
.s-
|
|
20275
|
-
|
|
20276
|
-
border:
|
|
20277
|
-
border-
|
|
20278
|
-
color: var(--fc-medium);
|
|
20304
|
+
.s-banner {
|
|
20305
|
+
background: var(--_bg, var(--black-050));
|
|
20306
|
+
border-color: var(--_bc, var(--bc-medium));
|
|
20307
|
+
border-style: solid;
|
|
20308
|
+
color: var(--_fc, var(--fc-medium));
|
|
20279
20309
|
font-size: var(--fs-body1);
|
|
20280
|
-
|
|
20281
|
-
|
|
20282
|
-
|
|
20310
|
+
--_x-offset: 0;
|
|
20311
|
+
border-width: var(--su-static1) 0;
|
|
20312
|
+
inset: 0 0 auto 0;
|
|
20313
|
+
padding: var(--su12);
|
|
20314
|
+
position: fixed;
|
|
20283
20315
|
width: 100%;
|
|
20284
|
-
|
|
20285
|
-
|
|
20286
|
-
|
|
20287
|
-
pointer-events: all;
|
|
20316
|
+
z-index: calc(var(--zi-navigation-fixed) - 1);
|
|
20317
|
+
-webkit-transform: translate3d(0, var(--_x-offset), 0);
|
|
20318
|
+
transform: translate3d(0, var(--_x-offset), 0);
|
|
20288
20319
|
}
|
|
20289
|
-
.s-
|
|
20290
|
-
|
|
20320
|
+
.s-banner code {
|
|
20321
|
+
background: var(--_code-bg, transparent);
|
|
20322
|
+
}
|
|
20323
|
+
.s-banner .s-banner--btn {
|
|
20324
|
+
color: inherit;
|
|
20291
20325
|
padding: var(--su8);
|
|
20292
20326
|
}
|
|
20293
|
-
.s-
|
|
20327
|
+
.s-banner .s-banner--btn:focus,
|
|
20328
|
+
.s-banner .s-banner--btn:hover {
|
|
20329
|
+
background: var(--_btn-focus-bg, var(--black-100));
|
|
20330
|
+
}
|
|
20331
|
+
.s-banner .s-banner--btn:active {
|
|
20332
|
+
background: var(--_btn-active-bg, var(--black-150));
|
|
20333
|
+
}
|
|
20334
|
+
@media (prefers-color-scheme: dark) {
|
|
20335
|
+
body.theme-system .s-banner:not(.s-banner__important) {
|
|
20336
|
+
--_bc: var(--_bg);
|
|
20337
|
+
}
|
|
20338
|
+
}
|
|
20339
|
+
body.theme-dark .s-banner:not(.s-banner__important),
|
|
20340
|
+
.theme-dark__forced .s-banner:not(.s-banner__important),
|
|
20341
|
+
body.theme-system .theme-dark__forced .s-banner:not(.s-banner__important) {
|
|
20342
|
+
--_bc: var(--_bg);
|
|
20343
|
+
}
|
|
20344
|
+
body.theme-highcontrast .s-banner:not(.s-banner__important) {
|
|
20345
|
+
--_bc: currentColor;
|
|
20346
|
+
}
|
|
20347
|
+
@media (prefers-color-scheme: dark) {
|
|
20348
|
+
body.theme-highcontrast.theme-system .s-banner:not(.s-banner__important) {
|
|
20349
|
+
--_bc: currentColor;
|
|
20350
|
+
}
|
|
20351
|
+
}
|
|
20352
|
+
body.theme-highcontrast.theme-dark .s-banner:not(.s-banner__important) {
|
|
20353
|
+
--_bc: currentColor;
|
|
20354
|
+
}
|
|
20355
|
+
.s-banner__important {
|
|
20356
|
+
--_bc: var(--_bg);
|
|
20357
|
+
--_bg: var(--black-700);
|
|
20358
|
+
--_fc: var(--white);
|
|
20359
|
+
--_btn-focus-bg: var(--black-800);
|
|
20360
|
+
--_btn-active-bg: var(--black-900);
|
|
20361
|
+
}
|
|
20362
|
+
body.theme-highcontrast .s-banner__important {
|
|
20363
|
+
--_bc: var(--_bg);
|
|
20364
|
+
}
|
|
20365
|
+
.s-banner__danger {
|
|
20366
|
+
--_bc: var(--red-200);
|
|
20367
|
+
--_bg: var(--red-050);
|
|
20368
|
+
--_btn-focus-bg: var(--red-100);
|
|
20369
|
+
--_btn-active-bg: var(--red-200);
|
|
20370
|
+
}
|
|
20371
|
+
body.theme-highcontrast .s-banner__danger:not(.s-banner__important) {
|
|
20372
|
+
--_bg: var(--red-200);
|
|
20373
|
+
}
|
|
20374
|
+
.s-banner__danger.s-banner__important {
|
|
20375
|
+
--_bc: var(--_bg);
|
|
20376
|
+
--_bg: var(--red-500);
|
|
20377
|
+
--_btn-focus-bg: var(--red-600);
|
|
20378
|
+
--_btn-active-bg: var(--red-700);
|
|
20379
|
+
}
|
|
20380
|
+
@media (prefers-color-scheme: dark) {
|
|
20381
|
+
body.theme-system .s-banner__danger.s-banner__important {
|
|
20382
|
+
--_bg: var(--red-400);
|
|
20383
|
+
--_fc: var(--black-900);
|
|
20384
|
+
}
|
|
20385
|
+
}
|
|
20386
|
+
body.theme-dark .s-banner__danger.s-banner__important,
|
|
20387
|
+
.theme-dark__forced .s-banner__danger.s-banner__important,
|
|
20388
|
+
body.theme-system .theme-dark__forced .s-banner__danger.s-banner__important {
|
|
20389
|
+
--_bg: var(--red-400);
|
|
20390
|
+
--_fc: var(--black-900);
|
|
20391
|
+
}
|
|
20392
|
+
@media (prefers-color-scheme: dark) {
|
|
20393
|
+
body.theme-highcontrast.theme-system .s-banner__danger.s-banner__important {
|
|
20394
|
+
--_bg: var(--red-500);
|
|
20395
|
+
--_fc: var(--white);
|
|
20396
|
+
}
|
|
20397
|
+
}
|
|
20398
|
+
body.theme-highcontrast.theme-dark .s-banner__danger.s-banner__important {
|
|
20399
|
+
--_bg: var(--red-500);
|
|
20400
|
+
--_fc: var(--white);
|
|
20401
|
+
}
|
|
20294
20402
|
.s-banner__info {
|
|
20295
|
-
|
|
20296
|
-
|
|
20403
|
+
--_bc: var(--theme-secondary-150);
|
|
20404
|
+
--_bg: var(--theme-secondary-050);
|
|
20405
|
+
--_btn-focus-bg: var(--theme-secondary-100);
|
|
20406
|
+
--_btn-active-bg: var(--theme-secondary-150);
|
|
20407
|
+
--_code-bg: var(--theme-secondary-150);
|
|
20408
|
+
}
|
|
20409
|
+
body.theme-highcontrast .s-banner__info:not(.s-banner__important) {
|
|
20410
|
+
--_bg: var(--theme-secondary-100);
|
|
20411
|
+
}
|
|
20412
|
+
@media (prefers-color-scheme: dark) {
|
|
20413
|
+
body.theme-highcontrast.theme-system .s-banner__info:not(.s-banner__important) {
|
|
20414
|
+
--_bg: var(--theme-secondary-100);
|
|
20415
|
+
}
|
|
20416
|
+
}
|
|
20417
|
+
body.theme-highcontrast.theme-dark .s-banner__info:not(.s-banner__important) {
|
|
20418
|
+
--_bg: var(--theme-secondary-100);
|
|
20297
20419
|
}
|
|
20298
|
-
.s-notice__info.s-notice__important,
|
|
20299
|
-
.s-banner__info.s-notice__important,
|
|
20300
|
-
.s-notice__info.s-banner__important,
|
|
20301
20420
|
.s-banner__info.s-banner__important {
|
|
20302
|
-
|
|
20421
|
+
--_bc: var(--_bg);
|
|
20422
|
+
--_bg: var(--theme-secondary-400);
|
|
20423
|
+
--_btn-focus-bg: var(--theme-secondary-500);
|
|
20424
|
+
--_btn-active-bg: var(--theme-secondary-600);
|
|
20303
20425
|
}
|
|
20304
|
-
|
|
20305
|
-
.s-banner__info
|
|
20306
|
-
|
|
20307
|
-
|
|
20308
|
-
|
|
20426
|
+
@media (prefers-color-scheme: dark) {
|
|
20427
|
+
body.theme-system .s-banner__info.s-banner__important {
|
|
20428
|
+
--_bg: var(--theme-secondary-300);
|
|
20429
|
+
--_fc: var(--black-900);
|
|
20430
|
+
}
|
|
20309
20431
|
}
|
|
20310
|
-
.
|
|
20311
|
-
.s-banner__info
|
|
20312
|
-
|
|
20432
|
+
body.theme-dark .s-banner__info.s-banner__important,
|
|
20433
|
+
.theme-dark__forced .s-banner__info.s-banner__important,
|
|
20434
|
+
body.theme-system .theme-dark__forced .s-banner__info.s-banner__important {
|
|
20435
|
+
--_bg: var(--theme-secondary-300);
|
|
20436
|
+
--_fc: var(--black-900);
|
|
20437
|
+
}
|
|
20438
|
+
@media (prefers-color-scheme: dark) {
|
|
20439
|
+
body.theme-highcontrast.theme-system .s-banner__info.s-banner__important {
|
|
20440
|
+
--_bg: var(--theme-secondary-400);
|
|
20441
|
+
--_fc: var(--white);
|
|
20442
|
+
}
|
|
20313
20443
|
}
|
|
20314
|
-
.s-
|
|
20315
|
-
|
|
20316
|
-
|
|
20444
|
+
body.theme-highcontrast.theme-dark .s-banner__info.s-banner__important {
|
|
20445
|
+
--_bg: var(--theme-secondary-400);
|
|
20446
|
+
--_fc: var(--white);
|
|
20317
20447
|
}
|
|
20318
|
-
.s-notice__success,
|
|
20319
20448
|
.s-banner__success {
|
|
20320
|
-
|
|
20321
|
-
|
|
20449
|
+
--_bc: var(--green-200);
|
|
20450
|
+
--_bg: var(--green-050);
|
|
20451
|
+
--_btn-focus-bg: var(--green-100);
|
|
20452
|
+
--_btn-active-bg: var(--green-200);
|
|
20322
20453
|
}
|
|
20323
|
-
body.theme-highcontrast .s-
|
|
20324
|
-
|
|
20325
|
-
background-color: var(--green-200);
|
|
20326
|
-
border-color: var(--green-400);
|
|
20454
|
+
body.theme-highcontrast .s-banner__success:not(.s-banner__important) {
|
|
20455
|
+
--_bg: var(--green-200);
|
|
20327
20456
|
}
|
|
20328
|
-
.s-notice__success.s-notice__important,
|
|
20329
|
-
.s-banner__success.s-notice__important,
|
|
20330
|
-
.s-notice__success.s-banner__important,
|
|
20331
20457
|
.s-banner__success.s-banner__important {
|
|
20332
|
-
|
|
20333
|
-
|
|
20458
|
+
--_bc: var(--_bg);
|
|
20459
|
+
--_bg: var(--green-400);
|
|
20460
|
+
--_fc: var(--black-900);
|
|
20461
|
+
--_btn-focus-bg: var(--green-500);
|
|
20462
|
+
--_btn-active-bg: var(--green-600);
|
|
20334
20463
|
}
|
|
20335
|
-
|
|
20336
|
-
body.theme-
|
|
20337
|
-
|
|
20338
|
-
|
|
20339
|
-
|
|
20340
|
-
color: var(--white);
|
|
20341
|
-
border-color: transparent;
|
|
20464
|
+
@media (prefers-color-scheme: dark) {
|
|
20465
|
+
body.theme-system .s-banner__success.s-banner__important {
|
|
20466
|
+
--_bg: var(--green-500);
|
|
20467
|
+
--_fc: var(--white);
|
|
20468
|
+
}
|
|
20342
20469
|
}
|
|
20343
|
-
.
|
|
20344
|
-
.s-banner__success
|
|
20345
|
-
.
|
|
20346
|
-
|
|
20347
|
-
|
|
20470
|
+
body.theme-dark .s-banner__success.s-banner__important,
|
|
20471
|
+
.theme-dark__forced .s-banner__success.s-banner__important,
|
|
20472
|
+
body.theme-system .theme-dark__forced .s-banner__success.s-banner__important {
|
|
20473
|
+
--_bg: var(--green-500);
|
|
20474
|
+
--_fc: var(--white);
|
|
20348
20475
|
}
|
|
20349
|
-
.
|
|
20350
|
-
|
|
20351
|
-
|
|
20476
|
+
body.theme-highcontrast .s-banner__success.s-banner__important {
|
|
20477
|
+
--_bg: var(--green-500);
|
|
20478
|
+
--_fc: var(--white);
|
|
20352
20479
|
}
|
|
20353
|
-
.s-notice__warning,
|
|
20354
20480
|
.s-banner__warning {
|
|
20355
|
-
|
|
20356
|
-
|
|
20481
|
+
--_bc: var(--yellow-300);
|
|
20482
|
+
--_bg: var(--yellow-050);
|
|
20483
|
+
--_btn-focus-bg: var(--yellow-200);
|
|
20484
|
+
--_btn-active-bg: var(--yellow-300);
|
|
20485
|
+
--_code-bg: var(--yellow-200);
|
|
20357
20486
|
}
|
|
20358
|
-
body.theme-highcontrast .s-
|
|
20359
|
-
|
|
20360
|
-
background-color: var(--yellow-200);
|
|
20361
|
-
border-color: var(--yellow-700);
|
|
20487
|
+
body.theme-highcontrast .s-banner__warning:not(.s-banner__important) {
|
|
20488
|
+
--_bg: var(--yellow-200);
|
|
20362
20489
|
}
|
|
20363
|
-
.s-notice__warning.s-notice__important,
|
|
20364
|
-
.s-banner__warning.s-notice__important,
|
|
20365
|
-
.s-notice__warning.s-banner__important,
|
|
20366
20490
|
.s-banner__warning.s-banner__important {
|
|
20367
|
-
|
|
20368
|
-
|
|
20491
|
+
--_bc: var(--_bg);
|
|
20492
|
+
--_bg: var(--yellow-400);
|
|
20493
|
+
--_btn-focus-bg: var(--yellow-500);
|
|
20494
|
+
--_btn-active-bg: var(--yellow-600);
|
|
20495
|
+
--_fc: var(--black-900);
|
|
20496
|
+
}
|
|
20497
|
+
@media (prefers-color-scheme: dark) {
|
|
20498
|
+
body.theme-system .s-banner__warning.s-banner__important {
|
|
20499
|
+
--_bg: var(--yellow-600);
|
|
20500
|
+
--_fc: var(--white);
|
|
20501
|
+
}
|
|
20502
|
+
}
|
|
20503
|
+
body.theme-dark .s-banner__warning.s-banner__important,
|
|
20504
|
+
.theme-dark__forced .s-banner__warning.s-banner__important,
|
|
20505
|
+
body.theme-system .theme-dark__forced .s-banner__warning.s-banner__important {
|
|
20506
|
+
--_bg: var(--yellow-600);
|
|
20507
|
+
--_fc: var(--white);
|
|
20369
20508
|
}
|
|
20370
|
-
body.theme-highcontrast .s-notice__warning.s-notice__important,
|
|
20371
|
-
body.theme-highcontrast .s-banner__warning.s-notice__important,
|
|
20372
|
-
body.theme-highcontrast .s-notice__warning.s-banner__important,
|
|
20373
20509
|
body.theme-highcontrast .s-banner__warning.s-banner__important {
|
|
20374
|
-
|
|
20375
|
-
|
|
20376
|
-
border-color: transparent;
|
|
20510
|
+
--_bg: var(--yellow-700);
|
|
20511
|
+
--_fc: var(--white);
|
|
20377
20512
|
}
|
|
20378
|
-
.s-
|
|
20379
|
-
|
|
20380
|
-
.s-notice__warning .s-notice--btn:hover,
|
|
20381
|
-
.s-banner__warning .s-notice--btn:hover {
|
|
20382
|
-
background-color: var(--yellow-200);
|
|
20513
|
+
.s-banner__body-pt {
|
|
20514
|
+
padding-top: 93px;
|
|
20383
20515
|
}
|
|
20384
|
-
.s-
|
|
20385
|
-
|
|
20386
|
-
background-color: var(--yellow-300);
|
|
20516
|
+
.s-banner.is-pinned {
|
|
20517
|
+
z-index: calc(var(--zi-navigation-fixed) + 1);
|
|
20387
20518
|
}
|
|
20388
|
-
.s-
|
|
20389
|
-
|
|
20390
|
-
|
|
20519
|
+
.s-banner[aria-hidden="true"] {
|
|
20520
|
+
--_x-offset: -50px;
|
|
20521
|
+
visibility: hidden;
|
|
20522
|
+
opacity: 0;
|
|
20391
20523
|
}
|
|
20392
|
-
.s-
|
|
20393
|
-
|
|
20394
|
-
|
|
20395
|
-
|
|
20524
|
+
.s-banner[aria-hidden="false"] {
|
|
20525
|
+
--_x-offset: 49px;
|
|
20526
|
+
visibility: visible;
|
|
20527
|
+
opacity: 1;
|
|
20396
20528
|
}
|
|
20397
|
-
|
|
20398
|
-
|
|
20399
|
-
|
|
20400
|
-
|
|
20529
|
+
.s-banner .s-banner--container {
|
|
20530
|
+
position: relative;
|
|
20531
|
+
width: 100%;
|
|
20532
|
+
max-width: calc(var(--s-step) * 10);
|
|
20533
|
+
margin: 0 auto;
|
|
20401
20534
|
}
|
|
20402
|
-
|
|
20403
|
-
|
|
20404
|
-
|
|
20405
|
-
|
|
20406
|
-
|
|
20535
|
+
.s-notice {
|
|
20536
|
+
background: var(--_bg, var(--black-050));
|
|
20537
|
+
border-color: var(--_bc, var(--bc-medium));
|
|
20538
|
+
border-style: solid;
|
|
20539
|
+
color: var(--_fc, var(--fc-medium));
|
|
20540
|
+
font-size: var(--fs-body1);
|
|
20541
|
+
border-radius: var(--br-sm);
|
|
20542
|
+
border-width: var(--su-static1);
|
|
20543
|
+
padding: var(--su16);
|
|
20407
20544
|
}
|
|
20408
|
-
.s-
|
|
20409
|
-
|
|
20410
|
-
.s-notice__danger.s-banner__important,
|
|
20411
|
-
.s-banner__danger.s-banner__important {
|
|
20412
|
-
background-color: var(--red-400);
|
|
20545
|
+
.s-notice code {
|
|
20546
|
+
background: var(--_code-bg, transparent);
|
|
20413
20547
|
}
|
|
20414
|
-
.s-
|
|
20415
|
-
|
|
20416
|
-
|
|
20417
|
-
.s-banner__danger .s-notice--btn:hover {
|
|
20418
|
-
background-color: var(--red-100);
|
|
20548
|
+
.s-notice .s-notice--btn {
|
|
20549
|
+
color: inherit;
|
|
20550
|
+
padding: var(--su8);
|
|
20419
20551
|
}
|
|
20420
|
-
.s-
|
|
20421
|
-
.s-
|
|
20422
|
-
background
|
|
20552
|
+
.s-notice .s-notice--btn:focus,
|
|
20553
|
+
.s-notice .s-notice--btn:hover {
|
|
20554
|
+
background: var(--_btn-focus-bg, var(--black-100));
|
|
20555
|
+
}
|
|
20556
|
+
.s-notice .s-notice--btn:active {
|
|
20557
|
+
background: var(--_btn-active-bg, var(--black-150));
|
|
20558
|
+
}
|
|
20559
|
+
@media (prefers-color-scheme: dark) {
|
|
20560
|
+
body.theme-system .s-notice:not(.s-notice__important) {
|
|
20561
|
+
--_bc: var(--_bg);
|
|
20562
|
+
}
|
|
20563
|
+
}
|
|
20564
|
+
body.theme-dark .s-notice:not(.s-notice__important),
|
|
20565
|
+
.theme-dark__forced .s-notice:not(.s-notice__important),
|
|
20566
|
+
body.theme-system .theme-dark__forced .s-notice:not(.s-notice__important) {
|
|
20567
|
+
--_bc: var(--_bg);
|
|
20568
|
+
}
|
|
20569
|
+
body.theme-highcontrast .s-notice:not(.s-notice__important) {
|
|
20570
|
+
--_bc: currentColor;
|
|
20571
|
+
}
|
|
20572
|
+
@media (prefers-color-scheme: dark) {
|
|
20573
|
+
body.theme-highcontrast.theme-system .s-notice:not(.s-notice__important) {
|
|
20574
|
+
--_bc: currentColor;
|
|
20575
|
+
}
|
|
20576
|
+
}
|
|
20577
|
+
body.theme-highcontrast.theme-dark .s-notice:not(.s-notice__important) {
|
|
20578
|
+
--_bc: currentColor;
|
|
20423
20579
|
}
|
|
20424
20580
|
.s-notice__important {
|
|
20425
|
-
|
|
20426
|
-
|
|
20427
|
-
|
|
20581
|
+
--_bc: var(--_bg);
|
|
20582
|
+
--_bg: var(--black-700);
|
|
20583
|
+
--_fc: var(--white);
|
|
20584
|
+
--_btn-focus-bg: var(--black-800);
|
|
20585
|
+
--_btn-active-bg: var(--black-900);
|
|
20586
|
+
}
|
|
20587
|
+
body.theme-highcontrast .s-notice__important {
|
|
20588
|
+
--_bc: var(--_bg);
|
|
20589
|
+
}
|
|
20590
|
+
.s-notice__danger {
|
|
20591
|
+
--_bc: var(--red-200);
|
|
20592
|
+
--_bg: var(--red-050);
|
|
20593
|
+
--_btn-focus-bg: var(--red-100);
|
|
20594
|
+
--_btn-active-bg: var(--red-200);
|
|
20595
|
+
}
|
|
20596
|
+
body.theme-highcontrast .s-notice__danger:not(.s-notice__important) {
|
|
20597
|
+
--_bg: var(--red-200);
|
|
20598
|
+
}
|
|
20599
|
+
.s-notice__danger.s-notice__important {
|
|
20600
|
+
--_bc: var(--_bg);
|
|
20601
|
+
--_bg: var(--red-500);
|
|
20602
|
+
--_btn-focus-bg: var(--red-600);
|
|
20603
|
+
--_btn-active-bg: var(--red-700);
|
|
20428
20604
|
}
|
|
20429
20605
|
@media (prefers-color-scheme: dark) {
|
|
20430
|
-
body.theme-system .s-
|
|
20431
|
-
|
|
20432
|
-
|
|
20433
|
-
body.theme-system .s-notice__danger {
|
|
20434
|
-
border-color: transparent;
|
|
20606
|
+
body.theme-system .s-notice__danger.s-notice__important {
|
|
20607
|
+
--_bg: var(--red-400);
|
|
20608
|
+
--_fc: var(--black-900);
|
|
20435
20609
|
}
|
|
20436
20610
|
}
|
|
20437
|
-
body.theme-dark .s-
|
|
20438
|
-
|
|
20439
|
-
body.theme-
|
|
20440
|
-
|
|
20441
|
-
|
|
20442
|
-
.theme-dark__forced .s-notice__success,
|
|
20443
|
-
.theme-dark__forced .s-notice__warning,
|
|
20444
|
-
.theme-dark__forced .s-notice__danger,
|
|
20445
|
-
body.theme-system .theme-dark__forced .s-notice__info,
|
|
20446
|
-
body.theme-system .theme-dark__forced .s-notice__success,
|
|
20447
|
-
body.theme-system .theme-dark__forced .s-notice__warning,
|
|
20448
|
-
body.theme-system .theme-dark__forced .s-notice__danger {
|
|
20449
|
-
border-color: transparent;
|
|
20611
|
+
body.theme-dark .s-notice__danger.s-notice__important,
|
|
20612
|
+
.theme-dark__forced .s-notice__danger.s-notice__important,
|
|
20613
|
+
body.theme-system .theme-dark__forced .s-notice__danger.s-notice__important {
|
|
20614
|
+
--_bg: var(--red-400);
|
|
20615
|
+
--_fc: var(--black-900);
|
|
20450
20616
|
}
|
|
20451
|
-
|
|
20452
|
-
body.theme-highcontrast .s-
|
|
20453
|
-
|
|
20454
|
-
|
|
20455
|
-
|
|
20617
|
+
@media (prefers-color-scheme: dark) {
|
|
20618
|
+
body.theme-highcontrast.theme-system .s-notice__danger.s-notice__important {
|
|
20619
|
+
--_bg: var(--red-500);
|
|
20620
|
+
--_fc: var(--white);
|
|
20621
|
+
}
|
|
20622
|
+
}
|
|
20623
|
+
body.theme-highcontrast.theme-dark .s-notice__danger.s-notice__important {
|
|
20624
|
+
--_bg: var(--red-500);
|
|
20625
|
+
--_fc: var(--white);
|
|
20626
|
+
}
|
|
20627
|
+
.s-notice__info {
|
|
20628
|
+
--_bc: var(--theme-secondary-150);
|
|
20629
|
+
--_bg: var(--theme-secondary-050);
|
|
20630
|
+
--_btn-focus-bg: var(--theme-secondary-100);
|
|
20631
|
+
--_btn-active-bg: var(--theme-secondary-150);
|
|
20632
|
+
--_code-bg: var(--theme-secondary-150);
|
|
20633
|
+
}
|
|
20634
|
+
body.theme-highcontrast .s-notice__info:not(.s-notice__important) {
|
|
20635
|
+
--_bg: var(--theme-secondary-100);
|
|
20636
|
+
}
|
|
20637
|
+
@media (prefers-color-scheme: dark) {
|
|
20638
|
+
body.theme-highcontrast.theme-system .s-notice__info:not(.s-notice__important) {
|
|
20639
|
+
--_bg: var(--theme-secondary-100);
|
|
20640
|
+
}
|
|
20641
|
+
}
|
|
20642
|
+
body.theme-highcontrast.theme-dark .s-notice__info:not(.s-notice__important) {
|
|
20643
|
+
--_bg: var(--theme-secondary-100);
|
|
20644
|
+
}
|
|
20645
|
+
.s-notice__info.s-notice__important {
|
|
20646
|
+
--_bc: var(--_bg);
|
|
20647
|
+
--_bg: var(--theme-secondary-400);
|
|
20648
|
+
--_btn-focus-bg: var(--theme-secondary-500);
|
|
20649
|
+
--_btn-active-bg: var(--theme-secondary-600);
|
|
20650
|
+
}
|
|
20651
|
+
@media (prefers-color-scheme: dark) {
|
|
20652
|
+
body.theme-system .s-notice__info.s-notice__important {
|
|
20653
|
+
--_bg: var(--theme-secondary-300);
|
|
20654
|
+
--_fc: var(--black-900);
|
|
20655
|
+
}
|
|
20656
|
+
}
|
|
20657
|
+
body.theme-dark .s-notice__info.s-notice__important,
|
|
20658
|
+
.theme-dark__forced .s-notice__info.s-notice__important,
|
|
20659
|
+
body.theme-system .theme-dark__forced .s-notice__info.s-notice__important {
|
|
20660
|
+
--_bg: var(--theme-secondary-300);
|
|
20661
|
+
--_fc: var(--black-900);
|
|
20662
|
+
}
|
|
20663
|
+
@media (prefers-color-scheme: dark) {
|
|
20664
|
+
body.theme-highcontrast.theme-system .s-notice__info.s-notice__important {
|
|
20665
|
+
--_bg: var(--theme-secondary-400);
|
|
20666
|
+
--_fc: var(--white);
|
|
20667
|
+
}
|
|
20668
|
+
}
|
|
20669
|
+
body.theme-highcontrast.theme-dark .s-notice__info.s-notice__important {
|
|
20670
|
+
--_bg: var(--theme-secondary-400);
|
|
20671
|
+
--_fc: var(--white);
|
|
20672
|
+
}
|
|
20673
|
+
.s-notice__success {
|
|
20674
|
+
--_bc: var(--green-200);
|
|
20675
|
+
--_bg: var(--green-050);
|
|
20676
|
+
--_btn-focus-bg: var(--green-100);
|
|
20677
|
+
--_btn-active-bg: var(--green-200);
|
|
20678
|
+
}
|
|
20679
|
+
body.theme-highcontrast .s-notice__success:not(.s-notice__important) {
|
|
20680
|
+
--_bg: var(--green-200);
|
|
20681
|
+
}
|
|
20682
|
+
.s-notice__success.s-notice__important {
|
|
20683
|
+
--_bc: var(--_bg);
|
|
20684
|
+
--_bg: var(--green-400);
|
|
20685
|
+
--_fc: var(--black-900);
|
|
20686
|
+
--_btn-focus-bg: var(--green-500);
|
|
20687
|
+
--_btn-active-bg: var(--green-600);
|
|
20688
|
+
}
|
|
20689
|
+
@media (prefers-color-scheme: dark) {
|
|
20690
|
+
body.theme-system .s-notice__success.s-notice__important {
|
|
20691
|
+
--_bg: var(--green-500);
|
|
20692
|
+
--_fc: var(--white);
|
|
20693
|
+
}
|
|
20694
|
+
}
|
|
20695
|
+
body.theme-dark .s-notice__success.s-notice__important,
|
|
20696
|
+
.theme-dark__forced .s-notice__success.s-notice__important,
|
|
20697
|
+
body.theme-system .theme-dark__forced .s-notice__success.s-notice__important {
|
|
20698
|
+
--_bg: var(--green-500);
|
|
20699
|
+
--_fc: var(--white);
|
|
20700
|
+
}
|
|
20701
|
+
body.theme-highcontrast .s-notice__success.s-notice__important {
|
|
20702
|
+
--_bg: var(--green-500);
|
|
20703
|
+
--_fc: var(--white);
|
|
20704
|
+
}
|
|
20705
|
+
.s-notice__warning {
|
|
20706
|
+
--_bc: var(--yellow-300);
|
|
20707
|
+
--_bg: var(--yellow-050);
|
|
20708
|
+
--_btn-focus-bg: var(--yellow-200);
|
|
20709
|
+
--_btn-active-bg: var(--yellow-300);
|
|
20710
|
+
--_code-bg: var(--yellow-200);
|
|
20711
|
+
}
|
|
20712
|
+
body.theme-highcontrast .s-notice__warning:not(.s-notice__important) {
|
|
20713
|
+
--_bg: var(--yellow-200);
|
|
20714
|
+
}
|
|
20715
|
+
.s-notice__warning.s-notice__important {
|
|
20716
|
+
--_bc: var(--_bg);
|
|
20717
|
+
--_bg: var(--yellow-400);
|
|
20718
|
+
--_btn-focus-bg: var(--yellow-500);
|
|
20719
|
+
--_btn-active-bg: var(--yellow-600);
|
|
20720
|
+
--_fc: var(--black-900);
|
|
20721
|
+
}
|
|
20722
|
+
@media (prefers-color-scheme: dark) {
|
|
20723
|
+
body.theme-system .s-notice__warning.s-notice__important {
|
|
20724
|
+
--_bg: var(--yellow-600);
|
|
20725
|
+
--_fc: var(--white);
|
|
20726
|
+
}
|
|
20727
|
+
}
|
|
20728
|
+
body.theme-dark .s-notice__warning.s-notice__important,
|
|
20729
|
+
.theme-dark__forced .s-notice__warning.s-notice__important,
|
|
20730
|
+
body.theme-system .theme-dark__forced .s-notice__warning.s-notice__important {
|
|
20731
|
+
--_bg: var(--yellow-600);
|
|
20732
|
+
--_fc: var(--white);
|
|
20733
|
+
}
|
|
20734
|
+
body.theme-highcontrast .s-notice__warning.s-notice__important {
|
|
20735
|
+
--_bg: var(--yellow-700);
|
|
20736
|
+
--_fc: var(--white);
|
|
20456
20737
|
}
|
|
20457
20738
|
.s-toast {
|
|
20458
20739
|
visibility: hidden;
|
|
@@ -20479,6 +20760,14 @@ body.theme-highcontrast .s-notice__danger {
|
|
|
20479
20760
|
transform: none;
|
|
20480
20761
|
}
|
|
20481
20762
|
}
|
|
20763
|
+
.s-toast .s-notice {
|
|
20764
|
+
max-width: 44rem;
|
|
20765
|
+
width: 100%;
|
|
20766
|
+
padding-top: var(--su8);
|
|
20767
|
+
padding-bottom: var(--su8);
|
|
20768
|
+
box-shadow: var(--bs-sm);
|
|
20769
|
+
pointer-events: all;
|
|
20770
|
+
}
|
|
20482
20771
|
.s-tag {
|
|
20483
20772
|
display: inline-flex;
|
|
20484
20773
|
align-items: center;
|