@patternfly/react-core 4.235.8 → 4.236.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/CHANGELOG.md +27 -0
  2. package/dist/esm/components/ApplicationLauncher/ApplicationLauncher.d.ts.map +1 -1
  3. package/dist/esm/components/ApplicationLauncher/ApplicationLauncher.js +1 -0
  4. package/dist/esm/components/ApplicationLauncher/ApplicationLauncher.js.map +1 -1
  5. package/dist/esm/components/MenuToggle/MenuToggle.d.ts.map +1 -1
  6. package/dist/esm/components/MenuToggle/MenuToggle.js +1 -1
  7. package/dist/esm/components/MenuToggle/MenuToggle.js.map +1 -1
  8. package/dist/esm/components/Page/PageSection.d.ts +2 -0
  9. package/dist/esm/components/Page/PageSection.d.ts.map +1 -1
  10. package/dist/esm/components/Page/PageSection.js +3 -2
  11. package/dist/esm/components/Page/PageSection.js.map +1 -1
  12. package/dist/esm/components/TimePicker/TimePicker.js +2 -2
  13. package/dist/esm/components/TimePicker/TimePicker.js.map +1 -1
  14. package/dist/js/components/ApplicationLauncher/ApplicationLauncher.d.ts.map +1 -1
  15. package/dist/js/components/ApplicationLauncher/ApplicationLauncher.js +1 -0
  16. package/dist/js/components/ApplicationLauncher/ApplicationLauncher.js.map +1 -1
  17. package/dist/js/components/MenuToggle/MenuToggle.d.ts.map +1 -1
  18. package/dist/js/components/MenuToggle/MenuToggle.js +1 -1
  19. package/dist/js/components/MenuToggle/MenuToggle.js.map +1 -1
  20. package/dist/js/components/Page/PageSection.d.ts +2 -0
  21. package/dist/js/components/Page/PageSection.d.ts.map +1 -1
  22. package/dist/js/components/Page/PageSection.js +3 -2
  23. package/dist/js/components/Page/PageSection.js.map +1 -1
  24. package/dist/js/components/TimePicker/TimePicker.js +2 -2
  25. package/dist/js/components/TimePicker/TimePicker.js.map +1 -1
  26. package/dist/umd/react-core.min.css +915 -901
  27. package/dist/umd/react-core.min.js +2 -2
  28. package/package.json +6 -6
  29. package/src/components/ApplicationLauncher/ApplicationLauncher.tsx +1 -0
  30. package/src/components/Avatar/__tests__/Avatar.test.tsx +69 -3
  31. package/src/components/Avatar/__tests__/__snapshots__/Avatar.test.tsx.snap +3 -2
  32. package/src/components/Dropdown/__tests__/Dropdown.test.tsx +1 -1
  33. package/src/components/Dropdown/examples/DropdownPrimaryToggle.tsx +1 -1
  34. package/src/components/LabelGroup/examples/LabelGroupEditableAdd.tsx +1 -1
  35. package/src/components/LabelGroup/examples/LabelGroupEditableAddDropdown.tsx +1 -1
  36. package/src/components/LabelGroup/examples/LabelGroupEditableAddModal.tsx +5 -5
  37. package/src/components/MenuToggle/MenuToggle.tsx +7 -1
  38. package/src/components/Page/PageSection.tsx +7 -2
  39. package/src/components/Page/__tests__/PageSection.test.tsx +12 -0
  40. package/src/components/Page/examples/PageCenteredSection.tsx +1 -1
  41. package/src/components/TimePicker/TimePicker.tsx +2 -2
@@ -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);
@@ -1394,238 +1626,6 @@ textarea.pf-c-form-control {
1394
1626
  display: block;
1395
1627
  }
1396
1628
 
1397
- .pf-c-alert {
1398
- --pf-global--Color--100: var(--pf-global--Color--dark-100);
1399
- --pf-global--Color--200: var(--pf-global--Color--dark-200);
1400
- --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
1401
- --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
1402
- --pf-global--link--Color: var(--pf-global--link--Color--dark);
1403
- --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
1404
- --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
1405
- }
1406
-
1407
- .pf-c-alert {
1408
- --pf-c-alert--BoxShadow: var(--pf-global--BoxShadow--lg);
1409
- --pf-c-alert--BackgroundColor: var(--pf-global--BackgroundColor--100);
1410
- --pf-c-alert--GridTemplateColumns: max-content 1fr max-content;
1411
- --pf-c-alert--GridTemplateAreas:
1412
- "icon title action"
1413
- ". description description"
1414
- ". actiongroup actiongroup";
1415
- --pf-c-alert--BorderTopWidth: var(--pf-global--BorderWidth--md);
1416
- --pf-c-alert--BorderTopColor: var(--pf-global--default-color--200);
1417
- --pf-c-alert--PaddingTop: var(--pf-global--spacer--md);
1418
- --pf-c-alert--PaddingRight: var(--pf-global--spacer--md);
1419
- --pf-c-alert--PaddingBottom: var(--pf-global--spacer--md);
1420
- --pf-c-alert--PaddingLeft: var(--pf-global--spacer--md);
1421
- --pf-c-alert__FontSize: var(--pf-global--FontSize--sm);
1422
- --pf-c-alert__toggle--MarginTop: calc(-1 * var(--pf-global--spacer--form-element) - 0.0625rem);
1423
- --pf-c-alert__toggle--MarginBottom: calc(-1 * var(--pf-global--spacer--form-element));
1424
- --pf-c-alert__toggle--MarginLeft: calc(-1 * var(--pf-global--spacer--md));
1425
- --pf-c-alert__toggle-icon--Rotate: 0;
1426
- --pf-c-alert__toggle-icon--Transition: var(--pf-global--Transition);
1427
- --pf-c-alert__icon--Color: var(--pf-global--default-color--200);
1428
- --pf-c-alert__icon--MarginTop: 0.0625rem;
1429
- --pf-c-alert__icon--MarginRight: var(--pf-global--spacer--sm);
1430
- --pf-c-alert__icon--FontSize: var(--pf-global--icon--FontSize--md);
1431
- --pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--bold);
1432
- --pf-c-alert__title--Color: var(--pf-global--default-color--300);
1433
- --pf-c-alert__title--max-lines: 1;
1434
- --pf-c-alert__action--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
1435
- --pf-c-alert__action--MarginBottom: calc(var(--pf-global--spacer--form-element) * -1);
1436
- --pf-c-alert__action--TranslateY: 0.125rem;
1437
- --pf-c-alert__action--MarginRight: calc(var(--pf-global--spacer--sm) * -1);
1438
- --pf-c-alert__description--PaddingTop: var(--pf-global--spacer--xs);
1439
- --pf-c-alert__action-group--PaddingTop-base: var(--pf-global--spacer--xs);
1440
- --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
1441
- --pf-c-alert__description--action-group--PaddingTop-base: var(--pf-global--spacer--md);
1442
- --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
1443
- --pf-c-alert__action-group__c-button--not-last-child--MarginRight: var(--pf-global--spacer--lg);
1444
- --pf-c-alert--m-success--BorderTopColor: var(--pf-global--success-color--100);
1445
- --pf-c-alert--m-success__icon--Color: var(--pf-global--success-color--100);
1446
- --pf-c-alert--m-success__title--Color: var(--pf-global--success-color--200);
1447
- --pf-c-alert--m-danger--BorderTopColor: var(--pf-global--danger-color--100);
1448
- --pf-c-alert--m-danger__icon--Color: var(--pf-global--danger-color--100);
1449
- --pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--200);
1450
- --pf-c-alert--m-warning--BorderTopColor: var(--pf-global--warning-color--100);
1451
- --pf-c-alert--m-warning__icon--Color: var(--pf-global--warning-color--100);
1452
- --pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--200);
1453
- --pf-c-alert--m-info--BorderTopColor: var(--pf-global--info-color--100);
1454
- --pf-c-alert--m-info__icon--Color: var(--pf-global--info-color--100);
1455
- --pf-c-alert--m-info__title--Color: var(--pf-global--info-color--200);
1456
- --pf-c-alert--m-inline--BoxShadow: none;
1457
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--cyan-50);
1458
- --pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--green-50);
1459
- --pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--red-50);
1460
- --pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--gold-50);
1461
- --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--blue-50);
1462
- --pf-c-alert--m-inline--m-plain--BorderTopWidth: 0;
1463
- --pf-c-alert--m-inline--m-plain--BackgroundColor: transparent;
1464
- --pf-c-alert--m-inline--m-plain--PaddingTop: 0;
1465
- --pf-c-alert--m-inline--m-plain--PaddingRight: 0;
1466
- --pf-c-alert--m-inline--m-plain--PaddingBottom: 0;
1467
- --pf-c-alert--m-inline--m-plain--PaddingLeft: 0;
1468
- --pf-c-alert--m-expandable--GridTemplateColumns: auto max-content 1fr max-content;
1469
- --pf-c-alert--m-expandable--GridTemplateAreas:
1470
- "toggle icon title action"
1471
- ". . description description"
1472
- ". . actiongroup actiongroup";
1473
- --pf-c-alert--m-expandable__description--action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
1474
- --pf-c-alert--m-expanded__toggle-icon--Rotate: 90deg;
1475
- --pf-c-alert--m-expanded__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
1476
- color: var(--pf-global--Color--100);
1477
- position: relative;
1478
- display: grid;
1479
- padding: var(--pf-c-alert--PaddingTop) var(--pf-c-alert--PaddingRight) var(--pf-c-alert--PaddingBottom) var(--pf-c-alert--PaddingLeft);
1480
- font-size: var(--pf-c-alert__FontSize);
1481
- background-color: var(--pf-c-alert--BackgroundColor);
1482
- border-top: var(--pf-c-alert--BorderTopWidth) solid var(--pf-c-alert--BorderTopColor);
1483
- box-shadow: var(--pf-c-alert--BoxShadow);
1484
- grid-template-columns: var(--pf-c-alert--GridTemplateColumns);
1485
- grid-template-areas: var(--pf-c-alert--GridTemplateAreas);
1486
- }
1487
-
1488
- .pf-c-alert.pf-m-success {
1489
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-success--BorderTopColor);
1490
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-success__icon--Color);
1491
- --pf-c-alert__title--Color: var(--pf-c-alert--m-success__title--Color);
1492
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-success--BackgroundColor);
1493
- }
1494
-
1495
- .pf-c-alert.pf-m-danger {
1496
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-danger--BorderTopColor);
1497
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-danger__icon--Color);
1498
- --pf-c-alert__title--Color: var(--pf-c-alert--m-danger__title--Color);
1499
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-danger--BackgroundColor);
1500
- }
1501
-
1502
- .pf-c-alert.pf-m-warning {
1503
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-warning--BorderTopColor);
1504
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-warning__icon--Color);
1505
- --pf-c-alert__title--Color: var(--pf-c-alert--m-warning__title--Color);
1506
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-warning--BackgroundColor);
1507
- }
1508
-
1509
- .pf-c-alert.pf-m-info {
1510
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-info--BorderTopColor);
1511
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-info__icon--Color);
1512
- --pf-c-alert__title--Color: var(--pf-c-alert--m-info__title--Color);
1513
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-info--BackgroundColor);
1514
- }
1515
-
1516
- .pf-c-alert.pf-m-inline {
1517
- --pf-c-alert--BoxShadow: var(--pf-c-alert--m-inline--BoxShadow);
1518
- --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--BackgroundColor);
1519
- }
1520
-
1521
- .pf-c-alert.pf-m-plain {
1522
- --pf-c-alert--BorderTopWidth: var(--pf-c-alert--m-inline--m-plain--BorderTopWidth);
1523
- --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--m-plain--BackgroundColor);
1524
- --pf-c-alert--PaddingTop: var(--pf-c-alert--m-inline--m-plain--PaddingTop);
1525
- --pf-c-alert--PaddingRight: var(--pf-c-alert--m-inline--m-plain--PaddingRight);
1526
- --pf-c-alert--PaddingBottom: var(--pf-c-alert--m-inline--m-plain--PaddingBottom);
1527
- --pf-c-alert--PaddingLeft: var(--pf-c-alert--m-inline--m-plain--PaddingLeft);
1528
- }
1529
-
1530
- .pf-c-alert.pf-m-expandable {
1531
- --pf-c-alert--GridTemplateColumns: var(--pf-c-alert--m-expandable--GridTemplateColumns);
1532
- --pf-c-alert--GridTemplateAreas: var(--pf-c-alert--m-expandable--GridTemplateAreas);
1533
- --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expandable__description--action-group--PaddingTop);
1534
- }
1535
-
1536
- .pf-c-alert.pf-m-expanded {
1537
- --pf-c-alert__toggle-icon--Rotate: var(--pf-c-alert--m-expanded__toggle-icon--Rotate);
1538
- --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expanded__description--action-group--PaddingTop);
1539
- }
1540
-
1541
- .pf-c-alert__toggle {
1542
- margin-top: var(--pf-c-alert__toggle--MarginTop);
1543
- margin-bottom: var(--pf-c-alert__toggle--MarginBottom);
1544
- margin-left: var(--pf-c-alert__toggle--MarginLeft);
1545
- }
1546
-
1547
- .pf-c-alert__toggle-icon {
1548
- display: inline-block;
1549
- transition: var(--pf-c-alert__toggle-icon--Transition);
1550
- transform: rotate(var(--pf-c-alert__toggle-icon--Rotate));
1551
- }
1552
-
1553
- .pf-c-alert__icon {
1554
- grid-area: icon;
1555
- display: flex;
1556
- margin-top: var(--pf-c-alert__icon--MarginTop);
1557
- margin-right: var(--pf-c-alert__icon--MarginRight);
1558
- font-size: var(--pf-c-alert__icon--FontSize);
1559
- color: var(--pf-c-alert__icon--Color);
1560
- }
1561
-
1562
- .pf-c-alert__title {
1563
- grid-area: title;
1564
- font-weight: var(--pf-c-alert__title--FontWeight);
1565
- color: var(--pf-c-alert__title--Color);
1566
- word-break: break-word;
1567
- }
1568
-
1569
- .pf-c-alert__title.pf-m-truncate {
1570
- display: -webkit-box;
1571
- -webkit-box-orient: vertical;
1572
- -webkit-line-clamp: var(--pf-c-alert__title--max-lines);
1573
- overflow: hidden;
1574
- }
1575
-
1576
- .pf-c-alert__description {
1577
- grid-area: description;
1578
- padding-top: var(--pf-c-alert__description--PaddingTop);
1579
- word-break: break-word;
1580
- }
1581
-
1582
- .pf-c-alert__description + .pf-c-alert__action-group {
1583
- --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop);
1584
- }
1585
-
1586
- .pf-c-alert__action {
1587
- grid-area: action;
1588
- margin-top: var(--pf-c-alert__action--MarginTop);
1589
- margin-right: var(--pf-c-alert__action--MarginRight);
1590
- margin-bottom: var(--pf-c-alert__action--MarginBottom);
1591
- transform: translateY(var(--pf-c-alert__action--TranslateY));
1592
- }
1593
-
1594
- .pf-c-alert__action > .pf-c-button {
1595
- --pf-c-button--LineHeight: 1;
1596
- }
1597
-
1598
- .pf-c-alert__action-group {
1599
- grid-area: actiongroup;
1600
- padding-top: var(--pf-c-alert__action-group--PaddingTop);
1601
- }
1602
-
1603
- .pf-c-alert__action-group > .pf-c-button {
1604
- --pf-c-button--m-link--m-inline--hover--TextDecoration: none;
1605
- }
1606
-
1607
- .pf-c-alert__action-group > .pf-c-button:not(:last-child) {
1608
- margin-right: var(--pf-c-alert__action-group__c-button--not-last-child--MarginRight);
1609
- }
1610
-
1611
- .pf-m-overpass-font .pf-c-alert__title {
1612
- --pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--normal);
1613
- }
1614
-
1615
- :where(.pf-theme-dark) .pf-c-alert {
1616
- --pf-c-alert--BackgroundColor: var(--pf-global--palette--black-600);
1617
- --pf-c-alert__title--Color: var(--pf-global--default-color--200);
1618
- --pf-c-alert--m-success__title--Color: var(--pf-global--success-color--100);
1619
- --pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--100);
1620
- --pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--100);
1621
- --pf-c-alert--m-info__title--Color: var(--pf-global--info-color--100);
1622
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--black-600);
1623
- --pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--black-600);
1624
- --pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--black-600);
1625
- --pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--black-600);
1626
- --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--black-600);
1627
- }
1628
-
1629
1629
  .pf-c-badge {
1630
1630
  --pf-c-badge--BorderRadius: var(--pf-global--BorderRadius--lg);
1631
1631
  --pf-c-badge--FontSize: var(--pf-global--FontSize--xs);
@@ -7265,331 +7265,6 @@ label.pf-c-check, .pf-c-check__label,
7265
7265
  --pf-c-drawer__panel--BackgroundColor: var(--pf-global--BackgroundColor--100);
7266
7266
  }
