@patternfly/react-core 4.251.4 → 4.252.0

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.
@@ -297,6 +297,238 @@
297
297
  --pf-c-action-list--child--spacer: var(--pf-c-action-list--m-icon--spacer);
298
298
  }
299
299
 
300
+ .pf-c-alert {
301
+ --pf-global--Color--100: var(--pf-global--Color--dark-100);
302
+ --pf-global--Color--200: var(--pf-global--Color--dark-200);
303
+ --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
304
+ --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
305
+ --pf-global--link--Color: var(--pf-global--link--Color--dark);
306
+ --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
307
+ --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
308
+ }
309
+
310
+ .pf-c-alert {
311
+ --pf-c-alert--BoxShadow: var(--pf-global--BoxShadow--lg);
312
+ --pf-c-alert--BackgroundColor: var(--pf-global--BackgroundColor--100);
313
+ --pf-c-alert--GridTemplateColumns: max-content 1fr max-content;
314
+ --pf-c-alert--GridTemplateAreas:
315
+ "icon title action"
316
+ ". description description"
317
+ ". actiongroup actiongroup";
318
+ --pf-c-alert--BorderTopWidth: var(--pf-global--BorderWidth--md);
319
+ --pf-c-alert--BorderTopColor: var(--pf-global--default-color--200);
320
+ --pf-c-alert--PaddingTop: var(--pf-global--spacer--md);
321
+ --pf-c-alert--PaddingRight: var(--pf-global--spacer--md);
322
+ --pf-c-alert--PaddingBottom: var(--pf-global--spacer--md);
323
+ --pf-c-alert--PaddingLeft: var(--pf-global--spacer--md);
324
+ --pf-c-alert__FontSize: var(--pf-global--FontSize--sm);
325
+ --pf-c-alert__toggle--MarginTop: calc(-1 * var(--pf-global--spacer--form-element) - 0.0625rem);
326
+ --pf-c-alert__toggle--MarginBottom: calc(-1 * var(--pf-global--spacer--form-element));
327
+ --pf-c-alert__toggle--MarginLeft: calc(-1 * var(--pf-global--spacer--md));
328
+ --pf-c-alert__toggle-icon--Rotate: 0;
329
+ --pf-c-alert__toggle-icon--Transition: var(--pf-global--Transition);
330
+ --pf-c-alert__icon--Color: var(--pf-global--default-color--200);
331
+ --pf-c-alert__icon--MarginTop: 0.0625rem;
332
+ --pf-c-alert__icon--MarginRight: var(--pf-global--spacer--sm);
333
+ --pf-c-alert__icon--FontSize: var(--pf-global--icon--FontSize--md);
334
+ --pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--bold);
335
+ --pf-c-alert__title--Color: var(--pf-global--default-color--300);
336
+ --pf-c-alert__title--max-lines: 1;
337
+ --pf-c-alert__action--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
338
+ --pf-c-alert__action--MarginBottom: calc(var(--pf-global--spacer--form-element) * -1);
339
+ --pf-c-alert__action--TranslateY: 0.125rem;
340
+ --pf-c-alert__action--MarginRight: calc(var(--pf-global--spacer--sm) * -1);
341
+ --pf-c-alert__description--PaddingTop: var(--pf-global--spacer--xs);
342
+ --pf-c-alert__action-group--PaddingTop-base: var(--pf-global--spacer--xs);
343
+ --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
344
+ --pf-c-alert__description--action-group--PaddingTop-base: var(--pf-global--spacer--md);
345
+ --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
346
+ --pf-c-alert__action-group__c-button--not-last-child--MarginRight: var(--pf-global--spacer--lg);
347
+ --pf-c-alert--m-success--BorderTopColor: var(--pf-global--success-color--100);
348
+ --pf-c-alert--m-success__icon--Color: var(--pf-global--success-color--100);
349
+ --pf-c-alert--m-success__title--Color: var(--pf-global--success-color--200);
350
+ --pf-c-alert--m-danger--BorderTopColor: var(--pf-global--danger-color--100);
351
+ --pf-c-alert--m-danger__icon--Color: var(--pf-global--danger-color--100);
352
+ --pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--200);
353
+ --pf-c-alert--m-warning--BorderTopColor: var(--pf-global--warning-color--100);
354
+ --pf-c-alert--m-warning__icon--Color: var(--pf-global--warning-color--100);
355
+ --pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--200);
356
+ --pf-c-alert--m-info--BorderTopColor: var(--pf-global--info-color--100);
357
+ --pf-c-alert--m-info__icon--Color: var(--pf-global--info-color--100);
358
+ --pf-c-alert--m-info__title--Color: var(--pf-global--info-color--200);
359
+ --pf-c-alert--m-inline--BoxShadow: none;
360
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--cyan-50);
361
+ --pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--green-50);
362
+ --pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--red-50);
363
+ --pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--gold-50);
364
+ --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--blue-50);
365
+ --pf-c-alert--m-inline--m-plain--BorderTopWidth: 0;
366
+ --pf-c-alert--m-inline--m-plain--BackgroundColor: transparent;
367
+ --pf-c-alert--m-inline--m-plain--PaddingTop: 0;
368
+ --pf-c-alert--m-inline--m-plain--PaddingRight: 0;
369
+ --pf-c-alert--m-inline--m-plain--PaddingBottom: 0;
370
+ --pf-c-alert--m-inline--m-plain--PaddingLeft: 0;
371
+ --pf-c-alert--m-expandable--GridTemplateColumns: auto max-content 1fr max-content;
372
+ --pf-c-alert--m-expandable--GridTemplateAreas:
373
+ "toggle icon title action"
374
+ ". . description description"
375
+ ". . actiongroup actiongroup";
376
+ --pf-c-alert--m-expandable__description--action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
377
+ --pf-c-alert--m-expanded__toggle-icon--Rotate: 90deg;
378
+ --pf-c-alert--m-expanded__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
379
+ color: var(--pf-global--Color--100);
380
+ position: relative;
381
+ display: grid;
382
+ padding: var(--pf-c-alert--PaddingTop) var(--pf-c-alert--PaddingRight) var(--pf-c-alert--PaddingBottom) var(--pf-c-alert--PaddingLeft);
383
+ font-size: var(--pf-c-alert__FontSize);
384
+ background-color: var(--pf-c-alert--BackgroundColor);
385
+ border-top: var(--pf-c-alert--BorderTopWidth) solid var(--pf-c-alert--BorderTopColor);
386
+ box-shadow: var(--pf-c-alert--BoxShadow);
387
+ grid-template-columns: var(--pf-c-alert--GridTemplateColumns);
388
+ grid-template-areas: var(--pf-c-alert--GridTemplateAreas);
389
+ }
390
+
391
+ .pf-c-alert.pf-m-success {
392
+ --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-success--BorderTopColor);
393
+ --pf-c-alert__icon--Color: var(--pf-c-alert--m-success__icon--Color);
394
+ --pf-c-alert__title--Color: var(--pf-c-alert--m-success__title--Color);
395
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-success--BackgroundColor);
396
+ }
397
+
398
+ .pf-c-alert.pf-m-danger {
399
+ --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-danger--BorderTopColor);
400
+ --pf-c-alert__icon--Color: var(--pf-c-alert--m-danger__icon--Color);
401
+ --pf-c-alert__title--Color: var(--pf-c-alert--m-danger__title--Color);
402
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-danger--BackgroundColor);
403
+ }
404
+
405
+ .pf-c-alert.pf-m-warning {
406
+ --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-warning--BorderTopColor);
407
+ --pf-c-alert__icon--Color: var(--pf-c-alert--m-warning__icon--Color);
408
+ --pf-c-alert__title--Color: var(--pf-c-alert--m-warning__title--Color);
409
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-warning--BackgroundColor);
410
+ }
411
+
412
+ .pf-c-alert.pf-m-info {
413
+ --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-info--BorderTopColor);
414
+ --pf-c-alert__icon--Color: var(--pf-c-alert--m-info__icon--Color);
415
+ --pf-c-alert__title--Color: var(--pf-c-alert--m-info__title--Color);
416
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-info--BackgroundColor);
417
+ }
418
+
419
+ .pf-c-alert.pf-m-inline {
420
+ --pf-c-alert--BoxShadow: var(--pf-c-alert--m-inline--BoxShadow);
421
+ --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--BackgroundColor);
422
+ }
423
+
424
+ .pf-c-alert.pf-m-plain {
425
+ --pf-c-alert--BorderTopWidth: var(--pf-c-alert--m-inline--m-plain--BorderTopWidth);
426
+ --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--m-plain--BackgroundColor);
427
+ --pf-c-alert--PaddingTop: var(--pf-c-alert--m-inline--m-plain--PaddingTop);
428
+ --pf-c-alert--PaddingRight: var(--pf-c-alert--m-inline--m-plain--PaddingRight);
429
+ --pf-c-alert--PaddingBottom: var(--pf-c-alert--m-inline--m-plain--PaddingBottom);
430
+ --pf-c-alert--PaddingLeft: var(--pf-c-alert--m-inline--m-plain--PaddingLeft);
431
+ }
432
+
433
+ .pf-c-alert.pf-m-expandable {
434
+ --pf-c-alert--GridTemplateColumns: var(--pf-c-alert--m-expandable--GridTemplateColumns);
435
+ --pf-c-alert--GridTemplateAreas: var(--pf-c-alert--m-expandable--GridTemplateAreas);
436
+ --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expandable__description--action-group--PaddingTop);
437
+ }
438
+
439
+ .pf-c-alert.pf-m-expanded {
440
+ --pf-c-alert__toggle-icon--Rotate: var(--pf-c-alert--m-expanded__toggle-icon--Rotate);
441
+ --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expanded__description--action-group--PaddingTop);
442
+ }
443
+
444
+ .pf-c-alert__toggle {
445
+ margin-top: var(--pf-c-alert__toggle--MarginTop);
446
+ margin-bottom: var(--pf-c-alert__toggle--MarginBottom);
447
+ margin-left: var(--pf-c-alert__toggle--MarginLeft);
448
+ }
449
+
450
+ .pf-c-alert__toggle-icon {
451
+ display: inline-block;
452
+ transition: var(--pf-c-alert__toggle-icon--Transition);
453
+ transform: rotate(var(--pf-c-alert__toggle-icon--Rotate));
454
+ }
455
+
456
+ .pf-c-alert__icon {
457
+ grid-area: icon;
458
+ display: flex;
459
+ margin-top: var(--pf-c-alert__icon--MarginTop);
460
+ margin-right: var(--pf-c-alert__icon--MarginRight);
461
+ font-size: var(--pf-c-alert__icon--FontSize);
462
+ color: var(--pf-c-alert__icon--Color);
463
+ }
464
+
465
+ .pf-c-alert__title {
466
+ grid-area: title;
467
+ font-weight: var(--pf-c-alert__title--FontWeight);
468
+ color: var(--pf-c-alert__title--Color);
469
+ word-break: break-word;
470
+ }
471
+
472
+ .pf-c-alert__title.pf-m-truncate {
473
+ display: -webkit-box;
474
+ -webkit-box-orient: vertical;
475
+ -webkit-line-clamp: var(--pf-c-alert__title--max-lines);
476
+ overflow: hidden;
477
+ }
478
+
479
+ .pf-c-alert__description {
480
+ grid-area: description;
481
+ padding-top: var(--pf-c-alert__description--PaddingTop);
482
+ word-break: break-word;
483
+ }
484
+
485
+ .pf-c-alert__description + .pf-c-alert__action-group {
486
+ --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop);
487
+ }
488
+
489
+ .pf-c-alert__action {
490
+ grid-area: action;
491
+ margin-top: var(--pf-c-alert__action--MarginTop);
492
+ margin-right: var(--pf-c-alert__action--MarginRight);
493
+ margin-bottom: var(--pf-c-alert__action--MarginBottom);
494
+ transform: translateY(var(--pf-c-alert__action--TranslateY));
495
+ }
496
+
497
+ .pf-c-alert__action > .pf-c-button {
498
+ --pf-c-button--LineHeight: 1;
499
+ }
500
+
501
+ .pf-c-alert__action-group {
502
+ grid-area: actiongroup;
503
+ padding-top: var(--pf-c-alert__action-group--PaddingTop);
504
+ }
505
+
506
+ .pf-c-alert__action-group > .pf-c-button {
507
+ --pf-c-button--m-link--m-inline--hover--TextDecoration: none;
508
+ }
509
+
510
+ .pf-c-alert__action-group > .pf-c-button:not(:last-child) {
511
+ margin-right: var(--pf-c-alert__action-group__c-button--not-last-child--MarginRight);
512
+ }
513
+
514
+ .pf-m-overpass-font .pf-c-alert__title {
515
+ --pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--normal);
516
+ }
517
+
518
+ :where(.pf-theme-dark) .pf-c-alert {
519
+ --pf-c-alert--BackgroundColor: var(--pf-global--palette--black-600);
520
+ --pf-c-alert__title--Color: var(--pf-global--default-color--200);
521
+ --pf-c-alert--m-success__title--Color: var(--pf-global--success-color--100);
522
+ --pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--100);
523
+ --pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--100);
524
+ --pf-c-alert--m-info__title--Color: var(--pf-global--info-color--100);
525
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--black-600);
526
+ --pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--black-600);
527
+ --pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--black-600);
528
+ --pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--black-600);
529
+ --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--black-600);
530
+ }
531
+
300
532
  .pf-c-app-launcher {
301
533
  --pf-c-app-launcher__menu--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
302
534
  --pf-c-app-launcher__menu--BoxShadow: var(--pf-global--BoxShadow--md);
@@ -1318,238 +1550,6 @@ textarea.pf-c-form-control {
1318
1550
  --pf-c-avatar--Height: var(--pf-c-avatar--m-xl--Height-on-2xl, var(--pf-c-avatar--m-xl--Height-on-xl, var(--pf-c-avatar--m-xl--Height-on-lg, var(--pf-c-avatar--m-xl--Height-on-md, var(--pf-c-avatar--m-xl--Height-on-sm, var(--pf-c-avatar--m-xl--Height))))));
1319
1551
  }
1320
1552
  }
