@patternfly/react-core 4.263.0 → 4.264.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (54) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/dist/esm/components/Tabs/Tab.d.ts +4 -2
  3. package/dist/esm/components/Tabs/Tab.d.ts.map +1 -1
  4. package/dist/esm/components/Tabs/Tab.js +6 -7
  5. package/dist/esm/components/Tabs/Tab.js.map +1 -1
  6. package/dist/esm/components/Tabs/TabAction.d.ts +20 -0
  7. package/dist/esm/components/Tabs/TabAction.d.ts.map +1 -0
  8. package/dist/esm/components/Tabs/TabAction.js +17 -0
  9. package/dist/esm/components/Tabs/TabAction.js.map +1 -0
  10. package/dist/esm/components/Tabs/Tabs.d.ts +1 -1
  11. package/dist/esm/components/Tabs/Tabs.d.ts.map +1 -1
  12. package/dist/esm/components/Tabs/index.d.ts +1 -0
  13. package/dist/esm/components/Tabs/index.d.ts.map +1 -1
  14. package/dist/esm/components/Tabs/index.js +1 -0
  15. package/dist/esm/components/Tabs/index.js.map +1 -1
  16. package/dist/js/components/Tabs/Tab.d.ts +4 -2
  17. package/dist/js/components/Tabs/Tab.d.ts.map +1 -1
  18. package/dist/js/components/Tabs/Tab.js +6 -7
  19. package/dist/js/components/Tabs/Tab.js.map +1 -1
  20. package/dist/js/components/Tabs/TabAction.d.ts +20 -0
  21. package/dist/js/components/Tabs/TabAction.d.ts.map +1 -0
  22. package/dist/js/components/Tabs/TabAction.js +20 -0
  23. package/dist/js/components/Tabs/TabAction.js.map +1 -0
  24. package/dist/js/components/Tabs/Tabs.d.ts +1 -1
  25. package/dist/js/components/Tabs/Tabs.d.ts.map +1 -1
  26. package/dist/js/components/Tabs/index.d.ts +1 -0
  27. package/dist/js/components/Tabs/index.d.ts.map +1 -1
  28. package/dist/js/components/Tabs/index.js +1 -0
  29. package/dist/js/components/Tabs/index.js.map +1 -1
  30. package/dist/styles/assets/pficon/pficon.scss +12 -0
  31. package/dist/styles/assets/pficon/pficon.woff +0 -0
  32. package/dist/styles/assets/pficon/pficon.woff2 +0 -0
  33. package/dist/styles/base-no-reset.css +10 -0
  34. package/dist/styles/base.css +10 -0
  35. package/dist/umd/react-core.min.css +947 -778
  36. package/dist/umd/react-core.min.js +1 -1
  37. package/package.json +6 -6
  38. package/src/components/Tabs/Tab.tsx +17 -16
  39. package/src/components/Tabs/TabAction.tsx +57 -0
  40. package/src/components/Tabs/Tabs.tsx +1 -1
  41. package/src/components/Tabs/__tests__/Tab.test.tsx +10 -0
  42. package/src/components/Tabs/__tests__/__snapshots__/Tab.test.tsx.snap +45 -0
  43. package/src/components/Tabs/examples/Tabs.md +64 -20
  44. package/src/components/Tabs/examples/TabsHelp.tsx +61 -0
  45. package/src/components/Tabs/examples/TabsHelpAndClose.tsx +84 -0
  46. package/src/components/Tabs/index.ts +1 -0
  47. package/src/demos/Tabs.md +0 -10
  48. package/src/demos/examples/DashboardWrapper.js +1 -0
  49. package/src/demos/examples/Tabs/ModalTabs.tsx +3 -3
  50. package/src/demos/examples/Tabs/NestedTabs.tsx +11 -3
  51. package/src/demos/examples/Tabs/NestedUnindentedTabs.tsx +25 -40
  52. package/src/demos/examples/Tabs/TabsAndTable.tsx +9 -52
  53. package/src/demos/examples/Tabs/GrayTabs.tsx +0 -152
  54. package/src/demos/examples/Tabs/TabsAndTablesAutoWidthTabs.tsx +0 -442
@@ -7310,331 +7310,6 @@ label.pf-c-check, .pf-c-check__label,
7310
7310
  --pf-c-drawer__panel--BackgroundColor: var(--pf-global--BackgroundColor--100);
7311
7311
  }
7312
7312
 
7313
- .pf-c-dual-list-selector {
7314
- --pf-c-dual-list-selector__header--GridArea: pane-header;
7315
- --pf-c-dual-list-selector__tools--GridArea: pane-tools;
7316
- --pf-c-dual-list-selector__status--GridArea: pane-status;
7317
- --pf-c-dual-list-selector__menu--GridArea: pane-menu;
7318
- --pf-c-dual-list-selector__controls--GridArea: controls;
7319
- --pf-c-dual-list-selector--m-chosen__header--GridArea: pane-header-c;
7320
- --pf-c-dual-list-selector--m-chosen__tools--GridArea: pane-tools-c;
7321
- --pf-c-dual-list-selector--m-chosen__status--GridArea: pane-status-c;
7322
- --pf-c-dual-list-selector--m-chosen__menu--GridArea: pane-menu-c;
7323
- --pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min: 12.5rem;
7324
- --pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max: 28.125rem;
7325
- --pf-c-dual-list-selector__header--MarginBottom: var(--pf-global--spacer--sm);
7326
- --pf-c-dual-list-selector__title-text--FontWeight: var(--pf-global--FontWeight--bold);
7327
- --pf-c-dual-list-selector__tools--MarginBottom: var(--pf-global--spacer--md);
7328
- --pf-c-dual-list-selector__tools-filter--tools-actions--MarginLeft: var(--pf-global--spacer--sm);
7329
- --pf-c-dual-list-selector__menu--BorderWidth: var(--pf-global--BorderWidth--sm);
7330
- --pf-c-dual-list-selector__menu--BorderColor: var(--pf-global--BorderColor--100);
7331
- --pf-c-dual-list-selector__menu--MinHeight: 12.5rem;
7332
- --pf-c-dual-list-selector__menu--MaxHeight: 20rem;
7333
- --pf-c-dual-list-selector__list-item-row--FontSize: var(--pf-global--FontSize--sm);
7334
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: transparent;
7335
- --pf-c-dual-list-selector__list-item-row--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
7336
- --pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
7337
- --pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
7338
- --pf-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor: var(--pf-global--BackgroundColor--100);
7339
- --pf-c-dual-list-selector__list-item--m-ghost-row--Opacity: .4;
7340
- --pf-c-dual-list-selector__item--PaddingTop: var(--pf-global--spacer--sm);
7341
- --pf-c-dual-list-selector__item--PaddingRight: var(--pf-global--spacer--md);
7342
- --pf-c-dual-list-selector__item--PaddingBottom: var(--pf-global--spacer--sm);
7343
- --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-global--spacer--md);
7344
- --pf-c-dual-list-selector__item--m-expandable--PaddingLeft: 0;
7345
- --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));
7346
- --pf-c-dual-list-selector__item--nested-indent--base: calc(var(--pf-c-dual-list-selector__item--indent--base) - var(--pf-global--spacer--md));
7347
- --pf-c-dual-list-selector__draggable--item--PaddingLeft: var(--pf-global--spacer--xs);
7348
- --pf-c-dual-list-selector__item-text--Color: var(--pf-global--Color--100);
7349
- --pf-c-dual-list-selector__list-item-row--m-selected__text--Color: var(--pf-global--active-color--100);
7350
- --pf-c-dual-list-selector__list-item-row--m-selected__text--FontWeight: var(--pf-global--FontWeight--bold);
7351
- --pf-c-dual-list-selector__list-item--m-disabled__item-text--Color: var(--pf-global--disabled-color--100);
7352
- --pf-c-dual-list-selector__status--MarginBottom: var(--pf-global--spacer--sm);
7353
- --pf-c-dual-list-selector__status-text--FontSize: var(--pf-global--FontSize--sm);
7354
- --pf-c-dual-list-selector__status-text--Color: var(--pf-global--Color--200);
7355
- --pf-c-dual-list-selector__controls--PaddingRight: var(--pf-global--spacer--md);
7356
- --pf-c-dual-list-selector__controls--PaddingLeft: var(--pf-global--spacer--md);
7357
- --pf-c-dual-list-selector__item-toggle--PaddingTop: var(--pf-global--spacer--sm);
7358
- --pf-c-dual-list-selector__item-toggle--PaddingRight: var(--pf-global--spacer--sm);
7359
- --pf-c-dual-list-selector__item-toggle--PaddingBottom: var(--pf-global--spacer--sm);
7360
- --pf-c-dual-list-selector__item-toggle--PaddingLeft: var(--pf-global--spacer--md);
7361
- --pf-c-dual-list-selector__item-toggle--MarginTop: calc(var(--pf-global--spacer--sm) * -1);
7362
- --pf-c-dual-list-selector__item-toggle--MarginBottom: calc(var(--pf-global--spacer--sm) * -1);
7363
- --pf-c-dual-list-selector__list__list__item-toggle--Left: 0;
7364
- --pf-c-dual-list-selector__list__list__item-toggle--TranslateX: -100%;
7365
- --pf-c-dual-list-selector__item-check--MarginRight: var(--pf-global--spacer--sm);
7366
- --pf-c-dual-list-selector__item-count--Marginleft: var(--pf-global--spacer--sm);
7367
- --pf-c-dual-list-selector__item--c-badge--m-read--BackgroundColor: var(--pf-global--disabled-color--200);
7368
- --pf-c-dual-list-selector__item-toggle-icon--Rotate: 0;
7369
- --pf-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate: 90deg;
7370
- --pf-c-dual-list-selector__item-toggle-icon--Transition: var(--pf-global--Transition);
7371
- --pf-c-dual-list-selector__item-toggle-icon--MinWidth: var(--pf-c-dual-list-selector__list-item-row--FontSize);
7372
- --pf-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color: var(--pf-global--disabled-color--200);
7373
- display: grid;
7374
- grid-template-areas: "pane-header . pane-header-c" "pane-tools . pane-tools-c" "pane-status . pane-status-c" "pane-menu controls pane-menu-c";
7375
- 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));
7376
- grid-template-rows: repeat(3, auto) auto;
7377
- }
7378
-
7379
- .pf-c-dual-list-selector__pane {
7380
- display: contents;
7381
- }
7382
-
7383
- .pf-c-dual-list-selector__pane.pf-m-chosen {
7384
- --pf-c-dual-list-selector__header--GridArea: var(--pf-c-dual-list-selector--m-chosen__header--GridArea);
7385
- --pf-c-dual-list-selector__tools--GridArea: var(--pf-c-dual-list-selector--m-chosen__tools--GridArea);
7386
- --pf-c-dual-list-selector__status--GridArea: var(--pf-c-dual-list-selector--m-chosen__status--GridArea);
7387
- --pf-c-dual-list-selector__menu--GridArea: var(--pf-c-dual-list-selector--m-chosen__menu--GridArea);
7388
- }
7389
-
7390
- .pf-c-dual-list-selector__header {
7391
- grid-area: var(--pf-c-dual-list-selector__header--GridArea);
7392
- margin-bottom: var(--pf-c-dual-list-selector__header--MarginBottom);
7393
- }
7394
-
7395
- .pf-c-dual-list-selector__title-text {
7396
- font-weight: var(--pf-c-dual-list-selector__title-text--FontWeight);
7397
- }
7398
-
7399
- .pf-c-dual-list-selector__tools {
7400
- display: flex;
7401
- grid-area: var(--pf-c-dual-list-selector__tools--GridArea);
7402
- margin-bottom: var(--pf-c-dual-list-selector__tools--MarginBottom);
7403
- }
7404
-
7405
- .pf-c-dual-list-selector__tools-filter {
7406
- flex-grow: 1;
7407
- }
7408
-
7409
- .pf-c-dual-list-selector__tools-actions {
7410
- display: flex;
7411
- }
7412
-
7413
- .pf-c-dual-list-selector__tools-filter ~ .pf-c-dual-list-selector__tools-actions {
7414
- margin-left: var(--pf-c-dual-list-selector__tools-filter--tools-actions--MarginLeft);
7415
- }
7416
-
7417
- .pf-c-dual-list-selector__status {
7418
- display: flex;
7419
- grid-area: var(--pf-c-dual-list-selector__status--GridArea);
7420
- margin-bottom: var(--pf-c-dual-list-selector__status--MarginBottom);
7421
- }
7422
-
7423
- .pf-c-dual-list-selector__status-text {
7424
- flex-grow: 1;
7425
- font-size: var(--pf-c-dual-list-selector__status-text--FontSize);
7426
- color: var(--pf-c-dual-list-selector__status-text--Color);
7427
- }
7428
-
7429
- .pf-c-dual-list-selector__menu {
7430
- grid-area: var(--pf-c-dual-list-selector__menu--GridArea);
7431
- min-height: var(--pf-c-dual-list-selector__menu--MinHeight);
7432
- max-height: var(--pf-c-dual-list-selector__menu--MaxHeight);
7433
- overflow: auto;
7434
- border: var(--pf-c-dual-list-selector__menu--BorderWidth) solid var(--pf-c-dual-list-selector__menu--BorderColor);
7435
- }
7436
-
7437
- .pf-c-dual-list-selector__list {
7438
- --pf-c-dual-list-selector__item-toggle-icon--Rotate: 0;
7439
- display: flex;
7440
- flex-direction: column;
7441
- }
7442
-
7443
- .pf-c-dual-list-selector__list .pf-c-dual-list-selector__list {
7444
- --pf-c-dual-list-selector__item-toggle--MarginTop: 0;
7445
- --pf-c-dual-list-selector__item-toggle--MarginBottom: 0;
7446
- }
7447
-
7448
- .pf-c-dual-list-selector__list .pf-c-dual-list-selector__list .pf-c-dual-list-selector__item-toggle {
7449
- position: absolute;
7450
- top: 0;
7451
- left: var(--pf-c-dual-list-selector__list__list__item-toggle--Left);
7452
- transform: translateX(var(--pf-c-dual-list-selector__list__list__item-toggle--TranslateX));
7453
- }
7454
-
7455
- .pf-c-dual-list-selector__list.pf-m-drag-over {
7456
- overflow-anchor: none;
7457
- }
7458
-
7459
- .pf-c-dual-list-selector__list-item:focus {
7460
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor);
7461
- }
7462
-
7463
- .pf-c-dual-list-selector__list-item.pf-m-expandable {
7464
- --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-c-dual-list-selector__item--m-expandable--PaddingLeft);
7465
- }
7466
-
7467
- .pf-c-dual-list-selector__list-item.pf-m-expanded {
7468
- --pf-c-dual-list-selector__item-toggle-icon--Rotate: var(--pf-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate);
7469
- }
7470
-
7471
- .pf-c-dual-list-selector__list-item.pf-m-disabled {
7472
- --pf-c-dual-list-selector__item-text--Color: var(--pf-c-dual-list-selector__list-item--m-disabled__item-text--Color);
7473
- --pf-c-dual-list-selector__item-toggle-icon--Color: var(--pf-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color);
7474
- pointer-events: none;
7475
- }
7476
-
7477
- .pf-c-dual-list-selector__list-item-row {
7478
- display: flex;
7479
- font-size: var(--pf-c-dual-list-selector__list-item-row--FontSize);
7480
- background-color: var(--pf-c-dual-list-selector__list-item-row--BackgroundColor);
7481
- }
7482
-
7483
- .pf-c-dual-list-selector__list-item-row:hover {
7484
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--hover--BackgroundColor);
7485
- }
7486
-
7487
- .pf-c-dual-list-selector__list-item-row.pf-m-selected {
7488
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor);
7489
- }
7490
-
7491
- .pf-c-dual-list-selector__list-item-row.pf-m-selected .pf-c-dual-list-selector__item-text {
7492
- --pf-c-dual-list-selector__item-text--Color: var(--pf-c-dual-list-selector__list-item-row--m-selected__text--Color);
7493
- font-weight: var(--pf-c-dual-list-selector__list-item-row--m-selected__text--FontWeight);
7494
- }
7495
-
7496
- .pf-c-dual-list-selector__list-item-row.pf-m-check {
7497
- --pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: transparent;
7498
- }
7499
-
7500
- .pf-c-dual-list-selector__list-item-row.pf-m-ghost-row {
7501
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor);
7502
- opacity: var(--pf-c-dual-list-selector__list-item--m-ghost-row--Opacity);
7503
- }
7504
-
7505
- .pf-c-dual-list-selector__item,
7506
- .pf-c-dual-list-selector__main {
7507
- display: flex;
7508
- }
7509
-
7510
- .pf-c-dual-list-selector__item,
7511
- .pf-c-dual-list-selector__item-main {
7512
- flex-basis: 100%;
7513
- }
7514
-
7515
- .pf-c-dual-list-selector__draggable {
7516
- display: flex;
7517
- }
7518
-
7519
- .pf-c-dual-list-selector__draggable + .pf-c-dual-list-selector__item {
7520
- --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-c-dual-list-selector__draggable--item--PaddingLeft);
7521
- }
7522
-
7523
- .pf-c-dual-list-selector__draggable .pf-c-button {
7524
- --pf-c-button--FontSize: inherit;
7525
- cursor: grab;
7526
- }
7527
-
7528
- .pf-c-dual-list-selector__draggable .pf-c-button:active {
7529
- cursor: grabbing;
7530
- }
7531
-
7532
- .pf-c-dual-list-selector__item {
7533
- position: relative;
7534
- width: 100%;
7535
- 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);
7536
- cursor: pointer;
7537
- }
7538
-
7539
- .pf-c-dual-list-selector__item-count {
7540
- margin-left: var(--pf-c-dual-list-selector__item-count--Marginleft);
7541
- }
7542
-
7543
- .pf-c-dual-list-selector__item-count .pf-c-badge.pf-m-read {
7544
- --pf-c-badge--m-read--BackgroundColor: var(--pf-c-dual-list-selector__item--c-badge--m-read--BackgroundColor);
7545
- }
7546
-
7547
- .pf-c-dual-list-selector__item-text {
7548
- overflow: hidden;
7549
- text-overflow: ellipsis;
7550
- white-space: nowrap;
7551
- flex-grow: 1;
7552
- color: var(--pf-c-dual-list-selector__item-text--Color);
7553
- }
7554
-
7555
- .pf-c-dual-list-selector__controls {
7556
- grid-area: var(--pf-c-dual-list-selector__controls--GridArea);
7557
- align-self: center;
7558
- padding-right: var(--pf-c-dual-list-selector__controls--PaddingRight);
7559
- padding-left: var(--pf-c-dual-list-selector__controls--PaddingLeft);
7560
- }
7561
-
7562
- .pf-c-dual-list-selector__item-main {
7563
- display: flex;
7564
- min-width: 0;
7565
- }
7566
-
7567
- .pf-c-dual-list-selector__item-toggle {
7568
- 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);
7569
- margin-top: var(--pf-c-dual-list-selector__item-toggle--MarginTop);
7570
- margin-bottom: var(--pf-c-dual-list-selector__item-toggle--MarginBottom);
7571
- }
7572
-
7573
- .pf-c-dual-list-selector__item-check {
7574
- display: flex;
7575
- align-items: center;
7576
- margin-right: var(--pf-c-dual-list-selector__item-check--MarginRight);
7577
- }
7578
-
7579
- .pf-c-dual-list-selector__item-toggle-icon {
7580
- display: inline-block;
7581
- min-width: var(--pf-c-dual-list-selector__item-toggle-icon--MinWidth);
7582
- color: var(--pf-c-dual-list-selector__item-toggle-icon--Color, inherit);
7583
- text-align: center;
7584
- transition: var(--pf-c-dual-list-selector__item-toggle-icon--Transition);
7585
- transform: rotate(var(--pf-c-dual-list-selector__item-toggle-icon--Rotate));
7586
- }
7587
-
7588
- .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) * 1 + 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
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7594
- --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));
7595
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7596
- }
7597
-
7598
- .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 {
7599
- --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));
7600
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7601
- }
7602
-
7603
- .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 {
7604
- --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));
7605
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7606
- }
7607
-
7608
- .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 {
7609
- --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));
7610
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7611
- }
7612
-
7613
- .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 {
7614
- --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));
7615
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7616
- }
7617
-
7618
- .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 {
7619
- --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));
7620
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7621
- }
7622
-
7623
- .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 {
7624
- --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));
7625
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7626
- }
7627
-
7628
- .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 {
7629
- --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));
7630
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7631
- }
7632
-
7633
- .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 {
7634
- --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));
7635
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7636
- }
7637
-
7638
7313
  .pf-c-dropdown {
7639
7314
  --pf-c-dropdown__toggle--PaddingTop: var(--pf-global--spacer--form-element);
7640
7315
  --pf-c-dropdown__toggle--PaddingRight: var(--pf-global--spacer--sm);
@@ -7810,577 +7485,902 @@ label.pf-c-check, .pf-c-check__label,
7810
7485
  height: 100%;
7811
7486
  }