7267
7267
 
7268
- .pf-c-dual-list-selector {
7269
- --pf-c-dual-list-selector__header--GridArea: pane-header;
7270
- --pf-c-dual-list-selector__tools--GridArea: pane-tools;
7271
- --pf-c-dual-list-selector__status--GridArea: pane-status;
7272
- --pf-c-dual-list-selector__menu--GridArea: pane-menu;
7273
- --pf-c-dual-list-selector__controls--GridArea: controls;
7274
- --pf-c-dual-list-selector--m-chosen__header--GridArea: pane-header-c;
7275
- --pf-c-dual-list-selector--m-chosen__tools--GridArea: pane-tools-c;
7276
- --pf-c-dual-list-selector--m-chosen__status--GridArea: pane-status-c;
7277
- --pf-c-dual-list-selector--m-chosen__menu--GridArea: pane-menu-c;
7278
- --pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min: 12.5rem;
7279
- --pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max: 28.125rem;
7280
- --pf-c-dual-list-selector__header--MarginBottom: var(--pf-global--spacer--sm);
7281
- --pf-c-dual-list-selector__title-text--FontWeight: var(--pf-global--FontWeight--bold);
7282
- --pf-c-dual-list-selector__tools--MarginBottom: var(--pf-global--spacer--md);
7283
- --pf-c-dual-list-selector__tools-filter--tools-actions--MarginLeft: var(--pf-global--spacer--sm);
7284
- --pf-c-dual-list-selector__menu--BorderWidth: var(--pf-global--BorderWidth--sm);
7285
- --pf-c-dual-list-selector__menu--BorderColor: var(--pf-global--BorderColor--100);
7286
- --pf-c-dual-list-selector__menu--MinHeight: 12.5rem;
7287
- --pf-c-dual-list-selector__menu--MaxHeight: 20rem;
7288
- --pf-c-dual-list-selector__list-item-row--FontSize: var(--pf-global--FontSize--sm);
7289
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: transparent;
7290
- --pf-c-dual-list-selector__list-item-row--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
7291
- --pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
7292
- --pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
7293
- --pf-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor: var(--pf-global--BackgroundColor--100);
7294
- --pf-c-dual-list-selector__list-item--m-ghost-row--Opacity: .4;
7295
- --pf-c-dual-list-selector__item--PaddingTop: var(--pf-global--spacer--sm);
7296
- --pf-c-dual-list-selector__item--PaddingRight: var(--pf-global--spacer--md);
7297
- --pf-c-dual-list-selector__item--PaddingBottom: var(--pf-global--spacer--sm);
7298
- --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-global--spacer--md);
7299
- --pf-c-dual-list-selector__item--m-expandable--PaddingLeft: 0;
7300
- --pf-c-dual-list-selector__item--indent--base: calc(var(--pf-global--spacer--md) + var(--pf-global--spacer--sm) + var(--pf-c-dual-list-selector__list-item-row--FontSize));
7301
- --pf-c-dual-list-selector__item--nested-indent--base: calc(var(--pf-c-dual-list-selector__item--indent--base) - var(--pf-global--spacer--md));
7302
- --pf-c-dual-list-selector__draggable--item--PaddingLeft: var(--pf-global--spacer--xs);
7303
- --pf-c-dual-list-selector__item-text--Color: var(--pf-global--Color--100);
7304
- --pf-c-dual-list-selector__list-item-row--m-selected__text--Color: var(--pf-global--active-color--100);
7305
- --pf-c-dual-list-selector__list-item-row--m-selected__text--FontWeight: var(--pf-global--FontWeight--bold);
7306
- --pf-c-dual-list-selector__list-item--m-disabled__item-text--Color: var(--pf-global--disabled-color--100);
7307
- --pf-c-dual-list-selector__status--MarginBottom: var(--pf-global--spacer--sm);
7308
- --pf-c-dual-list-selector__status-text--FontSize: var(--pf-global--FontSize--sm);
7309
- --pf-c-dual-list-selector__status-text--Color: var(--pf-global--Color--200);
7310
- --pf-c-dual-list-selector__controls--PaddingRight: var(--pf-global--spacer--md);
7311
- --pf-c-dual-list-selector__controls--PaddingLeft: var(--pf-global--spacer--md);
7312
- --pf-c-dual-list-selector__item-toggle--PaddingTop: var(--pf-global--spacer--sm);
7313
- --pf-c-dual-list-selector__item-toggle--PaddingRight: var(--pf-global--spacer--sm);
7314
- --pf-c-dual-list-selector__item-toggle--PaddingBottom: var(--pf-global--spacer--sm);
7315
- --pf-c-dual-list-selector__item-toggle--PaddingLeft: var(--pf-global--spacer--md);
7316
- --pf-c-dual-list-selector__item-toggle--MarginTop: calc(var(--pf-global--spacer--sm) * -1);
7317
- --pf-c-dual-list-selector__item-toggle--MarginBottom: calc(var(--pf-global--spacer--sm) * -1);
7318
- --pf-c-dual-list-selector__list__list__item-toggle--Left: 0;
7319
- --pf-c-dual-list-selector__list__list__item-toggle--TranslateX: -100%;
7320
- --pf-c-dual-list-selector__item-check--MarginRight: var(--pf-global--spacer--sm);
7321
- --pf-c-dual-list-selector__item-count--Marginleft: var(--pf-global--spacer--sm);
7322
- --pf-c-dual-list-selector__item--c-badge--m-read--BackgroundColor: var(--pf-global--disabled-color--200);
7323
- --pf-c-dual-list-selector__item-toggle-icon--Rotate: 0;
7324
- --pf-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate: 90deg;
7325
- --pf-c-dual-list-selector__item-toggle-icon--Transition: var(--pf-global--Transition);
7326
- --pf-c-dual-list-selector__item-toggle-icon--MinWidth: var(--pf-c-dual-list-selector__list-item-row--FontSize);
7327
- --pf-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color: var(--pf-global--disabled-color--200);
7328
- display: grid;
7329
- grid-template-areas: "pane-header . pane-header-c" "pane-tools . pane-tools-c" "pane-status . pane-status-c" "pane-menu controls pane-menu-c";
7330
- grid-template-columns: minmax(var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min), var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max)) min-content minmax(var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min), var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max));
7331
- grid-template-rows: repeat(3, auto) auto;
7332
- }
7333
-
7334
- .pf-c-dual-list-selector__pane {
7335
- display: contents;
7336
- }
7337
-
7338
- .pf-c-dual-list-selector__pane.pf-m-chosen {
7339
- --pf-c-dual-list-selector__header--GridArea: var(--pf-c-dual-list-selector--m-chosen__header--GridArea);
7340
- --pf-c-dual-list-selector__tools--GridArea: var(--pf-c-dual-list-selector--m-chosen__tools--GridArea);
7341
- --pf-c-dual-list-selector__status--GridArea: var(--pf-c-dual-list-selector--m-chosen__status--GridArea);
7342
- --pf-c-dual-list-selector__menu--GridArea: var(--pf-c-dual-list-selector--m-chosen__menu--GridArea);
7343
- }
7344
-
7345
- .pf-c-dual-list-selector__header {
7346
- grid-area: var(--pf-c-dual-list-selector__header--GridArea);
7347
- margin-bottom: var(--pf-c-dual-list-selector__header--MarginBottom);
7348
- }
7349
-
7350
- .pf-c-dual-list-selector__title-text {
7351
- font-weight: var(--pf-c-dual-list-selector__title-text--FontWeight);
7352
- }
7353
-
7354
- .pf-c-dual-list-selector__tools {
7355
- display: flex;
7356
- grid-area: var(--pf-c-dual-list-selector__tools--GridArea);
7357
- margin-bottom: var(--pf-c-dual-list-selector__tools--MarginBottom);
7358
- }
7359
-
7360
- .pf-c-dual-list-selector__tools-filter {
7361
- flex-grow: 1;
7362
- }
7363
-
7364
- .pf-c-dual-list-selector__tools-actions {
7365
- display: flex;
7366
- }
7367
-
7368
- .pf-c-dual-list-selector__tools-filter ~ .pf-c-dual-list-selector__tools-actions {
7369
- margin-left: var(--pf-c-dual-list-selector__tools-filter--tools-actions--MarginLeft);
7370
- }
7371
-
7372
- .pf-c-dual-list-selector__status {
7373
- display: flex;
7374
- grid-area: var(--pf-c-dual-list-selector__status--GridArea);
7375
- margin-bottom: var(--pf-c-dual-list-selector__status--MarginBottom);
7376
- }
7377
-
7378
- .pf-c-dual-list-selector__status-text {
7379
- flex-grow: 1;
7380
- font-size: var(--pf-c-dual-list-selector__status-text--FontSize);
7381
- color: var(--pf-c-dual-list-selector__status-text--Color);
7382
- }
7383
-
7384
- .pf-c-dual-list-selector__menu {
7385
- grid-area: var(--pf-c-dual-list-selector__menu--GridArea);
7386
- min-height: var(--pf-c-dual-list-selector__menu--MinHeight);
7387
- max-height: var(--pf-c-dual-list-selector__menu--MaxHeight);
7388
- overflow: auto;
7389
- border: var(--pf-c-dual-list-selector__menu--BorderWidth) solid var(--pf-c-dual-list-selector__menu--BorderColor);
7390
- }
7391
-
7392
- .pf-c-dual-list-selector__list {
7393
- --pf-c-dual-list-selector__item-toggle-icon--Rotate: 0;
7394
- display: flex;
7395
- flex-direction: column;
7396
- }
7397
-
7398
- .pf-c-dual-list-selector__list .pf-c-dual-list-selector__list {
7399
- --pf-c-dual-list-selector__item-toggle--MarginTop: 0;
7400
- --pf-c-dual-list-selector__item-toggle--MarginBottom: 0;
7401
- }
7402
-
7403
- .pf-c-dual-list-selector__list .pf-c-dual-list-selector__list .pf-c-dual-list-selector__item-toggle {
7404
- position: absolute;
7405
- top: 0;
7406
- left: var(--pf-c-dual-list-selector__list__list__item-toggle--Left);
7407
- transform: translateX(var(--pf-c-dual-list-selector__list__list__item-toggle--TranslateX));
7408
- }
7409
-
7410
- .pf-c-dual-list-selector__list.pf-m-drag-over {
7411
- overflow-anchor: none;
7412
- }
7413
-
7414
- .pf-c-dual-list-selector__list-item:focus {
7415
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor);
7416
- }
7417
-
7418
- .pf-c-dual-list-selector__list-item.pf-m-expandable {
7419
- --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-c-dual-list-selector__item--m-expandable--PaddingLeft);
7420
- }
7421
-
7422
- .pf-c-dual-list-selector__list-item.pf-m-expanded {
7423
- --pf-c-dual-list-selector__item-toggle-icon--Rotate: var(--pf-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate);
7424
- }
7425
-
7426
- .pf-c-dual-list-selector__list-item.pf-m-disabled {
7427
- --pf-c-dual-list-selector__item-text--Color: var(--pf-c-dual-list-selector__list-item--m-disabled__item-text--Color);
7428
- --pf-c-dual-list-selector__item-toggle-icon--Color: var(--pf-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color);
7429
- pointer-events: none;
7430
- }
7431
-
7432
- .pf-c-dual-list-selector__list-item-row {
7433
- display: flex;
7434
- font-size: var(--pf-c-dual-list-selector__list-item-row--FontSize);
7435
- background-color: var(--pf-c-dual-list-selector__list-item-row--BackgroundColor);
7436
- }
7437
-
7438
- .pf-c-dual-list-selector__list-item-row:hover {
7439
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--hover--BackgroundColor);
7440
- }
7441
-
7442
- .pf-c-dual-list-selector__list-item-row.pf-m-selected {
7443
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor);
7444
- }
7445
-
7446
- .pf-c-dual-list-selector__list-item-row.pf-m-selected .pf-c-dual-list-selector__item-text {
7447
- --pf-c-dual-list-selector__item-text--Color: var(--pf-c-dual-list-selector__list-item-row--m-selected__text--Color);
7448
- font-weight: var(--pf-c-dual-list-selector__list-item-row--m-selected__text--FontWeight);
7449
- }
7450
-
7451
- .pf-c-dual-list-selector__list-item-row.pf-m-check {
7452
- --pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: transparent;
7453
- }
7454
-
7455
- .pf-c-dual-list-selector__list-item-row.pf-m-ghost-row {
7456
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor);
7457
- opacity: var(--pf-c-dual-list-selector__list-item--m-ghost-row--Opacity);
7458
- }
7459
-
7460
- .pf-c-dual-list-selector__item,
7461
- .pf-c-dual-list-selector__main {
7462
- display: flex;
7463
- }
7464
-
7465
- .pf-c-dual-list-selector__item,
7466
- .pf-c-dual-list-selector__item-main {
7467
- flex-basis: 100%;
7468
- }
7469
-
7470
- .pf-c-dual-list-selector__draggable {
7471
- display: flex;
7472
- }
7473
-
7474
- .pf-c-dual-list-selector__draggable + .pf-c-dual-list-selector__item {
7475
- --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-c-dual-list-selector__draggable--item--PaddingLeft);
7476
- }
7477
-
7478
- .pf-c-dual-list-selector__draggable .pf-c-button {
7479
- --pf-c-button--FontSize: inherit;
7480
- cursor: grab;
7481
- }
7482
-
7483
- .pf-c-dual-list-selector__draggable .pf-c-button:active {
7484
- cursor: grabbing;
7485
- }
7486
-
7487
- .pf-c-dual-list-selector__item {
7488
- position: relative;
7489
- width: 100%;
7490
- padding: var(--pf-c-dual-list-selector__item--PaddingTop) var(--pf-c-dual-list-selector__item--PaddingRight) var(--pf-c-dual-list-selector__item--PaddingBottom) var(--pf-c-dual-list-selector__item--PaddingLeft);
7491
- cursor: pointer;
7492
- }
7493
-
7494
- .pf-c-dual-list-selector__item-count {
7495
- margin-left: var(--pf-c-dual-list-selector__item-count--Marginleft);
7496
- }
7497
-
7498
- .pf-c-dual-list-selector__item-count .pf-c-badge.pf-m-read {
7499
- --pf-c-badge--m-read--BackgroundColor: var(--pf-c-dual-list-selector__item--c-badge--m-read--BackgroundColor);
7500
- }
7501
-
7502
- .pf-c-dual-list-selector__item-text {
7503
- overflow: hidden;
7504
- text-overflow: ellipsis;
7505
- white-space: nowrap;
7506
- flex-grow: 1;
7507
- color: var(--pf-c-dual-list-selector__item-text--Color);
7508
- }
7509
-
7510
- .pf-c-dual-list-selector__controls {
7511
- grid-area: var(--pf-c-dual-list-selector__controls--GridArea);
7512
- align-self: center;
7513
- padding-right: var(--pf-c-dual-list-selector__controls--PaddingRight);
7514
- padding-left: var(--pf-c-dual-list-selector__controls--PaddingLeft);
7515
- }
7516
-
7517
- .pf-c-dual-list-selector__item-main {
7518
- display: flex;
7519
- min-width: 0;
7520
- }
7521
-
7522
- .pf-c-dual-list-selector__item-toggle {
7523
- padding: var(--pf-c-dual-list-selector__item-toggle--PaddingTop) var(--pf-c-dual-list-selector__item-toggle--PaddingRight) var(--pf-c-dual-list-selector__item-toggle--PaddingBottom) var(--pf-c-dual-list-selector__item-toggle--PaddingLeft);
7524
- margin-top: var(--pf-c-dual-list-selector__item-toggle--MarginTop);
7525
- margin-bottom: var(--pf-c-dual-list-selector__item-toggle--MarginBottom);
7526
- }
7527
-
7528
- .pf-c-dual-list-selector__item-check {
7529
- display: flex;
7530
- align-items: center;
7531
- margin-right: var(--pf-c-dual-list-selector__item-check--MarginRight);
7532
- }
7533
-
7534
- .pf-c-dual-list-selector__item-toggle-icon {
7535
- display: inline-block;
7536
- min-width: var(--pf-c-dual-list-selector__item-toggle-icon--MinWidth);
7537
- color: var(--pf-c-dual-list-selector__item-toggle-icon--Color, inherit);
7538
- text-align: center;
7539
- transition: var(--pf-c-dual-list-selector__item-toggle-icon--Transition);
7540
- transform: rotate(var(--pf-c-dual-list-selector__item-toggle-icon--Rotate));
7541
- }
7542
-
7543
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7544
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 1 + var(--pf-c-dual-list-selector__item--indent--base));
7545
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7546
- }
7547
-
7548
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7549
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 2 + var(--pf-c-dual-list-selector__item--indent--base));
7550
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7551
- }
7552
-
7553
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7554
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 3 + var(--pf-c-dual-list-selector__item--indent--base));
7555
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7556
- }
7557
-
7558
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7559
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 4 + var(--pf-c-dual-list-selector__item--indent--base));
7560
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7561
- }
7562
-
7563
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7564
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 5 + var(--pf-c-dual-list-selector__item--indent--base));
7565
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7566
- }
7567
-
7568
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7569
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 6 + var(--pf-c-dual-list-selector__item--indent--base));
7570
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7571
- }
7572
-
7573
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7574
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 7 + var(--pf-c-dual-list-selector__item--indent--base));
7575
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7576
- }
7577
-
7578
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7579
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 8 + var(--pf-c-dual-list-selector__item--indent--base));
7580
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7581
- }
7582
-
7583
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7584
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 9 + var(--pf-c-dual-list-selector__item--indent--base));
7585
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7586
- }
7587
-
7588
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7589
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 10 + var(--pf-c-dual-list-selector__item--indent--base));
7590
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7591
- }
7592
-
7593
7268
  .pf-c-dropdown {
7594
7269
  --pf-c-dropdown__toggle--PaddingTop: var(--pf-global--spacer--form-element);
7595
7270
  --pf-c-dropdown__toggle--PaddingRight: var(--pf-global--spacer--sm);
@@ -7925,413 +7600,738 @@ label.pf-c-check, .pf-c-check__label,
7925
7600
  border-bottom-right-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7926
7601
  }