1321
- .pf-c-alert {
1322
- --pf-global--Color--100: var(--pf-global--Color--dark-100);
1323
- --pf-global--Color--200: var(--pf-global--Color--dark-200);
1324
- --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
1325
- --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
1326
- --pf-global--link--Color: var(--pf-global--link--Color--dark);
1327
- --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
1328
- --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
1329
- }
1330
-
1331
- .pf-c-alert {
1332
- --pf-c-alert--BoxShadow: var(--pf-global--BoxShadow--lg);
1333
- --pf-c-alert--BackgroundColor: var(--pf-global--BackgroundColor--100);
1334
- --pf-c-alert--GridTemplateColumns: max-content 1fr max-content;
1335
- --pf-c-alert--GridTemplateAreas:
1336
- "icon title action"
1337
- ". description description"
1338
- ". actiongroup actiongroup";
1339
- --pf-c-alert--BorderTopWidth: var(--pf-global--BorderWidth--md);
1340
- --pf-c-alert--BorderTopColor: var(--pf-global--default-color--200);
1341
- --pf-c-alert--PaddingTop: var(--pf-global--spacer--md);
1342
- --pf-c-alert--PaddingRight: var(--pf-global--spacer--md);
1343
- --pf-c-alert--PaddingBottom: var(--pf-global--spacer--md);
1344
- --pf-c-alert--PaddingLeft: var(--pf-global--spacer--md);
1345
- --pf-c-alert__FontSize: var(--pf-global--FontSize--sm);
1346
- --pf-c-alert__toggle--MarginTop: calc(-1 * var(--pf-global--spacer--form-element) - 0.0625rem);
1347
- --pf-c-alert__toggle--MarginBottom: calc(-1 * var(--pf-global--spacer--form-element));
1348
- --pf-c-alert__toggle--MarginLeft: calc(-1 * var(--pf-global--spacer--md));
1349
- --pf-c-alert__toggle-icon--Rotate: 0;
1350
- --pf-c-alert__toggle-icon--Transition: var(--pf-global--Transition);
1351
- --pf-c-alert__icon--Color: var(--pf-global--default-color--200);
1352
- --pf-c-alert__icon--MarginTop: 0.0625rem;
1353
- --pf-c-alert__icon--MarginRight: var(--pf-global--spacer--sm);
1354
- --pf-c-alert__icon--FontSize: var(--pf-global--icon--FontSize--md);
1355
- --pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--bold);
1356
- --pf-c-alert__title--Color: var(--pf-global--default-color--300);
1357
- --pf-c-alert__title--max-lines: 1;
1358
- --pf-c-alert__action--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
1359
- --pf-c-alert__action--MarginBottom: calc(var(--pf-global--spacer--form-element) * -1);
1360
- --pf-c-alert__action--TranslateY: 0.125rem;
1361
- --pf-c-alert__action--MarginRight: calc(var(--pf-global--spacer--sm) * -1);
1362
- --pf-c-alert__description--PaddingTop: var(--pf-global--spacer--xs);
1363
- --pf-c-alert__action-group--PaddingTop-base: var(--pf-global--spacer--xs);
1364
- --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
1365
- --pf-c-alert__description--action-group--PaddingTop-base: var(--pf-global--spacer--md);
1366
- --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
1367
- --pf-c-alert__action-group__c-button--not-last-child--MarginRight: var(--pf-global--spacer--lg);
1368
- --pf-c-alert--m-success--BorderTopColor: var(--pf-global--success-color--100);
1369
- --pf-c-alert--m-success__icon--Color: var(--pf-global--success-color--100);
1370
- --pf-c-alert--m-success__title--Color: var(--pf-global--success-color--200);
1371
- --pf-c-alert--m-danger--BorderTopColor: var(--pf-global--danger-color--100);
1372
- --pf-c-alert--m-danger__icon--Color: var(--pf-global--danger-color--100);
1373
- --pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--200);
1374
- --pf-c-alert--m-warning--BorderTopColor: var(--pf-global--warning-color--100);
1375
- --pf-c-alert--m-warning__icon--Color: var(--pf-global--warning-color--100);
1376
- --pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--200);
1377
- --pf-c-alert--m-info--BorderTopColor: var(--pf-global--info-color--100);
1378
- --pf-c-alert--m-info__icon--Color: var(--pf-global--info-color--100);
1379
- --pf-c-alert--m-info__title--Color: var(--pf-global--info-color--200);
1380
- --pf-c-alert--m-inline--BoxShadow: none;
1381
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--cyan-50);
1382
- --pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--green-50);
1383
- --pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--red-50);
1384
- --pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--gold-50);
1385
- --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--blue-50);
1386
- --pf-c-alert--m-inline--m-plain--BorderTopWidth: 0;
1387
- --pf-c-alert--m-inline--m-plain--BackgroundColor: transparent;
1388
- --pf-c-alert--m-inline--m-plain--PaddingTop: 0;
1389
- --pf-c-alert--m-inline--m-plain--PaddingRight: 0;
1390
- --pf-c-alert--m-inline--m-plain--PaddingBottom: 0;
1391
- --pf-c-alert--m-inline--m-plain--PaddingLeft: 0;
1392
- --pf-c-alert--m-expandable--GridTemplateColumns: auto max-content 1fr max-content;
1393
- --pf-c-alert--m-expandable--GridTemplateAreas:
1394
- "toggle icon title action"
1395
- ". . description description"
1396
- ". . actiongroup actiongroup";
1397
- --pf-c-alert--m-expandable__description--action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
1398
- --pf-c-alert--m-expanded__toggle-icon--Rotate: 90deg;
1399
- --pf-c-alert--m-expanded__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
1400
- color: var(--pf-global--Color--100);
1401
- position: relative;
1402
- display: grid;
1403
- padding: var(--pf-c-alert--PaddingTop) var(--pf-c-alert--PaddingRight) var(--pf-c-alert--PaddingBottom) var(--pf-c-alert--PaddingLeft);
1404
- font-size: var(--pf-c-alert__FontSize);
1405
- background-color: var(--pf-c-alert--BackgroundColor);
1406
- border-top: var(--pf-c-alert--BorderTopWidth) solid var(--pf-c-alert--BorderTopColor);
1407
- box-shadow: var(--pf-c-alert--BoxShadow);
1408
- grid-template-columns: var(--pf-c-alert--GridTemplateColumns);
1409
- grid-template-areas: var(--pf-c-alert--GridTemplateAreas);
1410
- }
1411
-
1412
- .pf-c-alert.pf-m-success {
1413
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-success--BorderTopColor);
1414
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-success__icon--Color);
1415
- --pf-c-alert__title--Color: var(--pf-c-alert--m-success__title--Color);
1416
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-success--BackgroundColor);
1417
- }
1418
-
1419
- .pf-c-alert.pf-m-danger {
1420
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-danger--BorderTopColor);
1421
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-danger__icon--Color);
1422
- --pf-c-alert__title--Color: var(--pf-c-alert--m-danger__title--Color);
1423
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-danger--BackgroundColor);
1424
- }
1425
-
1426
- .pf-c-alert.pf-m-warning {
1427
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-warning--BorderTopColor);
1428
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-warning__icon--Color);
1429
- --pf-c-alert__title--Color: var(--pf-c-alert--m-warning__title--Color);
1430
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-warning--BackgroundColor);
1431
- }
1432
-
1433
- .pf-c-alert.pf-m-info {
1434
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-info--BorderTopColor);
1435
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-info__icon--Color);
1436
- --pf-c-alert__title--Color: var(--pf-c-alert--m-info__title--Color);
1437
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-info--BackgroundColor);
1438
- }
1439
-
1440
- .pf-c-alert.pf-m-inline {
1441
- --pf-c-alert--BoxShadow: var(--pf-c-alert--m-inline--BoxShadow);
1442
- --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--BackgroundColor);
1443
- }
1444
-
1445
- .pf-c-alert.pf-m-plain {
1446
- --pf-c-alert--BorderTopWidth: var(--pf-c-alert--m-inline--m-plain--BorderTopWidth);
1447
- --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--m-plain--BackgroundColor);
1448
- --pf-c-alert--PaddingTop: var(--pf-c-alert--m-inline--m-plain--PaddingTop);
1449
- --pf-c-alert--PaddingRight: var(--pf-c-alert--m-inline--m-plain--PaddingRight);
1450
- --pf-c-alert--PaddingBottom: var(--pf-c-alert--m-inline--m-plain--PaddingBottom);
1451
- --pf-c-alert--PaddingLeft: var(--pf-c-alert--m-inline--m-plain--PaddingLeft);
1452
- }
1453
-
1454
- .pf-c-alert.pf-m-expandable {
1455
- --pf-c-alert--GridTemplateColumns: var(--pf-c-alert--m-expandable--GridTemplateColumns);
1456
- --pf-c-alert--GridTemplateAreas: var(--pf-c-alert--m-expandable--GridTemplateAreas);
1457
- --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expandable__description--action-group--PaddingTop);
1458
- }
1459
-
1460
- .pf-c-alert.pf-m-expanded {
1461
- --pf-c-alert__toggle-icon--Rotate: var(--pf-c-alert--m-expanded__toggle-icon--Rotate);
1462
- --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expanded__description--action-group--PaddingTop);
1463
- }
1464
-
1465
- .pf-c-alert__toggle {
1466
- margin-top: var(--pf-c-alert__toggle--MarginTop);
1467
- margin-bottom: var(--pf-c-alert__toggle--MarginBottom);
1468
- margin-left: var(--pf-c-alert__toggle--MarginLeft);
1469
- }
1470
-
1471
- .pf-c-alert__toggle-icon {
1472
- display: inline-block;
1473
- transition: var(--pf-c-alert__toggle-icon--Transition);
1474
- transform: rotate(var(--pf-c-alert__toggle-icon--Rotate));
1475
- }
1476
-
1477
- .pf-c-alert__icon {
1478
- grid-area: icon;
1479
- display: flex;
1480
- margin-top: var(--pf-c-alert__icon--MarginTop);
1481
- margin-right: var(--pf-c-alert__icon--MarginRight);
1482
- font-size: var(--pf-c-alert__icon--FontSize);
1483
- color: var(--pf-c-alert__icon--Color);
1484
- }
1485
-
1486
- .pf-c-alert__title {
1487
- grid-area: title;
1488
- font-weight: var(--pf-c-alert__title--FontWeight);
1489
- color: var(--pf-c-alert__title--Color);
1490
- word-break: break-word;
1491
- }
1492
-
1493
- .pf-c-alert__title.pf-m-truncate {
1494
- display: -webkit-box;
1495
- -webkit-box-orient: vertical;
1496
- -webkit-line-clamp: var(--pf-c-alert__title--max-lines);
1497
- overflow: hidden;
1498
- }
1499
-
1500
- .pf-c-alert__description {
1501
- grid-area: description;
1502
- padding-top: var(--pf-c-alert__description--PaddingTop);
1503
- word-break: break-word;
1504
- }
1505
-
1506
- .pf-c-alert__description + .pf-c-alert__action-group {
1507
- --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop);
1508
- }
1509
-
1510
- .pf-c-alert__action {
1511
- grid-area: action;
1512
- margin-top: var(--pf-c-alert__action--MarginTop);
1513
- margin-right: var(--pf-c-alert__action--MarginRight);
1514
- margin-bottom: var(--pf-c-alert__action--MarginBottom);
1515
- transform: translateY(var(--pf-c-alert__action--TranslateY));
1516
- }
1517
-
1518
- .pf-c-alert__action > .pf-c-button {
1519
- --pf-c-button--LineHeight: 1;
1520
- }
1521
-
1522
- .pf-c-alert__action-group {
1523
- grid-area: actiongroup;
1524
- padding-top: var(--pf-c-alert__action-group--PaddingTop);
1525
- }
1526
-
1527
- .pf-c-alert__action-group > .pf-c-button {
1528
- --pf-c-button--m-link--m-inline--hover--TextDecoration: none;
1529
- }
1530
-
1531
- .pf-c-alert__action-group > .pf-c-button:not(:last-child) {
1532
- margin-right: var(--pf-c-alert__action-group__c-button--not-last-child--MarginRight);
1533
- }
1534
-
1535
- .pf-m-overpass-font .pf-c-alert__title {
1536
- --pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--normal);
1537
- }
1538
-
1539
- :where(.pf-theme-dark) .pf-c-alert {
1540
- --pf-c-alert--BackgroundColor: var(--pf-global--palette--black-600);
1541
- --pf-c-alert__title--Color: var(--pf-global--default-color--200);
1542
- --pf-c-alert--m-success__title--Color: var(--pf-global--success-color--100);
1543
- --pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--100);
1544
- --pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--100);
1545
- --pf-c-alert--m-info__title--Color: var(--pf-global--info-color--100);
1546
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--black-600);
1547
- --pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--black-600);
1548
- --pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--black-600);
1549
- --pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--black-600);
1550
- --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--black-600);
1551
- }
1552
-
1553
1553
  .pf-c-back-to-top {
1554
1554
  --pf-c-back-to-top--Right: var(--pf-global--spacer--2xl);
1555
1555
  --pf-c-back-to-top--Bottom: var(--pf-global--spacer--lg);
@@ -1625,52 +1625,13 @@ textarea.pf-c-form-control {
1625
1625
  --pf-c-background-image--BackgroundImage: var(--pf-c-background-image--BackgroundImage--sm-2x);
1626
1626
  }
1627
1627
  }