7812
7487
 
7813
- .pf-c-dropdown.pf-m-full-height .pf-c-dropdown__toggle {
7814
- align-self: stretch;
7488
+ .pf-c-dropdown.pf-m-full-height .pf-c-dropdown__toggle {
7489
+ align-self: stretch;
7490
+ }
7491
+
7492
+ .pf-c-dropdown.pf-m-full-height .pf-c-dropdown__toggle::before {
7493
+ border-top-width: var(--pf-c-dropdown--m-full-height__toggle--before--BorderTopWidth);
7494
+ }
7495
+
7496
+ .pf-c-dropdown.pf-m-full-height:hover .pf-c-dropdown__toggle::before {
7497
+ border-bottom-width: var(--pf-c-dropdown--m-full-height__toggle--hover--before--BorderBottomWidth);
7498
+ }
7499
+
7500
+ .pf-c-dropdown.pf-m-expanded {
7501
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--m-expanded--BackgroundColor);
7502
+ --pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--m-split-button--child--before--BorderWidth);
7503
+ }
7504
+
7505
+ .pf-c-dropdown__toggle {
7506
+ position: relative;
7507
+ display: flex;
7508
+ align-items: center;
7509
+ justify-content: space-between;
7510
+ min-width: var(--pf-c-dropdown__toggle--MinWidth);
7511
+ max-width: 100%;
7512
+ padding: var(--pf-c-dropdown__toggle--PaddingTop) var(--pf-c-dropdown__toggle--PaddingRight) var(--pf-c-dropdown__toggle--PaddingBottom) var(--pf-c-dropdown__toggle--PaddingLeft);
7513
+ font-size: var(--pf-c-dropdown__toggle--FontSize);
7514
+ font-weight: var(--pf-c-dropdown__toggle--FontWeight);
7515
+ line-height: var(--pf-c-dropdown__toggle--LineHeight);
7516
+ color: var(--pf-c-dropdown__toggle--Color);
7517
+ background-color: var(--pf-c-dropdown__toggle--BackgroundColor);
7518
+ border: none;
7519
+ }
7520
+
7521
+ .pf-c-dropdown__toggle::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button::before {
7522
+ position: absolute;
7523
+ top: 0;
7524
+ right: 0;
7525
+ bottom: 0;
7526
+ left: 0;
7527
+ content: "";
7528
+ border: var(--pf-c-dropdown__toggle--before--BorderWidth) solid;
7529
+ border-color: var(--pf-c-dropdown__toggle--before--BorderTopColor) var(--pf-c-dropdown__toggle--before--BorderRightColor) var(--pf-c-dropdown__toggle--before--BorderBottomColor) var(--pf-c-dropdown__toggle--before--BorderLeftColor);
7530
+ }
7531
+
7532
+ .pf-c-dropdown__toggle.pf-m-disabled, .pf-c-dropdown__toggle:disabled {
7533
+ --pf-c-dropdown__toggle--m-primary--Color: var(--pf-c-dropdown__toggle--m-primary--disabled--Color);
7534
+ --pf-c-dropdown__toggle--before--BorderBottomColor: transparent;
7535
+ pointer-events: none;
7536
+ }
7537
+
7538
+ .pf-c-dropdown__toggle.pf-m-disabled:not(.pf-m-plain), .pf-c-dropdown__toggle.pf-m-disabled.pf-m-plain.pf-m-text, .pf-c-dropdown__toggle:disabled:not(.pf-m-plain), .pf-c-dropdown__toggle:disabled.pf-m-plain.pf-m-text {
7539
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--disabled--BackgroundColor);
7540
+ }
7541
+
7542
+ .pf-c-dropdown__toggle.pf-m-disabled:not(.pf-m-plain)::before, .pf-c-dropdown__toggle.pf-m-disabled.pf-m-plain.pf-m-text::before, .pf-c-dropdown__toggle:disabled:not(.pf-m-plain)::before, .pf-c-dropdown__toggle:disabled.pf-m-plain.pf-m-text::before {
7543
+ border: 0;
7544
+ }
7545
+
7546
+ .pf-c-dropdown__toggle.pf-m-split-button {
7547
+ padding: 0;
7548
+ }
7549
+
7550
+ .pf-c-dropdown__toggle.pf-m-split-button:not(.pf-m-disabled) {
7551
+ background-color: var(--pf-c-dropdown__toggle--m-split-button--child--BackgroundColor);
7552
+ }
7553
+
7554
+ .pf-c-dropdown__toggle.pf-m-split-button > * {
7555
+ position: relative;
7556
+ padding-top: var(--pf-c-dropdown__toggle--m-split-button--child--PaddingTop);
7557
+ padding-right: var(--pf-c-dropdown__toggle--m-split-button--child--PaddingRight);
7558
+ padding-bottom: var(--pf-c-dropdown__toggle--m-split-button--child--PaddingBottom);
7559
+ padding-left: var(--pf-c-dropdown__toggle--m-split-button--child--PaddingLeft);
7560
+ }
7561
+
7562
+ .pf-c-dropdown__toggle.pf-m-split-button > *:first-child {
7563
+ --pf-c-dropdown__toggle--m-split-button--child--PaddingLeft: var(--pf-c-dropdown__toggle--m-split-button--first-child--PaddingLeft);
7564
+ }
7565
+
7566
+ .pf-c-dropdown__toggle.pf-m-split-button > *:last-child {
7567
+ --pf-c-dropdown__toggle--m-split-button--child--PaddingRight: var(--pf-c-dropdown__toggle--m-split-button--last-child--PaddingRight);
7568
+ }
7569
+
7570
+ .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action {
7571
+ --pf-c-dropdown__toggle--m-split-button--child--PaddingRight: var(--pf-c-dropdown__toggle--m-split-button--m-action--child--PaddingRight);
7572
+ --pf-c-dropdown__toggle--m-split-button--child--PaddingLeft: var(--pf-c-dropdown__toggle--m-split-button--m-action--child--PaddingLeft);
7573
+ }
7574
+
7575
+ .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action .pf-c-dropdown__toggle-button {
7576
+ margin-right: var(--pf-c-dropdown__toggle--m-split-button--m-action__toggle-button--MarginRight);
7577
+ }
7578
+
7579
+ .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action .pf-c-dropdown__toggle-button::before {
7580
+ border-left: 0;
7581
+ }
7582
+
7583
+ .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action .pf-c-dropdown__toggle-button:last-child {
7584
+ --pf-c-dropdown__toggle--m-split-button--m-action__toggle-button--MarginRight: 0;
7585
+ }
7586
+
7587
+ .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action.pf-m-primary > :not(:first-child) {
7588
+ border-left: var(--pf-c-dropdown__toggle--m-split-button--m-primary--m-action--child--BorderLeftWidth) solid var(--pf-c-dropdown__toggle--m-split-button--m-primary--m-action--child--BorderLeftColor);
7589
+ }
7590
+
7591
+ .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action.pf-m-primary.pf-m-disabled, .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action.pf-m-primary[disabled] {
7592
+ --pf-c-dropdown__toggle--m-split-button--m-primary--m-action--child--BorderLeftWidth: 0;
7593
+ }
7594
+
7595
+ .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-check {
7596
+ display: flex;
7597
+ align-items: center;
7598
+ cursor: pointer;
7599
+ }
7600
+
7601
+ .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-check > input,
7602
+ .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-check .pf-c-check {
7603
+ cursor: pointer;
7604
+ transform: translateY(var(--pf-c-dropdown__toggle--m-split-button__toggle-check__input--TranslateY));
7605
+ }
7606
+
7607
+ .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-button {
7608
+ color: var(--pf-c-dropdown__toggle-button--Color);
7609
+ border: 0;
7610
+ }
7611
+
7612
+ .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-text {
7613
+ margin-left: var(--pf-c-dropdown__toggle--m-split-button__toggle-text--MarginLeft);
7614
+ }
7615
+
7616
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) {
7617
+ --pf-c-dropdown__toggle--before--BorderWidth: 0;
7618
+ --pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth: 0;
7619
+ }
7620
+
7621
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > * {
7622
+ background-color: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor);
7623
+ border: 0;
7624
+ }
7625
+
7626
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:hover {
7627
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--hover--BackgroundColor);
7628
+ }
7629
+
7630
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:focus {
7631
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--focus--BackgroundColor);
7632
+ }
7633
+
7634
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *.pf-m-active {
7635
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--focus--BackgroundColor);
7636
+ }
7637
+
7638
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > :first-child {
7639
+ border-top-left-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7640
+ border-bottom-left-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7641
+ }
7642
+
7643
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > :last-child {
7644
+ border-top-right-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7645
+ border-bottom-right-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7646
+ }
7647
+
7648
+ .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 {
7649
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--hover--before--BorderBottomColor);
7650
+ }
7651
+
7652
+ .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 {
7653
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--focus--before--BorderBottomColor);
7654
+ border-bottom-width: var(--pf-c-dropdown__toggle--focus--before--BorderBottomWidth);
7655
+ }
7656
+
7657
+ .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 {
7658
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--active--before--BorderBottomColor);
7659
+ border-bottom-width: var(--pf-c-dropdown__toggle--active--before--BorderBottomWidth);
7660
+ }
7661
+
7662
+ .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 {
7663
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomColor);
7664
+ border-bottom-width: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth);
7665
+ }
7666
+
7667
+ .pf-c-dropdown__toggle.pf-m-plain {
7668
+ --pf-c-dropdown__toggle-icon--Color: var(--pf-c-dropdown--m-plain__toggle-icon--Color);
7669
+ }
7670
+
7671
+ .pf-c-dropdown__toggle.pf-m-plain:not(.pf-m-text) {
7672
+ --pf-c-dropdown__toggle--PaddingRight: var(--pf-c-dropdown__toggle--m-plain--PaddingRight);
7673
+ --pf-c-dropdown__toggle--PaddingLeft: var(--pf-c-dropdown__toggle--m-plain--PaddingLeft);
7674
+ display: inline-block;
7675
+ color: var(--pf-c-dropdown__toggle--m-plain--Color);
7676
+ }
7677
+
7678
+ .pf-c-dropdown__toggle.pf-m-plain:not(.pf-m-text) > * {
7679
+ line-height: var(--pf-c-dropdown__toggle--m-plain--child--LineHeight);
7680
+ }
7681
+
7682
+ .pf-c-dropdown__toggle.pf-m-plain::before {
7683
+ border: 0;
7684
+ }
7685
+
7686
+ .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 {
7687
+ --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--hover--Color);
7688
+ --pf-c-dropdown--m-plain__toggle-icon--Color: var(--pf-c-dropdown--m-plain--hover__toggle-icon--Color);
7689
+ }
7690
+
7691
+ .pf-c-dropdown__toggle.pf-m-plain.pf-m-disabled, .pf-c-dropdown__toggle.pf-m-plain:disabled {
7692
+ --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--disabled--Color);
7693
+ }
7694
+
7695
+ .pf-c-dropdown__toggle.pf-m-primary {
7696
+ --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
7697
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--BackgroundColor);
7698
+ --pf-c-dropdown__toggle-button--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
7699
+ border-radius: var(--pf-c-dropdown__toggle--m-primary--BorderRadius);
7700
+ }
7701
+
7702
+ .pf-c-dropdown__toggle.pf-m-primary::before,
7703
+ .pf-c-dropdown__toggle.pf-m-primary .pf-c-dropdown__toggle-button::before {
7704
+ border: 0;
7705
+ }
7706
+
7707
+ .pf-c-dropdown__toggle.pf-m-primary:hover {
7708
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--hover--BackgroundColor);
7709
+ }
7710
+
7711
+ .pf-c-dropdown__toggle.pf-m-primary:focus {
7712
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--focus--BackgroundColor);
7713
+ }
7714
+
7715
+ .pf-c-dropdown__toggle.pf-m-primary:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-active {
7716
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--active--BackgroundColor);
7717
+ }
7718
+
7719
+ .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-primary {
7720
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown--m-expanded__toggle--m-primary--BackgroundColor);
7721
+ }
7722
+
7723
+ .pf-c-dropdown__toggle.pf-m-secondary {
7724
+ border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
7725
+ }
7726
+
7727
+ .pf-c-dropdown__toggle.pf-m-secondary:not(.pf-m-disabled):not([disabled]) {
7728
+ --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-secondary--Color);
7729
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-secondary--BackgroundColor);
7730
+ }
7731
+
7732
+ .pf-c-dropdown__toggle.pf-m-secondary:not(.pf-m-disabled):not([disabled])::before {
7733
+ border: var(--pf-c-dropdown__toggle--m-secondary--before--BorderWidth) solid var(--pf-c-dropdown__toggle--m-secondary--before--BorderColor);
7734
+ border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
7815
7735
  }