7927
7602
 
7928
- .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):hover::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:hover::before {
7929
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--hover--before--BorderBottomColor);
7603
+ .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):hover::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:hover::before {
7604
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--hover--before--BorderBottomColor);
7605
+ }
7606
+
7607
+ .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):focus::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:focus::before {
7608
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--focus--before--BorderBottomColor);
7609
+ border-bottom-width: var(--pf-c-dropdown__toggle--focus--before--BorderBottomWidth);
7610
+ }
7611
+
7612
+ .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):active::before, .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary).pf-m-active::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:active::before {
7613
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--active--before--BorderBottomColor);
7614
+ border-bottom-width: var(--pf-c-dropdown__toggle--active--before--BorderBottomWidth);
7615
+ }
7616
+
7617
+ .pf-m-expanded > .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary)::before, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button::before {
7618
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomColor);
7619
+ border-bottom-width: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth);
7620
+ }
7621
+
7622
+ .pf-c-dropdown__toggle.pf-m-plain {
7623
+ --pf-c-dropdown__toggle-icon--Color: var(--pf-c-dropdown--m-plain__toggle-icon--Color);
7624
+ }
7625
+
7626
+ .pf-c-dropdown__toggle.pf-m-plain:not(.pf-m-text) {
7627
+ --pf-c-dropdown__toggle--PaddingRight: var(--pf-c-dropdown__toggle--m-plain--PaddingRight);
7628
+ --pf-c-dropdown__toggle--PaddingLeft: var(--pf-c-dropdown__toggle--m-plain--PaddingLeft);
7629
+ display: inline-block;
7630
+ color: var(--pf-c-dropdown__toggle--m-plain--Color);
7631
+ }
7632
+
7633
+ .pf-c-dropdown__toggle.pf-m-plain:not(.pf-m-text) > * {
7634
+ line-height: var(--pf-c-dropdown__toggle--m-plain--child--LineHeight);
7635
+ }
7636
+
7637
+ .pf-c-dropdown__toggle.pf-m-plain::before {
7638
+ border: 0;
7639
+ }
7640
+
7641
+ .pf-c-dropdown__toggle.pf-m-plain:hover, .pf-c-dropdown__toggle.pf-m-plain:focus, .pf-c-dropdown__toggle.pf-m-plain:active, .pf-c-dropdown__toggle.pf-m-plain.pf-m-active, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-plain {
7642
+ --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--hover--Color);
7643
+ --pf-c-dropdown--m-plain__toggle-icon--Color: var(--pf-c-dropdown--m-plain--hover__toggle-icon--Color);
7644
+ }
7645
+
7646
+ .pf-c-dropdown__toggle.pf-m-plain.pf-m-disabled, .pf-c-dropdown__toggle.pf-m-plain:disabled {
7647
+ --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--disabled--Color);
7648
+ }
7649
+
7650
+ .pf-c-dropdown__toggle.pf-m-primary {
7651
+ --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
7652
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--BackgroundColor);
7653
+ --pf-c-dropdown__toggle-button--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
7654
+ border-radius: var(--pf-c-dropdown__toggle--m-primary--BorderRadius);
7655
+ }
7656
+
7657
+ .pf-c-dropdown__toggle.pf-m-primary::before,
7658
+ .pf-c-dropdown__toggle.pf-m-primary .pf-c-dropdown__toggle-button::before {
7659
+ border: 0;
7660
+ }
7661
+
7662
+ .pf-c-dropdown__toggle.pf-m-primary:hover {
7663
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--hover--BackgroundColor);
7664
+ }
7665
+
7666
+ .pf-c-dropdown__toggle.pf-m-primary:focus {
7667
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--focus--BackgroundColor);
7668
+ }
7669
+
7670
+ .pf-c-dropdown__toggle.pf-m-primary:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-active {
7671
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--active--BackgroundColor);
7672
+ }
7673
+
7674
+ .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-primary {
7675
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown--m-expanded__toggle--m-primary--BackgroundColor);
7676
+ }
7677
+
7678
+ .pf-c-dropdown__toggle.pf-m-secondary {
7679
+ border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
7680
+ }
7681
+
7682
+ .pf-c-dropdown__toggle.pf-m-secondary:not(.pf-m-disabled):not([disabled]) {
7683
+ --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-secondary--Color);
7684
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-secondary--BackgroundColor);
7685
+ }
7686
+
7687
+ .pf-c-dropdown__toggle.pf-m-secondary:not(.pf-m-disabled):not([disabled])::before {
7688
+ border: var(--pf-c-dropdown__toggle--m-secondary--before--BorderWidth) solid var(--pf-c-dropdown__toggle--m-secondary--before--BorderColor);
7689
+ border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
7690
+ }
7691
+
7692
+ .pf-c-dropdown__toggle.pf-m-secondary:hover {
7693
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth);
7694
+ }
7695
+
7696
+ .pf-c-dropdown__toggle.pf-m-secondary:focus {
7697
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth);
7698
+ }
7699
+
7700
+ .pf-c-dropdown__toggle.pf-m-secondary:active, .pf-c-dropdown__toggle.pf-m-secondary.pf-m-active {
7701
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth);
7702
+ }
7703
+
7704
+ .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-secondary {
7705
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderWidth);
7706
+ --pf-c-dropdown__toggle--m-secondary--before--BorderColor: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderColor);
7707
+ }
7708
+
7709
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) {
7710
+ --pf-c-dropdown__toggle-button--Color: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--Color);
7711
+ }
7712
+
7713
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):hover {
7714
+ --pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--hover--before--BorderWidth);
7715
+ }
7716
+
7717
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):focus {
7718
+ --pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--focus--before--BorderWidth);
7719
+ }
7720
+
7721
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):active {
7722
+ --pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--active--before--BorderWidth);
7723
+ }
7724
+
7725
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *::before {
7726
+ border: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth) solid var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderColor);
7727
+ }
7728
+
7729
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:hover {
7730
+ --pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--hover--BorderWidth);
7731
+ }
7732
+
7733
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:focus {
7734
+ --pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--focus--BorderWidth);
7735
+ }
7736
+
7737
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:active {
7738
+ --pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--active--BorderWidth);
7739
+ }
7740
+
7741
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:first-child::before {
7742
+ border-top-left-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
7743
+ border-bottom-left-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
7744
+ }
7745
+
7746
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:last-child::before {
7747
+ border-top-right-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
7748
+ border-bottom-right-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
7749
+ }
7750
+
7751
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:not(:first-child)::before {
7752
+ border-left: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth--base) solid var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderColor--base);
7753
+ }
7754
+
7755
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:not(:last-child)::before {
7756
+ border-right: 0;
7757
+ }
7758
+
7759
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled).pf-m-action::before {
7760
+ border: 0;
7761
+ }
7762
+
7763
+ .pf-c-dropdown__toggle > .pf-c-badge {
7764
+ --pf-c-dropdown__toggle-icon--MarginLeft: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginLeft);
7765
+ --pf-c-dropdown__toggle-icon--MarginRight: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginRight);
7766
+ }
7767
+
7768
+ .pf-c-dropdown__toggle .pf-c-dropdown__toggle-text {
7769
+ overflow: hidden;
7770
+ text-overflow: ellipsis;
7771
+ white-space: nowrap;
7772
+ }
7773
+
7774
+ .pf-c-dropdown__toggle-text {
7775
+ flex: 0 1 auto;
7776
+ }
7777
+
7778
+ .pf-c-dropdown__toggle-icon {
7779
+ margin-right: var(--pf-c-dropdown__toggle-icon--MarginRight);
7780
+ margin-left: var(--pf-c-dropdown__toggle-icon--MarginLeft);
7781
+ line-height: var(--pf-c-dropdown__toggle-icon--LineHeight);
7782
+ color: var(--pf-c-dropdown__toggle-icon--Color, inherit);
7783
+ }
7784
+
7785
+ .pf-c-dropdown.pf-m-top.pf-m-expanded .pf-c-dropdown__toggle-icon {
7786
+ transform: rotate(var(--pf-c-dropdown--m-top--m-expanded__toggle-icon--Rotate));
7787
+ }
7788
+
7789
+ .pf-c-dropdown__toggle-image {
7790
+ display: inline-flex;
7791
+ flex-shrink: 0;
7792
+ align-self: center;
7793
+ margin-top: var(--pf-c-dropdown__toggle-image--MarginTop);
7794
+ margin-right: var(--pf-c-dropdown__toggle-image--MarginRight);
7795
+ margin-bottom: var(--pf-c-dropdown__toggle-image--MarginBottom);
7796
+ line-height: 1;
7797
+ }
7798
+
7799
+ .pf-c-dropdown__toggle-image:last-child {
7800
+ --pf-c-dropdown__toggle-image--MarginRight: 0;
7801
+ }
7802
+
7803
+ .pf-c-dropdown__menu {
7804
+ position: absolute;
7805
+ top: var(--pf-c-dropdown__menu--Top);
7806
+ z-index: var(--pf-c-dropdown__menu--ZIndex);
7807
+ padding-top: var(--pf-c-dropdown__menu--PaddingTop);
7808
+ padding-bottom: var(--pf-c-dropdown__menu--PaddingBottom);
7809
+ background: var(--pf-c-dropdown__menu--BackgroundColor);
7810
+ background-clip: padding-box;
7811
+ box-shadow: var(--pf-c-dropdown__menu--BoxShadow);
7812
+ }
7813
+
7814
+ .pf-c-dropdown__menu.pf-m-static {
7815
+ position: static;
7816
+ top: auto;
7817
+ z-index: auto;
7818
+ min-width: min-content;
7819
+ }
7820
+
7821
+ .pf-c-dropdown .pf-c-menu,
7822
+ .pf-c-dropdown__menu {
7823
+ min-width: 100%;
7824
+ }
7825
+
7826
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right,
7827
+ .pf-c-dropdown__menu.pf-m-align-right {
7828
+ right: 0;
7829
+ }
7830
+
7831
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left,
7832
+ .pf-c-dropdown__menu.pf-m-align-left {
7833
+ right: auto;
7834
+ }
7835
+
7836
+ @media (min-width: 576px) {
7837
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-sm,
7838
+ .pf-c-dropdown__menu.pf-m-align-right-on-sm {
7839
+ right: 0;
7840
+ }
7841
+
7842
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-sm,
7843
+ .pf-c-dropdown__menu.pf-m-align-left-on-sm {
7844
+ right: auto;
7845
+ }
7846
+ }
7847
+ @media (min-width: 768px) {
7848
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-md,
7849
+ .pf-c-dropdown__menu.pf-m-align-right-on-md {
7850
+ right: 0;
7851
+ }
7852
+
7853
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-md,
7854
+ .pf-c-dropdown__menu.pf-m-align-left-on-md {
7855
+ right: auto;
7856
+ }
7930
7857
  }