1628
- @media (min-width: 992px) {
1629
- .pf-c-background-image::before {
1630
- --pf-c-background-image--BackgroundImage: var(--pf-c-background-image--BackgroundImage--lg);
1631
- }
1632
- }
1633
- .pf-c-background-image__filter {
1634
- display: block;
1635
- }
1636
-
1637
- .pf-c-badge {
1638
- --pf-c-badge--BorderRadius: var(--pf-global--BorderRadius--lg);
1639
- --pf-c-badge--FontSize: var(--pf-global--FontSize--xs);
1640
- --pf-c-badge--FontWeight: var(--pf-global--FontWeight--bold);
1641
- --pf-c-badge--PaddingRight: var(--pf-global--spacer--sm);
1642
- --pf-c-badge--PaddingLeft: var(--pf-global--spacer--sm);
1643
- --pf-c-badge--Color: var(--pf-global--Color--dark-100);
1644
- --pf-c-badge--MinWidth: var(--pf-global--spacer--xl);
1645
- --pf-c-badge--m-read--BackgroundColor: var(--pf-global--BackgroundColor--200);
1646
- --pf-c-badge--m-read--Color: var(--pf-global--Color--dark-100);
1647
- --pf-c-badge--m-unread--BackgroundColor: var(--pf-global--primary-color--100);
1648
- --pf-c-badge--m-unread--Color: var(--pf-global--Color--light-100);
1649
- display: inline-block;
1650
- min-width: var(--pf-c-badge--MinWidth);
1651
- padding-right: var(--pf-c-badge--PaddingRight);
1652
- padding-left: var(--pf-c-badge--PaddingLeft);
1653
- font-size: var(--pf-c-badge--FontSize);
1654
- font-weight: var(--pf-c-badge--FontWeight);
1655
- color: var(--pf-c-badge--Color);
1656
- text-align: center;
1657
- background-color: var(--pf-c-badge--BackgroundColor);
1658
- border-radius: var(--pf-c-badge--BorderRadius);
1659
- }
1660
-
1661
- .pf-c-badge.pf-m-read {
1662
- --pf-c-badge--Color: var(--pf-c-badge--m-read--Color);
1663
- --pf-c-badge--BackgroundColor: var(--pf-c-badge--m-read--BackgroundColor);
1664
- }
1665
-
1666
- .pf-c-badge.pf-m-unread {
1667
- --pf-c-badge--Color: var(--pf-c-badge--m-unread--Color);
1668
- --pf-c-badge--BackgroundColor: var(--pf-c-badge--m-unread--BackgroundColor);
1669
- }
1670
-
1671
- :where(.pf-theme-dark) .pf-c-badge {
1672
- --pf-c-badge--m-read--BackgroundColor: var(--pf-global--palette--black-500);
1673
- --pf-c-badge--m-unread--BackgroundColor: var(--pf-global--primary-color--300);
1628
+ @media (min-width: 992px) {
1629
+ .pf-c-background-image::before {
1630
+ --pf-c-background-image--BackgroundImage: var(--pf-c-background-image--BackgroundImage--lg);
1631
+ }
1632
+ }
1633
+ .pf-c-background-image__filter {
1634
+ display: block;
1674
1635
  }
1675
1636
 
1676
1637
  .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-gold, .pf-c-banner.pf-m-info, .pf-c-banner.pf-m-blue {
@@ -1851,6 +1812,45 @@ textarea.pf-c-form-control {
1851
1812
  color: var(--pf-global--palette--black-900);
1852
1813
  }
1853
1814
 
1815
+ .pf-c-badge {
1816
+ --pf-c-badge--BorderRadius: var(--pf-global--BorderRadius--lg);
1817
+ --pf-c-badge--FontSize: var(--pf-global--FontSize--xs);
1818
+ --pf-c-badge--FontWeight: var(--pf-global--FontWeight--bold);
1819
+ --pf-c-badge--PaddingRight: var(--pf-global--spacer--sm);
1820
+ --pf-c-badge--PaddingLeft: var(--pf-global--spacer--sm);
1821
+ --pf-c-badge--Color: var(--pf-global--Color--dark-100);
1822
+ --pf-c-badge--MinWidth: var(--pf-global--spacer--xl);
1823
+ --pf-c-badge--m-read--BackgroundColor: var(--pf-global--BackgroundColor--200);
1824
+ --pf-c-badge--m-read--Color: var(--pf-global--Color--dark-100);
1825
+ --pf-c-badge--m-unread--BackgroundColor: var(--pf-global--primary-color--100);
1826
+ --pf-c-badge--m-unread--Color: var(--pf-global--Color--light-100);
1827
+ display: inline-block;
1828
+ min-width: var(--pf-c-badge--MinWidth);
1829
+ padding-right: var(--pf-c-badge--PaddingRight);
1830
+ padding-left: var(--pf-c-badge--PaddingLeft);
1831
+ font-size: var(--pf-c-badge--FontSize);
1832
+ font-weight: var(--pf-c-badge--FontWeight);
1833
+ color: var(--pf-c-badge--Color);
1834
+ text-align: center;
1835
+ background-color: var(--pf-c-badge--BackgroundColor);
1836
+ border-radius: var(--pf-c-badge--BorderRadius);
1837
+ }
1838
+
1839
+ .pf-c-badge.pf-m-read {
1840
+ --pf-c-badge--Color: var(--pf-c-badge--m-read--Color);
1841
+ --pf-c-badge--BackgroundColor: var(--pf-c-badge--m-read--BackgroundColor);
1842
+ }
1843
+
1844
+ .pf-c-badge.pf-m-unread {
1845
+ --pf-c-badge--Color: var(--pf-c-badge--m-unread--Color);
1846
+ --pf-c-badge--BackgroundColor: var(--pf-c-badge--m-unread--BackgroundColor);
1847
+ }
1848
+
1849
+ :where(.pf-theme-dark) .pf-c-badge {
1850
+ --pf-c-badge--m-read--BackgroundColor: var(--pf-global--palette--black-500);
1851
+ --pf-c-badge--m-unread--BackgroundColor: var(--pf-global--primary-color--300);
1852
+ }
1853
+
1854
1854
  .pf-c-brand {
1855
1855
  --pf-c-brand--Width: auto;
1856
1856
  --pf-c-brand--Height: auto;
@@ -9562,6 +9562,112 @@ label.pf-c-check, .pf-c-check__label,
9562
9562
  transform: translateY(calc(-50% - 0.5 * var(--pf-c-icon__content--svg--VerticalAlign)));
9563
9563
  }
9564
9564
 
9565
+ .pf-c-input-group {
9566
+ --pf-global--Color--100: var(--pf-global--Color--dark-100);
9567
+ --pf-global--Color--200: var(--pf-global--Color--dark-200);
9568
+ --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
9569
+ --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
9570
+ --pf-global--link--Color: var(--pf-global--link--Color--dark);
9571
+ --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
9572
+ --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
9573
+ }
9574
+
9575
+ .pf-c-input-group {
9576
+ --pf-c-input-group--BackgroundColor: var(--pf-global--BackgroundColor--100);
9577
+ --pf-c-input-group--child--ZIndex: var(--pf-global--ZIndex--xs);
9578
+ --pf-c-input-group__text--FontSize: var(--pf-global--FontSize--md);
9579
+ --pf-c-input-group__text--PaddingRight: var(--pf-global--spacer--sm);
9580
+ --pf-c-input-group__text--PaddingLeft: var(--pf-global--spacer--sm);
9581
+ --pf-c-input-group__text--Color: var(--pf-global--Color--dark-200);
9582
+ --pf-c-input-group__text--BorderWidth: var(--pf-global--BorderWidth--sm);
9583
+ --pf-c-input-group__text--BorderTopColor: var(--pf-global--BorderColor--300);
9584
+ --pf-c-input-group__text--BorderRightColor: var(--pf-global--BorderColor--300);
9585
+ --pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--200);
9586
+ --pf-c-input-group__text--BorderLeftColor: var(--pf-global--BorderColor--300);
9587
+ --pf-c-input-group__text--BackgroundColor: var(--pf-global--BackgroundColor--100);
9588
+ --pf-c-input-group__textarea--MinHeight: var(--pf-global--spacer--xl);
9589
+ --pf-c-input-group--c-form-control--invalid--ZIndex: var(--pf-global--ZIndex--xs);
9590
+ --pf-c-input-group--c-form-control--MarginRight: 0;
9591
+ color: var(--pf-global--Color--100);
9592
+ display: flex;
9593
+ width: 100%;
9594
+ background-color: var(--pf-c-input-group--BackgroundColor);
9595
+ }
9596
+
9597
+ .pf-c-input-group.pf-m-plain {
9598
+ --pf-c-input-group--BackgroundColor: transparent;
9599
+ }
9600
+
9601
+ .pf-c-input-group > * + * {
9602
+ margin-left: -1px;
9603
+ }
9604
+
9605
+ .pf-c-input-group > :focus,
9606
+ .pf-c-input-group > :focus-within {
9607
+ z-index: var(--pf-c-input-group--child--ZIndex);
9608
+ }
9609
+
9610
+ .pf-c-input-group .pf-c-form-control[aria-invalid=true]:not(:last-child) {
9611
+ margin-right: var(--pf-c-input-group--c-form-control--MarginRight);
9612
+ }
9613
+
9614
+ .pf-c-input-group input:not([type=checkbox]):not([type=radio]),
9615
+ .pf-c-input-group textarea {
9616
+ flex: 2;
9617
+ min-width: 0;
9618
+ }
9619
+
9620
+ .pf-c-input-group textarea {
9621
+ min-height: var(--pf-c-input-group__textarea--MinHeight);
9622
+ }
9623
+
9624
+ .pf-c-input-group__text {
9625
+ display: flex;
9626
+ align-items: center;
9627
+ padding-right: var(--pf-c-input-group__text--PaddingRight);
9628
+ padding-left: var(--pf-c-input-group__text--PaddingLeft);
9629
+ font-size: var(--pf-c-input-group__text--FontSize);
9630
+ color: var(--pf-c-input-group__text--Color);
9631
+ text-align: center;
9632
+ background-color: var(--pf-c-input-group__text--BackgroundColor);
9633
+ border: var(--pf-c-input-group__text--BorderWidth) solid;
9634
+ border-color: var(--pf-c-input-group__text--BorderTopColor) var(--pf-c-input-group__text--BorderRightColor) var(--pf-c-input-group__text--BorderBottomColor) var(--pf-c-input-group__text--BorderLeftColor);
9635
+ }
9636
+
9637
+ label.pf-c-input-group__text {
9638
+ cursor: pointer;
9639
+ }
9640
+
9641
+ .pf-c-input-group__text.pf-m-plain {
9642
+ --pf-c-input-group__text--BorderWidth: 0;
9643
+ margin-left: 0;
9644
+ }
9645
+
9646
+ :where(.pf-theme-dark) .pf-c-input-group {
9647
+ --pf-c-input-group--BackgroundColor: transparent;
9648
+ --pf-c-input-group__text--BorderTopColor: transparent;
9649
+ --pf-c-input-group__text--BorderRightColor: transparent;
9650
+ --pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--400);
9651
+ --pf-c-input-group__text--BorderLeftColor: transparent;
9652
+ --pf-c-input-group__text--BackgroundColor: var(--pf-global--palette--black-600);
9653
+ }
9654
+
9655
+ :where(.pf-theme-dark) .pf-c-input-group > * + * {
9656
+ margin-left: 0;
9657
+ border-left: 1px solid var(--pf-global--palette--black-700);
9658
+ }
9659
+
9660
+ :where(.pf-theme-dark) .pf-c-input-group__text {
9661
+ --pf-c-input-group__text--BorderTopColor: transparent;
9662
+ --pf-c-input-group__text--BorderRightColor: transparent;
9663
+ --pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--400);
9664
+ --pf-c-input-group__text--BorderLeftColor: transparent;
9665
+ }
9666
+
9667
+ :where(.pf-theme-dark) .pf-c-input-group__text.pf-m-plain {
9668
+ --pf-c-input-group__text--BackgroundColor: transparent;
9669
+ }
9670
+
9565
9671
  .pf-c-jump-links {
9566
9672
  --pf-c-jump-links__list--Display: flex;
9567
9673
  --pf-c-jump-links__list--Visibility: visible;
@@ -10177,141 +10283,35 @@ label.pf-c-check, .pf-c-check__label,
10177
10283
  --pf-c-sidebar__panel--FlexBasis: 100%;
10178
10284
  }