7816
7736
 
7817
- .pf-c-dropdown.pf-m-full-height .pf-c-dropdown__toggle::before {
7818
- border-top-width: var(--pf-c-dropdown--m-full-height__toggle--before--BorderTopWidth);
7737
+ .pf-c-dropdown__toggle.pf-m-secondary:hover {
7738
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth);
7819
7739
  }
7820
7740
 
7821
- .pf-c-dropdown.pf-m-full-height:hover .pf-c-dropdown__toggle::before {
7822
- border-bottom-width: var(--pf-c-dropdown--m-full-height__toggle--hover--before--BorderBottomWidth);
7741
+ .pf-c-dropdown__toggle.pf-m-secondary:focus {
7742
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth);
7823
7743
  }
7824
7744
 
7825
- .pf-c-dropdown.pf-m-expanded {
7826
- --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--m-expanded--BackgroundColor);
7827
- --pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--m-split-button--child--before--BorderWidth);
7745
+ .pf-c-dropdown__toggle.pf-m-secondary:active, .pf-c-dropdown__toggle.pf-m-secondary.pf-m-active {
7746
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth);
7828
7747
  }
7829
7748
 
7830
- .pf-c-dropdown__toggle {
7831
- position: relative;
7832
- display: flex;
7833
- align-items: center;
7834
- justify-content: space-between;
7835
- min-width: var(--pf-c-dropdown__toggle--MinWidth);
7836
- max-width: 100%;
7837
- padding: var(--pf-c-dropdown__toggle--PaddingTop) var(--pf-c-dropdown__toggle--PaddingRight) var(--pf-c-dropdown__toggle--PaddingBottom) var(--pf-c-dropdown__toggle--PaddingLeft);
7838
- font-size: var(--pf-c-dropdown__toggle--FontSize);
7839
- font-weight: var(--pf-c-dropdown__toggle--FontWeight);
7840
- line-height: var(--pf-c-dropdown__toggle--LineHeight);
7841
- color: var(--pf-c-dropdown__toggle--Color);
7842
- background-color: var(--pf-c-dropdown__toggle--BackgroundColor);
7843
- border: none;
7749
+ .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-secondary {
7750
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderWidth);
7751
+ --pf-c-dropdown__toggle--m-secondary--before--BorderColor: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderColor);
7844
7752
  }
7845
7753
 
7846
- .pf-c-dropdown__toggle::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button::before {
7847
- position: absolute;
7848
- top: 0;
7849
- right: 0;
7850
- bottom: 0;
7851
- left: 0;
7852
- content: "";
7853
- border: var(--pf-c-dropdown__toggle--before--BorderWidth) solid;
7854
- border-color: var(--pf-c-dropdown__toggle--before--BorderTopColor) var(--pf-c-dropdown__toggle--before--BorderRightColor) var(--pf-c-dropdown__toggle--before--BorderBottomColor) var(--pf-c-dropdown__toggle--before--BorderLeftColor);
7754
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) {
7755
+ --pf-c-dropdown__toggle-button--Color: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--Color);
7855
7756
  }
7856
7757
 
7857
- .pf-c-dropdown__toggle.pf-m-disabled, .pf-c-dropdown__toggle:disabled {
7858
- --pf-c-dropdown__toggle--m-primary--Color: var(--pf-c-dropdown__toggle--m-primary--disabled--Color);
7859
- --pf-c-dropdown__toggle--before--BorderBottomColor: transparent;
7860
- pointer-events: none;
7758
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):hover {
7759
+ --pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--hover--before--BorderWidth);
7861
7760
  }
7862
7761
 
7863
- .pf-c-dropdown__toggle.pf-m-disabled:not(.pf-m-plain), .pf-c-dropdown__toggle.pf-m-disabled.pf-m-plain.pf-m-text, .pf-c-dropdown__toggle:disabled:not(.pf-m-plain), .pf-c-dropdown__toggle:disabled.pf-m-plain.pf-m-text {
7864
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--disabled--BackgroundColor);
7762
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):focus {
7763
+ --pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--focus--before--BorderWidth);
7865
7764
  }
7866
7765
 
7867
- .pf-c-dropdown__toggle.pf-m-disabled:not(.pf-m-plain)::before, .pf-c-dropdown__toggle.pf-m-disabled.pf-m-plain.pf-m-text::before, .pf-c-dropdown__toggle:disabled:not(.pf-m-plain)::before, .pf-c-dropdown__toggle:disabled.pf-m-plain.pf-m-text::before {
7868
- border: 0;
7766
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):active {
7767
+ --pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--active--before--BorderWidth);
7869
7768
  }
7870
7769
 
7871
- .pf-c-dropdown__toggle.pf-m-split-button {
7872
- padding: 0;
7770
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *::before {
7771
+ 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);
7873
7772
  }
7874
7773
 
7875
- .pf-c-dropdown__toggle.pf-m-split-button:not(.pf-m-disabled) {
7876
- background-color: var(--pf-c-dropdown__toggle--m-split-button--child--BackgroundColor);
7774
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:hover {
7775
+ --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);
7877
7776
  }
7878
7777
 
7879
- .pf-c-dropdown__toggle.pf-m-split-button > * {
7880
- position: relative;
7881
- padding-top: var(--pf-c-dropdown__toggle--m-split-button--child--PaddingTop);
7882
- padding-right: var(--pf-c-dropdown__toggle--m-split-button--child--PaddingRight);
7883
- padding-bottom: var(--pf-c-dropdown__toggle--m-split-button--child--PaddingBottom);
7884
- padding-left: var(--pf-c-dropdown__toggle--m-split-button--child--PaddingLeft);
7778
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:focus {
7779
+ --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);
7885
7780
  }
7886
7781
 
7887
- .pf-c-dropdown__toggle.pf-m-split-button > *:first-child {
7888
- --pf-c-dropdown__toggle--m-split-button--child--PaddingLeft: var(--pf-c-dropdown__toggle--m-split-button--first-child--PaddingLeft);
7782
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:active {
7783
+ --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);
7889
7784
  }
7890
7785
 