7858
+ @media (min-width: 992px) {
7859
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-lg,
7860
+ .pf-c-dropdown__menu.pf-m-align-right-on-lg {
7861
+ right: 0;
7862
+ }
7931
7863
 
7932
- .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):focus::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:focus::before {
7933
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--focus--before--BorderBottomColor);
7934
- border-bottom-width: var(--pf-c-dropdown__toggle--focus--before--BorderBottomWidth);
7864
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-lg,
7865
+ .pf-c-dropdown__menu.pf-m-align-left-on-lg {
7866
+ right: auto;
7867
+ }
7935
7868
  }
7869
+ @media (min-width: 1200px) {
7870
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-xl,
7871
+ .pf-c-dropdown__menu.pf-m-align-right-on-xl {
7872
+ right: 0;
7873
+ }
7936
7874
 
7937
- .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):active::before, .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary).pf-m-active::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:active::before {
7938
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--active--before--BorderBottomColor);
7939
- border-bottom-width: var(--pf-c-dropdown__toggle--active--before--BorderBottomWidth);
7875
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-xl,
7876
+ .pf-c-dropdown__menu.pf-m-align-left-on-xl {
7877
+ right: auto;
7878
+ }
7940
7879
  }
7880
+ @media (min-width: 1450px) {
7881
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-2xl,
7882
+ .pf-c-dropdown__menu.pf-m-align-right-on-2xl {
7883
+ right: 0;
7884
+ }
7941
7885
 
7942
- .pf-m-expanded > .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary)::before, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button::before {
7943
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomColor);
7944
- border-bottom-width: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth);
7886
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-2xl,
7887
+ .pf-c-dropdown__menu.pf-m-align-left-on-2xl {
7888
+ right: auto;
7889
+ }
7945
7890
  }