10179
10285
  }
10180
- @media (min-width: 1450px) {
10181
- .pf-c-sidebar__panel.pf-m-width-default-on-2xl {
10182
- --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
10183
- }
10184
-
10185
- .pf-c-sidebar__panel.pf-m-width-25-on-2xl {
10186
- --pf-c-sidebar__panel--FlexBasis: 25%;
10187
- }
10188
-
10189
- .pf-c-sidebar__panel.pf-m-width-33-on-2xl {
10190
- --pf-c-sidebar__panel--FlexBasis: 33%;
10191
- }
10192
-
10193
- .pf-c-sidebar__panel.pf-m-width-50-on-2xl {
10194
- --pf-c-sidebar__panel--FlexBasis: 50%;
10195
- }
10196
-
10197
- .pf-c-sidebar__panel.pf-m-width-66-on-2xl {
10198
- --pf-c-sidebar__panel--FlexBasis: 66%;
10199
- }
10200
-
10201
- .pf-c-sidebar__panel.pf-m-width-75-on-2xl {
10202
- --pf-c-sidebar__panel--FlexBasis: 75%;
10203
- }
10204
-
10205
- .pf-c-sidebar__panel.pf-m-width-100-on-2xl {
10206
- --pf-c-sidebar__panel--FlexBasis: 100%;
10207
- }
10208
- }
10209
- .pf-c-input-group {
10210
- --pf-global--Color--100: var(--pf-global--Color--dark-100);
10211
- --pf-global--Color--200: var(--pf-global--Color--dark-200);
10212
- --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
10213
- --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
10214
- --pf-global--link--Color: var(--pf-global--link--Color--dark);
10215
- --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
10216
- --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
10217
- }
10218
-
10219
- .pf-c-input-group {
10220
- --pf-c-input-group--BackgroundColor: var(--pf-global--BackgroundColor--100);
10221
- --pf-c-input-group--child--ZIndex: var(--pf-global--ZIndex--xs);
10222
- --pf-c-input-group__text--FontSize: var(--pf-global--FontSize--md);
10223
- --pf-c-input-group__text--PaddingRight: var(--pf-global--spacer--sm);
10224
- --pf-c-input-group__text--PaddingLeft: var(--pf-global--spacer--sm);
10225
- --pf-c-input-group__text--Color: var(--pf-global--Color--dark-200);
10226
- --pf-c-input-group__text--BorderWidth: var(--pf-global--BorderWidth--sm);
10227
- --pf-c-input-group__text--BorderTopColor: var(--pf-global--BorderColor--300);
10228
- --pf-c-input-group__text--BorderRightColor: var(--pf-global--BorderColor--300);
10229
- --pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--200);
10230
- --pf-c-input-group__text--BorderLeftColor: var(--pf-global--BorderColor--300);
10231
- --pf-c-input-group__text--BackgroundColor: var(--pf-global--BackgroundColor--100);
10232
- --pf-c-input-group__textarea--MinHeight: var(--pf-global--spacer--xl);
10233
- --pf-c-input-group--c-form-control--invalid--ZIndex: var(--pf-global--ZIndex--xs);
10234
- --pf-c-input-group--c-form-control--MarginRight: 0;
10235
- color: var(--pf-global--Color--100);
10236
- display: flex;
10237
- width: 100%;
10238
- background-color: var(--pf-c-input-group--BackgroundColor);
10239
- }
10240
-
10241
- .pf-c-input-group.pf-m-plain {
10242
- --pf-c-input-group--BackgroundColor: transparent;
10243
- }
10244
-
10245
- .pf-c-input-group > * + * {
10246
- margin-left: -1px;
10247
- }
10248
-
10249
- .pf-c-input-group > :focus,
10250
- .pf-c-input-group > :focus-within {
10251
- z-index: var(--pf-c-input-group--child--ZIndex);
10252
- }
10253
-
10254
- .pf-c-input-group .pf-c-form-control[aria-invalid=true]:not(:last-child) {
10255
- margin-right: var(--pf-c-input-group--c-form-control--MarginRight);
10256
- }
10257
-
10258
- .pf-c-input-group input:not([type=checkbox]):not([type=radio]),
10259
- .pf-c-input-group textarea {
10260
- flex: 2;
10261
- min-width: 0;
10262
- }
10263
-
10264
- .pf-c-input-group textarea {
10265
- min-height: var(--pf-c-input-group__textarea--MinHeight);
10266
- }
10267
-
10268
- .pf-c-input-group__text {
10269
- display: flex;
10270
- align-items: center;
10271
- padding-right: var(--pf-c-input-group__text--PaddingRight);
10272
- padding-left: var(--pf-c-input-group__text--PaddingLeft);
10273
- font-size: var(--pf-c-input-group__text--FontSize);
10274
- color: var(--pf-c-input-group__text--Color);
10275
- text-align: center;
10276
- background-color: var(--pf-c-input-group__text--BackgroundColor);
10277
- border: var(--pf-c-input-group__text--BorderWidth) solid;
10278
- border-color: var(--pf-c-input-group__text--BorderTopColor) var(--pf-c-input-group__text--BorderRightColor) var(--pf-c-input-group__text--BorderBottomColor) var(--pf-c-input-group__text--BorderLeftColor);
10279
- }
10286
+ @media (min-width: 1450px) {
10287
+ .pf-c-sidebar__panel.pf-m-width-default-on-2xl {
10288
+ --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
10289
+ }
10280
10290
 
10281
- label.pf-c-input-group__text {
10282
- cursor: pointer;
10283
- }
10291
+ .pf-c-sidebar__panel.pf-m-width-25-on-2xl {
10292
+ --pf-c-sidebar__panel--FlexBasis: 25%;
10293
+ }
10284
10294
 
10285
- .pf-c-input-group__text.pf-m-plain {
10286
- --pf-c-input-group__text--BorderWidth: 0;
10287
- margin-left: 0;
10288
- }
10295
+ .pf-c-sidebar__panel.pf-m-width-33-on-2xl {
10296
+ --pf-c-sidebar__panel--FlexBasis: 33%;
10297
+ }
10289
10298
 
10290
- :where(.pf-theme-dark) .pf-c-input-group {
10291
- --pf-c-input-group--BackgroundColor: transparent;
10292
- --pf-c-input-group__text--BorderTopColor: transparent;
10293
- --pf-c-input-group__text--BorderRightColor: transparent;
10294
- --pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--400);
10295
- --pf-c-input-group__text--BorderLeftColor: transparent;
10296
- --pf-c-input-group__text--BackgroundColor: var(--pf-global--palette--black-600);
10297
- }
10299
+ .pf-c-sidebar__panel.pf-m-width-50-on-2xl {
10300
+ --pf-c-sidebar__panel--FlexBasis: 50%;
10301
+ }
10298
10302
 