7891
- .pf-c-dropdown__toggle.pf-m-split-button > *:last-child {
7892
- --pf-c-dropdown__toggle--m-split-button--child--PaddingRight: var(--pf-c-dropdown__toggle--m-split-button--last-child--PaddingRight);
7786
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:first-child::before {
7787
+ border-top-left-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
7788
+ border-bottom-left-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
7893
7789
  }
7894
7790
 
7895
- .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action {
7896
- --pf-c-dropdown__toggle--m-split-button--child--PaddingRight: var(--pf-c-dropdown__toggle--m-split-button--m-action--child--PaddingRight);
7897
- --pf-c-dropdown__toggle--m-split-button--child--PaddingLeft: var(--pf-c-dropdown__toggle--m-split-button--m-action--child--PaddingLeft);
7791
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:last-child::before {
7792
+ border-top-right-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
7793
+ border-bottom-right-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
7898
7794
  }
7899
7795
 
7900
- .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action .pf-c-dropdown__toggle-button {
7901
- margin-right: var(--pf-c-dropdown__toggle--m-split-button--m-action__toggle-button--MarginRight);
7796
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:not(:first-child)::before {
7797
+ 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);
7902
7798
  }
7903
7799
 
7904
- .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action .pf-c-dropdown__toggle-button::before {
7905
- border-left: 0;
7800
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:not(:last-child)::before {
7801
+ border-right: 0;
7906
7802
  }
7907
7803
 
7908
- .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action .pf-c-dropdown__toggle-button:last-child {
7909
- --pf-c-dropdown__toggle--m-split-button--m-action__toggle-button--MarginRight: 0;
7804
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled).pf-m-action::before {
7805
+ border: 0;
7910
7806
  }
7911
7807
 
7912
- .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action.pf-m-primary > :not(:first-child) {
7913
- border-left: var(--pf-c-dropdown__toggle--m-split-button--m-primary--m-action--child--BorderLeftWidth) solid var(--pf-c-dropdown__toggle--m-split-button--m-primary--m-action--child--BorderLeftColor);
7808
+ .pf-c-dropdown__toggle > .pf-c-badge {
7809
+ --pf-c-dropdown__toggle-icon--MarginLeft: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginLeft);
7810
+ --pf-c-dropdown__toggle-icon--MarginRight: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginRight);
7914
7811
  }
7915
7812
 
7916
- .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action.pf-m-primary.pf-m-disabled, .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action.pf-m-primary[disabled] {
7917
- --pf-c-dropdown__toggle--m-split-button--m-primary--m-action--child--BorderLeftWidth: 0;
7813
+ .pf-c-dropdown__toggle .pf-c-dropdown__toggle-text {
7814
+ overflow: hidden;
7815
+ text-overflow: ellipsis;
7816
+ white-space: nowrap;
7918
7817
  }
7919
7818
 
7920
- .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-check {
7921
- display: flex;
7922
- align-items: center;
7923
- cursor: pointer;
7819
+ .pf-c-dropdown__toggle-text {
7820
+ flex: 0 1 auto;
7924
7821
  }
7925
7822
 
7926
- .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-check > input,
7927
- .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-check .pf-c-check {
7928
- cursor: pointer;
7929
- transform: translateY(var(--pf-c-dropdown__toggle--m-split-button__toggle-check__input--TranslateY));
7823
+ .pf-c-dropdown__toggle-icon {
7824
+ margin-right: var(--pf-c-dropdown__toggle-icon--MarginRight);
7825
+ margin-left: var(--pf-c-dropdown__toggle-icon--MarginLeft);
7826
+ line-height: var(--pf-c-dropdown__toggle-icon--LineHeight);
7827
+ color: var(--pf-c-dropdown__toggle-icon--Color, inherit);
7930
7828
  }
7931
7829
 
7932
- .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-button {
7933
- color: var(--pf-c-dropdown__toggle-button--Color);
7934
- border: 0;
7830
+ .pf-c-dropdown.pf-m-top.pf-m-expanded .pf-c-dropdown__toggle-icon {
7831
+ transform: rotate(var(--pf-c-dropdown--m-top--m-expanded__toggle-icon--Rotate));
7935
7832
  }
7936
7833
 
7937
- .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-text {
7938
- margin-left: var(--pf-c-dropdown__toggle--m-split-button__toggle-text--MarginLeft);
7834
+ .pf-c-dropdown__toggle-image {
7835
+ display: inline-flex;
7836
+ flex-shrink: 0;
7837
+ align-self: center;
7838
+ margin-top: var(--pf-c-dropdown__toggle-image--MarginTop);
7839
+ margin-right: var(--pf-c-dropdown__toggle-image--MarginRight);
7840
+ margin-bottom: var(--pf-c-dropdown__toggle-image--MarginBottom);
7841
+ line-height: 1;
7939
7842
  }
7940
7843
 
7941
- .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) {
7942
- --pf-c-dropdown__toggle--before--BorderWidth: 0;
7943
- --pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth: 0;
7844
+ .pf-c-dropdown__toggle-image:last-child {
7845
+ --pf-c-dropdown__toggle-image--MarginRight: 0;
7944
7846
  }
7945
7847
 
7946
- .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > * {
7947
- background-color: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor);
7948
- border: 0;
7848
+ .pf-c-dropdown__menu {
7849
+ position: absolute;
7850
+ top: var(--pf-c-dropdown__menu--Top);
7851
+ z-index: var(--pf-c-dropdown__menu--ZIndex);
7852
+ padding-top: var(--pf-c-dropdown__menu--PaddingTop);
7853
+ padding-bottom: var(--pf-c-dropdown__menu--PaddingBottom);
7854
+ background: var(--pf-c-dropdown__menu--BackgroundColor);
7855
+ background-clip: padding-box;
7856
+ box-shadow: var(--pf-c-dropdown__menu--BoxShadow);
7949
7857
  }
7950
7858
 
7951
- .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:hover {
7952
- --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--hover--BackgroundColor);
7859
+ .pf-c-dropdown__menu.pf-m-static {
7860
+ --pf-c-dropdown--m-top__menu--TranslateY: 0;
7861
+ position: static;
7862
+ top: auto;
7863
+ right: auto;
7864
+ bottom: auto;
7865
+ left: auto;
7866
+ z-index: auto;
7867
+ min-width: min-content;
7953
7868
  }
7954
7869
 
7955
- .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:focus {
7956
- --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--focus--BackgroundColor);
7870
+ .pf-c-dropdown .pf-c-menu,
7871
+ .pf-c-dropdown__menu {
7872
+ min-width: 100%;
7957
7873
  }
7958
7874
 
7959
- .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *.pf-m-active {
7960
- --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--focus--BackgroundColor);
7875
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right,
7876
+ .pf-c-dropdown__menu.pf-m-align-right {
7877
+ right: 0;
7961
7878
  }
7962
7879
 
7963
- .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > :first-child {
7964
- border-top-left-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7965
- border-bottom-left-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7880
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left,
7881
+ .pf-c-dropdown__menu.pf-m-align-left {
7882
+ right: auto;
7966
7883
  }
7967
7884
 
7968
- .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > :last-child {
7969
- border-top-right-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7970
- border-bottom-right-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7885
+ @media (min-width: 576px) {
7886
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-sm,
7887
+ .pf-c-dropdown__menu.pf-m-align-right-on-sm {
7888
+ right: 0;
7889
+ }
7890
+
7891
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-sm,
7892
+ .pf-c-dropdown__menu.pf-m-align-left-on-sm {
7893
+ right: auto;
7894
+ }
7971
7895
  }
7896
+ @media (min-width: 768px) {
7897
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-md,
7898
+ .pf-c-dropdown__menu.pf-m-align-right-on-md {
7899
+ right: 0;
7900
+ }
7972
7901
 
7973
- .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 {
7974
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--hover--before--BorderBottomColor);
7902
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-md,
7903
+ .pf-c-dropdown__menu.pf-m-align-left-on-md {
7904
+ right: auto;
7905
+ }
7975
7906
  }
7907
+ @media (min-width: 992px) {
7908
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-lg,
7909
+ .pf-c-dropdown__menu.pf-m-align-right-on-lg {
7910
+ right: 0;
7911
+ }
7976
7912
 
7977
- .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 {
7978
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--focus--before--BorderBottomColor);
7979
- border-bottom-width: var(--pf-c-dropdown__toggle--focus--before--BorderBottomWidth);
7913
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-lg,
7914
+ .pf-c-dropdown__menu.pf-m-align-left-on-lg {
7915
+ right: auto;
7916
+ }
7980
7917
  }
7918
+ @media (min-width: 1200px) {
7919
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-xl,
7920
+ .pf-c-dropdown__menu.pf-m-align-right-on-xl {
7921
+ right: 0;
7922
+ }
7981
7923
 
7982
- .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 {
7983
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--active--before--BorderBottomColor);
7984
- border-bottom-width: var(--pf-c-dropdown__toggle--active--before--BorderBottomWidth);
7924
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-xl,
7925
+ .pf-c-dropdown__menu.pf-m-align-left-on-xl {
7926
+ right: auto;
7927
+ }
7928
+ }
7929
+ @media (min-width: 1450px) {
7930
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-2xl,
7931
+ .pf-c-dropdown__menu.pf-m-align-right-on-2xl {
7932
+ right: 0;
7933
+ }
7934
+
7935
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-2xl,
7936
+ .pf-c-dropdown__menu.pf-m-align-left-on-2xl {
7937
+ right: auto;
7938
+ }
7939
+ }
7940
+ .pf-c-dropdown.pf-m-top .pf-c-dropdown__menu {
7941
+ --pf-c-dropdown__menu--Top: var(--pf-c-dropdown--m-top__menu--Top);
7942
+ transform: translateY(var(--pf-c-dropdown--m-top__menu--TranslateY));
7985
7943
  }
7986
7944
 
7987
- .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 {
7988
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomColor);
7989
- border-bottom-width: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth);
7945
+ .pf-c-dropdown.pf-m-top > .pf-c-menu {
7946
+ --pf-c-dropdown--c-menu--Top: var(--pf-c-dropdown--m-top--c-menu--Top);
7947
+ transform: translateY(var(--pf-c-dropdown--m-top--c-menu--TranslateY));
7990
7948
  }
7991
7949
 
7992
- .pf-c-dropdown__toggle.pf-m-plain {
7993
- --pf-c-dropdown__toggle-icon--Color: var(--pf-c-dropdown--m-plain__toggle-icon--Color);
7950
+ .pf-c-dropdown__menu-item {
7951
+ display: block;
7952
+ width: 100%;
7953
+ 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);
7954
+ font-size: var(--pf-c-dropdown__menu-item--FontSize);
7955
+ font-weight: var(--pf-c-dropdown__menu-item--FontWeight);
7956
+ line-height: var(--pf-c-dropdown__menu-item--LineHeight);
7957
+ color: var(--pf-c-dropdown__menu-item--Color);
7958
+ text-align: left;
7959
+ white-space: nowrap;
7960
+ background-color: var(--pf-c-dropdown__menu-item--BackgroundColor);
7961
+ border: none;
7994
7962
  }
7995
7963
 
7996
- .pf-c-dropdown__toggle.pf-m-plain:not(.pf-m-text) {
7997
- --pf-c-dropdown__toggle--PaddingRight: var(--pf-c-dropdown__toggle--m-plain--PaddingRight);
7998
- --pf-c-dropdown__toggle--PaddingLeft: var(--pf-c-dropdown__toggle--m-plain--PaddingLeft);
7999
- display: inline-block;
8000
- color: var(--pf-c-dropdown__toggle--m-plain--Color);
7964
+ .pf-c-dropdown__menu-item:hover, .pf-c-dropdown__menu-item:focus {
7965
+ --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--hover--Color);
7966
+ --pf-c-dropdown__menu-item--BackgroundColor: var(--pf-c-dropdown__menu-item--hover--BackgroundColor);
7967
+ text-decoration: none;
8001
7968
  }
8002
7969
 
8003
- .pf-c-dropdown__toggle.pf-m-plain:not(.pf-m-text) > * {
8004
- line-height: var(--pf-c-dropdown__toggle--m-plain--child--LineHeight);
7970
+ .pf-c-dropdown__menu-item:disabled, .pf-c-dropdown__menu-item.pf-m-disabled, .pf-c-dropdown__menu-item.pf-m-aria-disabled {
7971
+ --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--disabled--Color);
7972
+ --pf-c-dropdown__menu-item--BackgroundColor: var(--pf-c-dropdown__menu-item--disabled--BackgroundColor);
8005
7973
  }
8006
7974
 
8007
- .pf-c-dropdown__toggle.pf-m-plain::before {
8008
- border: 0;
7975
+ .pf-c-dropdown__menu-item:disabled, .pf-c-dropdown__menu-item.pf-m-disabled {
7976
+ pointer-events: none;
8009
7977
  }
8010
7978
 
8011
- .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 {
8012
- --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--hover--Color);
8013
- --pf-c-dropdown--m-plain__toggle-icon--Color: var(--pf-c-dropdown--m-plain--hover__toggle-icon--Color);
7979
+ .pf-c-dropdown__menu-item.pf-m-aria-disabled {
7980
+ cursor: default;
8014
7981
  }
8015
7982
 
8016
- .pf-c-dropdown__toggle.pf-m-plain.pf-m-disabled, .pf-c-dropdown__toggle.pf-m-plain:disabled {
8017
- --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--disabled--Color);
7983
+ .pf-c-dropdown__menu-item.pf-m-icon {
7984
+ display: flex;
7985
+ align-items: center;
8018
7986
  }
8019
7987
 
8020
- .pf-c-dropdown__toggle.pf-m-primary {
8021
- --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
8022
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--BackgroundColor);
8023
- --pf-c-dropdown__toggle-button--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
8024
- border-radius: var(--pf-c-dropdown__toggle--m-primary--BorderRadius);
7988
+ .pf-c-dropdown__menu-item.pf-m-icon.pf-m-description {
7989
+ flex-direction: column;
7990
+ align-items: start;
8025
7991
  }
8026
7992
 
8027
- .pf-c-dropdown__toggle.pf-m-primary::before,
8028
- .pf-c-dropdown__toggle.pf-m-primary .pf-c-dropdown__toggle-button::before {
8029
- border: 0;
7993
+ .pf-c-dropdown__menu-item.pf-m-icon .pf-c-dropdown__menu-item-main {
7994
+ display: flex;
7995
+ align-items: center;
8030
7996
  }
8031
7997
 
8032
- .pf-c-dropdown__toggle.pf-m-primary:hover {
8033
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--hover--BackgroundColor);
7998
+ .pf-c-dropdown__menu-item.pf-m-text {
7999
+ --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--m-text--Color);
8034
8000
  }
8035
8001
 
8036
- .pf-c-dropdown__toggle.pf-m-primary:focus {
8037
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--focus--BackgroundColor);
8002
+ .pf-c-dropdown__menu-item.pf-m-text:hover, .pf-c-dropdown__menu-item.pf-m-text:focus {
8003
+ --pf-c-dropdown__menu-item--BackgroundColor: transparent;
8038
8004
  }
8039
8005
 
8040
- .pf-c-dropdown__toggle.pf-m-primary:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-active {
8041
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--active--BackgroundColor);
8006
+ .pf-c-dropdown__menu-item-icon {
8007
+ display: inline-flex;
8008
+ align-items: center;
8009
+ justify-content: center;
8010
+ width: var(--pf-c-dropdown__menu-item-icon--Width);
8011
+ height: var(--pf-c-dropdown__menu-item-icon--Height);
8012
+ margin-right: var(--pf-c-dropdown__menu-item-icon--MarginRight);
8042
8013
  }
8043
8014
 
8044
- .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-primary {
8045
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown--m-expanded__toggle--m-primary--BackgroundColor);
8015
+ .pf-c-dropdown__menu-item-icon > * {
8016
+ max-width: 100%;
8017
+ max-height: 100%;
8046
8018
  }
8047
8019
 
8048
- .pf-c-dropdown__toggle.pf-m-secondary {
8049
- border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
8020
+ .pf-c-dropdown__menu-item-description {
8021
+ font-size: var(--pf-c-dropdown__menu-item-description--FontSize);
8022
+ color: var(--pf-c-dropdown__menu-item-description--Color);
8050
8023
  }
8051
8024
 
8052
- .pf-c-dropdown__toggle.pf-m-secondary:not(.pf-m-disabled):not([disabled]) {
8053
- --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-secondary--Color);
8054
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-secondary--BackgroundColor);
8025
+ .pf-c-dropdown__group + .pf-c-dropdown__group {
8026
+ padding-top: var(--pf-c-dropdown__group--group--PaddingTop);
8055
8027
  }
8056
8028
 
8057
- .pf-c-dropdown__toggle.pf-m-secondary:not(.pf-m-disabled):not([disabled])::before {
8058
- border: var(--pf-c-dropdown__toggle--m-secondary--before--BorderWidth) solid var(--pf-c-dropdown__toggle--m-secondary--before--BorderColor);
8059
- border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
8029
+ .pf-c-dropdown__group-title {
8030
+ padding-top: var(--pf-c-dropdown__group-title--PaddingTop);
8031
+ padding-right: var(--pf-c-dropdown__group-title--PaddingRight);
8032
+ padding-bottom: var(--pf-c-dropdown__group-title--PaddingBottom);
8033
+ padding-left: var(--pf-c-dropdown__group-title--PaddingLeft);
8034
+ font-size: var(--pf-c-dropdown__group-title--FontSize);
8035
+ font-weight: var(--pf-c-dropdown__group-title--FontWeight);
8036
+ color: var(--pf-c-dropdown__group-title--Color);
8060
8037
  }
8061
8038
 
8062
- .pf-c-dropdown__toggle.pf-m-secondary:hover {
8063
- --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth);
8039
+ :where(.pf-theme-dark) .pf-c-dropdown {
8040
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-global--BackgroundColor--400);
8041
+ --pf-c-dropdown__toggle--before--BorderTopColor: transparent;
8042
+ --pf-c-dropdown__toggle--before--BorderRightColor: transparent;
8043
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-global--BorderColor--400);
8044
+ --pf-c-dropdown__toggle--before--BorderLeftColor: transparent;
8045
+ --pf-c-dropdown__toggle--disabled--BackgroundColor: var(--pf-global--palette--black-500);
8046
+ --pf-c-dropdown__toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--300);
8047
+ --pf-c-dropdown__menu--BackgroundColor: var(--pf-global--BackgroundColor--300);
8048
+ --pf-c-dropdown__menu--Top: 100%;
8049
+ --pf-c-dropdown--m-top__menu--TranslateY: -100%;
8050
+ --pf-c-dropdown__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
8064
8051
  }
8065
8052
 
8066
- .pf-c-dropdown__toggle.pf-m-secondary:focus {
8067
- --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth);
8053
+ :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 {
8054
+ color: var(--pf-global--palette--black-100);
8068
8055
  }
8069
8056
 
8070
- .pf-c-dropdown__toggle.pf-m-secondary:active, .pf-c-dropdown__toggle.pf-m-secondary.pf-m-active {
8071
- --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth);
8057
+ :where(.pf-theme-dark) .pf-c-dropdown__toggle.pf-m-plain {
8058
+ background: transparent;
8072
8059
  }
8073
8060
 
8074
- .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-secondary {
8075
- --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderWidth);
8076
- --pf-c-dropdown__toggle--m-secondary--before--BorderColor: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderColor);
8061
+ .pf-c-dual-list-selector {
8062
+ --pf-c-dual-list-selector__header--GridArea: pane-header;
8063
+ --pf-c-dual-list-selector__tools--GridArea: pane-tools;
8064
+ --pf-c-dual-list-selector__status--GridArea: pane-status;
8065
+ --pf-c-dual-list-selector__menu--GridArea: pane-menu;
8066
+ --pf-c-dual-list-selector__controls--GridArea: controls;
8067
+ --pf-c-dual-list-selector--m-chosen__header--GridArea: pane-header-c;
8068
+ --pf-c-dual-list-selector--m-chosen__tools--GridArea: pane-tools-c;
8069
+ --pf-c-dual-list-selector--m-chosen__status--GridArea: pane-status-c;
8070
+ --pf-c-dual-list-selector--m-chosen__menu--GridArea: pane-menu-c;
8071
+ --pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min: 12.5rem;
8072
+ --pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max: 28.125rem;
8073
+ --pf-c-dual-list-selector__header--MarginBottom: var(--pf-global--spacer--sm);
8074
+ --pf-c-dual-list-selector__title-text--FontWeight: var(--pf-global--FontWeight--bold);
8075
+ --pf-c-dual-list-selector__tools--MarginBottom: var(--pf-global--spacer--md);
8076
+ --pf-c-dual-list-selector__tools-filter--tools-actions--MarginLeft: var(--pf-global--spacer--sm);
8077
+ --pf-c-dual-list-selector__menu--BorderWidth: var(--pf-global--BorderWidth--sm);
8078
+ --pf-c-dual-list-selector__menu--BorderColor: var(--pf-global--BorderColor--100);
8079
+ --pf-c-dual-list-selector__menu--MinHeight: 12.5rem;
8080
+ --pf-c-dual-list-selector__menu--MaxHeight: 20rem;
8081
+ --pf-c-dual-list-selector__list-item-row--FontSize: var(--pf-global--FontSize--sm);
8082
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: transparent;
8083
+ --pf-c-dual-list-selector__list-item-row--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
8084
+ --pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
8085
+ --pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
8086
+ --pf-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor: var(--pf-global--BackgroundColor--100);
8087
+ --pf-c-dual-list-selector__list-item--m-ghost-row--Opacity: .4;
8088
+ --pf-c-dual-list-selector__item--PaddingTop: var(--pf-global--spacer--sm);
8089
+ --pf-c-dual-list-selector__item--PaddingRight: var(--pf-global--spacer--md);
8090
+ --pf-c-dual-list-selector__item--PaddingBottom: var(--pf-global--spacer--sm);
8091
+ --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-global--spacer--md);
8092
+ --pf-c-dual-list-selector__item--m-expandable--PaddingLeft: 0;
8093
+ --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));
8094
+ --pf-c-dual-list-selector__item--nested-indent--base: calc(var(--pf-c-dual-list-selector__item--indent--base) - var(--pf-global--spacer--md));
8095
+ --pf-c-dual-list-selector__draggable--item--PaddingLeft: var(--pf-global--spacer--xs);
8096
+ --pf-c-dual-list-selector__item-text--Color: var(--pf-global--Color--100);
8097
+ --pf-c-dual-list-selector__list-item-row--m-selected__text--Color: var(--pf-global--active-color--100);
8098
+ --pf-c-dual-list-selector__list-item-row--m-selected__text--FontWeight: var(--pf-global--FontWeight--bold);
8099
+ --pf-c-dual-list-selector__list-item--m-disabled__item-text--Color: var(--pf-global--disabled-color--100);
8100
+ --pf-c-dual-list-selector__status--MarginBottom: var(--pf-global--spacer--sm);
8101
+ --pf-c-dual-list-selector__status-text--FontSize: var(--pf-global--FontSize--sm);
8102
+ --pf-c-dual-list-selector__status-text--Color: var(--pf-global--Color--200);
8103
+ --pf-c-dual-list-selector__controls--PaddingRight: var(--pf-global--spacer--md);
8104
+ --pf-c-dual-list-selector__controls--PaddingLeft: var(--pf-global--spacer--md);
8105
+ --pf-c-dual-list-selector__item-toggle--PaddingTop: var(--pf-global--spacer--sm);
8106
+ --pf-c-dual-list-selector__item-toggle--PaddingRight: var(--pf-global--spacer--sm);
8107
+ --pf-c-dual-list-selector__item-toggle--PaddingBottom: var(--pf-global--spacer--sm);
8108
+ --pf-c-dual-list-selector__item-toggle--PaddingLeft: var(--pf-global--spacer--md);
8109
+ --pf-c-dual-list-selector__item-toggle--MarginTop: calc(var(--pf-global--spacer--sm) * -1);
8110
+ --pf-c-dual-list-selector__item-toggle--MarginBottom: calc(var(--pf-global--spacer--sm) * -1);
8111
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: 0;
8112
+ --pf-c-dual-list-selector__list__list__item-toggle--TranslateX: -100%;
8113
+ --pf-c-dual-list-selector__item-check--MarginRight: var(--pf-global--spacer--sm);
8114
+ --pf-c-dual-list-selector__item-count--Marginleft: var(--pf-global--spacer--sm);
8115
+ --pf-c-dual-list-selector__item--c-badge--m-read--BackgroundColor: var(--pf-global--disabled-color--200);
8116
+ --pf-c-dual-list-selector__item-toggle-icon--Rotate: 0;
8117
+ --pf-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate: 90deg;
8118
+ --pf-c-dual-list-selector__item-toggle-icon--Transition: var(--pf-global--Transition);
8119
+ --pf-c-dual-list-selector__item-toggle-icon--MinWidth: var(--pf-c-dual-list-selector__list-item-row--FontSize);
8120
+ --pf-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color: var(--pf-global--disabled-color--200);
8121
+ display: grid;
8122
+ grid-template-areas: "pane-header . pane-header-c" "pane-tools . pane-tools-c" "pane-status . pane-status-c" "pane-menu controls pane-menu-c";
8123
+ 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));
8124
+ grid-template-rows: repeat(3, auto) auto;
8077
8125
  }
8078
8126
 
8079
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) {
8080
- --pf-c-dropdown__toggle-button--Color: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--Color);
8127
+ .pf-c-dual-list-selector__pane {
8128
+ display: contents;
8081
8129
  }