7946
-
7947
- .pf-c-dropdown__toggle.pf-m-plain {
7948
- --pf-c-dropdown__toggle-icon--Color: var(--pf-c-dropdown--m-plain__toggle-icon--Color);
7891
+ .pf-c-dropdown.pf-m-top .pf-c-dropdown__menu {
7892
+ --pf-c-dropdown__menu--Top: var(--pf-c-dropdown--m-top__menu--Top);
7893
+ transform: translateY(var(--pf-c-dropdown--m-top__menu--TranslateY));
7949
7894
  }
7950
7895
 
7951
- .pf-c-dropdown__toggle.pf-m-plain:not(.pf-m-text) {
7952
- --pf-c-dropdown__toggle--PaddingRight: var(--pf-c-dropdown__toggle--m-plain--PaddingRight);
7953
- --pf-c-dropdown__toggle--PaddingLeft: var(--pf-c-dropdown__toggle--m-plain--PaddingLeft);
7954
- display: inline-block;
7955
- color: var(--pf-c-dropdown__toggle--m-plain--Color);
7896
+ .pf-c-dropdown.pf-m-top > .pf-c-menu {
7897
+ --pf-c-dropdown--c-menu--Top: var(--pf-c-dropdown--m-top--c-menu--Top);
7898
+ transform: translateY(var(--pf-c-dropdown--m-top--c-menu--TranslateY));
7956
7899
  }
7957
7900
 
7958
- .pf-c-dropdown__toggle.pf-m-plain:not(.pf-m-text) > * {
7959
- line-height: var(--pf-c-dropdown__toggle--m-plain--child--LineHeight);
7901
+ .pf-c-dropdown__menu-item {
7902
+ display: block;
7903
+ width: 100%;
7904
+ padding: var(--pf-c-dropdown__menu-item--PaddingTop) var(--pf-c-dropdown__menu-item--PaddingRight) var(--pf-c-dropdown__menu-item--PaddingBottom) var(--pf-c-dropdown__menu-item--PaddingLeft);
7905
+ font-size: var(--pf-c-dropdown__menu-item--FontSize);
7906
+ font-weight: var(--pf-c-dropdown__menu-item--FontWeight);
7907
+ line-height: var(--pf-c-dropdown__menu-item--LineHeight);
7908
+ color: var(--pf-c-dropdown__menu-item--Color);
7909
+ text-align: left;
7910
+ white-space: nowrap;
7911
+ background-color: var(--pf-c-dropdown__menu-item--BackgroundColor);
7912
+ border: none;
7960
7913
  }
7961
7914
 
7962
- .pf-c-dropdown__toggle.pf-m-plain::before {
7963
- border: 0;
7915
+ .pf-c-dropdown__menu-item:hover, .pf-c-dropdown__menu-item:focus {
7916
+ --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--hover--Color);
7917
+ --pf-c-dropdown__menu-item--BackgroundColor: var(--pf-c-dropdown__menu-item--hover--BackgroundColor);
7918
+ text-decoration: none;
7964
7919
  }
7965
7920
 
7966
- .pf-c-dropdown__toggle.pf-m-plain:hover, .pf-c-dropdown__toggle.pf-m-plain:focus, .pf-c-dropdown__toggle.pf-m-plain:active, .pf-c-dropdown__toggle.pf-m-plain.pf-m-active, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-plain {
7967
- --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--hover--Color);
7968
- --pf-c-dropdown--m-plain__toggle-icon--Color: var(--pf-c-dropdown--m-plain--hover__toggle-icon--Color);
7921
+ .pf-c-dropdown__menu-item:disabled, .pf-c-dropdown__menu-item.pf-m-disabled, .pf-c-dropdown__menu-item.pf-m-aria-disabled {
7922
+ --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--disabled--Color);
7923
+ --pf-c-dropdown__menu-item--BackgroundColor: var(--pf-c-dropdown__menu-item--disabled--BackgroundColor);
7969
7924
  }
7970
7925
 
7971
- .pf-c-dropdown__toggle.pf-m-plain.pf-m-disabled, .pf-c-dropdown__toggle.pf-m-plain:disabled {
7972
- --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--disabled--Color);
7926
+ .pf-c-dropdown__menu-item:disabled, .pf-c-dropdown__menu-item.pf-m-disabled {
7927
+ pointer-events: none;
7973
7928
  }
7974
7929
 
7975
- .pf-c-dropdown__toggle.pf-m-primary {
7976
- --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
7977
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--BackgroundColor);
7978
- --pf-c-dropdown__toggle-button--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
7979
- border-radius: var(--pf-c-dropdown__toggle--m-primary--BorderRadius);
7930
+ .pf-c-dropdown__menu-item.pf-m-aria-disabled {
7931
+ cursor: default;
7980
7932
  }
7981
7933
 
7982
- .pf-c-dropdown__toggle.pf-m-primary::before,
7983
- .pf-c-dropdown__toggle.pf-m-primary .pf-c-dropdown__toggle-button::before {
7984
- border: 0;
7934
+ .pf-c-dropdown__menu-item.pf-m-icon {
7935
+ display: flex;
7936
+ align-items: center;
7985
7937
  }
7986
7938
 
7987
- .pf-c-dropdown__toggle.pf-m-primary:hover {
7988
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--hover--BackgroundColor);
7939
+ .pf-c-dropdown__menu-item.pf-m-icon.pf-m-description {
7940
+ flex-direction: column;
7941
+ align-items: start;
7989
7942
  }
7990
7943
 
7991
- .pf-c-dropdown__toggle.pf-m-primary:focus {
7992
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--focus--BackgroundColor);
7944
+ .pf-c-dropdown__menu-item.pf-m-icon .pf-c-dropdown__menu-item-main {
7945
+ display: flex;
7946
+ align-items: center;
7993
7947
  }
7994
7948
 
7995
- .pf-c-dropdown__toggle.pf-m-primary:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-active {
7996
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--active--BackgroundColor);
7949
+ .pf-c-dropdown__menu-item.pf-m-text {
7950
+ --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--m-text--Color);
7997
7951
  }
7998
7952
 
7999
- .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-primary {
8000
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown--m-expanded__toggle--m-primary--BackgroundColor);
7953
+ .pf-c-dropdown__menu-item.pf-m-text:hover, .pf-c-dropdown__menu-item.pf-m-text:focus {
7954
+ --pf-c-dropdown__menu-item--BackgroundColor: transparent;
8001
7955
  }
8002
7956
 
8003
- .pf-c-dropdown__toggle.pf-m-secondary {
8004
- border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
7957
+ .pf-c-dropdown__menu-item-icon {
7958
+ display: inline-flex;
7959
+ align-items: center;
7960
+ justify-content: center;
7961
+ width: var(--pf-c-dropdown__menu-item-icon--Width);
7962
+ height: var(--pf-c-dropdown__menu-item-icon--Height);
7963
+ margin-right: var(--pf-c-dropdown__menu-item-icon--MarginRight);
8005
7964
  }
8006
7965
 
8007
- .pf-c-dropdown__toggle.pf-m-secondary:not(.pf-m-disabled):not([disabled]) {
8008
- --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-secondary--Color);
8009
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-secondary--BackgroundColor);
7966
+ .pf-c-dropdown__menu-item-icon > * {
7967
+ max-width: 100%;
7968
+ max-height: 100%;
8010
7969
  }
8011
7970
 
8012
- .pf-c-dropdown__toggle.pf-m-secondary:not(.pf-m-disabled):not([disabled])::before {
8013
- border: var(--pf-c-dropdown__toggle--m-secondary--before--BorderWidth) solid var(--pf-c-dropdown__toggle--m-secondary--before--BorderColor);
8014
- border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
7971
+ .pf-c-dropdown__menu-item-description {
7972
+ font-size: var(--pf-c-dropdown__menu-item-description--FontSize);
7973
+ color: var(--pf-c-dropdown__menu-item-description--Color);
8015
7974
  }
8016
7975
 
8017
- .pf-c-dropdown__toggle.pf-m-secondary:hover {
8018
- --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth);
7976
+ .pf-c-dropdown__group + .pf-c-dropdown__group {
7977
+ padding-top: var(--pf-c-dropdown__group--group--PaddingTop);
8019
7978
  }
8020
7979
 
8021
- .pf-c-dropdown__toggle.pf-m-secondary:focus {
8022
- --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth);
7980
+ .pf-c-dropdown__group-title {
7981
+ padding-top: var(--pf-c-dropdown__group-title--PaddingTop);
7982
+ padding-right: var(--pf-c-dropdown__group-title--PaddingRight);
7983
+ padding-bottom: var(--pf-c-dropdown__group-title--PaddingBottom);
7984
+ padding-left: var(--pf-c-dropdown__group-title--PaddingLeft);
7985
+ font-size: var(--pf-c-dropdown__group-title--FontSize);
7986
+ font-weight: var(--pf-c-dropdown__group-title--FontWeight);
7987
+ color: var(--pf-c-dropdown__group-title--Color);
8023
7988
  }
8024
7989
 
8025
- .pf-c-dropdown__toggle.pf-m-secondary:active, .pf-c-dropdown__toggle.pf-m-secondary.pf-m-active {
8026
- --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth);
7990
+ :where(.pf-theme-dark) .pf-c-dropdown {
7991
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-global--BackgroundColor--400);
7992
+ --pf-c-dropdown__toggle--before--BorderTopColor: transparent;
7993
+ --pf-c-dropdown__toggle--before--BorderRightColor: transparent;
7994
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-global--BorderColor--400);
7995
+ --pf-c-dropdown__toggle--before--BorderLeftColor: transparent;
7996
+ --pf-c-dropdown__toggle--disabled--BackgroundColor: var(--pf-global--palette--black-500);
7997
+ --pf-c-dropdown__toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--300);
7998
+ --pf-c-dropdown__menu--BackgroundColor: var(--pf-global--BackgroundColor--300);
7999
+ --pf-c-dropdown__menu--Top: 100%;
8000
+ --pf-c-dropdown--m-top__menu--TranslateY: -100%;
8001
+ --pf-c-dropdown__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
8027
8002
  }
8028
8003
 
8029
- .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-secondary {
8030
- --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderWidth);
8031
- --pf-c-dropdown__toggle--m-secondary--before--BorderColor: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderColor);
8004
+ :where(.pf-theme-dark) .pf-c-dropdown__toggle:not(.pf-m-plain):disabled, :where(.pf-theme-dark) .pf-c-dropdown__toggle:not(.pf-m-plain).pf-m-disabled {
8005
+ color: var(--pf-global--palette--black-100);
8032
8006
  }
8033
8007
 
8034
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) {
8035
- --pf-c-dropdown__toggle-button--Color: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--Color);
8008
+ :where(.pf-theme-dark) .pf-c-dropdown__toggle.pf-m-plain {
8009
+ background: transparent;
8036
8010
  }
8037
8011
 
8038
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):hover {
8039
- --pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--hover--before--BorderWidth);
8012
+ .pf-c-dual-list-selector {
8013
+ --pf-c-dual-list-selector__header--GridArea: pane-header;
8014
+ --pf-c-dual-list-selector__tools--GridArea: pane-tools;
8015
+ --pf-c-dual-list-selector__status--GridArea: pane-status;
8016
+ --pf-c-dual-list-selector__menu--GridArea: pane-menu;
8017
+ --pf-c-dual-list-selector__controls--GridArea: controls;
8018
+ --pf-c-dual-list-selector--m-chosen__header--GridArea: pane-header-c;
8019
+ --pf-c-dual-list-selector--m-chosen__tools--GridArea: pane-tools-c;
8020
+ --pf-c-dual-list-selector--m-chosen__status--GridArea: pane-status-c;
8021
+ --pf-c-dual-list-selector--m-chosen__menu--GridArea: pane-menu-c;
8022
+ --pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min: 12.5rem;
8023
+ --pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max: 28.125rem;
8024
+ --pf-c-dual-list-selector__header--MarginBottom: var(--pf-global--spacer--sm);
8025
+ --pf-c-dual-list-selector__title-text--FontWeight: var(--pf-global--FontWeight--bold);
8026
+ --pf-c-dual-list-selector__tools--MarginBottom: var(--pf-global--spacer--md);
8027
+ --pf-c-dual-list-selector__tools-filter--tools-actions--MarginLeft: var(--pf-global--spacer--sm);
8028
+ --pf-c-dual-list-selector__menu--BorderWidth: var(--pf-global--BorderWidth--sm);
8029
+ --pf-c-dual-list-selector__menu--BorderColor: var(--pf-global--BorderColor--100);
8030
+ --pf-c-dual-list-selector__menu--MinHeight: 12.5rem;
8031
+ --pf-c-dual-list-selector__menu--MaxHeight: 20rem;
8032
+ --pf-c-dual-list-selector__list-item-row--FontSize: var(--pf-global--FontSize--sm);
8033
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: transparent;
8034
+ --pf-c-dual-list-selector__list-item-row--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
8035
+ --pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
8036
+ --pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
8037
+ --pf-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor: var(--pf-global--BackgroundColor--100);
8038
+ --pf-c-dual-list-selector__list-item--m-ghost-row--Opacity: .4;
8039
+ --pf-c-dual-list-selector__item--PaddingTop: var(--pf-global--spacer--sm);
8040
+ --pf-c-dual-list-selector__item--PaddingRight: var(--pf-global--spacer--md);
8041
+ --pf-c-dual-list-selector__item--PaddingBottom: var(--pf-global--spacer--sm);
8042
+ --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-global--spacer--md);
8043
+ --pf-c-dual-list-selector__item--m-expandable--PaddingLeft: 0;
8044
+ --pf-c-dual-list-selector__item--indent--base: calc(var(--pf-global--spacer--md) + var(--pf-global--spacer--sm) + var(--pf-c-dual-list-selector__list-item-row--FontSize));
8045
+ --pf-c-dual-list-selector__item--nested-indent--base: calc(var(--pf-c-dual-list-selector__item--indent--base) - var(--pf-global--spacer--md));
8046
+ --pf-c-dual-list-selector__draggable--item--PaddingLeft: var(--pf-global--spacer--xs);
8047
+ --pf-c-dual-list-selector__item-text--Color: var(--pf-global--Color--100);
8048
+ --pf-c-dual-list-selector__list-item-row--m-selected__text--Color: var(--pf-global--active-color--100);
8049
+ --pf-c-dual-list-selector__list-item-row--m-selected__text--FontWeight: var(--pf-global--FontWeight--bold);
8050
+ --pf-c-dual-list-selector__list-item--m-disabled__item-text--Color: var(--pf-global--disabled-color--100);
8051
+ --pf-c-dual-list-selector__status--MarginBottom: var(--pf-global--spacer--sm);
8052
+ --pf-c-dual-list-selector__status-text--FontSize: var(--pf-global--FontSize--sm);
8053
+ --pf-c-dual-list-selector__status-text--Color: var(--pf-global--Color--200);
8054
+ --pf-c-dual-list-selector__controls--PaddingRight: var(--pf-global--spacer--md);
8055
+ --pf-c-dual-list-selector__controls--PaddingLeft: var(--pf-global--spacer--md);
8056
+ --pf-c-dual-list-selector__item-toggle--PaddingTop: var(--pf-global--spacer--sm);
8057
+ --pf-c-dual-list-selector__item-toggle--PaddingRight: var(--pf-global--spacer--sm);
8058
+ --pf-c-dual-list-selector__item-toggle--PaddingBottom: var(--pf-global--spacer--sm);
8059
+ --pf-c-dual-list-selector__item-toggle--PaddingLeft: var(--pf-global--spacer--md);
8060
+ --pf-c-dual-list-selector__item-toggle--MarginTop: calc(var(--pf-global--spacer--sm) * -1);
8061
+ --pf-c-dual-list-selector__item-toggle--MarginBottom: calc(var(--pf-global--spacer--sm) * -1);
8062
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: 0;
8063
+ --pf-c-dual-list-selector__list__list__item-toggle--TranslateX: -100%;
8064
+ --pf-c-dual-list-selector__item-check--MarginRight: var(--pf-global--spacer--sm);
8065
+ --pf-c-dual-list-selector__item-count--Marginleft: var(--pf-global--spacer--sm);
8066
+ --pf-c-dual-list-selector__item--c-badge--m-read--BackgroundColor: var(--pf-global--disabled-color--200);
8067
+ --pf-c-dual-list-selector__item-toggle-icon--Rotate: 0;
8068
+ --pf-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate: 90deg;
8069
+ --pf-c-dual-list-selector__item-toggle-icon--Transition: var(--pf-global--Transition);
8070
+ --pf-c-dual-list-selector__item-toggle-icon--MinWidth: var(--pf-c-dual-list-selector__list-item-row--FontSize);
8071
+ --pf-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color: var(--pf-global--disabled-color--200);
8072
+ display: grid;
8073
+ grid-template-areas: "pane-header . pane-header-c" "pane-tools . pane-tools-c" "pane-status . pane-status-c" "pane-menu controls pane-menu-c";
8074
+ grid-template-columns: minmax(var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min), var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max)) min-content minmax(var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min), var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max));
8075
+ grid-template-rows: repeat(3, auto) auto;
8040
8076
  }