10299
- :where(.pf-theme-dark) .pf-c-input-group > * + * {
10300
- margin-left: 0;
10301
- border-left: 1px solid var(--pf-global--palette--black-700);
10302
- }
10303
+ .pf-c-sidebar__panel.pf-m-width-66-on-2xl {
10304
+ --pf-c-sidebar__panel--FlexBasis: 66%;
10305
+ }
10303
10306
 
10304
- :where(.pf-theme-dark) .pf-c-input-group__text {
10305
- --pf-c-input-group__text--BorderTopColor: transparent;
10306
- --pf-c-input-group__text--BorderRightColor: transparent;
10307
- --pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--400);
10308
- --pf-c-input-group__text--BorderLeftColor: transparent;
10309
- }
10307
+ .pf-c-sidebar__panel.pf-m-width-75-on-2xl {
10308
+ --pf-c-sidebar__panel--FlexBasis: 75%;
10309
+ }
10310
10310
 
10311
- :where(.pf-theme-dark) .pf-c-input-group__text.pf-m-plain {
10312
- --pf-c-input-group__text--BackgroundColor: transparent;
10311
+ .pf-c-sidebar__panel.pf-m-width-100-on-2xl {
10312
+ --pf-c-sidebar__panel--FlexBasis: 100%;
10313
+ }
10313
10314
  }
10314
-
10315
10315
  .pf-c-label {
10316
10316
  --pf-c-label--PaddingTop: var(--pf-global--spacer--xs);
10317
10317
  --pf-c-label--PaddingRight: var(--pf-global--spacer--sm);
@@ -13215,251 +13215,67 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
13215
13215
  }
13216
13216
 