8082
8130
 
8083
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):hover {
8084
- --pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--hover--before--BorderWidth);
8131
+ .pf-c-dual-list-selector__pane.pf-m-chosen {
8132
+ --pf-c-dual-list-selector__header--GridArea: var(--pf-c-dual-list-selector--m-chosen__header--GridArea);
8133
+ --pf-c-dual-list-selector__tools--GridArea: var(--pf-c-dual-list-selector--m-chosen__tools--GridArea);
8134
+ --pf-c-dual-list-selector__status--GridArea: var(--pf-c-dual-list-selector--m-chosen__status--GridArea);
8135
+ --pf-c-dual-list-selector__menu--GridArea: var(--pf-c-dual-list-selector--m-chosen__menu--GridArea);
8085
8136
  }
8086
8137
 
8087
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):focus {
8088
- --pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--focus--before--BorderWidth);
8138
+ .pf-c-dual-list-selector__header {
8139
+ grid-area: var(--pf-c-dual-list-selector__header--GridArea);
8140
+ margin-bottom: var(--pf-c-dual-list-selector__header--MarginBottom);
8089
8141
  }
8090
8142
 
8091
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):active {
8092
- --pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--active--before--BorderWidth);
8143
+ .pf-c-dual-list-selector__title-text {
8144
+ font-weight: var(--pf-c-dual-list-selector__title-text--FontWeight);
8093
8145
  }
8094
8146
 
8095
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *::before {
8096
- 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);
8147
+ .pf-c-dual-list-selector__tools {
8148
+ display: flex;
8149
+ grid-area: var(--pf-c-dual-list-selector__tools--GridArea);
8150
+ margin-bottom: var(--pf-c-dual-list-selector__tools--MarginBottom);
8097
8151
  }
8098
8152
 
8099
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:hover {
8100
- --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);
8153
+ .pf-c-dual-list-selector__tools-filter {
8154
+ flex-grow: 1;
8101
8155
  }
8102
8156
 
8103
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:focus {
8104
- --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);
8157
+ .pf-c-dual-list-selector__tools-actions {
8158
+ display: flex;
8105
8159
  }
8106
8160
 
8107
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:active {
8108
- --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);
8161
+ .pf-c-dual-list-selector__tools-filter ~ .pf-c-dual-list-selector__tools-actions {
8162
+ margin-left: var(--pf-c-dual-list-selector__tools-filter--tools-actions--MarginLeft);
8109
8163
  }
8110
8164
 