8041
8077
 
8042
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):focus {
8043
- --pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--focus--before--BorderWidth);
8078
+ .pf-c-dual-list-selector__pane {
8079
+ display: contents;
8044
8080
  }
8045
8081
 
8046
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):active {
8047
- --pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--active--before--BorderWidth);
8082
+ .pf-c-dual-list-selector__pane.pf-m-chosen {
8083
+ --pf-c-dual-list-selector__header--GridArea: var(--pf-c-dual-list-selector--m-chosen__header--GridArea);
8084
+ --pf-c-dual-list-selector__tools--GridArea: var(--pf-c-dual-list-selector--m-chosen__tools--GridArea);
8085
+ --pf-c-dual-list-selector__status--GridArea: var(--pf-c-dual-list-selector--m-chosen__status--GridArea);
8086
+ --pf-c-dual-list-selector__menu--GridArea: var(--pf-c-dual-list-selector--m-chosen__menu--GridArea);
8048
8087
  }
8049
8088
 
8050
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *::before {
8051
- border: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth) solid var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderColor);
8089
+ .pf-c-dual-list-selector__header {
8090
+ grid-area: var(--pf-c-dual-list-selector__header--GridArea);
8091
+ margin-bottom: var(--pf-c-dual-list-selector__header--MarginBottom);
8052
8092
  }
8053
8093
 
8054
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:hover {
8055
- --pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--hover--BorderWidth);
8094
+ .pf-c-dual-list-selector__title-text {
8095
+ font-weight: var(--pf-c-dual-list-selector__title-text--FontWeight);
8056
8096
  }
8057
8097
 
8058
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:focus {
8059
- --pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--focus--BorderWidth);
8098
+ .pf-c-dual-list-selector__tools {
8099
+ display: flex;
8100
+ grid-area: var(--pf-c-dual-list-selector__tools--GridArea);
8101
+ margin-bottom: var(--pf-c-dual-list-selector__tools--MarginBottom);
8060
8102
  }
8061
8103
 
8062
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:active {
8063
- --pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--active--BorderWidth);
8104
+ .pf-c-dual-list-selector__tools-filter {
8105
+ flex-grow: 1;
8064
8106
  }
8065
8107
 