13217
13217
  .pf-c-menu-toggle.pf-m-full-width {
13218
- width: 100%;
13219
- }
13220
-
13221
- .pf-c-menu-toggle__button {
13222
- --pf-c-menu-toggle__controls--PaddingLeft: 0;
13223
- --pf-c-menu-toggle__controls--MarginRight: var(--pf-c-menu-toggle__button__controls--MarginRight);
13224
- --pf-c-menu-toggle__controls--MarginLeft: var(--pf-c-menu-toggle__button__controls--MarginLeft);
13225
- color: inherit;
13226
- border: 0;
13227
- }
13228
-
13229
- .pf-c-menu-toggle__icon {
13230
- display: inline-flex;
13231
- align-self: center;
13232
- flex-shrink: 0;
13233
- margin-right: var(--pf-c-menu-toggle__icon--MarginRight);
13234
- line-height: 1;
13235
- }
13236
-
13237
- .pf-c-menu-toggle__text {
13238
- overflow: hidden;
13239
- text-overflow: ellipsis;
13240
- white-space: nowrap;
13241
- min-width: 0;
13242
- }
13243
-
13244
- .pf-c-menu-toggle__count {
13245
- display: flex;
13246
- align-items: center;
13247
- margin-left: var(--pf-c-menu-toggle__count--MarginLeft);
13248
- }
13249
-
13250
- .pf-c-menu-toggle__controls {
13251
- padding-left: var(--pf-c-menu-toggle__controls--PaddingLeft);
13252
- margin-right: var(--pf-c-menu-toggle__controls--MarginRight);
13253
- margin-left: var(--pf-c-menu-toggle__controls--MarginLeft);
13254
- }
13255
-
13256
- .pf-c-menu-toggle__toggle-icon {
13257
- margin-right: var(--pf-c-menu-toggle__toggle-icon--MarginRight);
13258
- color: var(--pf-c-menu-toggle__toggle-icon--Color, inherit);
13259
- }
13260
-
13261
- :where(.pf-theme-dark) .pf-c-menu-toggle {
13262
- --pf-c-menu-toggle--BackgroundColor: var(--pf-global--BackgroundColor--400);
13263
- --pf-c-menu-toggle--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
13264
- --pf-c-menu-toggle--active--BackgroundColor: var(--pf-global--BackgroundColor--400);
13265
- --pf-c-menu-toggle--focus--BackgroundColor: var(--pf-global--BackgroundColor--400);
13266
- --pf-c-menu-toggle--m-expanded--BackgroundColor: var(--pf-global--BackgroundColor--400);
13267
- --pf-c-menu-toggle--before--BorderTopColor: transparent;
13268
- --pf-c-menu-toggle--before--BorderRightColor: transparent;
13269
- --pf-c-menu-toggle--before--BorderBottomColor: transparent;
13270
- --pf-c-menu-toggle--before--BorderLeftColor: transparent;
13271
- --pf-c-menu-toggle--after--BorderBottomColor: var(--pf-global--BorderColor--400);
13272
- --pf-c-menu-toggle--disabled--BackgroundColor: var(--pf-global--palette--black-500);
13273
- --pf-c-menu-toggle--disabled--Color: var(--pf-global--palette--black-100);
13274
- --pf-c-menu-toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--300);
13275
- }
13276
-
13277
- :where(.pf-theme-dark) .pf-c-menu-toggle.pf-m-plain {
13278
- background: transparent;
13279
- }
13280
-
13281
- .pf-c-multiple-file-upload {
13282
- --pf-c-multiple-file-upload--GridTemplateColumns: 1fr;
13283
- --pf-c-multiple-file-upload--Gap: var(--pf-global--spacer--lg);
13284
- --pf-c-multiple-file-upload__main--TextAlign: center;
13285
- --pf-c-multiple-file-upload__main--GridTemplateColumns: auto;
13286
- --pf-c-multiple-file-upload__main--GridTemplateRows: auto;
13287
- --pf-c-multiple-file-upload__main--GridTemplateAreas:
13288
- "title"
13289
- "upload"
13290
- "info";
13291
- --pf-c-multiple-file-upload__main--Gap: var(--pf-global--spacer--md);
13292
- --pf-c-multiple-file-upload__main--PaddingTop: var(--pf-global--spacer--lg);
13293
- --pf-c-multiple-file-upload__main--PaddingRight: var(--pf-global--spacer--lg);
13294
- --pf-c-multiple-file-upload__main--PaddingBottom: var(--pf-global--spacer--xl);
13295
- --pf-c-multiple-file-upload__main--PaddingLeft: var(--pf-global--spacer--lg);
13296
- --pf-c-multiple-file-upload__main--BorderWidth: var(--pf-global--BorderWidth--sm);
13297
- --pf-c-multiple-file-upload__main--BorderStyle: dashed;
13298
- --pf-c-multiple-file-upload__main--BorderColor: var(--pf-global--BorderColor--100);
13299
- --pf-c-multiple-file-upload__main--BackgroundColor: var(--pf-global--BackgroundColor--100);
13300
- --pf-c-multiple-file-upload__title--Display: grid;
13301
- --pf-c-multiple-file-upload__title--GridTemplateColumns: auto;
13302
- --pf-c-multiple-file-upload__title--Gap: var(--pf-global--spacer--sm);
13303
- --pf-c-multiple-file-upload__title-icon--Color: var(--pf-global--Color--200);
13304
- --pf-c-multiple-file-upload__title-text-separator--Display: block;
13305
- --pf-c-multiple-file-upload__title-text-separator--MarginTop: var(--pf-global--spacer--sm);
13306
- --pf-c-multiple-file-upload__info--FontSize: var(--pf-global--FontSize--sm);
13307
- --pf-c-multiple-file-upload__info--Color: var(--pf-global--Color--200);
13308
- --pf-c-multiple-file-upload__info--MarginTop: var(--pf-global--spacer--sm);
13309
- --pf-c-multiple-file-upload--m-drag-over__main--BorderStyle: solid;
13310
- --pf-c-multiple-file-upload--m-drag-over__main--BorderColor: var(--pf-global--active-color--100);
13311
- --pf-c-multiple-file-upload--m-drag-over__main--BackgroundColor: var(--pf-global--palette--blue-50);
13312
- --pf-c-multiple-file-upload--m-drag-over__main__title-icon--Color: var(--pf-global--active-color--100);
13313
- --pf-c-multiple-file-upload--m-drag-over__main__title-text--Color: var(--pf-global--active-color--100);
13314
- --pf-c-multiple-file-upload--m-drag-over__main__info--Color: var(--pf-global--active-color--100);
13315
- --pf-c-multiple-file-upload--m-horizontal--GridTemplateColumns: fit-content(100%);
13316
- --pf-c-multiple-file-upload--m-horizontal__main--TextAlign: left;
13317
- --pf-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns: 1fr auto;
13318
- --pf-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas:
13319
- "title upload"
13320
- "info upload";
13321
- --pf-c-multiple-file-upload--m-horizontal__main--Gap: var(--pf-global--spacer--sm) var(--pf-global--spacer--2xl);
13322
- --pf-c-multiple-file-upload--m-horizontal__main--PaddingBottom: var(--pf-global--spacer--lg);
13323
- --pf-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns: auto 1fr;
13324
- --pf-c-multiple-file-upload--m-horizontal__title--Gap: var(--pf-global--spacer--xs);
13325
- --pf-c-multiple-file-upload--m-horizontal__title-text-separator--Display: inline;
13326
- --pf-c-multiple-file-upload--m-horizontal__title-text-separator--MarginTop: 0;
13327
- --pf-c-multiple-file-upload--m-horizontal__info--MarginTop: 0;
13328
- --pf-c-multiple-file-upload__status-progress--GridTemplateColumns: auto 1fr;
13329
- --pf-c-multiple-file-upload__status-progress--Gap: var(--pf-global--spacer--sm);
13330
- --pf-c-multiple-file-upload__status-progress-icon--Color: var(--pf-global--Color--200);
13331
- --pf-c-multiple-file-upload__status-item--PaddingTop: var(--pf-global--spacer--md);
13332
- --pf-c-multiple-file-upload__status-item--PaddingBottom: var(--pf-global--spacer--md);
13333
- --pf-c-multiple-file-upload__status-item--first-child--PaddingTop: 0;
13334
- --pf-c-multiple-file-upload__status-item--GridTemplateColumns: auto 1fr auto;
13335
- --pf-c-multiple-file-upload__status-item--Gap: var(--pf-global--spacer--sm);
13336
- --pf-c-multiple-file-upload__status-item--BorderWidth: var(--pf-global--BorderWidth--sm);
13337
- --pf-c-multiple-file-upload__status-item--BorderColor: var(--pf-global--BorderColor--100);
13338
- --pf-c-multiple-file-upload__status-item-icon--Color: var(--pf-global--Color--200);
13339
- --pf-c-multiple-file-upload__status-item-close--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
13340
- --pf-c-multiple-file-upload__status-item-progress--GridTemplateColumns: fit-content(100%) max-content;
13341
- --pf-c-multiple-file-upload__status-item-progress--Gap: var(--pf-global--spacer--sm);
13342
- --pf-c-multiple-file-upload__status-item-progress-text--Color: var(--pf-global--primary-color--100);
13343
- --pf-c-multiple-file-upload__status-item-progress-size--Color: var(--pf-global--Color--200);
13344
- display: grid;
13345
- gap: var(--pf-c-multiple-file-upload--Gap);
13346
- grid-template-columns: var(--pf-c-multiple-file-upload--GridTemplateColumns);
13347
- }
13348
-
13349
- .pf-c-multiple-file-upload.pf-m-horizontal {
13350
- --pf-c-multiple-file-upload--GridTemplateColumns: var(--pf-c-multiple-file-upload--m-horizontal--GridTemplateColumns);
13351
- --pf-c-multiple-file-upload__main--TextAlign: var(--pf-c-multiple-file-upload--m-horizontal__main--TextAlign);
13352
- --pf-c-multiple-file-upload__main--GridTemplateColumns: var(--pf-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns);
13353
- --pf-c-multiple-file-upload__main--GridTemplateAreas: var(--pf-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas);
13354
- --pf-c-multiple-file-upload__main--Gap: var(--pf-c-multiple-file-upload--m-horizontal__main--Gap);
13355
- --pf-c-multiple-file-upload__main--PaddingBottom: var(--pf-c-multiple-file-upload--m-horizontal__main--PaddingBottom);
13356
- --pf-c-multiple-file-upload__title--GridTemplateColumns: var(--pf-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns);
13357
- --pf-c-multiple-file-upload__title--Gap: var(--pf-c-multiple-file-upload--m-horizontal__title--Gap);
13358
- --pf-c-multiple-file-upload__title-text-separator--Display: var(--pf-c-multiple-file-upload--m-horizontal__title-text-separator--Display);
13359
- --pf-c-multiple-file-upload__title-text-separator--MarginTop: var(--pf-c-multiple-file-upload--m-horizontal__title-text-separator--MarginTop);
13360
- --pf-c-multiple-file-upload__info--MarginTop: var(--pf-c-multiple-file-upload--m-horizontal__info--MarginTop);
13361
- }
13362
-
13363
- .pf-c-multiple-file-upload.pf-m-drag-over {
13364
- --pf-c-multiple-file-upload__main--BorderStyle: var(--pf-c-multiple-file-upload--m-drag-over__main--BorderStyle);
13365
- --pf-c-multiple-file-upload__main--BorderColor: var(--pf-c-multiple-file-upload--m-drag-over__main--BorderColor);
13366
- --pf-c-multiple-file-upload__main--BackgroundColor: var(--pf-c-multiple-file-upload--m-drag-over__main--BackgroundColor);
13367
- --pf-c-multiple-file-upload__title-icon--Color: var(--pf-c-multiple-file-upload--m-drag-over__main__title-icon--Color);
13368
- --pf-c-multiple-file-upload__title-text--Color: var(--pf-c-multiple-file-upload--m-drag-over__main__title-text--Color);
13369
- --pf-c-multiple-file-upload__info--Color: var(--pf-c-multiple-file-upload--m-drag-over__main__info--Color);
13370
- }
13371
-
13372
- .pf-c-multiple-file-upload__main {
13373
- display: grid;
13374
- padding: var(--pf-c-multiple-file-upload__main--PaddingTop) var(--pf-c-multiple-file-upload__main--PaddingRight) var(--pf-c-multiple-file-upload__main--PaddingBottom) var(--pf-c-multiple-file-upload__main--PaddingLeft);
13375
- text-align: var(--pf-c-multiple-file-upload__main--TextAlign);
13376
- background-color: var(--pf-c-multiple-file-upload__main--BackgroundColor);
13377
- border: var(--pf-c-multiple-file-upload__main--BorderWidth) var(--pf-c-multiple-file-upload__main--BorderStyle) var(--pf-c-multiple-file-upload__main--BorderColor);
13378
- grid-template-columns: var(--pf-c-multiple-file-upload__main--GridTemplateColumns);
13379
- grid-template-rows: var(--pf-c-multiple-file-upload__main--GridTemplateRows);
13380
- grid-template-areas: var(--pf-c-multiple-file-upload__main--GridTemplateAreas);
13381
- gap: var(--pf-c-multiple-file-upload__main--Gap);
13382
- }
13383
-
13384
- .pf-c-multiple-file-upload__title {
13385
- display: var(--pf-c-multiple-file-upload__title--Display);
13386
- grid-template-columns: var(--pf-c-multiple-file-upload__title--GridTemplateColumns);
13387
- gap: var(--pf-c-multiple-file-upload__title--Gap);
13388
- grid-area: title;
13389
- }
13390
-
13391
- .pf-c-multiple-file-upload__title-icon {
13392
- color: var(--pf-c-multiple-file-upload__title-icon--Color);
13393
- }
13394
-
13395
- .pf-c-multiple-file-upload__title-text {
13396
- color: var(--pf-c-multiple-file-upload__title-text--Color, inherit);
13397
- }
13398
-
13399
- .pf-c-multiple-file-upload__title-text-separator {
13400
- display: var(--pf-c-multiple-file-upload__title-text-separator--Display);
13401
- margin-top: var(--pf-c-multiple-file-upload__title-text-separator--MarginTop);
13402
- }
13403
-
13404
- .pf-c-multiple-file-upload__upload {
13405
- grid-area: upload;
13406
- }
13407
-
13408
- .pf-c-multiple-file-upload__info {
13409
- grid-area: info;
13410
- margin-top: var(--pf-c-multiple-file-upload__info--MarginTop);
13411
- font-size: var(--pf-c-multiple-file-upload__info--FontSize);
13412
- color: var(--pf-c-multiple-file-upload__info--Color);
13413
- }
13414
-
13415
- .pf-c-multiple-file-upload__status,
13416
- .pf-c-multiple-file-upload__status-item-main {
13417
- min-width: 0;
13418
- }
13419
-
13420
- .pf-c-multiple-file-upload__status-progress {
13421
- display: grid;
13422
- grid-template-columns: var(--pf-c-multiple-file-upload__status-progress--GridTemplateColumns);
13423
- gap: var(--pf-c-multiple-file-upload__status-progress--Gap);
13218
+ width: 100%;
13424
13219
  }
13425
13220
 