8111
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:first-child::before {
8112
- border-top-left-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
8113
- border-bottom-left-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
8165
+ .pf-c-dual-list-selector__status {
8166
+ display: flex;
8167
+ grid-area: var(--pf-c-dual-list-selector__status--GridArea);
8168
+ margin-bottom: var(--pf-c-dual-list-selector__status--MarginBottom);
8114
8169
  }
8115
8170
 
8116
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:last-child::before {
8117
- border-top-right-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
8118
- border-bottom-right-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
8171
+ .pf-c-dual-list-selector__status-text {
8172
+ flex-grow: 1;
8173
+ font-size: var(--pf-c-dual-list-selector__status-text--FontSize);
8174
+ color: var(--pf-c-dual-list-selector__status-text--Color);
8119
8175
  }
8120
8176
 
8121
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:not(:first-child)::before {
8122
- 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);
8177
+ .pf-c-dual-list-selector__menu {
8178
+ grid-area: var(--pf-c-dual-list-selector__menu--GridArea);
8179
+ min-height: var(--pf-c-dual-list-selector__menu--MinHeight);
8180
+ max-height: var(--pf-c-dual-list-selector__menu--MaxHeight);
8181
+ overflow: auto;
8182
+ border: var(--pf-c-dual-list-selector__menu--BorderWidth) solid var(--pf-c-dual-list-selector__menu--BorderColor);
8123
8183
  }
8124
8184
 
8125
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:not(:last-child)::before {
8126
- border-right: 0;
8185
+ .pf-c-dual-list-selector__list {
8186
+ --pf-c-dual-list-selector__item-toggle-icon--Rotate: 0;
8187
+ display: flex;
8188
+ flex-direction: column;
8127
8189
  }
8128
8190
 
8129
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled).pf-m-action::before {
8130
- border: 0;
8191
+ .pf-c-dual-list-selector__list .pf-c-dual-list-selector__list {
8192
+ --pf-c-dual-list-selector__item-toggle--MarginTop: 0;
8193
+ --pf-c-dual-list-selector__item-toggle--MarginBottom: 0;
8131
8194
  }
8132
8195
 
8133
- .pf-c-dropdown__toggle > .pf-c-badge {
8134
- --pf-c-dropdown__toggle-icon--MarginLeft: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginLeft);
8135
- --pf-c-dropdown__toggle-icon--MarginRight: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginRight);
8196
+ .pf-c-dual-list-selector__list .pf-c-dual-list-selector__list .pf-c-dual-list-selector__item-toggle {
8197
+ position: absolute;
8198
+ top: 0;
8199
+ left: var(--pf-c-dual-list-selector__list__list__item-toggle--Left);
8200
+ transform: translateX(var(--pf-c-dual-list-selector__list__list__item-toggle--TranslateX));
8136
8201
  }
8137
8202
 
8138
- .pf-c-dropdown__toggle .pf-c-dropdown__toggle-text {
8139
- overflow: hidden;
8140
- text-overflow: ellipsis;
8141
- white-space: nowrap;
8203
+ .pf-c-dual-list-selector__list.pf-m-drag-over {
8204
+ overflow-anchor: none;
8142
8205
  }
8143
8206
 
8144
- .pf-c-dropdown__toggle-text {
8145
- flex: 0 1 auto;
8207
+ .pf-c-dual-list-selector__list-item:focus {
8208
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor);
8146
8209
  }
8147
8210
 
8148
- .pf-c-dropdown__toggle-icon {
8149
- margin-right: var(--pf-c-dropdown__toggle-icon--MarginRight);
8150
- margin-left: var(--pf-c-dropdown__toggle-icon--MarginLeft);
8151
- line-height: var(--pf-c-dropdown__toggle-icon--LineHeight);
8152
- color: var(--pf-c-dropdown__toggle-icon--Color, inherit);
8211
+ .pf-c-dual-list-selector__list-item.pf-m-expandable {
8212
+ --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-c-dual-list-selector__item--m-expandable--PaddingLeft);
8153
8213
  }
8154
8214
 
8155
- .pf-c-dropdown.pf-m-top.pf-m-expanded .pf-c-dropdown__toggle-icon {
8156
- transform: rotate(var(--pf-c-dropdown--m-top--m-expanded__toggle-icon--Rotate));
8215
+ .pf-c-dual-list-selector__list-item.pf-m-expanded {
8216
+ --pf-c-dual-list-selector__item-toggle-icon--Rotate: var(--pf-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate);
8157
8217
  }
8158
8218
 
8159
- .pf-c-dropdown__toggle-image {
8160
- display: inline-flex;
8161
- flex-shrink: 0;
8162
- align-self: center;
8163
- margin-top: var(--pf-c-dropdown__toggle-image--MarginTop);
8164
- margin-right: var(--pf-c-dropdown__toggle-image--MarginRight);
8165
- margin-bottom: var(--pf-c-dropdown__toggle-image--MarginBottom);
8166
- line-height: 1;
8219
+ .pf-c-dual-list-selector__list-item.pf-m-disabled {
8220
+ --pf-c-dual-list-selector__item-text--Color: var(--pf-c-dual-list-selector__list-item--m-disabled__item-text--Color);
8221
+ --pf-c-dual-list-selector__item-toggle-icon--Color: var(--pf-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color);
8222
+ pointer-events: none;
8167
8223
  }
8168
8224
 
8169
- .pf-c-dropdown__toggle-image:last-child {
8170
- --pf-c-dropdown__toggle-image--MarginRight: 0;
8225
+ .pf-c-dual-list-selector__list-item-row {
8226
+ display: flex;
8227
+ font-size: var(--pf-c-dual-list-selector__list-item-row--FontSize);
8228
+ background-color: var(--pf-c-dual-list-selector__list-item-row--BackgroundColor);
8171
8229
  }
8172
8230
 
8173
- .pf-c-dropdown__menu {
8174
- position: absolute;
8175
- top: var(--pf-c-dropdown__menu--Top);
8176
- z-index: var(--pf-c-dropdown__menu--ZIndex);
8177
- padding-top: var(--pf-c-dropdown__menu--PaddingTop);
8178
- padding-bottom: var(--pf-c-dropdown__menu--PaddingBottom);
8179
- background: var(--pf-c-dropdown__menu--BackgroundColor);
8180
- background-clip: padding-box;
8181
- box-shadow: var(--pf-c-dropdown__menu--BoxShadow);
8231
+ .pf-c-dual-list-selector__list-item-row:hover {
8232
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--hover--BackgroundColor);
8182
8233
  }
8183
8234
 
8184
- .pf-c-dropdown__menu.pf-m-static {
8185
- --pf-c-dropdown--m-top__menu--TranslateY: 0;
8186
- position: static;
8187
- top: auto;
8188
- right: auto;
8189
- bottom: auto;
8190
- left: auto;
8191
- z-index: auto;
8192
- min-width: min-content;
8235
+ .pf-c-dual-list-selector__list-item-row.pf-m-selected {
8236
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor);
8193
8237
  }
8194
8238
 
8195
- .pf-c-dropdown .pf-c-menu,
8196
- .pf-c-dropdown__menu {
8197
- min-width: 100%;
8239
+ .pf-c-dual-list-selector__list-item-row.pf-m-selected .pf-c-dual-list-selector__item-text {
8240
+ --pf-c-dual-list-selector__item-text--Color: var(--pf-c-dual-list-selector__list-item-row--m-selected__text--Color);
8241
+ font-weight: var(--pf-c-dual-list-selector__list-item-row--m-selected__text--FontWeight);
8198
8242
  }
8199
8243
 
8200
- .pf-c-dropdown .pf-c-menu.pf-m-align-right,
8201
- .pf-c-dropdown__menu.pf-m-align-right {
8202
- right: 0;
8244
+ .pf-c-dual-list-selector__list-item-row.pf-m-check {
8245
+ --pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: transparent;
8203
8246
  }
8204
8247
 
8205
- .pf-c-dropdown .pf-c-menu.pf-m-align-left,
8206
- .pf-c-dropdown__menu.pf-m-align-left {
8207
- right: auto;
8248
+ .pf-c-dual-list-selector__list-item-row.pf-m-ghost-row {
8249
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor);
8250
+ opacity: var(--pf-c-dual-list-selector__list-item--m-ghost-row--Opacity);
8208
8251
  }
8209
8252
 
8210
- @media (min-width: 576px) {
8211
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-sm,
8212
- .pf-c-dropdown__menu.pf-m-align-right-on-sm {
8213
- right: 0;
8214
- }
8215
-
8216
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-sm,
8217
- .pf-c-dropdown__menu.pf-m-align-left-on-sm {
8218
- right: auto;
8219
- }
8253
+ .pf-c-dual-list-selector__item,
8254
+ .pf-c-dual-list-selector__main {
8255
+ display: flex;
8220
8256
  }
8221
- @media (min-width: 768px) {
8222
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-md,
8223
- .pf-c-dropdown__menu.pf-m-align-right-on-md {
8224
- right: 0;
8225
- }
8226
8257
 
8227
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-md,
8228
- .pf-c-dropdown__menu.pf-m-align-left-on-md {
8229
- right: auto;
8230
- }
8258
+ .pf-c-dual-list-selector__item,
8259
+ .pf-c-dual-list-selector__item-main {
8260
+ flex-basis: 100%;
8231
8261
  }
8232
- @media (min-width: 992px) {
8233
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-lg,
8234
- .pf-c-dropdown__menu.pf-m-align-right-on-lg {
8235
- right: 0;
8236
- }
8237
8262
 
8238
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-lg,
8239
- .pf-c-dropdown__menu.pf-m-align-left-on-lg {
8240
- right: auto;
8241
- }
8263
+ .pf-c-dual-list-selector__draggable {
8264
+ display: flex;
8242
8265
  }
8243
- @media (min-width: 1200px) {
8244
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-xl,
8245
- .pf-c-dropdown__menu.pf-m-align-right-on-xl {
8246
- right: 0;
8247
- }
8248
8266
 
8249
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-xl,
8250
- .pf-c-dropdown__menu.pf-m-align-left-on-xl {
8251
- right: auto;
8252
- }
8267
+ .pf-c-dual-list-selector__draggable + .pf-c-dual-list-selector__item {
8268
+ --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-c-dual-list-selector__draggable--item--PaddingLeft);
8253
8269
  }
8254
- @media (min-width: 1450px) {
8255
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-2xl,
8256
- .pf-c-dropdown__menu.pf-m-align-right-on-2xl {
8257
- right: 0;
8258
- }
8259
8270
 
8260
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-2xl,
8261
- .pf-c-dropdown__menu.pf-m-align-left-on-2xl {
8262
- right: auto;
8263
- }
8264
- }
8265
- .pf-c-dropdown.pf-m-top .pf-c-dropdown__menu {
8266
- --pf-c-dropdown__menu--Top: var(--pf-c-dropdown--m-top__menu--Top);
8267
- transform: translateY(var(--pf-c-dropdown--m-top__menu--TranslateY));
8271
+ .pf-c-dual-list-selector__draggable .pf-c-button {
8272
+ --pf-c-button--FontSize: inherit;
8273
+ cursor: grab;
8268
8274
  }
8269
8275
 
8270
- .pf-c-dropdown.pf-m-top > .pf-c-menu {
8271
- --pf-c-dropdown--c-menu--Top: var(--pf-c-dropdown--m-top--c-menu--Top);
8272
- transform: translateY(var(--pf-c-dropdown--m-top--c-menu--TranslateY));
8276
+ .pf-c-dual-list-selector__draggable .pf-c-button:active {
8277
+ cursor: grabbing;
8273
8278
  }
8274
8279
 
8275
- .pf-c-dropdown__menu-item {
8276
- display: block;
8280
+ .pf-c-dual-list-selector__item {
8281
+ position: relative;
8277
8282
  width: 100%;
8278
- 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);
8279
- font-size: var(--pf-c-dropdown__menu-item--FontSize);
8280
- font-weight: var(--pf-c-dropdown__menu-item--FontWeight);
8281
- line-height: var(--pf-c-dropdown__menu-item--LineHeight);
8282
- color: var(--pf-c-dropdown__menu-item--Color);
8283
- text-align: left;
8284
- white-space: nowrap;
8285
- background-color: var(--pf-c-dropdown__menu-item--BackgroundColor);
8286
- border: none;
8283
+ 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);
8284
+ cursor: pointer;
8287
8285
  }
8288
8286
 
8289
- .pf-c-dropdown__menu-item:hover, .pf-c-dropdown__menu-item:focus {
8290
- --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--hover--Color);
8291
- --pf-c-dropdown__menu-item--BackgroundColor: var(--pf-c-dropdown__menu-item--hover--BackgroundColor);
8292
- text-decoration: none;
8287
+ .pf-c-dual-list-selector__item-count {
8288
+ margin-left: var(--pf-c-dual-list-selector__item-count--Marginleft);
8293
8289
  }
8294
8290
 
8295
- .pf-c-dropdown__menu-item:disabled, .pf-c-dropdown__menu-item.pf-m-disabled, .pf-c-dropdown__menu-item.pf-m-aria-disabled {
8296
- --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--disabled--Color);
8297
- --pf-c-dropdown__menu-item--BackgroundColor: var(--pf-c-dropdown__menu-item--disabled--BackgroundColor);
8291
+ .pf-c-dual-list-selector__item-count .pf-c-badge.pf-m-read {
8292
+ --pf-c-badge--m-read--BackgroundColor: var(--pf-c-dual-list-selector__item--c-badge--m-read--BackgroundColor);
8298
8293
  }
8299
8294
 
8300
- .pf-c-dropdown__menu-item:disabled, .pf-c-dropdown__menu-item.pf-m-disabled {
8301
- pointer-events: none;
8295
+ .pf-c-dual-list-selector__item-text {
8296
+ overflow: hidden;
8297
+ text-overflow: ellipsis;
8298
+ white-space: nowrap;
8299
+ flex-grow: 1;
8300
+ color: var(--pf-c-dual-list-selector__item-text--Color);
8302
8301
  }
8303
8302
 
8304
- .pf-c-dropdown__menu-item.pf-m-aria-disabled {
8305
- cursor: default;
8303
+ .pf-c-dual-list-selector__controls {
8304
+ grid-area: var(--pf-c-dual-list-selector__controls--GridArea);
8305
+ align-self: center;
8306
+ padding-right: var(--pf-c-dual-list-selector__controls--PaddingRight);
8307
+ padding-left: var(--pf-c-dual-list-selector__controls--PaddingLeft);
8306
8308
  }
8307
8309
 
8308
- .pf-c-dropdown__menu-item.pf-m-icon {
8310
+ .pf-c-dual-list-selector__item-main {
8309
8311
  display: flex;
8310
- align-items: center;
8312
+ min-width: 0;
8311
8313
  }
8312
8314
 
8313
- .pf-c-dropdown__menu-item.pf-m-icon.pf-m-description {
8314
- flex-direction: column;
8315
- align-items: start;
8315
+ .pf-c-dual-list-selector__item-toggle {
8316
+ 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);
8317
+ margin-top: var(--pf-c-dual-list-selector__item-toggle--MarginTop);
8318
+ margin-bottom: var(--pf-c-dual-list-selector__item-toggle--MarginBottom);
8316
8319
  }
8317
8320
 
8318
- .pf-c-dropdown__menu-item.pf-m-icon .pf-c-dropdown__menu-item-main {
8321
+ .pf-c-dual-list-selector__item-check {
8319
8322
  display: flex;
8320
8323
  align-items: center;
8324
+ margin-right: var(--pf-c-dual-list-selector__item-check--MarginRight);
8321
8325
  }
8322
8326
 
8323
- .pf-c-dropdown__menu-item.pf-m-text {
8324
- --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--m-text--Color);
8327
+ .pf-c-dual-list-selector__item-toggle-icon {
8328
+ display: inline-block;
8329
+ min-width: var(--pf-c-dual-list-selector__item-toggle-icon--MinWidth);
8330
+ color: var(--pf-c-dual-list-selector__item-toggle-icon--Color, inherit);
8331
+ text-align: center;
8332
+ transition: var(--pf-c-dual-list-selector__item-toggle-icon--Transition);
8333
+ transform: rotate(var(--pf-c-dual-list-selector__item-toggle-icon--Rotate));
8325
8334
  }
8326
8335
 
8327
- .pf-c-dropdown__menu-item.pf-m-text:hover, .pf-c-dropdown__menu-item.pf-m-text:focus {
8328
- --pf-c-dropdown__menu-item--BackgroundColor: transparent;
8336
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8337
+ --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));
8338
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8329
8339
  }
8330
8340
 
8331
- .pf-c-dropdown__menu-item-icon {
8332
- display: inline-flex;
8333
- align-items: center;
8334
- justify-content: center;
8335
- width: var(--pf-c-dropdown__menu-item-icon--Width);
8336
- height: var(--pf-c-dropdown__menu-item-icon--Height);
8337
- margin-right: var(--pf-c-dropdown__menu-item-icon--MarginRight);
8341
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8342
+ --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));
8343
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8338
8344
  }
8339
8345
 
8340
- .pf-c-dropdown__menu-item-icon > * {
8341
- max-width: 100%;
8342
- max-height: 100%;
8346
+ .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 {
8347
+ --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));
8348
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8343
8349
  }
8344
8350
 
8345
- .pf-c-dropdown__menu-item-description {
8346
- font-size: var(--pf-c-dropdown__menu-item-description--FontSize);
8347
- color: var(--pf-c-dropdown__menu-item-description--Color);
8351
+ .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 {
8352
+ --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));
8353
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8348
8354
  }
8349
8355
 
8350
- .pf-c-dropdown__group + .pf-c-dropdown__group {
8351
- padding-top: var(--pf-c-dropdown__group--group--PaddingTop);
8356
+ .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 {
8357
+ --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));
8358
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8359
+ }
8360
+
8361
+ .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 {
8362
+ --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));
8363
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8352
8364
  }
8353
8365
 
8354
- .pf-c-dropdown__group-title {
8355
- padding-top: var(--pf-c-dropdown__group-title--PaddingTop);
8356
- padding-right: var(--pf-c-dropdown__group-title--PaddingRight);
8357
- padding-bottom: var(--pf-c-dropdown__group-title--PaddingBottom);
8358
- padding-left: var(--pf-c-dropdown__group-title--PaddingLeft);
8359
- font-size: var(--pf-c-dropdown__group-title--FontSize);
8360
- font-weight: var(--pf-c-dropdown__group-title--FontWeight);
8361
- color: var(--pf-c-dropdown__group-title--Color);
8366
+ .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 {
8367
+ --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));
8368
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8362
8369
  }
8363
8370
 
8364
- :where(.pf-theme-dark) .pf-c-dropdown {
8365
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-global--BackgroundColor--400);
8366
- --pf-c-dropdown__toggle--before--BorderTopColor: transparent;
8367
- --pf-c-dropdown__toggle--before--BorderRightColor: transparent;
8368
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-global--BorderColor--400);
8369
- --pf-c-dropdown__toggle--before--BorderLeftColor: transparent;
8370
- --pf-c-dropdown__toggle--disabled--BackgroundColor: var(--pf-global--palette--black-500);
8371
- --pf-c-dropdown__toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--300);
8372
- --pf-c-dropdown__menu--BackgroundColor: var(--pf-global--BackgroundColor--300);
8373
- --pf-c-dropdown__menu--Top: 100%;
8374
- --pf-c-dropdown--m-top__menu--TranslateY: -100%;
8375
- --pf-c-dropdown__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
8371
+ .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 {
8372
+ --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));
8373
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8376
8374
  }
8377
8375
 
8378
- :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 {
8379
- color: var(--pf-global--palette--black-100);
8376
+ .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 {
8377
+ --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));
8378
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8380
8379
  }
8381
8380
 
8382
- :where(.pf-theme-dark) .pf-c-dropdown__toggle.pf-m-plain {
8383
- background: transparent;
8381
+ .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 {
8382
+ --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));
8383
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8384
8384
  }