8066
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:first-child::before {
8067
- border-top-left-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
8068
- border-bottom-left-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
8108
+ .pf-c-dual-list-selector__tools-actions {
8109
+ display: flex;
8069
8110
  }
8070
8111
 
8071
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:last-child::before {
8072
- border-top-right-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
8073
- border-bottom-right-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
8112
+ .pf-c-dual-list-selector__tools-filter ~ .pf-c-dual-list-selector__tools-actions {
8113
+ margin-left: var(--pf-c-dual-list-selector__tools-filter--tools-actions--MarginLeft);
8074
8114
  }
8075
8115
 
8076
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:not(:first-child)::before {
8077
- border-left: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth--base) solid var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderColor--base);
8116
+ .pf-c-dual-list-selector__status {
8117
+ display: flex;
8118
+ grid-area: var(--pf-c-dual-list-selector__status--GridArea);
8119
+ margin-bottom: var(--pf-c-dual-list-selector__status--MarginBottom);
8078
8120
  }
8079
8121
 
8080
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:not(:last-child)::before {
8081
- border-right: 0;
8122
+ .pf-c-dual-list-selector__status-text {
8123
+ flex-grow: 1;
8124
+ font-size: var(--pf-c-dual-list-selector__status-text--FontSize);
8125
+ color: var(--pf-c-dual-list-selector__status-text--Color);
8082
8126
  }
8083
8127
 
8084
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled).pf-m-action::before {
8085
- border: 0;
8128
+ .pf-c-dual-list-selector__menu {
8129
+ grid-area: var(--pf-c-dual-list-selector__menu--GridArea);
8130
+ min-height: var(--pf-c-dual-list-selector__menu--MinHeight);
8131
+ max-height: var(--pf-c-dual-list-selector__menu--MaxHeight);
8132
+ overflow: auto;
8133
+ border: var(--pf-c-dual-list-selector__menu--BorderWidth) solid var(--pf-c-dual-list-selector__menu--BorderColor);
8086
8134
  }
8087
8135
 
8088
- .pf-c-dropdown__toggle > .pf-c-badge {
8089
- --pf-c-dropdown__toggle-icon--MarginLeft: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginLeft);
8090
- --pf-c-dropdown__toggle-icon--MarginRight: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginRight);
8136
+ .pf-c-dual-list-selector__list {
8137
+ --pf-c-dual-list-selector__item-toggle-icon--Rotate: 0;
8138
+ display: flex;
8139
+ flex-direction: column;
8091
8140
  }
8092
8141
 
8093
- .pf-c-dropdown__toggle .pf-c-dropdown__toggle-text {
8094
- overflow: hidden;
8095
- text-overflow: ellipsis;
8096
- white-space: nowrap;
8142
+ .pf-c-dual-list-selector__list .pf-c-dual-list-selector__list {
8143
+ --pf-c-dual-list-selector__item-toggle--MarginTop: 0;
8144
+ --pf-c-dual-list-selector__item-toggle--MarginBottom: 0;
8097
8145
  }
8098
8146
 
8099
- .pf-c-dropdown__toggle-text {
8100
- flex: 0 1 auto;
8147
+ .pf-c-dual-list-selector__list .pf-c-dual-list-selector__list .pf-c-dual-list-selector__item-toggle {
8148
+ position: absolute;
8149
+ top: 0;
8150
+ left: var(--pf-c-dual-list-selector__list__list__item-toggle--Left);
8151
+ transform: translateX(var(--pf-c-dual-list-selector__list__list__item-toggle--TranslateX));
8101
8152
  }
8102
8153
 
8103
- .pf-c-dropdown__toggle-icon {
8104
- margin-right: var(--pf-c-dropdown__toggle-icon--MarginRight);
8105
- margin-left: var(--pf-c-dropdown__toggle-icon--MarginLeft);
8106
- line-height: var(--pf-c-dropdown__toggle-icon--LineHeight);
8107
- color: var(--pf-c-dropdown__toggle-icon--Color, inherit);
8154
+ .pf-c-dual-list-selector__list.pf-m-drag-over {
8155
+ overflow-anchor: none;
8108
8156
  }
8109
8157
 
8110
- .pf-c-dropdown.pf-m-top.pf-m-expanded .pf-c-dropdown__toggle-icon {
8111
- transform: rotate(var(--pf-c-dropdown--m-top--m-expanded__toggle-icon--Rotate));
8158
+ .pf-c-dual-list-selector__list-item:focus {
8159
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor);
8112
8160
  }
8113
8161
 
8114
- .pf-c-dropdown__toggle-image {
8115
- display: inline-flex;
8116
- flex-shrink: 0;
8117
- align-self: center;
8118
- margin-top: var(--pf-c-dropdown__toggle-image--MarginTop);
8119
- margin-right: var(--pf-c-dropdown__toggle-image--MarginRight);
8120
- margin-bottom: var(--pf-c-dropdown__toggle-image--MarginBottom);
8121
- line-height: 1;
8162
+ .pf-c-dual-list-selector__list-item.pf-m-expandable {
8163
+ --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-c-dual-list-selector__item--m-expandable--PaddingLeft);
8122
8164
  }
8123
8165
 
8124
- .pf-c-dropdown__toggle-image:last-child {
8125
- --pf-c-dropdown__toggle-image--MarginRight: 0;
8166
+ .pf-c-dual-list-selector__list-item.pf-m-expanded {
8167
+ --pf-c-dual-list-selector__item-toggle-icon--Rotate: var(--pf-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate);
8126
8168
  }
8127
8169
 
8128
- .pf-c-dropdown__menu {
8129
- position: absolute;
8130
- top: var(--pf-c-dropdown__menu--Top);
8131
- z-index: var(--pf-c-dropdown__menu--ZIndex);
8132
- padding-top: var(--pf-c-dropdown__menu--PaddingTop);
8133
- padding-bottom: var(--pf-c-dropdown__menu--PaddingBottom);
8134
- background: var(--pf-c-dropdown__menu--BackgroundColor);
8135
- background-clip: padding-box;
8136
- box-shadow: var(--pf-c-dropdown__menu--BoxShadow);
8170
+ .pf-c-dual-list-selector__list-item.pf-m-disabled {
8171
+ --pf-c-dual-list-selector__item-text--Color: var(--pf-c-dual-list-selector__list-item--m-disabled__item-text--Color);
8172
+ --pf-c-dual-list-selector__item-toggle-icon--Color: var(--pf-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color);
8173
+ pointer-events: none;
8137
8174
  }
8138
8175
 
8139
- .pf-c-dropdown__menu.pf-m-static {
8140
- position: static;
8141
- top: auto;
8142
- z-index: auto;
8143
- min-width: min-content;
8176
+ .pf-c-dual-list-selector__list-item-row {
8177
+ display: flex;
8178
+ font-size: var(--pf-c-dual-list-selector__list-item-row--FontSize);
8179
+ background-color: var(--pf-c-dual-list-selector__list-item-row--BackgroundColor);
8144
8180
  }
8145
8181
 
8146
- .pf-c-dropdown .pf-c-menu,
8147
- .pf-c-dropdown__menu {
8148
- min-width: 100%;
8182
+ .pf-c-dual-list-selector__list-item-row:hover {
8183
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--hover--BackgroundColor);
8149
8184
  }
8150
8185
 
8151
- .pf-c-dropdown .pf-c-menu.pf-m-align-right,
8152
- .pf-c-dropdown__menu.pf-m-align-right {
8153
- right: 0;
8186
+ .pf-c-dual-list-selector__list-item-row.pf-m-selected {
8187
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor);
8154
8188
  }
8155
8189
 
8156
- .pf-c-dropdown .pf-c-menu.pf-m-align-left,
8157
- .pf-c-dropdown__menu.pf-m-align-left {
8158
- right: auto;
8190
+ .pf-c-dual-list-selector__list-item-row.pf-m-selected .pf-c-dual-list-selector__item-text {
8191
+ --pf-c-dual-list-selector__item-text--Color: var(--pf-c-dual-list-selector__list-item-row--m-selected__text--Color);
8192
+ font-weight: var(--pf-c-dual-list-selector__list-item-row--m-selected__text--FontWeight);
8159
8193
  }
8160
8194
 
8161
- @media (min-width: 576px) {
8162
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-sm,
8163
- .pf-c-dropdown__menu.pf-m-align-right-on-sm {
8164
- right: 0;
8165
- }
8195
+ .pf-c-dual-list-selector__list-item-row.pf-m-check {
8196
+ --pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: transparent;
8197
+ }
8166
8198
 
8167
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-sm,
8168
- .pf-c-dropdown__menu.pf-m-align-left-on-sm {
8169
- right: auto;
8170
- }
8199
+ .pf-c-dual-list-selector__list-item-row.pf-m-ghost-row {
8200
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor);
8201
+ opacity: var(--pf-c-dual-list-selector__list-item--m-ghost-row--Opacity);
8171
8202
  }
8172
- @media (min-width: 768px) {
8173
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-md,
8174
- .pf-c-dropdown__menu.pf-m-align-right-on-md {
8175
- right: 0;
8176
- }
8177
8203
 
8178
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-md,
8179
- .pf-c-dropdown__menu.pf-m-align-left-on-md {
8180
- right: auto;
8181
- }
8204
+ .pf-c-dual-list-selector__item,
8205
+ .pf-c-dual-list-selector__main {
8206
+ display: flex;
8182
8207
  }
8183
- @media (min-width: 992px) {
8184
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-lg,
8185
- .pf-c-dropdown__menu.pf-m-align-right-on-lg {
8186
- right: 0;
8187
- }
8188
8208
 
8189
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-lg,
8190
- .pf-c-dropdown__menu.pf-m-align-left-on-lg {
8191
- right: auto;
8192
- }
8209
+ .pf-c-dual-list-selector__item,
8210
+ .pf-c-dual-list-selector__item-main {
8211
+ flex-basis: 100%;
8193
8212
  }
8194
- @media (min-width: 1200px) {
8195
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-xl,
8196
- .pf-c-dropdown__menu.pf-m-align-right-on-xl {
8197
- right: 0;
8198
- }
8199
8213
 
8200
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-xl,
8201
- .pf-c-dropdown__menu.pf-m-align-left-on-xl {
8202
- right: auto;
8203
- }
8214
+ .pf-c-dual-list-selector__draggable {
8215
+ display: flex;
8204
8216
  }
8205
- @media (min-width: 1450px) {
8206
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-2xl,
8207
- .pf-c-dropdown__menu.pf-m-align-right-on-2xl {
8208
- right: 0;
8209
- }
8210
8217
 
8211
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-2xl,
8212
- .pf-c-dropdown__menu.pf-m-align-left-on-2xl {
8213
- right: auto;
8214
- }
8218
+ .pf-c-dual-list-selector__draggable + .pf-c-dual-list-selector__item {
8219
+ --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-c-dual-list-selector__draggable--item--PaddingLeft);
8215
8220
  }
8216
- .pf-c-dropdown.pf-m-top .pf-c-dropdown__menu {
8217
- --pf-c-dropdown__menu--Top: var(--pf-c-dropdown--m-top__menu--Top);
8218
- transform: translateY(var(--pf-c-dropdown--m-top__menu--TranslateY));
8221
+
8222
+ .pf-c-dual-list-selector__draggable .pf-c-button {
8223
+ --pf-c-button--FontSize: inherit;
8224
+ cursor: grab;
8219
8225
  }
8220
8226
 
8221
- .pf-c-dropdown.pf-m-top > .pf-c-menu {
8222
- --pf-c-dropdown--c-menu--Top: var(--pf-c-dropdown--m-top--c-menu--Top);
8223
- transform: translateY(var(--pf-c-dropdown--m-top--c-menu--TranslateY));
8227
+ .pf-c-dual-list-selector__draggable .pf-c-button:active {
8228
+ cursor: grabbing;
8224
8229
  }
8225
8230
 
8226
- .pf-c-dropdown__menu-item {
8227
- display: block;
8231
+ .pf-c-dual-list-selector__item {
8232
+ position: relative;
8228
8233
  width: 100%;
8229
- padding: var(--pf-c-dropdown__menu-item--PaddingTop) var(--pf-c-dropdown__menu-item--PaddingRight) var(--pf-c-dropdown__menu-item--PaddingBottom) var(--pf-c-dropdown__menu-item--PaddingLeft);
8230
- font-size: var(--pf-c-dropdown__menu-item--FontSize);
8231
- font-weight: var(--pf-c-dropdown__menu-item--FontWeight);
8232
- line-height: var(--pf-c-dropdown__menu-item--LineHeight);
8233
- color: var(--pf-c-dropdown__menu-item--Color);
8234
- text-align: left;
8235
- white-space: nowrap;
8236
- background-color: var(--pf-c-dropdown__menu-item--BackgroundColor);
8237
- border: none;
8234
+ padding: var(--pf-c-dual-list-selector__item--PaddingTop) var(--pf-c-dual-list-selector__item--PaddingRight) var(--pf-c-dual-list-selector__item--PaddingBottom) var(--pf-c-dual-list-selector__item--PaddingLeft);
8235
+ cursor: pointer;
8238
8236
  }
8239
8237
 
8240
- .pf-c-dropdown__menu-item:hover, .pf-c-dropdown__menu-item:focus {
8241
- --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--hover--Color);
8242
- --pf-c-dropdown__menu-item--BackgroundColor: var(--pf-c-dropdown__menu-item--hover--BackgroundColor);
8243
- text-decoration: none;
8238
+ .pf-c-dual-list-selector__item-count {
8239
+ margin-left: var(--pf-c-dual-list-selector__item-count--Marginleft);
8244
8240
  }
8245
8241
 
8246
- .pf-c-dropdown__menu-item:disabled, .pf-c-dropdown__menu-item.pf-m-disabled, .pf-c-dropdown__menu-item.pf-m-aria-disabled {
8247
- --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--disabled--Color);
8248
- --pf-c-dropdown__menu-item--BackgroundColor: var(--pf-c-dropdown__menu-item--disabled--BackgroundColor);
8242
+ .pf-c-dual-list-selector__item-count .pf-c-badge.pf-m-read {
8243
+ --pf-c-badge--m-read--BackgroundColor: var(--pf-c-dual-list-selector__item--c-badge--m-read--BackgroundColor);
8249
8244
  }
8250
8245
 
8251
- .pf-c-dropdown__menu-item:disabled, .pf-c-dropdown__menu-item.pf-m-disabled {
8252
- pointer-events: none;
8246
+ .pf-c-dual-list-selector__item-text {
8247
+ overflow: hidden;
8248
+ text-overflow: ellipsis;
8249
+ white-space: nowrap;
8250
+ flex-grow: 1;
8251
+ color: var(--pf-c-dual-list-selector__item-text--Color);
8253
8252
  }
8254
8253
 
8255
- .pf-c-dropdown__menu-item.pf-m-aria-disabled {
8256
- cursor: default;
8254
+ .pf-c-dual-list-selector__controls {
8255
+ grid-area: var(--pf-c-dual-list-selector__controls--GridArea);
8256
+ align-self: center;
8257
+ padding-right: var(--pf-c-dual-list-selector__controls--PaddingRight);
8258
+ padding-left: var(--pf-c-dual-list-selector__controls--PaddingLeft);
8257
8259
  }
8258
8260
 
8259
- .pf-c-dropdown__menu-item.pf-m-icon {
8261
+ .pf-c-dual-list-selector__item-main {
8260
8262
  display: flex;
8261
- align-items: center;
8263
+ min-width: 0;
8262
8264
  }
8263
-
8264
- .pf-c-dropdown__menu-item.pf-m-icon.pf-m-description {
8265
- flex-direction: column;
8266
- align-items: start;
8265
+
8266
+ .pf-c-dual-list-selector__item-toggle {
8267
+ padding: var(--pf-c-dual-list-selector__item-toggle--PaddingTop) var(--pf-c-dual-list-selector__item-toggle--PaddingRight) var(--pf-c-dual-list-selector__item-toggle--PaddingBottom) var(--pf-c-dual-list-selector__item-toggle--PaddingLeft);
8268
+ margin-top: var(--pf-c-dual-list-selector__item-toggle--MarginTop);
8269
+ margin-bottom: var(--pf-c-dual-list-selector__item-toggle--MarginBottom);
8267
8270
  }
8268
8271
 
8269
- .pf-c-dropdown__menu-item.pf-m-icon .pf-c-dropdown__menu-item-main {
8272
+ .pf-c-dual-list-selector__item-check {
8270
8273
  display: flex;
8271
8274
  align-items: center;
8275
+ margin-right: var(--pf-c-dual-list-selector__item-check--MarginRight);
8272
8276
  }
8273
8277
 
8274
- .pf-c-dropdown__menu-item.pf-m-text {
8275
- --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--m-text--Color);
8278
+ .pf-c-dual-list-selector__item-toggle-icon {
8279
+ display: inline-block;
8280
+ min-width: var(--pf-c-dual-list-selector__item-toggle-icon--MinWidth);
8281
+ color: var(--pf-c-dual-list-selector__item-toggle-icon--Color, inherit);
8282
+ text-align: center;
8283
+ transition: var(--pf-c-dual-list-selector__item-toggle-icon--Transition);
8284
+ transform: rotate(var(--pf-c-dual-list-selector__item-toggle-icon--Rotate));
8276
8285
  }
8277
8286
 
8278
- .pf-c-dropdown__menu-item.pf-m-text:hover, .pf-c-dropdown__menu-item.pf-m-text:focus {
8279
- --pf-c-dropdown__menu-item--BackgroundColor: transparent;
8287
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8288
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 1 + var(--pf-c-dual-list-selector__item--indent--base));
8289
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8280
8290
  }
8281
8291
 
8282
- .pf-c-dropdown__menu-item-icon {
8283
- display: inline-flex;
8284
- align-items: center;
8285
- justify-content: center;
8286
- width: var(--pf-c-dropdown__menu-item-icon--Width);
8287
- height: var(--pf-c-dropdown__menu-item-icon--Height);
8288
- margin-right: var(--pf-c-dropdown__menu-item-icon--MarginRight);
8292
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8293
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 2 + var(--pf-c-dual-list-selector__item--indent--base));
8294
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8289
8295
  }
8290
8296
 
8291
- .pf-c-dropdown__menu-item-icon > * {
8292
- max-width: 100%;
8293
- max-height: 100%;
8297
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8298
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 3 + var(--pf-c-dual-list-selector__item--indent--base));
8299
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8294
8300
  }
8295
8301
 
8296
- .pf-c-dropdown__menu-item-description {
8297
- font-size: var(--pf-c-dropdown__menu-item-description--FontSize);
8298
- color: var(--pf-c-dropdown__menu-item-description--Color);
8302
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8303
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 4 + var(--pf-c-dual-list-selector__item--indent--base));
8304
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8299
8305
  }
8300
8306
 
8301
- .pf-c-dropdown__group + .pf-c-dropdown__group {
8302
- padding-top: var(--pf-c-dropdown__group--group--PaddingTop);
8307
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8308
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 5 + var(--pf-c-dual-list-selector__item--indent--base));
8309
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8303
8310
  }
8304
8311
 
8305
- .pf-c-dropdown__group-title {
8306
- padding-top: var(--pf-c-dropdown__group-title--PaddingTop);
8307
- padding-right: var(--pf-c-dropdown__group-title--PaddingRight);
8308
- padding-bottom: var(--pf-c-dropdown__group-title--PaddingBottom);
8309
- padding-left: var(--pf-c-dropdown__group-title--PaddingLeft);
8310
- font-size: var(--pf-c-dropdown__group-title--FontSize);
8311
- font-weight: var(--pf-c-dropdown__group-title--FontWeight);
8312
- color: var(--pf-c-dropdown__group-title--Color);
8312
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8313
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 6 + var(--pf-c-dual-list-selector__item--indent--base));
8314
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8313
8315
  }
8314
8316
 
8315
- :where(.pf-theme-dark) .pf-c-dropdown {
8316
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-global--BackgroundColor--400);
8317
- --pf-c-dropdown__toggle--before--BorderTopColor: transparent;
8318
- --pf-c-dropdown__toggle--before--BorderRightColor: transparent;
8319
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-global--BorderColor--400);
8320
- --pf-c-dropdown__toggle--before--BorderLeftColor: transparent;
8321
- --pf-c-dropdown__toggle--disabled--BackgroundColor: var(--pf-global--palette--black-500);
8322
- --pf-c-dropdown__toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--300);
8323
- --pf-c-dropdown__menu--BackgroundColor: var(--pf-global--BackgroundColor--300);
8324
- --pf-c-dropdown__menu--Top: 100%;
8325
- --pf-c-dropdown--m-top__menu--TranslateY: -100%;
8326
- --pf-c-dropdown__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
8317
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8318
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 7 + var(--pf-c-dual-list-selector__item--indent--base));
8319
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8327
8320
  }
8328
8321
 
8329
- :where(.pf-theme-dark) .pf-c-dropdown__toggle:not(.pf-m-plain):disabled, :where(.pf-theme-dark) .pf-c-dropdown__toggle:not(.pf-m-plain).pf-m-disabled {
8330
- color: var(--pf-global--palette--black-100);
8322
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8323
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 8 + var(--pf-c-dual-list-selector__item--indent--base));
8324
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8331
8325
  }
8332
8326
 
8333
- :where(.pf-theme-dark) .pf-c-dropdown__toggle.pf-m-plain {
8334
- background: transparent;
8327
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8328
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 9 + var(--pf-c-dual-list-selector__item--indent--base));
8329
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8330
+ }
8331
+
8332
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8333
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 10 + var(--pf-c-dual-list-selector__item--indent--base));
8334
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8335
8335
  }
8336
8336
 
8337
8337
  .pf-c-empty-state {
@@ -11438,7 +11438,7 @@ ul.pf-c-list {
11438
11438
  }
11439
11439
 
11440
11440
  .pf-c-masthead .pf-c-button.pf-m-plain {
11441
- color: var(--pf-global--Color--200);
11441
+ color: var(--pf-c-button--m-plain--Color);
11442
11442
  }
11443
11443
 
11444
11444
  .pf-c-masthead__main {
@@ -14589,12 +14589,15 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
14589
14589
  --pf-c-notification-badge__i--Height: auto;
14590
14590
  --pf-c-notification-badge--m-read--after--BorderColor: transparent;
14591
14591
  --pf-c-notification-badge--m-read--after--BackgroundColor: transparent;
14592
+ --pf-c-notification-badge--m-read--m-expanded--after--BackgroundColor: var(--pf-global--BackgroundColor--dark-200);
14592
14593
  --pf-c-notification-badge--m-unread--Color: var(--pf-global--Color--light-100);
14593
14594
  --pf-c-notification-badge--m-unread--after--BackgroundColor: var(--pf-global--active-color--100);
14594
14595
  --pf-c-notification-badge--m-unread--hover--after--BackgroundColor: var(--pf-global--primary-color--200);
14596
+ --pf-c-notification-badge--m-unread--m-expanded--after--BackgroundColor: var(--pf-global--primary-color--200);
14595
14597
  --pf-c-notification-badge--m-attention--Color: var(--pf-global--Color--light-100);
14596
14598
  --pf-c-notification-badge--m-attention--after--BackgroundColor: var(--pf-global--danger-color--100);
14597
14599
  --pf-c-notification-badge--m-attention--hover--after--BackgroundColor: var(--pf-global--danger-color--200);
14600
+ --pf-c-notification-badge--m-attention--m-expanded--after--BackgroundColor: var(--pf-global--danger-color--200);
14598
14601
  --pf-c-notification-badge__count--MarginLeft: var(--pf-global--spacer--xs);
14599
14602
  --pf-c-notification-badge--pf-icon-attention-bell--LineHeight: var(--pf-global--LineHeight--sm);
14600
14603
  position: relative;
@@ -14642,6 +14645,7 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
14642
14645
  .pf-c-notification-badge.pf-m-read {
14643
14646
  --pf-c-notification-badge--after--BackgroundColor: var(--pf-c-notification-badge--m-read--after--BackgroundColor);
14644
14647
  --pf-c-notification-badge--after--BorderColor: var(--pf-c-notification-badge--m-read--after--BorderColor);
14648
+ color: var(--pf-c-notification-badge--m-read--Color, inherit);
14645
14649
  }
14646
14650
 
14647
14651
  .pf-c-notification-badge.pf-m-unread {
@@ -14659,7 +14663,14 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
14659
14663
  }
14660
14664
 
14661
14665
  .pf-c-notification-badge.pf-m-attention:hover {
14662
- --pf-c-notification-badge--after--BackgroundColor: var(--pf-c-notification-badge--m-attention--hover--after--BackgroundColor);
14666
+ --pf-c-notification-badge--m-attention--after--BackgroundColor: var(--pf-c-notification-badge--m-attention--hover--after--BackgroundColor);
14667
+ }
14668
+
14669
+ .pf-c-notification-badge.pf-m-expanded {
14670
+ --pf-c-notification-badge--m-read--Color: var(--pf-global--Color--light-100);
14671
+ --pf-c-notification-badge--m-read--after--BackgroundColor: var(--pf-c-notification-badge--m-read--m-expanded--after--BackgroundColor);
14672
+ --pf-c-notification-badge--m-unread--after--BackgroundColor: var(--pf-c-notification-badge--m-unread--m-expanded--after--BackgroundColor);
14673
+ --pf-c-notification-badge--m-attention--after--BackgroundColor: var(--pf-c-notification-badge--m-attention--m-expanded--after--BackgroundColor);
14663
14674
  }
14664
14675
 
14665
14676
  .pf-c-notification-badge__count {
@@ -14667,7 +14678,9 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
14667
14678
  }
14668
14679
 
14669
14680
  :where(.pf-theme-dark) .pf-c-notification-badge {
14681
+ --pf-c-notification-badge--m-read--m-expanded--after--BackgroundColor: var(--pf-global--BackgroundColor--400);
14670
14682
  --pf-c-notification-badge--m-unread--after--BackgroundColor: var(--pf-global--primary-color--300);
14683
+ --pf-c-notification-badge--m-attention--Color: var(--pf-global--palette--black-900);
14671
14684
  }
14672
14685
 
14673
14686
  .pf-c-notification-drawer {
@@ -15597,6 +15610,7 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
15597
15610
  .pf-c-page.pf-m-full-height {
15598
15611
  height: 100vh;
15599
15612
  height: 100dvh;
15613
+ max-height: 100%;
15600
15614
  }
15601
15615
 
15602
15616
  .pf-c-page__header,
@@ -24087,87 +24101,6 @@ label.pf-c-tree-view__node-text {
24087
24101
  direction: ltr;
24088
24102
  }
24089
24103
  }
24090
- .pf-l-gallery {
24091
- --pf-l-gallery--m-gutter--GridGap: var(--pf-global--gutter);
24092
- --pf-l-gallery--GridTemplateColumns--min: 250px;
24093
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
24094
- --pf-l-gallery--GridTemplateColumns--max: 1fr;
24095
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
24096
- --pf-l-gallery--GridTemplateColumns: repeat(auto-fill, minmax(var(--pf-l-gallery--GridTemplateColumns--minmax--min), var(--pf-l-gallery--GridTemplateColumns--minmax--max)));
24097
- --pf-l-gallery--GridTemplateRows: auto;
24098
- display: grid;
24099
- grid-template-columns: var(--pf-l-gallery--GridTemplateColumns);
24100
- grid-template-rows: var(--pf-l-gallery--GridTemplateRows);
24101
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
24102
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
24103
- }
24104
-
24105
- .pf-l-gallery.pf-m-gutter {
24106
- grid-gap: var(--pf-l-gallery--m-gutter--GridGap);
24107
- }
24108
-
24109
- @media (min-width: 576px) {
24110
- .pf-l-gallery {
24111
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min));
24112
- }
24113
- }
24114
- @media (min-width: 768px) {
24115
- .pf-l-gallery {
24116
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min)));
24117
- }
24118
- }
24119
- @media (min-width: 992px) {
24120
- .pf-l-gallery {
24121
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min))));
24122
- }
24123
- }
24124
- @media (min-width: 1200px) {
24125
- .pf-l-gallery {
24126
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min)))));
24127
- }
24128
- }
24129
- @media (min-width: 1450px) {
24130
- .pf-l-gallery {
24131
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-2xl, var(--pf-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min))))));
24132
- }
24133
- }
24134
- @media (min-width: 576px) {
24135
- .pf-l-gallery {
24136
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max));
24137
- }
24138
- }
24139
- @media (min-width: 768px) {
24140
- .pf-l-gallery {
24141
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max)));
24142
- }
24143
- }
24144
- @media (min-width: 992px) {
24145
- .pf-l-gallery {
24146
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max))));
24147
- }
24148
- }
24149
- @media (min-width: 1200px) {
24150
- .pf-l-gallery {
24151
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max)))));
24152
- }
24153
- }
24154
- @media (min-width: 1450px) {
24155
- .pf-l-gallery {
24156
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-2xl, var(--pf-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max))))));
24157
- }
24158
- }
24159
- .pf-l-level {
24160
- --pf-l-level--m-gutter--MarginRight: var(--pf-global--gutter);
24161
- display: flex;
24162
- flex-wrap: wrap;
24163
- align-items: center;
24164
- justify-content: space-between;
24165
- }
24166
-
24167
- .pf-l-level.pf-m-gutter > *:not(:last-child) {
24168
- margin-right: var(--pf-l-level--m-gutter--MarginRight);
24169
- }
24170
-
24171
24104
  .pf-l-flex {
24172
24105
  --pf-l-flex--Display: flex;
24173
24106
  --pf-l-flex--FlexWrap: wrap;
@@ -26244,6 +26177,75 @@ label.pf-c-tree-view__node-text {
26244
26177
  --pf-l-flex--spacer: var(--pf-l-flex--spacer--4xl);
26245
26178
  }
26246
26179
  }