13426
- .pf-c-multiple-file-upload__status-progress-icon {
13427
- color: var(--pf-c-multiple-file-upload__status-progress-icon--Color);
13221
+ .pf-c-menu-toggle__button {
13222
+ --pf-c-menu-toggle__controls--PaddingLeft: 0;
13223
+ --pf-c-menu-toggle__controls--MarginRight: var(--pf-c-menu-toggle__button__controls--MarginRight);
13224
+ --pf-c-menu-toggle__controls--MarginLeft: var(--pf-c-menu-toggle__button__controls--MarginLeft);
13225
+ color: inherit;
13226
+ border: 0;
13428
13227
  }
13429
13228
 
13430
- .pf-c-multiple-file-upload__status-item {
13431
- display: grid;
13432
- grid-template-columns: var(--pf-c-multiple-file-upload__status-item--GridTemplateColumns);
13433
- gap: var(--pf-c-multiple-file-upload__status-item--Gap);
13434
- padding-top: var(--pf-c-multiple-file-upload__status-item--PaddingTop);
13435
- padding-bottom: var(--pf-c-multiple-file-upload__status-item--PaddingBottom);
13436
- border-bottom: var(--pf-c-multiple-file-upload__status-item--BorderWidth) solid var(--pf-c-multiple-file-upload__status-item--BorderColor);
13229
+ .pf-c-menu-toggle__icon {
13230
+ display: inline-flex;
13231
+ align-self: center;
13232
+ flex-shrink: 0;
13233
+ margin-right: var(--pf-c-menu-toggle__icon--MarginRight);
13234
+ line-height: 1;
13437
13235
  }
13438
13236
 
13439
- .pf-c-multiple-file-upload__status-item:first-child {
13440
- --pf-c-multiple-file-upload__status-item--PaddingTop: var(--pf-c-multiple-file-upload__status-item--first-child--PaddingTop);
13237
+ .pf-c-menu-toggle__text {
13238
+ overflow: hidden;
13239
+ text-overflow: ellipsis;
13240
+ white-space: nowrap;
13241
+ min-width: 0;
13441
13242
  }
13442
13243
 
13443
- .pf-c-multiple-file-upload__status-item-icon {
13444
- color: var(--pf-c-multiple-file-upload__status-item-icon--Color);
13244
+ .pf-c-menu-toggle__count {
13245
+ display: flex;
13246
+ align-items: center;
13247
+ margin-left: var(--pf-c-menu-toggle__count--MarginLeft);
13445
13248
  }
13446
13249
 
13447
- .pf-c-multiple-file-upload__status-item-close {
13448
- margin-top: var(--pf-c-multiple-file-upload__status-item-close--MarginTop);
13250
+ .pf-c-menu-toggle__controls {
13251
+ padding-left: var(--pf-c-menu-toggle__controls--PaddingLeft);
13252
+ margin-right: var(--pf-c-menu-toggle__controls--MarginRight);
13253
+ margin-left: var(--pf-c-menu-toggle__controls--MarginLeft);
13449
13254
  }
13450
13255
 
13451
- .pf-c-multiple-file-upload__status-item-progress {
13452
- display: grid;
13453
- grid-template-columns: var(--pf-c-multiple-file-upload__status-item-progress--GridTemplateColumns);
13454
- gap: var(--pf-c-multiple-file-upload__status-item-progress--Gap);
13256
+ .pf-c-menu-toggle__toggle-icon {
13257
+ margin-right: var(--pf-c-menu-toggle__toggle-icon--MarginRight);
13258
+ color: var(--pf-c-menu-toggle__toggle-icon--Color, inherit);
13455
13259
  }
13456
13260
 
13457
- .pf-c-multiple-file-upload__status-item-progress-text {
13458
- color: var(--pf-c-multiple-file-upload__status-item-progress-text--Color);
13261
+ :where(.pf-theme-dark) .pf-c-menu-toggle {
13262
+ --pf-c-menu-toggle--BackgroundColor: var(--pf-global--BackgroundColor--400);
13263
+ --pf-c-menu-toggle--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
13264
+ --pf-c-menu-toggle--active--BackgroundColor: var(--pf-global--BackgroundColor--400);
13265
+ --pf-c-menu-toggle--focus--BackgroundColor: var(--pf-global--BackgroundColor--400);
13266
+ --pf-c-menu-toggle--m-expanded--BackgroundColor: var(--pf-global--BackgroundColor--400);
13267
+ --pf-c-menu-toggle--before--BorderTopColor: transparent;
13268
+ --pf-c-menu-toggle--before--BorderRightColor: transparent;
13269
+ --pf-c-menu-toggle--before--BorderBottomColor: transparent;
13270
+ --pf-c-menu-toggle--before--BorderLeftColor: transparent;
13271
+ --pf-c-menu-toggle--after--BorderBottomColor: var(--pf-global--BorderColor--400);
13272
+ --pf-c-menu-toggle--disabled--BackgroundColor: var(--pf-global--palette--black-500);
13273
+ --pf-c-menu-toggle--disabled--Color: var(--pf-global--palette--black-100);
13274
+ --pf-c-menu-toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--300);
13459
13275
  }
13460
13276
 
13461
- .pf-c-multiple-file-upload__status-item-progress-size {
13462
- color: var(--pf-c-multiple-file-upload__status-item-progress-size--Color);
13277
+ :where(.pf-theme-dark) .pf-c-menu-toggle.pf-m-plain {
13278
+ background: transparent;
13463
13279
  }
13464
13280
 
13465
13281
  .pf-c-modal-box {
@@ -13666,6 +13482,190 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
13666
13482
  --pf-c-modal-box--BackgroundColor: var(--pf-global--BackgroundColor--300);
13667
13483
  }
13668
13484
 
13485
+ .pf-c-multiple-file-upload {
13486
+ --pf-c-multiple-file-upload--GridTemplateColumns: 1fr;
13487
+ --pf-c-multiple-file-upload--Gap: var(--pf-global--spacer--lg);
13488
+ --pf-c-multiple-file-upload__main--TextAlign: center;
13489
+ --pf-c-multiple-file-upload__main--GridTemplateColumns: auto;
13490
+ --pf-c-multiple-file-upload__main--GridTemplateRows: auto;
13491
+ --pf-c-multiple-file-upload__main--GridTemplateAreas:
13492
+ "title"
13493
+ "upload"
13494
+ "info";
13495
+ --pf-c-multiple-file-upload__main--Gap: var(--pf-global--spacer--md);
13496
+ --pf-c-multiple-file-upload__main--PaddingTop: var(--pf-global--spacer--lg);
13497
+ --pf-c-multiple-file-upload__main--PaddingRight: var(--pf-global--spacer--lg);
13498
+ --pf-c-multiple-file-upload__main--PaddingBottom: var(--pf-global--spacer--xl);
13499
+ --pf-c-multiple-file-upload__main--PaddingLeft: var(--pf-global--spacer--lg);
13500
+ --pf-c-multiple-file-upload__main--BorderWidth: var(--pf-global--BorderWidth--sm);
13501
+ --pf-c-multiple-file-upload__main--BorderStyle: dashed;
13502
+ --pf-c-multiple-file-upload__main--BorderColor: var(--pf-global--BorderColor--100);
13503
+ --pf-c-multiple-file-upload__main--BackgroundColor: var(--pf-global--BackgroundColor--100);
13504
+ --pf-c-multiple-file-upload__title--Display: grid;
13505
+ --pf-c-multiple-file-upload__title--GridTemplateColumns: auto;
13506
+ --pf-c-multiple-file-upload__title--Gap: var(--pf-global--spacer--sm);
13507
+ --pf-c-multiple-file-upload__title-icon--Color: var(--pf-global--Color--200);
13508
+ --pf-c-multiple-file-upload__title-text-separator--Display: block;
13509
+ --pf-c-multiple-file-upload__title-text-separator--MarginTop: var(--pf-global--spacer--sm);
13510
+ --pf-c-multiple-file-upload__info--FontSize: var(--pf-global--FontSize--sm);
13511
+ --pf-c-multiple-file-upload__info--Color: var(--pf-global--Color--200);
13512
+ --pf-c-multiple-file-upload__info--MarginTop: var(--pf-global--spacer--sm);
13513
+ --pf-c-multiple-file-upload--m-drag-over__main--BorderStyle: solid;
13514
+ --pf-c-multiple-file-upload--m-drag-over__main--BorderColor: var(--pf-global--active-color--100);
13515
+ --pf-c-multiple-file-upload--m-drag-over__main--BackgroundColor: var(--pf-global--palette--blue-50);
13516
+ --pf-c-multiple-file-upload--m-drag-over__main__title-icon--Color: var(--pf-global--active-color--100);
13517
+ --pf-c-multiple-file-upload--m-drag-over__main__title-text--Color: var(--pf-global--active-color--100);
13518
+ --pf-c-multiple-file-upload--m-drag-over__main__info--Color: var(--pf-global--active-color--100);
13519
+ --pf-c-multiple-file-upload--m-horizontal--GridTemplateColumns: fit-content(100%);
13520
+ --pf-c-multiple-file-upload--m-horizontal__main--TextAlign: left;
13521
+ --pf-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns: 1fr auto;
13522
+ --pf-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas:
13523
+ "title upload"
13524
+ "info upload";
13525
+ --pf-c-multiple-file-upload--m-horizontal__main--Gap: var(--pf-global--spacer--sm) var(--pf-global--spacer--2xl);
13526
+ --pf-c-multiple-file-upload--m-horizontal__main--PaddingBottom: var(--pf-global--spacer--lg);
13527
+ --pf-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns: auto 1fr;
13528
+ --pf-c-multiple-file-upload--m-horizontal__title--Gap: var(--pf-global--spacer--xs);
13529
+ --pf-c-multiple-file-upload--m-horizontal__title-text-separator--Display: inline;
13530
+ --pf-c-multiple-file-upload--m-horizontal__title-text-separator--MarginTop: 0;
13531
+ --pf-c-multiple-file-upload--m-horizontal__info--MarginTop: 0;
13532
+ --pf-c-multiple-file-upload__status-progress--GridTemplateColumns: auto 1fr;
13533
+ --pf-c-multiple-file-upload__status-progress--Gap: var(--pf-global--spacer--sm);
13534
+ --pf-c-multiple-file-upload__status-progress-icon--Color: var(--pf-global--Color--200);
13535
+ --pf-c-multiple-file-upload__status-item--PaddingTop: var(--pf-global--spacer--md);
13536
+ --pf-c-multiple-file-upload__status-item--PaddingBottom: var(--pf-global--spacer--md);
13537
+ --pf-c-multiple-file-upload__status-item--first-child--PaddingTop: 0;
13538
+ --pf-c-multiple-file-upload__status-item--GridTemplateColumns: auto 1fr auto;
13539
+ --pf-c-multiple-file-upload__status-item--Gap: var(--pf-global--spacer--sm);
13540
+ --pf-c-multiple-file-upload__status-item--BorderWidth: var(--pf-global--BorderWidth--sm);
13541
+ --pf-c-multiple-file-upload__status-item--BorderColor: var(--pf-global--BorderColor--100);
13542
+ --pf-c-multiple-file-upload__status-item-icon--Color: var(--pf-global--Color--200);
13543
+ --pf-c-multiple-file-upload__status-item-close--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
13544
+ --pf-c-multiple-file-upload__status-item-progress--GridTemplateColumns: fit-content(100%) max-content;
13545
+ --pf-c-multiple-file-upload__status-item-progress--Gap: var(--pf-global--spacer--sm);
13546
+ --pf-c-multiple-file-upload__status-item-progress-text--Color: var(--pf-global--primary-color--100);
13547
+ --pf-c-multiple-file-upload__status-item-progress-size--Color: var(--pf-global--Color--200);
13548
+ display: grid;
13549
+ gap: var(--pf-c-multiple-file-upload--Gap);
13550
+ grid-template-columns: var(--pf-c-multiple-file-upload--GridTemplateColumns);
13551
+ }
13552
+
13553
+ .pf-c-multiple-file-upload.pf-m-horizontal {
13554
+ --pf-c-multiple-file-upload--GridTemplateColumns: var(--pf-c-multiple-file-upload--m-horizontal--GridTemplateColumns);
13555
+ --pf-c-multiple-file-upload__main--TextAlign: var(--pf-c-multiple-file-upload--m-horizontal__main--TextAlign);
13556
+ --pf-c-multiple-file-upload__main--GridTemplateColumns: var(--pf-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns);
13557
+ --pf-c-multiple-file-upload__main--GridTemplateAreas: var(--pf-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas);
13558
+ --pf-c-multiple-file-upload__main--Gap: var(--pf-c-multiple-file-upload--m-horizontal__main--Gap);
13559
+ --pf-c-multiple-file-upload__main--PaddingBottom: var(--pf-c-multiple-file-upload--m-horizontal__main--PaddingBottom);
13560
+ --pf-c-multiple-file-upload__title--GridTemplateColumns: var(--pf-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns);
13561
+ --pf-c-multiple-file-upload__title--Gap: var(--pf-c-multiple-file-upload--m-horizontal__title--Gap);
13562
+ --pf-c-multiple-file-upload__title-text-separator--Display: var(--pf-c-multiple-file-upload--m-horizontal__title-text-separator--Display);
13563
+ --pf-c-multiple-file-upload__title-text-separator--MarginTop: var(--pf-c-multiple-file-upload--m-horizontal__title-text-separator--MarginTop);
13564
+ --pf-c-multiple-file-upload__info--MarginTop: var(--pf-c-multiple-file-upload--m-horizontal__info--MarginTop);
13565
+ }
13566
+
13567
+ .pf-c-multiple-file-upload.pf-m-drag-over {
13568
+ --pf-c-multiple-file-upload__main--BorderStyle: var(--pf-c-multiple-file-upload--m-drag-over__main--BorderStyle);
13569
+ --pf-c-multiple-file-upload__main--BorderColor: var(--pf-c-multiple-file-upload--m-drag-over__main--BorderColor);
13570
+ --pf-c-multiple-file-upload__main--BackgroundColor: var(--pf-c-multiple-file-upload--m-drag-over__main--BackgroundColor);
13571
+ --pf-c-multiple-file-upload__title-icon--Color: var(--pf-c-multiple-file-upload--m-drag-over__main__title-icon--Color);
13572
+ --pf-c-multiple-file-upload__title-text--Color: var(--pf-c-multiple-file-upload--m-drag-over__main__title-text--Color);
13573
+ --pf-c-multiple-file-upload__info--Color: var(--pf-c-multiple-file-upload--m-drag-over__main__info--Color);
13574
+ }
13575
+
13576
+ .pf-c-multiple-file-upload__main {
13577
+ display: grid;
13578
+ padding: var(--pf-c-multiple-file-upload__main--PaddingTop) var(--pf-c-multiple-file-upload__main--PaddingRight) var(--pf-c-multiple-file-upload__main--PaddingBottom) var(--pf-c-multiple-file-upload__main--PaddingLeft);
13579
+ text-align: var(--pf-c-multiple-file-upload__main--TextAlign);
13580
+ background-color: var(--pf-c-multiple-file-upload__main--BackgroundColor);
13581
+ border: var(--pf-c-multiple-file-upload__main--BorderWidth) var(--pf-c-multiple-file-upload__main--BorderStyle) var(--pf-c-multiple-file-upload__main--BorderColor);
13582
+ grid-template-columns: var(--pf-c-multiple-file-upload__main--GridTemplateColumns);
13583
+ grid-template-rows: var(--pf-c-multiple-file-upload__main--GridTemplateRows);
13584
+ grid-template-areas: var(--pf-c-multiple-file-upload__main--GridTemplateAreas);
13585
+ gap: var(--pf-c-multiple-file-upload__main--Gap);
13586
+ }
13587
+
13588
+ .pf-c-multiple-file-upload__title {
13589
+ display: var(--pf-c-multiple-file-upload__title--Display);
13590
+ grid-template-columns: var(--pf-c-multiple-file-upload__title--GridTemplateColumns);
13591
+ gap: var(--pf-c-multiple-file-upload__title--Gap);
13592
+ grid-area: title;
13593
+ }
13594
+
13595
+ .pf-c-multiple-file-upload__title-icon {
13596
+ color: var(--pf-c-multiple-file-upload__title-icon--Color);
13597
+ }
13598
+
13599
+ .pf-c-multiple-file-upload__title-text {
13600
+ color: var(--pf-c-multiple-file-upload__title-text--Color, inherit);
13601
+ }
13602
+
13603
+ .pf-c-multiple-file-upload__title-text-separator {
13604
+ display: var(--pf-c-multiple-file-upload__title-text-separator--Display);
13605
+ margin-top: var(--pf-c-multiple-file-upload__title-text-separator--MarginTop);
13606
+ }
13607
+
13608
+ .pf-c-multiple-file-upload__upload {
13609
+ grid-area: upload;
13610
+ }
13611
+
13612
+ .pf-c-multiple-file-upload__info {
13613
+ grid-area: info;
13614
+ margin-top: var(--pf-c-multiple-file-upload__info--MarginTop);
13615
+ font-size: var(--pf-c-multiple-file-upload__info--FontSize);
13616
+ color: var(--pf-c-multiple-file-upload__info--Color);
13617
+ }
13618
+
13619
+ .pf-c-multiple-file-upload__status,
13620
+ .pf-c-multiple-file-upload__status-item-main {
13621
+ min-width: 0;
13622
+ }
13623
+
13624
+ .pf-c-multiple-file-upload__status-progress {
13625
+ display: grid;
13626
+ grid-template-columns: var(--pf-c-multiple-file-upload__status-progress--GridTemplateColumns);
13627
+ gap: var(--pf-c-multiple-file-upload__status-progress--Gap);
13628
+ }
13629
+
13630
+ .pf-c-multiple-file-upload__status-progress-icon {
13631
+ color: var(--pf-c-multiple-file-upload__status-progress-icon--Color);
13632
+ }
13633
+
13634
+ .pf-c-multiple-file-upload__status-item {
13635
+ display: grid;
13636
+ grid-template-columns: var(--pf-c-multiple-file-upload__status-item--GridTemplateColumns);
13637
+ gap: var(--pf-c-multiple-file-upload__status-item--Gap);
13638
+ padding-top: var(--pf-c-multiple-file-upload__status-item--PaddingTop);
13639
+ padding-bottom: var(--pf-c-multiple-file-upload__status-item--PaddingBottom);
13640
+ border-bottom: var(--pf-c-multiple-file-upload__status-item--BorderWidth) solid var(--pf-c-multiple-file-upload__status-item--BorderColor);
13641
+ }
13642
+
13643
+ .pf-c-multiple-file-upload__status-item:first-child {
13644
+ --pf-c-multiple-file-upload__status-item--PaddingTop: var(--pf-c-multiple-file-upload__status-item--first-child--PaddingTop);
13645
+ }
13646
+
13647
+ .pf-c-multiple-file-upload__status-item-icon {
13648
+ color: var(--pf-c-multiple-file-upload__status-item-icon--Color);
13649
+ }
13650
+
13651
+ .pf-c-multiple-file-upload__status-item-close {
13652
+ margin-top: var(--pf-c-multiple-file-upload__status-item-close--MarginTop);
13653
+ }
13654
+
13655
+ .pf-c-multiple-file-upload__status-item-progress {
13656
+ display: grid;
13657
+ grid-template-columns: var(--pf-c-multiple-file-upload__status-item-progress--GridTemplateColumns);
13658
+ gap: var(--pf-c-multiple-file-upload__status-item-progress--Gap);
13659
+ }
13660
+
13661
+ .pf-c-multiple-file-upload__status-item-progress-text {
13662
+ color: var(--pf-c-multiple-file-upload__status-item-progress-text--Color);
13663
+ }
13664
+
13665
+ .pf-c-multiple-file-upload__status-item-progress-size {
13666
+ color: var(--pf-c-multiple-file-upload__status-item-progress-size--Color);
13667
+ }
13668
+
13669
13669
  .pf-l-bullseye {
13670
13670
  --pf-l-bullseye--Padding: 0;
13671
13671
  display: flex;
@@ -17198,6 +17198,7 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
17198
17198
  --pf-c-progress__bar--before--Opacity: .2;
17199
17199
  --pf-c-progress__indicator--Height: var(--pf-c-progress__bar--Height);
17200
17200
  --pf-c-progress__indicator--BackgroundColor: var(--pf-c-progress__bar--before--BackgroundColor);
17201
+ --pf-c-progress__helper-text--MarginTop: calc(var(--pf-global--spacer--xs) - var(--pf-c-progress--GridGap));
17201
17202
  --pf-c-progress--m-success__bar--BackgroundColor: var(--pf-global--success-color--100);
17202
17203
  --pf-c-progress--m-warning__bar--BackgroundColor: var(--pf-global--warning-color--100);
17203
17204
  --pf-c-progress--m-danger__bar--BackgroundColor: var(--pf-global--danger-color--100);
@@ -17366,6 +17367,12 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
17366
17367
  background-color: var(--pf-c-progress__indicator--BackgroundColor);
17367
17368
  }
17368
17369
 
17370
+ .pf-c-progress__helper-text {
17371
+ grid-column: 1/3;
17372
+ grid-row: 3/4;
17373
+ margin-top: var(--pf-c-progress__helper-text--MarginTop);
17374
+ }
17375
+
17369
17376
  :where(.pf-theme-dark) .pf-c-progress {
17370
17377
  --pf-c-progress--m-inside__measure--Color: var(--pf-global--palette--black-900);
17371
17378
  --pf-c-progress--m-success--m-inside__measure--Color: var(--pf-global--palette--black-900);