8385
8385
 
8386
8386
  .pf-c-empty-state {
@@ -16667,6 +16667,11 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16667
16667
  }
16668
16668
 
16669
16669
  .pf-c-pagination {
16670
+ --pf-c-pagination--inset: 0;
16671
+ --pf-c-pagination--PaddingRight: var(--pf-c-pagination--inset);
16672
+ --pf-c-pagination--PaddingLeft: var(--pf-c-pagination--inset);
16673
+ --pf-c-pagination--m-page-insets--inset: var(--pf-global--spacer--md);
16674
+ --pf-c-pagination--m-page-insets--xl--inset: var(--pf-global--spacer--lg);
16670
16675
  --pf-c-pagination--child--MarginRight: var(--pf-global--spacer--lg);
16671
16676
  --pf-c-pagination--m-bottom--child--MarginRight: 0;
16672
16677
  --pf-c-pagination--m-bottom--child--md--MarginRight: var(--pf-global--spacer--lg);
@@ -16731,6 +16736,8 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16731
16736
  flex-wrap: wrap;
16732
16737
  align-items: center;
16733
16738
  justify-content: flex-end;
16739
+ padding-right: var(--pf-c-pagination--PaddingRight);
16740
+ padding-left: var(--pf-c-pagination--PaddingLeft);
16734
16741
  }
16735
16742
 
16736
16743
  @media screen and (min-width: 768px) {
@@ -16754,6 +16761,8 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16754
16761
  .pf-c-pagination {
16755
16762
  --pf-c-pagination--m-bottom--md--PaddingRight: var(--pf-c-pagination--m-bottom--xl--PaddingRight);
16756
16763
  --pf-c-pagination--m-bottom--md--PaddingLeft: var(--pf-c-pagination--m-bottom--xl--PaddingLeft);
16764
+ --pf-c-pagination__scroll-button--Width: var(--pf-c-pagination__scroll-button--xl--Width);
16765
+ --pf-c-pagination--m-page-insets--inset: var(--pf-c-pagination--m-page-insets--xl--inset);
16757
16766
  }
16758
16767
  }
16759
16768
  .pf-c-pagination > *:not(:last-child):not(.pf-c-pagination__total-items) {
@@ -16863,6 +16872,10 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16863
16872
  --pf-c-pagination--child--MarginRight: var(--pf-c-pagination--m-compact--child--MarginRight);
16864
16873
  }
16865
16874
 
16875
+ .pf-c-pagination.pf-m-page-insets {
16876
+ --pf-c-pagination--inset: var(--pf-c-pagination--m-page-insets--inset);
16877
+ }
16878
+
16866
16879
  .pf-c-pagination__nav {
16867
16880
  display: var(--pf-c-pagination__nav--Display);
16868
16881
  justify-content: flex-end;
@@ -16922,6 +16935,30 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16922
16935
  --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
16923
16936
  }
16924
16937
 
16938
+ .pf-c-pagination.pf-m-inset-none {
16939
+ --pf-c-pagination--inset: 0;
16940
+ }
16941
+
16942
+ .pf-c-pagination.pf-m-inset-sm {
16943
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
16944
+ }
16945
+
16946
+ .pf-c-pagination.pf-m-inset-md {
16947
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
16948
+ }
16949
+
16950
+ .pf-c-pagination.pf-m-inset-lg {
16951
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
16952
+ }
16953
+
16954
+ .pf-c-pagination.pf-m-inset-xl {
16955
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
16956
+ }
16957
+
16958
+ .pf-c-pagination.pf-m-inset-2xl {
16959
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
16960
+ }
16961
+
16925
16962
  @media (min-width: 576px) {
16926
16963
  .pf-c-pagination.pf-m-display-summary-on-sm {
16927
16964
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-summary__nav--Display);
@@ -16940,6 +16977,30 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16940
16977
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
16941
16978
  --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
16942
16979
  }
16980
+
16981
+ .pf-c-pagination.pf-m-inset-none-on-sm {
16982
+ --pf-c-pagination--inset: 0;
16983
+ }
16984
+
16985
+ .pf-c-pagination.pf-m-inset-sm-on-sm {
16986
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
16987
+ }
16988
+
16989
+ .pf-c-pagination.pf-m-inset-md-on-sm {
16990
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
16991
+ }
16992
+
16993
+ .pf-c-pagination.pf-m-inset-lg-on-sm {
16994
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
16995
+ }
16996
+
16997
+ .pf-c-pagination.pf-m-inset-xl-on-sm {
16998
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
16999
+ }
17000
+
17001
+ .pf-c-pagination.pf-m-inset-2xl-on-sm {
17002
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
17003
+ }
16943
17004
  }
16944
17005
  @media (min-width: 768px) {
16945
17006
  .pf-c-pagination.pf-m-display-summary-on-md {
@@ -16959,6 +17020,30 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16959
17020
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
16960
17021
  --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
16961
17022
  }
17023
+
17024
+ .pf-c-pagination.pf-m-inset-none-on-md {
17025
+ --pf-c-pagination--inset: 0;
17026
+ }
17027
+
17028
+ .pf-c-pagination.pf-m-inset-sm-on-md {
17029
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
17030
+ }
17031
+
17032
+ .pf-c-pagination.pf-m-inset-md-on-md {
17033
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
17034
+ }
17035
+
17036
+ .pf-c-pagination.pf-m-inset-lg-on-md {
17037
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
17038
+ }
17039
+
17040
+ .pf-c-pagination.pf-m-inset-xl-on-md {
17041
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
17042
+ }
17043
+
17044
+ .pf-c-pagination.pf-m-inset-2xl-on-md {
17045
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
17046
+ }
16962
17047
  }
16963
17048
  @media (min-width: 992px) {
16964
17049
  .pf-c-pagination.pf-m-display-summary-on-lg {
@@ -16978,6 +17063,30 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16978
17063
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
16979
17064
  --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
16980
17065
  }
17066
+
17067
+ .pf-c-pagination.pf-m-inset-none-on-lg {
17068
+ --pf-c-pagination--inset: 0;
17069
+ }
17070
+
17071
+ .pf-c-pagination.pf-m-inset-sm-on-lg {
17072
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
17073
+ }
17074
+
17075
+ .pf-c-pagination.pf-m-inset-md-on-lg {
17076
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
17077
+ }
17078
+
17079
+ .pf-c-pagination.pf-m-inset-lg-on-lg {
17080
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
17081
+ }
17082
+
17083
+ .pf-c-pagination.pf-m-inset-xl-on-lg {
17084
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
17085
+ }
17086
+
17087
+ .pf-c-pagination.pf-m-inset-2xl-on-lg {
17088
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
17089
+ }
16981
17090
  }
16982
17091
  @media (min-width: 1200px) {
16983
17092
  .pf-c-pagination.pf-m-display-summary-on-xl {
@@ -16997,6 +17106,30 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16997
17106
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
16998
17107
  --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
16999
17108
  }
17109
+
17110
+ .pf-c-pagination.pf-m-inset-none-on-xl {
17111
+ --pf-c-pagination--inset: 0;
17112
+ }
17113
+
17114
+ .pf-c-pagination.pf-m-inset-sm-on-xl {
17115
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
17116
+ }
17117
+
17118
+ .pf-c-pagination.pf-m-inset-md-on-xl {
17119
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
17120
+ }
17121
+
17122
+ .pf-c-pagination.pf-m-inset-lg-on-xl {
17123
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
17124
+ }
17125
+
17126
+ .pf-c-pagination.pf-m-inset-xl-on-xl {
17127
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
17128
+ }
17129
+
17130
+ .pf-c-pagination.pf-m-inset-2xl-on-xl {
17131
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
17132
+ }
17000
17133
  }
17001
17134
  @media (min-width: 1450px) {
17002
17135
  .pf-c-pagination.pf-m-display-summary-on-2xl {
@@ -17016,6 +17149,30 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
17016
17149
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
17017
17150
  --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
17018
17151
  }
17152
+
17153
+ .pf-c-pagination.pf-m-inset-none-on-2xl {
17154
+ --pf-c-pagination--inset: 0;
17155
+ }
17156
+
17157
+ .pf-c-pagination.pf-m-inset-sm-on-2xl {
17158
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
17159
+ }
17160
+
17161
+ .pf-c-pagination.pf-m-inset-md-on-2xl {
17162
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
17163
+ }
17164
+
17165
+ .pf-c-pagination.pf-m-inset-lg-on-2xl {
17166
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
17167
+ }
17168
+
17169
+ .pf-c-pagination.pf-m-inset-xl-on-2xl {
17170
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
17171
+ }
17172
+
17173
+ .pf-c-pagination.pf-m-inset-2xl-on-2xl {
17174
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
17175
+ }
17019
17176
  }