26180
+ .pf-l-gallery {
26181
+ --pf-l-gallery--m-gutter--GridGap: var(--pf-global--gutter);
26182
+ --pf-l-gallery--GridTemplateColumns--min: 250px;
26183
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
26184
+ --pf-l-gallery--GridTemplateColumns--max: 1fr;
26185
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
26186
+ --pf-l-gallery--GridTemplateColumns: repeat(auto-fill, minmax(var(--pf-l-gallery--GridTemplateColumns--minmax--min), var(--pf-l-gallery--GridTemplateColumns--minmax--max)));
26187
+ --pf-l-gallery--GridTemplateRows: auto;
26188
+ display: grid;
26189
+ grid-template-columns: var(--pf-l-gallery--GridTemplateColumns);
26190
+ grid-template-rows: var(--pf-l-gallery--GridTemplateRows);
26191
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
26192
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
26193
+ }
26194
+
26195
+ .pf-l-gallery.pf-m-gutter {
26196
+ grid-gap: var(--pf-l-gallery--m-gutter--GridGap);
26197
+ }
26198
+
26199
+ @media (min-width: 576px) {
26200
+ .pf-l-gallery {
26201
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min));
26202
+ }
26203
+ }
26204
+ @media (min-width: 768px) {
26205
+ .pf-l-gallery {
26206
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min)));
26207
+ }
26208
+ }
26209
+ @media (min-width: 992px) {
26210
+ .pf-l-gallery {
26211
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min))));
26212
+ }
26213
+ }
26214
+ @media (min-width: 1200px) {
26215
+ .pf-l-gallery {
26216
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min)))));
26217
+ }
26218
+ }
26219
+ @media (min-width: 1450px) {
26220
+ .pf-l-gallery {
26221
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-2xl, var(--pf-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min))))));
26222
+ }
26223
+ }
26224
+ @media (min-width: 576px) {
26225
+ .pf-l-gallery {
26226
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max));
26227
+ }
26228
+ }
26229
+ @media (min-width: 768px) {
26230
+ .pf-l-gallery {
26231
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max)));
26232
+ }
26233
+ }
26234
+ @media (min-width: 992px) {
26235
+ .pf-l-gallery {
26236
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max))));
26237
+ }
26238
+ }
26239
+ @media (min-width: 1200px) {
26240
+ .pf-l-gallery {
26241
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max)))));
26242
+ }
26243
+ }
26244
+ @media (min-width: 1450px) {
26245
+ .pf-l-gallery {
26246
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-2xl, var(--pf-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max))))));
26247
+ }
26248
+ }
26247
26249
  .pf-l-grid {
26248
26250
  --pf-l-grid--m-gutter--GridGap: var(--pf-global--gutter);
26249
26251
  --pf-l-grid__item--GridColumnStart: auto;
@@ -27458,6 +27460,18 @@ label.pf-c-tree-view__node-text {
27458
27460
  grid-gap: var(--pf-l-grid--m-gutter--GridGap);
27459
27461
  }
27460
27462
 
27463
+ .pf-l-level {
27464
+ --pf-l-level--m-gutter--MarginRight: var(--pf-global--gutter);
27465
+ display: flex;
27466
+ flex-wrap: wrap;
27467
+ align-items: center;
27468
+ justify-content: space-between;
27469
+ }
27470
+
27471
+ .pf-l-level.pf-m-gutter > *:not(:last-child) {
27472
+ margin-right: var(--pf-l-level--m-gutter--MarginRight);
27473
+ }
27474
+
27461
27475
  .pf-l-split {
27462
27476
  --pf-l-split--m-gutter--MarginRight: var(--pf-global--gutter);
27463
27477
  display: flex;