17020
17177
  :where(.pf-theme-dark) .pf-c-pagination {
17021
17178
  --pf-c-pagination--m-sticky--BackgroundColor: var(--pf-global--BackgroundColor--300);
@@ -19708,7 +19865,6 @@ svg.pf-c-spinner.pf-m-xl {
19708
19865
  --pf-c-tabs__list--Display: flex;
19709
19866
  --pf-c-tabs__list--Visibility: visible;
19710
19867
  --pf-c-tabs__item--m-action--before--ZIndex: var(--pf-global--ZIndex--xs);
19711
- --pf-c-tabs__item--m-action__link--PaddingRight: var(--pf-global--spacer--sm);
19712
19868
  --pf-c-tabs__link--Color: var(--pf-global--Color--200);
19713
19869
  --pf-c-tabs__link--FontSize: var(--pf-global--FontSize--md);
19714
19870
  --pf-c-tabs__link--BackgroundColor: transparent;
@@ -19725,8 +19881,9 @@ svg.pf-c-spinner.pf-m-xl {
19725
19881
  --pf-c-tabs--m-vertical__link--PaddingBottom: var(--pf-global--spacer--md);
19726
19882
  --pf-c-tabs--m-box__link--BackgroundColor: var(--pf-global--BackgroundColor--200);
19727
19883
  --pf-c-tabs--m-box__link--disabled--BackgroundColor: var(--pf-global--disabled-color--200);
19728
- --pf-c-tabs--m-box__item-close--c-button--disabled--BackgroundColor: var(--pf-global--palette--black-400);
19884
+ --pf-c-tabs--m-box__item-action--c-button--disabled--BackgroundColor: var(--pf-global--palette--black-400);
19729
19885
  --pf-c-tabs--m-secondary__link--FontSize: var(--pf-global--FontSize--sm);
19886
+ --pf-c-tabs__item--m-action__link--PaddingRight: var(--pf-global--spacer--xs);
19730
19887
  --pf-c-tabs__link--before--border-color--base: var(--pf-global--BorderColor--100);
19731
19888
  --pf-c-tabs__link--before--border-width--base: var(--pf-global--BorderWidth--sm);
19732
19889
  --pf-c-tabs__link--before--BorderTopColor: var(--pf-c-tabs__link--before--border-color--base);
@@ -19790,13 +19947,16 @@ svg.pf-c-spinner.pf-m-xl {
19790
19947
  --pf-c-tabs__toggle-button--MarginLeft: calc(-1 * var(--pf-global--spacer--md));
19791
19948
  --pf-c-tabs--m-expanded__toggle-icon--Color: var(--pf-global--Color--100);
19792
19949
  --pf-c-tabs--m-expanded__toggle-icon--Rotate: 90deg;
19793
- --pf-c-tabs__item-close--c-button--FontSize: var(--pf-global--FontSize--xs);
19794
- --pf-c-tabs--m-secondary__item-close--c-button--FontSize: var(--pf-global--icon--FontSize--sm);
19795
- --pf-c-tabs__item-close--c-button--PaddingTop: var(--pf-global--spacer--sm);
19796
- --pf-c-tabs__item-close--c-button--PaddingBottom: var(--pf-global--spacer--sm);
19797
- --pf-c-tabs__item-close--c-button--PaddingLeft: var(--pf-global--spacer--sm);
19798
- --pf-c-tabs__item-close--c-button--OutlineOffset: -0.1875rem;
19799
- --pf-c-tabs__item-close-icon--MarginTop: 0.125rem;
19950
+ --pf-c-tabs__item-action--c-button--FontSize: var(--pf-global--FontSize--xs);
19951
+ --pf-c-tabs--m-secondary__item-action--c-button--FontSize: var(--pf-global--icon--FontSize--sm);
19952
+ --pf-c-tabs__item-action--c-button--PaddingTop: var(--pf-global--spacer--sm);
19953
+ --pf-c-tabs__item-action--c-button--PaddingRight: var(--pf-global--spacer--sm);
19954
+ --pf-c-tabs__item-action--c-button--PaddingBottom: var(--pf-global--spacer--sm);
19955
+ --pf-c-tabs__item-action--c-button--PaddingLeft: var(--pf-global--spacer--sm);
19956
+ --pf-c-tabs__item-action--last-child--c-button--PaddingRight: var(--pf-global--spacer--md);
19957
+ --pf-c-tabs__item-action--c-button--OutlineOffset: -0.1875rem;
19958
+ --pf-c-tabs__item-action-icon--MarginTop: 0.125rem;
19959
+ --pf-c-tabs__item-action--m-help--c-button--PaddingLeft: var(--pf-global--spacer--xs);
19800
19960
  --pf-c-tabs__add--before--BorderColor: var(--pf-c-tabs__link--before--border-color--base);
19801
19961
  --pf-c-tabs__add--before--BorderLeftWidth: var(--pf-c-tabs__link--before--border-width--base);
19802
19962
  --pf-c-tabs__add--c-button--FontSize: var(--pf-global--FontSize--sm);
@@ -19934,8 +20094,8 @@ svg.pf-c-spinner.pf-m-xl {
19934
20094
  --pf-c-tabs__link--disabled--BackgroundColor: var(--pf-c-tabs--m-color-scheme--light-300__link--disabled--BackgroundColor);
19935
20095
  }
19936
20096
 
19937
- .pf-c-tabs.pf-m-box .pf-c-tabs__item-close .pf-c-button {
19938
- --pf-c-button--m-plain--disabled--Color: var(--pf-c-tabs--m-box__item-close--c-button--disabled--BackgroundColor);
20097
+ .pf-c-tabs.pf-m-box .pf-c-tabs__item-action .pf-c-button {
20098
+ --pf-c-button--m-plain--disabled--Color: var(--pf-c-tabs--m-box__item-action--c-button--disabled--BackgroundColor);
19939
20099
  }
19940
20100
 
19941
20101
  .pf-c-tabs.pf-m-vertical {
@@ -20133,7 +20293,7 @@ svg.pf-c-spinner.pf-m-xl {
20133
20293
 
20134
20294
  .pf-c-tabs.pf-m-secondary {
20135
20295
  --pf-c-tabs__link--FontSize: var(--pf-c-tabs--m-secondary__link--FontSize);
20136
- --pf-c-tabs__item-close--c-button--FontSize: var(--pf-c-tabs--m-secondary__item-close--c-button--FontSize);
20296
+ --pf-c-tabs__item-action--c-button--FontSize: var(--pf-c-tabs--m-secondary__item-action--c-button--FontSize);
20137
20297
  --pf-c-tabs__add--c-button--FontSize: var(--pf-c-tabs--m-secondary__add--c-button--FontSize);
20138
20298
  }
20139
20299
 
@@ -20353,21 +20513,30 @@ svg.pf-c-spinner.pf-m-xl {
20353
20513
  transform: rotate(var(--pf-c-tabs__link-toggle-icon--Rotate));
20354
20514
  }
20355
20515
 
20356
- .pf-c-tabs__item-close {
20516
+ .pf-c-tabs__item-action {
20357
20517
  display: flex;
20358
20518
  }
20359
20519
 
20360
- .pf-c-tabs__item-close .pf-c-button {
20361
- --pf-c-button--FontSize: var(--pf-c-tabs__item-close--c-button--FontSize);
20362
- --pf-c-button--PaddingTop: var(--pf-c-tabs__item-close--c-button--PaddingTop);
20363
- --pf-c-button--PaddingBottom: var(--pf-c-tabs__item-close--c-button--PaddingBottom);
20364
- --pf-c-button--PaddingLeft: var(--pf-c-tabs__item-close--c-button--PaddingLeft);
20365
- outline-offset: var(--pf-c-tabs__item-close--c-button--OutlineOffset);
20520
+ .pf-c-tabs__item-action .pf-c-button {
20521
+ --pf-c-button--FontSize: var(--pf-c-tabs__item-action--c-button--FontSize);
20522
+ --pf-c-button--PaddingTop: var(--pf-c-tabs__item-action--c-button--PaddingTop);
20523
+ --pf-c-button--PaddingRight: var(--pf-c-tabs__item-action--c-button--PaddingRight);
20524
+ --pf-c-button--PaddingBottom: var(--pf-c-tabs__item-action--c-button--PaddingBottom);
20525
+ --pf-c-button--PaddingLeft: var(--pf-c-tabs__item-action--c-button--PaddingLeft);
20526
+ outline-offset: var(--pf-c-tabs__item-action--c-button--OutlineOffset);
20527
+ }
20528
+
20529
+ .pf-c-tabs__item-action.pf-m-help {
20530
+ --pf-c-tabs__item-action--c-button--PaddingLeft: var(--pf-c-tabs__item-action--m-help--c-button--PaddingLeft);
20366
20531
  }
20367
20532
 
20368
- .pf-c-tabs__item-close-icon {
20533
+ .pf-c-tabs__item-action:last-child {
20534
+ --pf-c-tabs__item-action--c-button--PaddingRight: var(--pf-c-tabs__item-action--last-child--c-button--PaddingRight);
20535
+ }
20536
+
20537
+ .pf-c-tabs__item-action-icon {
20369
20538
  display: inline-block;
20370
- margin-top: var(--pf-c-tabs__item-close-icon--MarginTop);
20539
+ margin-top: var(--pf-c-tabs__item-action-icon--MarginTop);
20371
20540
  }
20372
20541
 
20373
20542
  .pf-c-tabs__scroll-button {
@@ -26404,75 +26573,6 @@ label.pf-c-tree-view__node-text {
26404
26573
  --pf-l-flex--spacer: var(--pf-l-flex--spacer--4xl);
26405
26574
  }
26406
26575
  }
26407
- .pf-l-gallery {
26408
- --pf-l-gallery--m-gutter--GridGap: var(--pf-global--gutter);
26409
- --pf-l-gallery--GridTemplateColumns--min: 250px;
26410
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
26411
- --pf-l-gallery--GridTemplateColumns--max: 1fr;
26412
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
26413
- --pf-l-gallery--GridTemplateColumns: repeat(auto-fill, minmax(var(--pf-l-gallery--GridTemplateColumns--minmax--min), var(--pf-l-gallery--GridTemplateColumns--minmax--max)));
26414
- --pf-l-gallery--GridTemplateRows: auto;
26415
- display: grid;
26416
- grid-template-columns: var(--pf-l-gallery--GridTemplateColumns);
26417
- grid-template-rows: var(--pf-l-gallery--GridTemplateRows);
26418
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
26419
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
26420
- }
26421
-
26422
- .pf-l-gallery.pf-m-gutter {
26423
- grid-gap: var(--pf-l-gallery--m-gutter--GridGap);
26424
- }
26425
-
26426
- @media (min-width: 576px) {
26427
- .pf-l-gallery {
26428
- --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min));
26429
- }
26430
- }
26431
- @media (min-width: 768px) {
26432
- .pf-l-gallery {
26433
- --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)));
26434
- }
26435
- }
26436
- @media (min-width: 992px) {
26437
- .pf-l-gallery {
26438
- --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))));
26439
- }
26440
- }
26441
- @media (min-width: 1200px) {
26442
- .pf-l-gallery {
26443
- --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)))));
26444
- }
26445
- }
26446
- @media (min-width: 1450px) {
26447
- .pf-l-gallery {
26448
- --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))))));
26449
- }
26450
- }
26451
- @media (min-width: 576px) {
26452
- .pf-l-gallery {
26453
- --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max));
26454
- }
26455
- }
26456
- @media (min-width: 768px) {
26457
- .pf-l-gallery {
26458
- --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)));
26459
- }
26460
- }
26461
- @media (min-width: 992px) {
26462
- .pf-l-gallery {
26463
- --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))));
26464
- }
26465
- }
26466
- @media (min-width: 1200px) {
26467
- .pf-l-gallery {
26468
- --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)))));
26469
- }
26470
- }
26471
- @media (min-width: 1450px) {
26472
- .pf-l-gallery {
26473
- --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))))));
26474
- }
26475
- }
26476
26576
  .pf-l-grid {
26477
26577
  --pf-l-grid--m-gutter--GridGap: var(--pf-global--gutter);
26478
26578
  --pf-l-grid__item--GridColumnStart: auto;
@@ -27687,6 +27787,75 @@ label.pf-c-tree-view__node-text {
27687
27787
  grid-gap: var(--pf-l-grid--m-gutter--GridGap);
27688
27788
  }
27689
27789
 
27790
+ .pf-l-gallery {
27791
+ --pf-l-gallery--m-gutter--GridGap: var(--pf-global--gutter);
27792
+ --pf-l-gallery--GridTemplateColumns--min: 250px;
27793
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
27794
+ --pf-l-gallery--GridTemplateColumns--max: 1fr;
27795
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
27796
+ --pf-l-gallery--GridTemplateColumns: repeat(auto-fill, minmax(var(--pf-l-gallery--GridTemplateColumns--minmax--min), var(--pf-l-gallery--GridTemplateColumns--minmax--max)));
27797
+ --pf-l-gallery--GridTemplateRows: auto;
27798
+ display: grid;
27799
+ grid-template-columns: var(--pf-l-gallery--GridTemplateColumns);
27800
+ grid-template-rows: var(--pf-l-gallery--GridTemplateRows);
27801
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
27802
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
27803
+ }
27804
+
27805
+ .pf-l-gallery.pf-m-gutter {
27806
+ grid-gap: var(--pf-l-gallery--m-gutter--GridGap);
27807
+ }
27808
+
27809
+ @media (min-width: 576px) {
27810
+ .pf-l-gallery {
27811
+ --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min));
27812
+ }
27813
+ }
27814
+ @media (min-width: 768px) {
27815
+ .pf-l-gallery {
27816
+ --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)));
27817
+ }
27818
+ }
27819
+ @media (min-width: 992px) {
27820
+ .pf-l-gallery {
27821
+ --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))));
27822
+ }
27823
+ }
27824
+ @media (min-width: 1200px) {
27825
+ .pf-l-gallery {
27826
+ --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)))));
27827
+ }
27828
+ }
27829
+ @media (min-width: 1450px) {
27830
+ .pf-l-gallery {
27831
+ --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))))));
27832
+ }
27833
+ }
27834
+ @media (min-width: 576px) {
27835
+ .pf-l-gallery {
27836
+ --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max));
27837
+ }
27838
+ }
27839
+ @media (min-width: 768px) {
27840
+ .pf-l-gallery {
27841
+ --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)));
27842
+ }
27843
+ }
27844
+ @media (min-width: 992px) {
27845
+ .pf-l-gallery {
27846
+ --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))));
27847
+ }
27848
+ }
27849
+ @media (min-width: 1200px) {
27850
+ .pf-l-gallery {
27851
+ --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)))));
27852
+ }
27853
+ }
27854
+ @media (min-width: 1450px) {
27855
+ .pf-l-gallery {
27856
+ --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))))));
27857
+ }
27858
+ }
27690
27859
  .pf-l-level {
27691
27860
  --pf-l-level--m-gutter--MarginRight: var(--pf-global--gutter);
27692
27861
  display: flex;