@patternfly/react-core 4.231.1 → 4.231.4

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 (9) hide show
  1. package/CHANGELOG.md +30 -0
  2. package/dist/esm/components/MenuToggle/MenuToggle.d.ts +1 -1
  3. package/dist/esm/components/MenuToggle/MenuToggle.d.ts.map +1 -1
  4. package/dist/js/components/MenuToggle/MenuToggle.d.ts +1 -1
  5. package/dist/js/components/MenuToggle/MenuToggle.d.ts.map +1 -1
  6. package/dist/umd/react-core.css +31 -31
  7. package/dist/umd/react-core.min.css +1662 -1662
  8. package/package.json +6 -6
  9. package/src/components/MenuToggle/MenuToggle.tsx +1 -1
package/dist/umd/react-core.min.css CHANGED
@@ -8285,130 +8285,6 @@ label.pf-c-check, .pf-c-check__label,
8285
8285
  --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8286
8286
  }
8287
8287
 
8288
- .pf-c-expandable-section {
8289
- --pf-c-expandable-section__toggle--PaddingTop: var(--pf-global--spacer--form-element);
8290
- --pf-c-expandable-section__toggle--PaddingRight: var(--pf-global--spacer--md);
8291
- --pf-c-expandable-section__toggle--PaddingBottom: var(--pf-global--spacer--form-element);
8292
- --pf-c-expandable-section__toggle--PaddingLeft: 0;
8293
- --pf-c-expandable-section__toggle--Color: var(--pf-global--link--Color);
8294
- --pf-c-expandable-section__toggle--hover--Color: var(--pf-global--link--Color--hover);
8295
- --pf-c-expandable-section__toggle--active--Color: var(--pf-global--link--Color--hover);
8296
- --pf-c-expandable-section__toggle--focus--Color: var(--pf-global--link--Color--hover);
8297
- --pf-c-expandable-section__toggle--m-expanded--Color: var(--pf-global--link--Color--hover);
8298
- --pf-c-expandable-section__toggle-icon--MinWidth: 1em;
8299
- --pf-c-expandable-section__toggle-icon--Color: var(--pf-global--Color--100);
8300
- --pf-c-expandable-section__toggle-icon--Transition: .2s ease-in 0s;
8301
- --pf-c-expandable-section__toggle-icon--Rotate: 0;
8302
- --pf-c-expandable-section__toggle-icon--m-expand-top--Rotate: 0;
8303
- --pf-c-expandable-section--m-expanded__toggle-icon--Rotate: 90deg;
8304
- --pf-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate: -90deg;
8305
- --pf-c-expandable-section__toggle-text--MarginLeft: calc(var(--pf-global--spacer--xs) + var(--pf-global--spacer--sm));
8306
- --pf-c-expandable-section__content--MarginTop: var(--pf-global--spacer--md);
8307
- --pf-c-expandable-section__content--MaxWidth: auto;
8308
- --pf-c-expandable-section--m-limit-width__content--MaxWidth: 46.875rem;
8309
- --pf-c-expandable-section--m-display-lg--BoxShadow: var(--pf-global--BoxShadow--md);
8310
- --pf-c-expandable-section--m-display-lg__toggle--PaddingTop: var(--pf-global--spacer--md);
8311
- --pf-c-expandable-section--m-display-lg__toggle--PaddingRight: var(--pf-global--spacer--md);
8312
- --pf-c-expandable-section--m-display-lg__toggle--PaddingBottom: var(--pf-global--spacer--md);
8313
- --pf-c-expandable-section--m-display-lg__toggle--PaddingLeft: var(--pf-global--spacer--md);
8314
- --pf-c-expandable-section--m-display-lg__content--MarginTop: 0;
8315
- --pf-c-expandable-section--m-display-lg__content--PaddingRight: var(--pf-global--spacer--lg);
8316
- --pf-c-expandable-section--m-display-lg__content--PaddingBottom: var(--pf-global--spacer--lg);
8317
- --pf-c-expandable-section--m-display-lg__content--PaddingLeft: var(--pf-global--spacer--lg);
8318
- --pf-c-expandable-section--m-display-lg--after--BackgroundColor: transparent;
8319
- --pf-c-expandable-section--m-display-lg--after--Width: var(--pf-global--BorderWidth--lg);
8320
- --pf-c-expandable-section--m-display-lg--m-expanded--after--BackgroundColor: var(--pf-global--primary-color--100);
8321
- --pf-c-expandable-section--m-indented__content--PaddingLeft: calc(var(--pf-c-expandable-section__toggle-text--MarginLeft) + var(--pf-c-expandable-section__toggle-icon--MinWidth));
8322
- }
8323
-
8324
- .pf-c-expandable-section.pf-m-expanded {
8325
- --pf-c-expandable-section__toggle--Color: var(--pf-c-expandable-section__toggle--m-expanded--Color);
8326
- --pf-c-expandable-section__toggle-icon--Rotate: var(--pf-c-expandable-section--m-expanded__toggle-icon--Rotate);
8327
- --pf-c-expandable-section__toggle-icon--m-expand-top--Rotate: var(--pf-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate);
8328
- --pf-c-expandable-section--m-display-lg--after--BackgroundColor: var(--pf-c-expandable-section--m-display-lg--m-expanded--after--BackgroundColor);
8329
- }
8330
-
8331
- .pf-c-expandable-section.pf-m-detached {
8332
- --pf-c-expandable-section__content--MarginTop: 0;
8333
- }
8334
-
8335
- .pf-c-expandable-section.pf-m-limit-width {
8336
- --pf-c-expandable-section__content--MaxWidth: var(--pf-c-expandable-section--m-limit-width__content--MaxWidth);
8337
- }
8338
-
8339
- .pf-c-expandable-section.pf-m-display-lg {
8340
- --pf-c-expandable-section__toggle--PaddingTop: var(--pf-c-expandable-section--m-display-lg__toggle--PaddingTop);
8341
- --pf-c-expandable-section__toggle--PaddingRight: var(--pf-c-expandable-section--m-display-lg__toggle--PaddingRight);
8342
- --pf-c-expandable-section__toggle--PaddingBottom: var(--pf-c-expandable-section--m-display-lg__toggle--PaddingBottom);
8343
- --pf-c-expandable-section__toggle--PaddingLeft: var(--pf-c-expandable-section--m-display-lg__toggle--PaddingLeft);
8344
- --pf-c-expandable-section__content--PaddingRight: var(--pf-c-expandable-section--m-display-lg__content--PaddingRight);
8345
- --pf-c-expandable-section__content--PaddingBottom: var(--pf-c-expandable-section--m-display-lg__content--PaddingBottom);
8346
- --pf-c-expandable-section__content--PaddingLeft: var(--pf-c-expandable-section--m-display-lg__content--PaddingLeft);
8347
- --pf-c-expandable-section__content--MarginTop: var(--pf-c-expandable-section--m-display-lg__content--MarginTop);
8348
- position: relative;
8349
- box-shadow: var(--pf-c-expandable-section--m-display-lg--BoxShadow);
8350
- }
8351
-
8352
- .pf-c-expandable-section.pf-m-display-lg::after {
8353
- position: absolute;
8354
- top: 0;
8355
- bottom: 0;
8356
- left: 0;
8357
- width: var(--pf-c-expandable-section--m-display-lg--after--Width);
8358
- content: "";
8359
- background-color: var(--pf-c-expandable-section--m-display-lg--after--BackgroundColor);
8360
- }
8361
-
8362
- .pf-c-expandable-section.pf-m-indented {
8363
- --pf-c-expandable-section__content--PaddingLeft: var(--pf-c-expandable-section--m-indented__content--PaddingLeft);
8364
- }
8365
-
8366
- .pf-c-expandable-section__toggle {
8367
- display: flex;
8368
- padding: var(--pf-c-expandable-section__toggle--PaddingTop) var(--pf-c-expandable-section__toggle--PaddingRight) var(--pf-c-expandable-section__toggle--PaddingBottom) var(--pf-c-expandable-section__toggle--PaddingLeft);
8369
- color: var(--pf-c-expandable-section__toggle--Color);
8370
- border: none;
8371
- }
8372
-
8373
- .pf-c-expandable-section__toggle:hover {
8374
- --pf-c-expandable-section__toggle--Color: var(--pf-c-expandable-section__toggle--hover--Color);
8375
- }
8376
-
8377
- .pf-c-expandable-section__toggle:active, .pf-c-expandable-section__toggle.pf-m-active {
8378
- --pf-c-expandable-section__toggle--Color: var(--pf-c-expandable-section__toggle--active--Color);
8379
- }
8380
-
8381
- .pf-c-expandable-section__toggle:focus {
8382
- --pf-c-expandable-section__toggle--Color: var(--pf-c-expandable-section__toggle--focus--Color);
8383
- }
8384
-
8385
- .pf-c-expandable-section__toggle-icon {
8386
- min-width: var(--pf-c-expandable-section__toggle-icon--MinWidth);
8387
- color: var(--pf-c-expandable-section__toggle-icon--Color);
8388
- transition: var(--pf-c-expandable-section__toggle-icon--Transition);
8389
- transform: rotate(var(--pf-c-expandable-section__toggle-icon--Rotate));
8390
- }
8391
-
8392
- .pf-c-expandable-section__toggle-icon.pf-m-expand-top {
8393
- --pf-c-expandable-section__toggle-icon--Rotate: var(--pf-c-expandable-section__toggle-icon--m-expand-top--Rotate);
8394
- }
8395
-
8396
- .pf-c-expandable-section__toggle-text {
8397
- margin-left: var(--pf-c-expandable-section__toggle-text--MarginLeft);
8398
- }
8399
-
8400
- .pf-c-expandable-section__content {
8401
- max-width: var(--pf-c-expandable-section__content--MaxWidth);
8402
- padding-right: var(--pf-c-expandable-section__content--PaddingRight);
8403
- padding-bottom: var(--pf-c-expandable-section__content--PaddingBottom);
8404
- padding-left: var(--pf-c-expandable-section__content--PaddingLeft);
8405
- margin-top: var(--pf-c-expandable-section__content--MarginTop);
8406
- }
8407
-
8408
- .pf-m-overpass-font .pf-c-expandable-section__toggle {
8409
- font-weight: var(--pf-global--FontWeight--semi-bold);
8410
- }
8411
-
8412
8288
  .pf-c-empty-state {
8413
8289
  --pf-c-empty-state--PaddingTop: var(--pf-global--spacer--xl);
8414
8290
  --pf-c-empty-state--PaddingRight: var(--pf-global--spacer--xl);
@@ -8543,6 +8419,130 @@ label.pf-c-check, .pf-c-check__label,
8543
8419
  font-size: var(--pf-global--FontSize--lg);
8544
8420
  }
8545
8421
 
8422
+ .pf-c-expandable-section {
8423
+ --pf-c-expandable-section__toggle--PaddingTop: var(--pf-global--spacer--form-element);
8424
+ --pf-c-expandable-section__toggle--PaddingRight: var(--pf-global--spacer--md);
8425
+ --pf-c-expandable-section__toggle--PaddingBottom: var(--pf-global--spacer--form-element);
8426
+ --pf-c-expandable-section__toggle--PaddingLeft: 0;
8427
+ --pf-c-expandable-section__toggle--Color: var(--pf-global--link--Color);
8428
+ --pf-c-expandable-section__toggle--hover--Color: var(--pf-global--link--Color--hover);
8429
+ --pf-c-expandable-section__toggle--active--Color: var(--pf-global--link--Color--hover);
8430
+ --pf-c-expandable-section__toggle--focus--Color: var(--pf-global--link--Color--hover);
8431
+ --pf-c-expandable-section__toggle--m-expanded--Color: var(--pf-global--link--Color--hover);
8432
+ --pf-c-expandable-section__toggle-icon--MinWidth: 1em;
8433
+ --pf-c-expandable-section__toggle-icon--Color: var(--pf-global--Color--100);
8434
+ --pf-c-expandable-section__toggle-icon--Transition: .2s ease-in 0s;
8435
+ --pf-c-expandable-section__toggle-icon--Rotate: 0;
8436
+ --pf-c-expandable-section__toggle-icon--m-expand-top--Rotate: 0;
8437
+ --pf-c-expandable-section--m-expanded__toggle-icon--Rotate: 90deg;
8438
+ --pf-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate: -90deg;
8439
+ --pf-c-expandable-section__toggle-text--MarginLeft: calc(var(--pf-global--spacer--xs) + var(--pf-global--spacer--sm));
8440
+ --pf-c-expandable-section__content--MarginTop: var(--pf-global--spacer--md);
8441
+ --pf-c-expandable-section__content--MaxWidth: auto;
8442
+ --pf-c-expandable-section--m-limit-width__content--MaxWidth: 46.875rem;
8443
+ --pf-c-expandable-section--m-display-lg--BoxShadow: var(--pf-global--BoxShadow--md);
8444
+ --pf-c-expandable-section--m-display-lg__toggle--PaddingTop: var(--pf-global--spacer--md);
8445
+ --pf-c-expandable-section--m-display-lg__toggle--PaddingRight: var(--pf-global--spacer--md);
8446
+ --pf-c-expandable-section--m-display-lg__toggle--PaddingBottom: var(--pf-global--spacer--md);
8447
+ --pf-c-expandable-section--m-display-lg__toggle--PaddingLeft: var(--pf-global--spacer--md);
8448
+ --pf-c-expandable-section--m-display-lg__content--MarginTop: 0;
8449
+ --pf-c-expandable-section--m-display-lg__content--PaddingRight: var(--pf-global--spacer--lg);
8450
+ --pf-c-expandable-section--m-display-lg__content--PaddingBottom: var(--pf-global--spacer--lg);
8451
+ --pf-c-expandable-section--m-display-lg__content--PaddingLeft: var(--pf-global--spacer--lg);
8452
+ --pf-c-expandable-section--m-display-lg--after--BackgroundColor: transparent;
8453
+ --pf-c-expandable-section--m-display-lg--after--Width: var(--pf-global--BorderWidth--lg);
8454
+ --pf-c-expandable-section--m-display-lg--m-expanded--after--BackgroundColor: var(--pf-global--primary-color--100);
8455
+ --pf-c-expandable-section--m-indented__content--PaddingLeft: calc(var(--pf-c-expandable-section__toggle-text--MarginLeft) + var(--pf-c-expandable-section__toggle-icon--MinWidth));
8456
+ }
8457
+
8458
+ .pf-c-expandable-section.pf-m-expanded {
8459
+ --pf-c-expandable-section__toggle--Color: var(--pf-c-expandable-section__toggle--m-expanded--Color);
8460
+ --pf-c-expandable-section__toggle-icon--Rotate: var(--pf-c-expandable-section--m-expanded__toggle-icon--Rotate);
8461
+ --pf-c-expandable-section__toggle-icon--m-expand-top--Rotate: var(--pf-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate);
8462
+ --pf-c-expandable-section--m-display-lg--after--BackgroundColor: var(--pf-c-expandable-section--m-display-lg--m-expanded--after--BackgroundColor);
8463
+ }
8464
+
8465
+ .pf-c-expandable-section.pf-m-detached {
8466
+ --pf-c-expandable-section__content--MarginTop: 0;
8467
+ }
8468
+
8469
+ .pf-c-expandable-section.pf-m-limit-width {
8470
+ --pf-c-expandable-section__content--MaxWidth: var(--pf-c-expandable-section--m-limit-width__content--MaxWidth);
8471
+ }
8472
+
8473
+ .pf-c-expandable-section.pf-m-display-lg {
8474
+ --pf-c-expandable-section__toggle--PaddingTop: var(--pf-c-expandable-section--m-display-lg__toggle--PaddingTop);
8475
+ --pf-c-expandable-section__toggle--PaddingRight: var(--pf-c-expandable-section--m-display-lg__toggle--PaddingRight);
8476
+ --pf-c-expandable-section__toggle--PaddingBottom: var(--pf-c-expandable-section--m-display-lg__toggle--PaddingBottom);
8477
+ --pf-c-expandable-section__toggle--PaddingLeft: var(--pf-c-expandable-section--m-display-lg__toggle--PaddingLeft);
8478
+ --pf-c-expandable-section__content--PaddingRight: var(--pf-c-expandable-section--m-display-lg__content--PaddingRight);
8479
+ --pf-c-expandable-section__content--PaddingBottom: var(--pf-c-expandable-section--m-display-lg__content--PaddingBottom);
8480
+ --pf-c-expandable-section__content--PaddingLeft: var(--pf-c-expandable-section--m-display-lg__content--PaddingLeft);
8481
+ --pf-c-expandable-section__content--MarginTop: var(--pf-c-expandable-section--m-display-lg__content--MarginTop);
8482
+ position: relative;
8483
+ box-shadow: var(--pf-c-expandable-section--m-display-lg--BoxShadow);
8484
+ }
8485
+
8486
+ .pf-c-expandable-section.pf-m-display-lg::after {
8487
+ position: absolute;
8488
+ top: 0;
8489
+ bottom: 0;
8490
+ left: 0;
8491
+ width: var(--pf-c-expandable-section--m-display-lg--after--Width);
8492
+ content: "";
8493
+ background-color: var(--pf-c-expandable-section--m-display-lg--after--BackgroundColor);
8494
+ }
8495
+
8496
+ .pf-c-expandable-section.pf-m-indented {
8497
+ --pf-c-expandable-section__content--PaddingLeft: var(--pf-c-expandable-section--m-indented__content--PaddingLeft);
8498
+ }
8499
+
8500
+ .pf-c-expandable-section__toggle {
8501
+ display: flex;
8502
+ padding: var(--pf-c-expandable-section__toggle--PaddingTop) var(--pf-c-expandable-section__toggle--PaddingRight) var(--pf-c-expandable-section__toggle--PaddingBottom) var(--pf-c-expandable-section__toggle--PaddingLeft);
8503
+ color: var(--pf-c-expandable-section__toggle--Color);
8504
+ border: none;
8505
+ }
8506
+
8507
+ .pf-c-expandable-section__toggle:hover {
8508
+ --pf-c-expandable-section__toggle--Color: var(--pf-c-expandable-section__toggle--hover--Color);
8509
+ }
8510
+
8511
+ .pf-c-expandable-section__toggle:active, .pf-c-expandable-section__toggle.pf-m-active {
8512
+ --pf-c-expandable-section__toggle--Color: var(--pf-c-expandable-section__toggle--active--Color);
8513
+ }
8514
+
8515
+ .pf-c-expandable-section__toggle:focus {
8516
+ --pf-c-expandable-section__toggle--Color: var(--pf-c-expandable-section__toggle--focus--Color);
8517
+ }
8518
+
8519
+ .pf-c-expandable-section__toggle-icon {
8520
+ min-width: var(--pf-c-expandable-section__toggle-icon--MinWidth);
8521
+ color: var(--pf-c-expandable-section__toggle-icon--Color);
8522
+ transition: var(--pf-c-expandable-section__toggle-icon--Transition);
8523
+ transform: rotate(var(--pf-c-expandable-section__toggle-icon--Rotate));
8524
+ }
8525
+
8526
+ .pf-c-expandable-section__toggle-icon.pf-m-expand-top {
8527
+ --pf-c-expandable-section__toggle-icon--Rotate: var(--pf-c-expandable-section__toggle-icon--m-expand-top--Rotate);
8528
+ }
8529
+
8530
+ .pf-c-expandable-section__toggle-text {
8531
+ margin-left: var(--pf-c-expandable-section__toggle-text--MarginLeft);
8532
+ }
8533
+
8534
+ .pf-c-expandable-section__content {
8535
+ max-width: var(--pf-c-expandable-section__content--MaxWidth);
8536
+ padding-right: var(--pf-c-expandable-section__content--PaddingRight);
8537
+ padding-bottom: var(--pf-c-expandable-section__content--PaddingBottom);
8538
+ padding-left: var(--pf-c-expandable-section__content--PaddingLeft);
8539
+ margin-top: var(--pf-c-expandable-section__content--MarginTop);
8540
+ }
8541
+
8542
+ .pf-m-overpass-font .pf-c-expandable-section__toggle {
8543
+ font-weight: var(--pf-global--FontWeight--semi-bold);
8544
+ }
8545
+
8546
8546
  .pf-c-file-upload {
8547
8547
  --pf-c-file-upload--m-loading__file-details--before--BackgroundColor: var(--pf-global--BackgroundColor--100);
8548
8548
  --pf-c-file-upload--m-loading__file-details--before--Left: var(--pf-global--BorderWidth--sm);
@@ -20991,2040 +20991,2040 @@ svg.pf-c-spinner.pf-m-xl {
20991
20991
  --pf-c-toggle-group__button--m-selected--BackgroundColor: var(--pf-global--primary-color--300);
20992
20992
  }
20993
20993
 
20994
- .pf-c-tooltip {
20995
- --pf-c-tooltip--MaxWidth: 18.75rem;
20996
- --pf-c-tooltip--BoxShadow: var(--pf-global--BoxShadow--md);
20997
- --pf-c-tooltip__content--PaddingTop: var(--pf-global--spacer--sm);
20998
- --pf-c-tooltip__content--PaddingRight: var(--pf-global--spacer--sm);
20999
- --pf-c-tooltip__content--PaddingBottom: var(--pf-global--spacer--sm);
21000
- --pf-c-tooltip__content--PaddingLeft: var(--pf-global--spacer--sm);
21001
- --pf-c-tooltip__content--Color: var(--pf-global--Color--light-100);
21002
- --pf-c-tooltip__content--BackgroundColor: var(--pf-global--BackgroundColor--dark-100);
21003
- --pf-c-tooltip__content--FontSize: var(--pf-global--FontSize--sm);
21004
- --pf-c-tooltip__arrow--Width: 0.5rem;
21005
- --pf-c-tooltip__arrow--Height: 0.5rem;
21006
- --pf-c-tooltip__arrow--m-top--TranslateX: -50%;
21007
- --pf-c-tooltip__arrow--m-top--TranslateY: 50%;
21008
- --pf-c-tooltip__arrow--m-top--Rotate: 45deg;
21009
- --pf-c-tooltip__arrow--m-right--TranslateX: -50%;
21010
- --pf-c-tooltip__arrow--m-right--TranslateY: -50%;
21011
- --pf-c-tooltip__arrow--m-right--Rotate: 45deg;
21012
- --pf-c-tooltip__arrow--m-bottom--TranslateX: -50%;
21013
- --pf-c-tooltip__arrow--m-bottom--TranslateY: -50%;
21014
- --pf-c-tooltip__arrow--m-bottom--Rotate: 45deg;
21015
- --pf-c-tooltip__arrow--m-left--TranslateX: 50%;
21016
- --pf-c-tooltip__arrow--m-left--TranslateY: -50%;
21017
- --pf-c-tooltip__arrow--m-left--Rotate: 45deg;
21018
- position: relative;
21019
- max-width: var(--pf-c-tooltip--MaxWidth);
21020
- box-shadow: var(--pf-c-tooltip--BoxShadow);
20994
+ .pf-c-toolbar__content-section, .pf-c-toolbar__content, .pf-c-toolbar__item, .pf-c-toolbar__group {
20995
+ --pf-hidden-visible--visible--Visibility: visible;
20996
+ --pf-hidden-visible--hidden--Display: none;
20997
+ --pf-hidden-visible--hidden--Visibility: hidden;
20998
+ --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
20999
+ --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
21000
+ display: var(--pf-hidden-visible--Display);
21001
+ visibility: var(--pf-hidden-visible--Visibility);
21021
21002
  }
21022
21003
 
21023
- .pf-c-tooltip.pf-m-top .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-top-left .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-top-right .pf-c-tooltip__arrow {
21024
- bottom: 0;
21025
- left: 50%;
21026
- transform: translateX(var(--pf-c-tooltip__arrow--m-top--TranslateX)) translateY(var(--pf-c-tooltip__arrow--m-top--TranslateY)) rotate(var(--pf-c-tooltip__arrow--m-top--Rotate));
21004
+ .pf-m-hidden.pf-c-toolbar__content-section, .pf-m-hidden.pf-c-toolbar__content, .pf-m-hidden.pf-c-toolbar__item, .pf-m-hidden.pf-c-toolbar__group {
21005
+ --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
21006
+ --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
21027
21007
  }
21028
21008
 
21029
- .pf-c-tooltip.pf-m-bottom .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-bottom-left .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-bottom-right .pf-c-tooltip__arrow {
21030
- top: 0;
21031
- left: 50%;
21032
- transform: translateX(var(--pf-c-tooltip__arrow--m-bottom--TranslateX)) translateY(var(--pf-c-tooltip__arrow--m-bottom--TranslateY)) rotate(var(--pf-c-tooltip__arrow--m-bottom--Rotate));
21009
+ @media screen and (min-width: 576px) {
21010
+ .pf-m-hidden-on-sm.pf-c-toolbar__content-section, .pf-m-hidden-on-sm.pf-c-toolbar__content, .pf-m-hidden-on-sm.pf-c-toolbar__item, .pf-m-hidden-on-sm.pf-c-toolbar__group {
21011
+ --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
21012
+ --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
21013
+ }
21014
+
21015
+ .pf-m-visible-on-sm.pf-c-toolbar__content-section, .pf-m-visible-on-sm.pf-c-toolbar__content, .pf-m-visible-on-sm.pf-c-toolbar__item, .pf-m-visible-on-sm.pf-c-toolbar__group {
21016
+ --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
21017
+ --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
21018
+ }
21033
21019
  }
21020
+ @media screen and (min-width: 768px) {
21021
+ .pf-m-hidden-on-md.pf-c-toolbar__content-section, .pf-m-hidden-on-md.pf-c-toolbar__content, .pf-m-hidden-on-md.pf-c-toolbar__item, .pf-m-hidden-on-md.pf-c-toolbar__group {
21022
+ --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
21023
+ --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
21024
+ }
21034
21025
 
21035
- .pf-c-tooltip.pf-m-left .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-left-top .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-left-bottom .pf-c-tooltip__arrow {
21036
- top: 50%;
21037
- right: 0;
21038
- transform: translateX(var(--pf-c-tooltip__arrow--m-left--TranslateX)) translateY(var(--pf-c-tooltip__arrow--m-left--TranslateY)) rotate(var(--pf-c-tooltip__arrow--m-left--Rotate));
21026
+ .pf-m-visible-on-md.pf-c-toolbar__content-section, .pf-m-visible-on-md.pf-c-toolbar__content, .pf-m-visible-on-md.pf-c-toolbar__item, .pf-m-visible-on-md.pf-c-toolbar__group {
21027
+ --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
21028
+ --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
21029
+ }
21039
21030
  }
21031
+ @media screen and (min-width: 992px) {
21032
+ .pf-m-hidden-on-lg.pf-c-toolbar__content-section, .pf-m-hidden-on-lg.pf-c-toolbar__content, .pf-m-hidden-on-lg.pf-c-toolbar__item, .pf-m-hidden-on-lg.pf-c-toolbar__group {
21033
+ --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
21034
+ --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
21035
+ }
21040
21036
 
21041
- .pf-c-tooltip.pf-m-right .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-right-top .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-right-bottom .pf-c-tooltip__arrow {
21042
- top: 50%;
21043
- left: 0;
21044
- transform: translateX(var(--pf-c-tooltip__arrow--m-right--TranslateX)) translateY(var(--pf-c-tooltip__arrow--m-right--TranslateY)) rotate(var(--pf-c-tooltip__arrow--m-right--Rotate));
21037
+ .pf-m-visible-on-lg.pf-c-toolbar__content-section, .pf-m-visible-on-lg.pf-c-toolbar__content, .pf-m-visible-on-lg.pf-c-toolbar__item, .pf-m-visible-on-lg.pf-c-toolbar__group {
21038
+ --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
21039
+ --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
21040
+ }
21045
21041
  }
21042
+ @media screen and (min-width: 1200px) {
21043
+ .pf-m-hidden-on-xl.pf-c-toolbar__content-section, .pf-m-hidden-on-xl.pf-c-toolbar__content, .pf-m-hidden-on-xl.pf-c-toolbar__item, .pf-m-hidden-on-xl.pf-c-toolbar__group {
21044
+ --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
21045
+ --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
21046
+ }
21046
21047
 
21047
- .pf-c-tooltip.pf-m-left-top .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-right-top .pf-c-tooltip__arrow {
21048
- top: var(--pf-c-tooltip__arrow--Height);
21048
+ .pf-m-visible-on-xl.pf-c-toolbar__content-section, .pf-m-visible-on-xl.pf-c-toolbar__content, .pf-m-visible-on-xl.pf-c-toolbar__item, .pf-m-visible-on-xl.pf-c-toolbar__group {
21049
+ --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
21050
+ --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
21051
+ }
21049
21052
  }
21053
+ @media screen and (min-width: 1450px) {
21054
+ .pf-m-hidden-on-2xl.pf-c-toolbar__content-section, .pf-m-hidden-on-2xl.pf-c-toolbar__content, .pf-m-hidden-on-2xl.pf-c-toolbar__item, .pf-m-hidden-on-2xl.pf-c-toolbar__group {
21055
+ --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
21056
+ --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
21057
+ }
21050
21058
 
21051
- .pf-c-tooltip.pf-m-left-bottom .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-right-bottom .pf-c-tooltip__arrow {
21052
- top: auto;
21053
- bottom: 0;
21059
+ .pf-m-visible-on-2xl.pf-c-toolbar__content-section, .pf-m-visible-on-2xl.pf-c-toolbar__content, .pf-m-visible-on-2xl.pf-c-toolbar__item, .pf-m-visible-on-2xl.pf-c-toolbar__group {
21060
+ --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
21061
+ --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
21062
+ }
21063
+ }
21064
+ .pf-c-toolbar {
21065
+ --pf-c-toolbar--BackgroundColor: var(--pf-global--BackgroundColor--100);
21066
+ --pf-c-toolbar--RowGap: var(--pf-global--spacer--lg);
21067
+ --pf-c-toolbar--PaddingTop: var(--pf-global--spacer--md);
21068
+ --pf-c-toolbar--PaddingBottom: var(--pf-global--spacer--md);
21069
+ --pf-c-toolbar__item--Display: block;
21070
+ --pf-c-toolbar__item--MinWidth--base: auto;
21071
+ --pf-c-toolbar__group--Display: flex;
21072
+ --pf-c-toolbar--m-sticky--ZIndex: var(--pf-global--ZIndex--xs);
21073
+ --pf-c-toolbar--m-sticky--BoxShadow: var(--pf-global--BoxShadow--sm-bottom);
21074
+ --pf-c-toolbar__content--Display: flex;
21075
+ --pf-c-toolbar__content--PaddingRight: var(--pf-global--spacer--md);
21076
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-global--spacer--md);
21077
+ --pf-c-toolbar__content-section--Display: flex;
21078
+ --pf-c-toolbar--m-page-insets--inset: var(--pf-global--spacer--md);
21079
+ --pf-c-toolbar--m-page-insets--xl--inset: var(--pf-global--spacer--lg);
21080
+ --pf-c-toolbar__expandable-content--Display: grid;
21081
+ --pf-c-toolbar__expandable-content--PaddingTop: var(--pf-c-toolbar--RowGap);
21082
+ --pf-c-toolbar__expandable-content--PaddingRight: var(--pf-c-toolbar__content--PaddingRight);
21083
+ --pf-c-toolbar__expandable-content--PaddingBottom: var(--pf-global--spacer--md);
21084
+ --pf-c-toolbar__expandable-content--PaddingLeft: var(--pf-c-toolbar__content--PaddingLeft);
21085
+ --pf-c-toolbar__expandable-content--lg--PaddingRight: 0;
21086
+ --pf-c-toolbar__expandable-content--lg--PaddingBottom: 0;
21087
+ --pf-c-toolbar__expandable-content--lg--PaddingLeft: 0;
21088
+ --pf-c-toolbar__expandable-content--ZIndex: var(--pf-global--ZIndex--sm);
21089
+ --pf-c-toolbar__expandable-content--BoxShadow: var(--pf-global--BoxShadow--md-bottom);
21090
+ --pf-c-toolbar__expandable-content--BackgroundColor: var(--pf-c-toolbar--BackgroundColor);
21091
+ --pf-c-toolbar__expandable-content--m-expanded--GridRowGap: var(--pf-global--gutter--md);
21092
+ --pf-c-toolbar__group--m-chip-container--MarginTop: calc(var(--pf-global--spacer--md) * -1);
21093
+ --pf-c-toolbar__group--m-chip-container__item--MarginTop: var(--pf-global--spacer--md);
21094
+ --pf-c-toolbar--spacer--base: var(--pf-global--spacer--md);
21095
+ --pf-c-toolbar__item--spacer: var(--pf-c-toolbar--spacer--base);
21096
+ --pf-c-toolbar__group--spacer: var(--pf-c-toolbar--spacer--base);
21097
+ --pf-c-toolbar__item--Width: auto;
21098
+ --pf-c-toolbar__group--m-toggle-group--spacer: var(--pf-global--spacer--sm);
21099
+ --pf-c-toolbar__group--m-toggle-group--m-show--spacer: var(--pf-c-toolbar__group--spacer);
21100
+ --pf-c-toolbar__group--m-icon-button-group--spacer: var(--pf-c-toolbar__group--spacer);
21101
+ --pf-c-toolbar__group--m-icon-button-group--space-items: 0;
21102
+ --pf-c-toolbar__group--m-button-group--spacer: var(--pf-c-toolbar__group--spacer);
21103
+ --pf-c-toolbar__group--m-button-group--space-items: var(--pf-global--spacer--sm);
21104
+ --pf-c-toolbar__group--m-filter-group--spacer: var(--pf-c-toolbar__group--spacer);
21105
+ --pf-c-toolbar__group--m-filter-group--space-items: 0;
21106
+ --pf-c-toolbar__item--m-overflow-menu--spacer: var(--pf-c-toolbar__item--spacer);
21107
+ --pf-c-toolbar__item--m-bulk-select--spacer: var(--pf-global--spacer--lg);
21108
+ --pf-c-toolbar__expand-all-icon--Rotate: 0;
21109
+ --pf-c-toolbar__expand-all-icon--Transition: var(--pf-global--Transition);
21110
+ --pf-c-toolbar__item--m-expand-all--m-expanded__expand-all-icon--Rotate: 90deg;
21111
+ --pf-c-toolbar__item--m-search-filter--spacer: var(--pf-global--spacer--sm);
21112
+ --pf-c-toolbar__item--m-chip-group--spacer: var(--pf-global--spacer--sm);
21113
+ --pf-c-toolbar__item--m-label--spacer: var(--pf-c-toolbar__item--spacer);
21114
+ --pf-c-toolbar__item--m-label--FontWeight: var(--pf-global--FontWeight--bold);
21115
+ --pf-c-toolbar__expandable-content__item--m-label--MarginBottom: calc(-1 * var(--pf-c-toolbar__expandable-content--m-expanded--GridRowGap) + var(--pf-global--spacer--sm));
21116
+ --pf-c-toolbar__expandable-content__item--m-label--FontSize: var(--pf-global--FontSize--sm);
21117
+ --pf-c-toolbar__toggle--m-expanded__c-button--m-plain--Color: var(--pf-global--Color--100);
21118
+ --pf-c-toolbar--c-divider--m-vertical--spacer: var(--pf-c-toolbar--spacer--base);
21119
+ --pf-c-toolbar--m-full-height--PaddingTop: 0;
21120
+ --pf-c-toolbar--m-full-height--PaddingBottom: 0;
21121
+ --pf-c-toolbar--m-full-height__item--Display: flex;
21122
+ --pf-c-toolbar--m-full-height__item--AlignItems: center;
21123
+ position: relative;
21124
+ row-gap: var(--pf-c-toolbar--RowGap);
21125
+ display: grid;
21126
+ padding-top: var(--pf-c-toolbar--PaddingTop);
21127
+ padding-bottom: var(--pf-c-toolbar--PaddingBottom);
21128
+ background-color: var(--pf-c-toolbar--BackgroundColor);
21054
21129
  }
21055
21130
 
21056
- .pf-c-tooltip.pf-m-top-left .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-bottom-left .pf-c-tooltip__arrow {
21057
- left: var(--pf-c-tooltip__arrow--Width);
21131
+ @media screen and (min-width: 992px) {
21132
+ .pf-c-toolbar {
21133
+ --pf-c-toolbar__expandable-content--PaddingRight: var(--pf-c-toolbar__expandable-content--lg--PaddingRight);
21134
+ --pf-c-toolbar__expandable-content--PaddingBottom: var(--pf-c-toolbar__expandable-content--lg--PaddingBottom);
21135
+ --pf-c-toolbar__expandable-content--PaddingLeft: var(--pf-c-toolbar__expandable-content--lg--PaddingLeft);
21136
+ }
21137
+ }
21138
+ @media screen and (min-width: 1200px) {
21139
+ .pf-c-toolbar {
21140
+ --pf-c-toolbar--m-page-insets--inset: var(--pf-c-toolbar--m-page-insets--xl--inset);
21141
+ }
21142
+ }
21143
+ .pf-c-toolbar.pf-m-page-insets {
21144
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--m-page-insets--inset);
21145
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--m-page-insets--inset);
21058
21146
  }
21059
21147
 
21060
- .pf-c-tooltip.pf-m-top-right .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-bottom-right .pf-c-tooltip__arrow {
21061
- right: 0;
21062
- left: auto;
21148
+ .pf-c-toolbar.pf-m-sticky {
21149
+ position: sticky;
21150
+ top: 0;
21151
+ z-index: var(--pf-c-toolbar--m-sticky--ZIndex);
21152
+ box-shadow: var(--pf-c-toolbar--m-sticky--BoxShadow);
21063
21153
  }
21064
21154
 
21065
- .pf-c-tooltip__content {
21066
- position: relative;
21067
- padding: var(--pf-c-tooltip__content--PaddingTop) var(--pf-c-tooltip__content--PaddingRight) var(--pf-c-tooltip__content--PaddingBottom) var(--pf-c-tooltip__content--PaddingLeft);
21068
- font-size: var(--pf-c-tooltip__content--FontSize);
21069
- color: var(--pf-c-tooltip__content--Color);
21070
- text-align: center;
21071
- word-break: break-word;
21072
- background-color: var(--pf-c-tooltip__content--BackgroundColor);
21155
+ .pf-c-toolbar.pf-m-full-height {
21156
+ --pf-c-toolbar--PaddingTop: var(--pf-c-toolbar--m-full-height--PaddingTop);
21157
+ --pf-c-toolbar--PaddingBottom: var(--pf-c-toolbar--m-full-height--PaddingTop);
21158
+ --pf-c-toolbar__item--Display: var(--pf-c-toolbar--m-full-height__item--Display);
21159
+ height: 100%;
21073
21160
  }
21074
21161
 
21075
- .pf-c-tooltip__content.pf-m-text-align-left {
21076
- text-align: left;
21162
+ .pf-c-toolbar.pf-m-full-height,
21163
+ .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__content,
21164
+ .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__content-section,
21165
+ .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__expandable-content,
21166
+ .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__group {
21167
+ min-width: 0;
21077
21168
  }
21078
21169
 
21079
- .pf-c-tooltip__arrow {
21080
- position: absolute;
21081
- width: var(--pf-c-tooltip__arrow--Width);
21082
- height: var(--pf-c-tooltip__arrow--Height);
21083
- pointer-events: none;
21084
- background-color: var(--pf-c-tooltip__content--BackgroundColor);
21170
+ .pf-c-toolbar.pf-m-full-height,
21171
+ .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__content,
21172
+ .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__content-section,
21173
+ .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__group,
21174
+ .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__item {
21175
+ align-self: stretch;
21085
21176
  }
21086
21177
 
21087
- :where(.pf-theme-dark) .pf-c-tooltip {
21088
- --pf-c-tooltip--BoxShadow: none;
21089
- --pf-c-tooltip__content--BackgroundColor: var(--pf-global--BackgroundColor--300);
21178
+ .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__item {
21179
+ align-items: var(--pf-c-toolbar--m-full-height__item--AlignItems);
21090
21180
  }
21091
21181
 
21092
- :where(.pf-theme-dark) .pf-c-tooltip,
21093
- :where(.pf-theme-dark) .pf-c-tooltip__arrow {
21094
- border: var(--pf-global--BorderWidth--lg) solid var(--pf-global--BorderColor--300);
21182
+ .pf-c-toolbar.pf-m-static,
21183
+ .pf-c-toolbar.pf-m-static .pf-c-toolbar__content {
21184
+ position: static;
21095
21185
  }
21096
21186
 
21097
- :where(.pf-theme-dark) .pf-c-tooltip__arrow {
21098
- --pf-c-tooltip__arrow--Width: 0.9375rem;
21099
- --pf-c-tooltip__arrow--Height: 0.9375rem;
21187
+ .pf-c-toolbar.pf-m-static .pf-c-toolbar__expandable-content {
21188
+ position: absolute;
21100
21189
  }
21101
21190
 
21102
- .pf-c-number-input .pf-c-form-control {
21103
- appearance: textfield;
21191
+ .pf-c-toolbar__content-section > .pf-c-divider,
21192
+ .pf-c-toolbar__group > .pf-c-divider {
21193
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar--c-divider--m-vertical--spacer);
21104
21194
  }
21105
21195
 
21106
- .pf-c-number-input .pf-c-form-control::-webkit-inner-spin-button, .pf-c-number-input .pf-c-form-control::-webkit-outer-spin-button {
21107
- appearance: none;
21108
- margin: 0;
21196
+ .pf-c-toolbar__content-section > .pf-c-divider.pf-m-vertical,
21197
+ .pf-c-toolbar__group > .pf-c-divider.pf-m-vertical {
21198
+ margin-right: var(--pf-c-toolbar--spacer);
21109
21199
  }
21110
21200
 
21111
- .pf-c-number-input {
21112
- --pf-c-number-input__unit--c-input-group--MarginLeft: var(--pf-global--spacer--sm);
21113
- --pf-c-number-input__icon--FontSize: var(--pf-global--FontSize--xs);
21114
- --pf-c-number-input--c-form-control--width-base: calc(var(--pf-global--spacer--sm) * 2 + var(--pf-global--BorderWidth--sm) * 2);
21115
- --pf-c-number-input--c-form-control--width-icon: 0px;
21116
- --pf-c-number-input--m-status--c-form-control--width-icon: var(--pf-global--spacer--xl);
21117
- --pf-c-number-input--c-form-control--width-chars: 4;
21118
- --pf-c-number-input--c-form-control--Width:
21119
- calc(
21120
- calc(
21121
- var(--pf-c-number-input--c-form-control--width-base) + var(--pf-c-number-input--c-form-control--width-chars) * 1ch
21122
- ) + var(--pf-c-number-input--c-form-control--width-icon)
21123
- );
21124
- display: inline-flex;
21125
- align-items: center;
21201
+ .pf-c-toolbar__content-section > .pf-c-divider.pf-m-vertical:last-child,
21202
+ .pf-c-toolbar__group > .pf-c-divider.pf-m-vertical:last-child {
21203
+ --pf-c-toolbar--spacer: 0;
21126
21204
  }
21127
21205
 
21128
- .pf-c-number-input.pf-m-status {
21129
- --pf-c-number-input--c-form-control--width-icon: var(--pf-c-number-input--m-status--c-form-control--width-icon);
21206
+ .pf-c-toolbar__group {
21207
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--spacer);
21208
+ --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__group--Display);
21209
+ align-items: center;
21210
+ margin-right: var(--pf-c-toolbar--spacer);
21130
21211
  }
21131
21212
 
21132
- .pf-c-number-input .pf-c-form-control {
21133
- display: inline-flex;
21134
- width: var(--pf-c-number-input--c-form-control--Width);
21135
- text-align: right;
21213
+ .pf-c-toolbar__group.pf-m-button-group {
21214
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-button-group--spacer);
21136
21215
  }
21137
21216
 
21138
- .pf-c-input-group + .pf-c-number-input__unit,
21139
- .pf-c-number-input__unit + .pf-c-input-group {
21140
- margin-left: var(--pf-c-number-input__unit--c-input-group--MarginLeft);
21217
+ .pf-c-toolbar__group.pf-m-button-group > * {
21218
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-button-group--space-items);
21141
21219
  }
21142
21220
 
21143
- .pf-c-number-input__icon {
21144
- display: flex;
21145
- font-size: var(--pf-c-number-input__icon--FontSize);
21221
+ .pf-c-toolbar__group.pf-m-icon-button-group {
21222
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-icon-button-group--spacer);
21146
21223
  }
21147
21224
 
21148
- .pf-c-tree-view {
21149
- --pf-c-tree-view--PaddingTop: var(--pf-global--spacer--sm);
21150
- --pf-c-tree-view--PaddingBottom: var(--pf-global--spacer--sm);
21151
- --pf-c-tree-view__node--indent--base: calc(var(--pf-global--spacer--md) * 2 + var(--pf-c-tree-view__node-toggle-icon--MinWidth));
21152
- --pf-c-tree-view__node--nested-indent--base: calc(var(--pf-c-tree-view__node--indent--base) - var(--pf-global--spacer--md));
21153
- --pf-c-tree-view__node--PaddingTop--base: var(--pf-global--spacer--sm);
21154
- --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view__node--PaddingTop--base);
21155
- --pf-c-tree-view__node--PaddingRight: var(--pf-global--spacer--sm);
21156
- --pf-c-tree-view__node--PaddingBottom: var(--pf-global--spacer--sm);
21157
- --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view__node--indent--base);
21158
- --pf-c-tree-view__node--Color: var(--pf-global--Color--100);
21159
- --pf-c-tree-view__node--m-current--Color: var(--pf-global--link--Color);
21160
- --pf-c-tree-view__node--m-current--FontWeight: var(--pf-global--FontWeight--bold);
21161
- --pf-c-tree-view__node-container--Display: contents;
21162
- --pf-c-tree-view__node-content--RowGap: var(--pf-global--spacer--sm);
21163
- --pf-c-tree-view__node-content--Overflow: visible;
21164
- --pf-c-tree-view__node--hover--BackgroundColor: var(--pf-global--BackgroundColor--200);
21165
- --pf-c-tree-view__node--focus--BackgroundColor: var(--pf-global--palette--black-200);
21166
- --pf-c-tree-view__list-item__list-item__node-toggle--Top: var(--pf-c-tree-view__node--PaddingTop--base);
21167
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
21168
- --pf-c-tree-view__list-item__list-item__node-toggle--TranslateX: -100%;
21169
- --pf-c-tree-view__node-toggle--Position: absolute;
21170
- --pf-c-tree-view__node-toggle--Color--base: var(--pf-global--Color--200);
21171
- --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--Color--base);
21172
- --pf-c-tree-view__node-toggle--hover--Color: var(--pf-global--Color--100);
21173
- --pf-c-tree-view__node-toggle--focus--Color: var(--pf-global--Color--100);
21174
- --pf-c-tree-view__node-toggle--active--Color: var(--pf-global--Color--100);
21175
- --pf-c-tree-view__list-item--m-expanded__node-toggle--Color: var(--pf-global--Color--100);
21176
- --pf-c-tree-view__node-toggle-icon--MinWidth: var(--pf-global--FontSize--md);
21177
- --pf-c-tree-view__node-toggle-icon--Transition: transform var(--pf-global--TransitionDuration) var(--pf-global--TimingFunction);
21178
- --pf-c-tree-view__node-toggle-button--PaddingTop: var(--pf-global--spacer--form-element);
21179
- --pf-c-tree-view__node-toggle-button--PaddingRight: var(--pf-global--spacer--md);
21180
- --pf-c-tree-view__node-toggle-button--PaddingBottom: var(--pf-global--spacer--form-element);
21181
- --pf-c-tree-view__node-toggle-button--PaddingLeft: var(--pf-global--spacer--md);
21182
- --pf-c-tree-view__node-toggle-button--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
21183
- --pf-c-tree-view__node-toggle-button--MarginBottom: calc(var(--pf-global--spacer--form-element) * -1);
21184
- --pf-c-tree-view__node-check--MarginRight: var(--pf-global--spacer--sm);
21185
- --pf-c-tree-view__node-count--MarginLeft: var(--pf-global--spacer--sm);
21186
- --pf-c-tree-view__node-count--c-badge--m-read--BackgroundColor: var(--pf-global--disabled-color--200);
21187
- --pf-c-tree-view__search--PaddingTop: var(--pf-global--spacer--sm);
21188
- --pf-c-tree-view__search--PaddingRight: var(--pf-global--spacer--sm);
21189
- --pf-c-tree-view__search--PaddingBottom: var(--pf-global--spacer--sm);
21190
- --pf-c-tree-view__search--PaddingLeft: var(--pf-global--spacer--sm);
21191
- --pf-c-tree-view__node-icon--PaddingRight: var(--pf-global--spacer--sm);
21192
- --pf-c-tree-view__node-icon--Color: var(--pf-global--icon--Color--light);
21193
- --pf-c-tree-view__node-toggle-icon--base--Rotate: 0;
21194
- --pf-c-tree-view__node-toggle-icon--Rotate: var(--pf-c-tree-view__node-toggle-icon--base--Rotate);
21195
- --pf-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate: 90deg;
21196
- --pf-c-tree-view__node-text--max-lines: 1;
21197
- --pf-c-tree-view__node-title--FontWeight: var(--pf-global--FontWeight--bold);
21198
- --pf-c-tree-view__action--MarginLeft: var(--pf-global--spacer--md);
21199
- --pf-c-tree-view__action--focus--BackgroundColor: var(--pf-global--BackgroundColor--200);
21200
- --pf-c-tree-view__action--Color: var(--pf-global--icon--Color--light);
21201
- --pf-c-tree-view__action--hover--Color: var(--pf-global--icon--Color--dark);
21202
- --pf-c-tree-view__action--focus--Color: var(--pf-global--icon--Color--dark);
21203
- --pf-c-tree-view--m-guides--guide--Left: var(--pf-c-tree-view--m-guides--guide-left--base);
21204
- --pf-c-tree-view--m-guides--guide-color--base: var(--pf-global--BorderColor--100);
21205
- --pf-c-tree-view--m-guides--guide-width--base: var(--pf-global--BorderWidth--sm);
21206
- --pf-c-tree-view--m-guides--guide-left--base: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides__list-node--guide-width--base));
21207
- --pf-c-tree-view--m-guides--guide-left--base--offset: calc(var(--pf-c-tree-view__list-item__list-item__node-toggle--Left) + var(--pf-c-tree-view__node-toggle-icon--MinWidth) / 2);
21208
- --pf-c-tree-view--m-guides__list-node--guide-width--base: var(--pf-global--spacer--lg);
21209
- --pf-c-tree-view--m-guides__list-item--before--Top: 0;
21210
- --pf-c-tree-view--m-guides__list-item--before--Width: var(--pf-c-tree-view--m-guides--guide-width--base);
21211
- --pf-c-tree-view--m-guides__list-item--before--Height: 100%;
21212
- --pf-c-tree-view--m-guides__list-item--before--BackgroundColor: var(--pf-c-tree-view--m-guides--guide-color--base);
21213
- --pf-c-tree-view--m-guides__list-item--last-child--before--Top: var(--pf-c-tree-view--m-guides__node--before--Top);
21214
- --pf-c-tree-view--m-guides__list-item--last-child--before--Height: var(--pf-c-tree-view--m-guides__list-item--last-child--before--Top);
21215
- --pf-c-tree-view--m-guides__list-item--ZIndex: var(--pf-global--ZIndex--xs);
21216
- --pf-c-tree-view--m-guides__node--before--Width: 1rem;
21217
- --pf-c-tree-view--m-guides__node--before--Height: var(--pf-c-tree-view--m-guides--guide-width--base);
21218
- --pf-c-tree-view--m-guides__node--before--Top: 1.125rem;
21219
- --pf-c-tree-view--m-guides__node--before--BackgroundColor: var(--pf-c-tree-view--m-guides--guide-color--base);
21220
- --pf-c-tree-view--m-compact--base-border--Left--offset: var(--pf-global--spacer--md);
21221
- --pf-c-tree-view--m-compact--base-border--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
21222
- --pf-c-tree-view--m-compact__node--indent--base: var(--pf-c-tree-view__node--indent--base);
21223
- --pf-c-tree-view--m-compact__node--nested-indent--base: var(--pf-global--spacer--lg);
21224
- --pf-c-tree-view--m-compact--border--Left: var(--pf-c-tree-view--m-compact--base-border--Left);
21225
- --pf-c-tree-view--m-compact__node--PaddingTop: 0;
21226
- --pf-c-tree-view--m-compact__node--PaddingBottom: 0;
21227
- --pf-c-tree-view--m-compact__node--nested--PaddingTop: var(--pf-global--spacer--sm);
21228
- --pf-c-tree-view--m-compact__node--nested--PaddingBottom: var(--pf-global--spacer--sm);
21229
- --pf-c-tree-view--m-compact__list-item__list-item__node-toggle--Top: calc(var(--pf-c-tree-view--m-compact__node-container--PaddingTop));
21230
- --pf-c-tree-view--m-compact__list-item--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
21231
- --pf-c-tree-view--m-compact__list-item--BorderBottomColor: var(--pf-global--BorderColor--100);
21232
- --pf-c-tree-view--m-compact__list-item--before--Top: 0;
21233
- --pf-c-tree-view--m-compact__list-item--last-child--before--Height: var(--pf-c-tree-view--m-compact__node--before--Top);
21234
- --pf-c-tree-view--m-compact__list-item--nested--before--Top: calc(var(--pf-c-tree-view__node--PaddingTop--base) * -1);
21235
- --pf-c-tree-view--m-compact__list-item--nested--last-child--before--Height: calc(var(--pf-c-tree-view--m-compact__node--before--Top) + var(--pf-c-tree-view__node--PaddingTop--base));
21236
- --pf-c-tree-view--m-compact__node--PaddingLeft: var(--pf-c-tree-view--m-compact__node--indent--base);
21237
- --pf-c-tree-view--m-compact__node--before--Top: calc(var(--pf-c-tree-view--m-compact__node-container--PaddingTop) + var(--pf-c-tree-view--m-compact__node--nested--PaddingTop) + 0.25rem);
21238
- --pf-c-tree-view--m-compact__node--level-2--PaddingLeft: var(--pf-c-tree-view--m-compact__node--indent--base);
21239
- --pf-c-tree-view--m-compact__node-toggle--nested--MarginRight: calc(var(--pf-c-tree-view__node-toggle-button--PaddingLeft) * -.5);
21240
- --pf-c-tree-view--m-compact__node-toggle--nested--MarginLeft: calc(var(--pf-c-tree-view__node-toggle-button--PaddingLeft) * -1.5);
21241
- --pf-c-tree-view--m-compact__node-container--Display: flex;
21242
- --pf-c-tree-view--m-compact__node-container--PaddingBottom--base: var(--pf-global--spacer--lg);
21243
- --pf-c-tree-view--m-compact__node-container--PaddingTop: var(--pf-global--spacer--lg);
21244
- --pf-c-tree-view--m-compact__node-container--PaddingRight: var(--pf-global--spacer--lg);
21245
- --pf-c-tree-view--m-compact__node-container--PaddingBottom: var(--pf-c-tree-view--m-compact__node-container--PaddingBottom--base);
21246
- --pf-c-tree-view--m-compact__node-container--PaddingLeft: var(--pf-global--spacer--xs);
21247
- --pf-c-tree-view--m-compact__node-container--nested--PaddingTop: var(--pf-global--spacer--md);
21248
- --pf-c-tree-view--m-compact__node-container--nested--PaddingRight: var(--pf-global--spacer--lg);
21249
- --pf-c-tree-view--m-compact__node-container--nested--PaddingBottom: var(--pf-global--spacer--md);
21250
- --pf-c-tree-view--m-compact__node-container--nested--PaddingLeft: var(--pf-global--spacer--lg);
21251
- --pf-c-tree-view--m-compact__node-container--nested--BackgroundColor: var(--pf-global--BackgroundColor--200);
21252
- --pf-c-tree-view--m-compact__list-item--m-expanded__node-container--PaddingBottom: 0;
21253
- --pf-c-tree-view--m-no-background__node-container--BackgroundColor: transparent;
21254
- --pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset: var(--pf-global--spacer--sm);
21255
- --pf-c-tree-view--m-compact--m-no-background--base-border--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
21256
- --pf-c-tree-view--m-compact--m-no-background__node--indent--base: var(--pf-c-tree-view__node--indent--base);
21257
- --pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base: var(--pf-global--spacer--2xl);
21258
- --pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingTop: 0;
21259
- --pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingBottom: 0;
21260
- --pf-c-tree-view--m-compact--m-no-background__node--before--Top: calc(var(--pf-c-tree-view--m-compact__node-container--nested--PaddingTop) + var(--pf-c-tree-view--m-compact__node--nested--PaddingTop) + 0.25rem);
21261
- padding-top: var(--pf-c-tree-view--PaddingTop);
21262
- padding-bottom: var(--pf-c-tree-view--PaddingBottom);
21225
+ .pf-c-toolbar__group.pf-m-icon-button-group > * {
21226
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-icon-button-group--space-items);
21263
21227
  }
21264
21228
 
21265
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item {
21266
- position: relative;
21229
+ .pf-c-toolbar__group.pf-m-filter-group {
21230
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-filter-group--spacer);
21267
21231
  }
21268
21232
 
21269
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before,
21270
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before,
21271
- .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
21272
- position: absolute;
21273
- left: var(--pf-c-tree-view--m-guides--guide--Left);
21274
- content: "";
21233
+ .pf-c-toolbar__group.pf-m-filter-group > * {
21234
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-filter-group--space-items);
21275
21235
  }
21276
21236
 
21277
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before {
21278
- top: var(--pf-c-tree-view--m-guides__list-item--before--Top);
21279
- z-index: var(--pf-c-tree-view--m-guides__list-item--ZIndex);
21280
- width: var(--pf-c-tree-view--m-guides__list-item--before--Width);
21281
- height: var(--pf-c-tree-view--m-guides__list-item--before--Height);
21282
- background-color: var(--pf-c-tree-view--m-guides__list-item--before--BackgroundColor);
21237
+ .pf-c-toolbar__group.pf-m-filter-group > * + * {
21238
+ margin-left: -1px;
21283
21239
  }
21284
21240
 
21285
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
21286
- top: var(--pf-c-tree-view--m-guides__node--before--Top);
21287
- width: var(--pf-c-tree-view--m-guides__node--before--Width);
21288
- height: var(--pf-c-tree-view--m-guides__node--before--Height);
21289
- background-color: var(--pf-c-tree-view--m-guides__node--before--BackgroundColor);
21241
+ .pf-c-toolbar__group.pf-m-toggle-group {
21242
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--spacer);
21290
21243
  }
21291
21244
 
21292
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item:last-child::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item:last-child::before {
21293
- height: var(--pf-c-tree-view--m-guides__list-item--last-child--before--Height);
21245
+ .pf-c-toolbar__group.pf-m-toggle-group .pf-c-toolbar__group,
21246
+ .pf-c-toolbar__group.pf-m-toggle-group .pf-c-toolbar__item {
21247
+ display: none;
21248
+ visibility: hidden;
21294
21249
  }
21295
21250
 
21296
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21297
- --pf-c-tree-view--m-guides--guide--Left: var(--pf-c-tree-view--m-guides--border--nested--Left);
21251
+ .pf-c-toolbar__group.pf-m-toggle-group .pf-c-toolbar__toggle {
21252
+ display: inline-block;
21253
+ visibility: visible;
21298
21254
  }
21299
21255
 
21300
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item:last-child, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item:last-child {
21301
- --pf-c-tree-view--m-compact__list-item--BorderBottomWidth: 0;
21256
+ .pf-c-toolbar__group:last-child {
21257
+ --pf-c-toolbar--spacer: 0;
21302
21258
  }
21303
21259
 
21304
- .pf-c-tree-view.pf-m-compact {
21305
- --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view--m-compact__node--PaddingTop);
21306
- --pf-c-tree-view__node--PaddingBottom: var(--pf-c-tree-view--m-compact__node--PaddingBottom);
21307
- --pf-c-tree-view__node-container--Display: var(--pf-c-tree-view--m-compact__node-container--Display);
21308
- --pf-c-tree-view__node--hover--BackgroundColor: transparent;
21309
- --pf-c-tree-view__node--focus--BackgroundColor: transparent;
21310
- --pf-c-tree-view__list-item__list-item__node-toggle--Top: var(--pf-c-tree-view--m-compact__list-item__list-item__node-toggle--Top);
21260
+ .pf-c-toolbar__item {
21261
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--spacer);
21262
+ --pf-c-toolbar__item--Width--base: var(--pf-c-toolbar__item--Width);
21263
+ --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth);
21264
+ --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__item--Display);
21265
+ width: var(--pf-c-toolbar__item--Width--base);
21266
+ min-width: var(--pf-c-toolbar__item--MinWidth--base);
21267
+ margin-right: var(--pf-c-toolbar--spacer);
21311
21268
  }
21312
21269
 
21313
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item {
21314
- border-bottom: var(--pf-c-tree-view--m-compact__list-item--BorderBottomWidth) solid var(--pf-c-tree-view--m-compact__list-item--BorderBottomColor);
21270
+ @media (min-width: 576px) {
21271
+ .pf-c-toolbar__item {
21272
+ --pf-c-toolbar__item--Width--base: var(--pf-c-toolbar__item--Width-on-sm, var(--pf-c-toolbar__item--Width));
21273
+ }
21315
21274
  }
21316
-
21317
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item.pf-m-expanded {
21318
- --pf-c-tree-view--m-compact__node-container--PaddingBottom: var(--pf-c-tree-view--m-compact__list-item--m-expanded__node-container--PaddingBottom);
21275
+ @media (min-width: 768px) {
21276
+ .pf-c-toolbar__item {
21277
+ --pf-c-toolbar__item--Width--base: var(--pf-c-toolbar__item--Width-on-md, var(--pf-c-toolbar__item--Width-on-sm, var(--pf-c-toolbar__item--Width)));
21278
+ }
21319
21279
  }
21320
-
21321
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21322
- --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view--m-compact__node--nested--PaddingTop);
21323
- --pf-c-tree-view__node--PaddingBottom: var(--pf-c-tree-view--m-compact__node--nested--PaddingBottom);
21324
- --pf-c-tree-view__node-toggle--Position: static;
21325
- --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view--m-compact__node--level-2--PaddingLeft);
21326
- --pf-c-tree-view__list-item__list-item__node-toggle--TranslateX: 0;
21327
- --pf-c-tree-view--m-compact__list-item--BorderBottomWidth: 0;
21328
- --pf-c-tree-view--m-compact__node-container--PaddingBottom: var(--pf-c-tree-view--m-compact__node-container--PaddingBottom--base);
21280
+ @media (min-width: 992px) {
21281
+ .pf-c-toolbar__item {
21282
+ --pf-c-toolbar__item--Width--base: var(--pf-c-toolbar__item--Width-on-lg, var(--pf-c-toolbar__item--Width-on-md, var(--pf-c-toolbar__item--Width-on-sm, var(--pf-c-toolbar__item--Width))));
21283
+ }
21329
21284
  }
21330
-
21331
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before,
21332
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
21333
- left: var(--pf-c-tree-view--m-compact--border--Left);
21285
+ @media (min-width: 1200px) {
21286
+ .pf-c-toolbar__item {
21287
+ --pf-c-toolbar__item--Width--base: var(--pf-c-toolbar__item--Width-on-xl, var(--pf-c-toolbar__item--Width-on-lg, var(--pf-c-toolbar__item--Width-on-md, var(--pf-c-toolbar__item--Width-on-sm, var(--pf-c-toolbar__item--Width)))));
21288
+ }
21334
21289
  }
21335
-
21336
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before {
21337
- top: var(--pf-c-tree-view--m-compact__list-item--before--Top);
21290
+ @media (min-width: 1450px) {
21291
+ .pf-c-toolbar__item {
21292
+ --pf-c-toolbar__item--Width--base: var(--pf-c-toolbar__item--Width-on-2xl, var(--pf-c-toolbar__item--Width-on-xl, var(--pf-c-toolbar__item--Width-on-lg, var(--pf-c-toolbar__item--Width-on-md, var(--pf-c-toolbar__item--Width-on-sm, var(--pf-c-toolbar__item--Width))))));
21293
+ }
21338
21294
  }
21339
-
21340
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
21341
- top: var(--pf-c-tree-view--m-compact__node--before--Top);
21295
+ @media (min-width: 576px) {
21296
+ .pf-c-toolbar__item {
21297
+ --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth-on-sm, var(--pf-c-toolbar__item--MinWidth));
21298
+ }
21342
21299
  }
21343
-
21344
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item:last-child::before {
21345
- height: var(--pf-c-tree-view--m-compact__list-item--last-child--before--Height);
21346
- }
21347
-
21348
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21349
- --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view--m-compact__node--PaddingLeft);
21350
- --pf-c-tree-view--m-compact--border--Left: var(--pf-c-tree-view--m-compact--border--nested--Left);
21351
- --pf-c-tree-view--m-compact__list-item--before--Top: var(--pf-c-tree-view--m-compact__list-item--nested--before--Top);
21352
- --pf-c-tree-view--m-compact__list-item--last-child--before--Height: var(--pf-c-tree-view--m-compact__list-item--nested--last-child--before--Height);
21300
+ @media (min-width: 768px) {
21301
+ .pf-c-toolbar__item {
21302
+ --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth-on-md, var(--pf-c-toolbar__item--MinWidth-on-sm, var(--pf-c-toolbar__item--MinWidth)));
21303
+ }
21353
21304
  }
21354
-
21355
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node-container {
21356
- padding: var(--pf-c-tree-view--m-compact__node-container--nested--PaddingTop) var(--pf-c-tree-view--m-compact__node-container--nested--PaddingRight) var(--pf-c-tree-view--m-compact__node-container--nested--PaddingBottom) var(--pf-c-tree-view--m-compact__node-container--nested--PaddingLeft);
21357
- background-color: var(--pf-c-tree-view--m-compact__node-container--nested--BackgroundColor);
21305
+ @media (min-width: 992px) {
21306
+ .pf-c-toolbar__item {
21307
+ --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth-on-lg, var(--pf-c-toolbar__item--MinWidth-on-md, var(--pf-c-toolbar__item--MinWidth-on-sm, var(--pf-c-toolbar__item--MinWidth))));
21308
+ }
21358
21309
  }
21359
-
21360
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node-toggle {
21361
- margin-right: var(--pf-c-tree-view--m-compact__node-toggle--nested--MarginRight);
21362
- margin-left: var(--pf-c-tree-view--m-compact__node-toggle--nested--MarginLeft);
21310
+ @media (min-width: 1200px) {
21311
+ .pf-c-toolbar__item {
21312
+ --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth-on-xl, var(--pf-c-toolbar__item--MinWidth-on-lg, var(--pf-c-toolbar__item--MinWidth-on-md, var(--pf-c-toolbar__item--MinWidth-on-sm, var(--pf-c-toolbar__item--MinWidth)))));
21313
+ }
21363
21314
  }
21364
-
21365
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__node-container {
21366
- padding: var(--pf-c-tree-view--m-compact__node-container--PaddingTop) var(--pf-c-tree-view--m-compact__node-container--PaddingRight) var(--pf-c-tree-view--m-compact__node-container--PaddingBottom) var(--pf-c-tree-view--m-compact__node-container--PaddingLeft);
21315
+ @media (min-width: 1450px) {
21316
+ .pf-c-toolbar__item {
21317
+ --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth-on-2xl, var(--pf-c-toolbar__item--MinWidth-on-xl, var(--pf-c-toolbar__item--MinWidth-on-lg, var(--pf-c-toolbar__item--MinWidth-on-md, var(--pf-c-toolbar__item--MinWidth-on-sm, var(--pf-c-toolbar__item--MinWidth))))));
21318
+ }
21367
21319
  }
21368
-
21369
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item:not([aria-expanded]) > .pf-c-tree-view__content > .pf-c-tree-view__node,
21370
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item:not([aria-expanded]) > .pf-c-tree-view__content > .pf-c-tree-view__node > .pf-c-tree-view__node-container {
21371
- cursor: default;
21320
+ .pf-c-toolbar__item.pf-m-overflow-menu {
21321
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--m-overflow-menu--spacer);
21372
21322
  }
21373
21323
 
21374
- .pf-c-tree-view.pf-m-compact.pf-m-no-background {
21375
- --pf-c-tree-view--m-compact__node--before--Top: var(--pf-c-tree-view--m-compact--m-no-background__node--before--Top);
21324
+ .pf-c-toolbar__item.pf-m-bulk-select {
21325
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--m-bulk-select--spacer);
21376
21326
  }
21377
21327
 
21378
- .pf-c-tree-view.pf-m-compact.pf-m-no-background .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21379
- --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingTop);
21380
- --pf-c-tree-view__node--PaddingBottom: var(--pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingBottom);
21328
+ .pf-c-toolbar__item.pf-m-expand-all.pf-m-expanded {
21329
+ --pf-c-toolbar__expand-all-icon--Rotate: var(--pf-c-toolbar__item--m-expand-all--m-expanded__expand-all-icon--Rotate);
21381
21330
  }
21382
21331
 
21383
- .pf-c-tree-view.pf-m-compact.pf-m-no-background .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21384
- --pf-c-tree-view--m-compact--border--Left: var(--pf-c-tree-view--m-compact--m-no-background--border--nested--Left);
21385
- --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft);
21332
+ .pf-c-toolbar__item.pf-m-search-filter {
21333
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--m-search-filter--spacer);
21386
21334
  }
21387
21335
 
21388
- .pf-c-tree-view.pf-m-no-background {
21389
- --pf-c-tree-view--m-compact__node-container--nested--BackgroundColor: var(--pf-c-tree-view--m-no-background__node-container--BackgroundColor);
21336
+ .pf-c-toolbar__item.pf-m-chip-group {
21337
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--m-chip-group--spacer);
21390
21338
  }
21391
21339
 
21392
- .pf-c-tree-view__node-toggle-icon {
21393
- display: inline-block;
21394
- min-width: var(--pf-c-tree-view__node-toggle-icon--MinWidth);
21395
- text-align: center;
21396
- transition: var(--pf-c-tree-view__node-toggle-icon--Transition);
21397
- transform: rotate(var(--pf-c-tree-view__node-toggle-icon--Rotate));
21340
+ .pf-c-toolbar__item.pf-m-label {
21341
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--m-label--spacer);
21342
+ font-weight: var(--pf-c-toolbar__item--m-label--FontWeight);
21398
21343
  }
21399
21344
 
21400
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21401
- --pf-c-tree-view__node-toggle-icon--Rotate: var(--pf-c-tree-view__node-toggle-icon--base--Rotate);
21402
- --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--Color--base);
21345
+ .pf-c-toolbar__item.pf-m-pagination {
21346
+ margin-left: auto;
21403
21347
  }
21404
21348
 
21405
- .pf-c-tree-view__list-item.pf-m-expanded {
21406
- --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__list-item--m-expanded__node-toggle--Color);
21407
- --pf-c-tree-view__node-toggle-icon--Rotate: var(--pf-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate);
21349
+ .pf-c-toolbar__item.pf-m-pagination .pf-c-pagination {
21350
+ flex-wrap: nowrap;
21408
21351
  }
21409
21352
 
21410
- .pf-c-tree-view__node,
21411
- .pf-c-tree-view__node-container {
21412
- flex: 1 1;
21413
- align-items: flex-start;
21414
- min-width: 0;
21415
- text-align: left;
21416
- cursor: pointer;
21417
- border: 0;
21353
+ .pf-c-toolbar__item:last-child {
21354
+ --pf-c-toolbar--spacer: 0;
21418
21355
  }
21419
21356
 
21420
- .pf-c-tree-view__node {
21421
- position: relative;
21422
- display: flex;
21423
- padding: var(--pf-c-tree-view__node--PaddingTop) var(--pf-c-tree-view__node--PaddingRight) var(--pf-c-tree-view__node--PaddingBottom) var(--pf-c-tree-view__node--PaddingLeft);
21424
- color: var(--pf-c-tree-view__node--Color);
21357
+ .pf-c-toolbar__group.pf-m-overflow-container,
21358
+ .pf-c-toolbar__item.pf-m-overflow-container {
21359
+ flex: 1;
21360
+ overflow: hidden;
21425
21361
  }
21426
21362
 
21427
- .pf-c-tree-view__node.pf-m-current {
21428
- --pf-c-tree-view__node--Color: var(--pf-c-tree-view__node--m-current--Color);
21429
- font-weight: var(--pf-c-tree-view__node--m-current--FontWeight);
21363
+ .pf-c-toolbar__expand-all-icon {
21364
+ display: inline-block;
21365
+ transition: var(--pf-c-toolbar__expand-all-icon--Transition);
21366
+ transform: rotate(var(--pf-c-toolbar__expand-all-icon--Rotate));
21430
21367
  }
21431
21368
 
21432
- .pf-c-tree-view__node:focus {
21433
- background-color: var(--pf-c-tree-view__node--focus--BackgroundColor);
21369
+ .pf-c-toolbar__content,
21370
+ .pf-c-toolbar__content-section {
21371
+ flex-wrap: wrap;
21372
+ align-items: center;
21434
21373
  }
21435
21374
 
21436
- .pf-c-tree-view__node .pf-c-tree-view__node-count {
21437
- margin-left: var(--pf-c-tree-view__node-count--MarginLeft);
21375
+ .pf-c-toolbar__content {
21376
+ --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__content--Display);
21377
+ position: relative;
21378
+ padding-right: var(--pf-c-toolbar__content--PaddingRight);
21379
+ padding-left: var(--pf-c-toolbar__content--PaddingLeft);
21438
21380
  }
21439
21381
 
21440
- .pf-c-tree-view__node .pf-c-tree-view__node-count .pf-c-badge.pf-m-read {
21441
- --pf-c-badge--m-read--BackgroundColor: var(--pf-c-tree-view__node-count--c-badge--m-read--BackgroundColor);
21382
+ .pf-c-toolbar__content-section {
21383
+ --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__content-section--Display);
21384
+ width: 100%;
21442
21385
  }
21443
21386
 
21444
- .pf-c-tree-view__node:not(.pf-m-selectable):hover, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:hover {
21445
- --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--hover--Color);
21387
+ .pf-c-toolbar__expandable-content {
21388
+ position: absolute;
21389
+ top: 100%;
21390
+ right: 0;
21391
+ left: 0;
21392
+ z-index: var(--pf-c-toolbar__expandable-content--ZIndex);
21393
+ display: none;
21394
+ width: 100%;
21395
+ padding: var(--pf-c-toolbar__expandable-content--PaddingTop) var(--pf-c-toolbar__expandable-content--PaddingRight) var(--pf-c-toolbar__expandable-content--PaddingBottom) var(--pf-c-toolbar__expandable-content--PaddingLeft);
21396
+ visibility: hidden;
21397
+ background-color: var(--pf-c-toolbar__expandable-content--BackgroundColor);
21398
+ box-shadow: var(--pf-c-toolbar__expandable-content--BoxShadow);
21446
21399
  }
21447
21400
 
21448
- .pf-c-tree-view__node:not(.pf-m-selectable):focus, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:focus {
21449
- --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--focus--Color);
21401
+ @media screen and (min-width: 992px) {
21402
+ .pf-c-toolbar__expandable-content {
21403
+ position: static;
21404
+ box-shadow: none;
21405
+ }
21450
21406
  }
21451
-
21452
- .pf-c-tree-view__node:not(.pf-m-selectable):active, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:active {
21453
- --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--active--Color);
21407
+ .pf-c-toolbar__expandable-content.pf-m-expanded {
21408
+ display: grid;
21409
+ grid-row-gap: var(--pf-c-toolbar__expandable-content--m-expanded--GridRowGap);
21410
+ visibility: visible;
21454
21411
  }
21455
21412
 
21456
- .pf-c-tree-view__node-container {
21457
- display: var(--pf-c-tree-view__node-container--Display);
21458
- flex-grow: 1;
21413
+ .pf-c-toolbar__expandable-content .pf-c-toolbar__group,
21414
+ .pf-c-toolbar__expandable-content .pf-c-toolbar__item {
21415
+ --pf-c-toolbar--spacer: 0;
21459
21416
  }
21460
21417
 
21461
- .pf-c-tree-view__node-content {
21462
- display: flex;
21463
- flex-direction: column;
21464
- overflow: var(--pf-c-tree-view__node-content--Overflow);
21418
+ .pf-c-toolbar__expandable-content .pf-c-toolbar__group {
21419
+ display: grid;
21420
+ grid-row-gap: var(--pf-c-toolbar__expandable-content--m-expanded--GridRowGap);
21465
21421
  }
21466
21422
 
21467
- .pf-c-tree-view__node-content > * + * {
21468
- margin-top: var(--pf-c-tree-view__node-content--RowGap);
21423
+ .pf-c-toolbar__expandable-content .pf-m-label {
21424
+ margin-bottom: var(--pf-c-toolbar__expandable-content__item--m-label--MarginBottom);
21425
+ font-size: var(--pf-c-toolbar__expandable-content__item--m-label--FontSize);
21469
21426
  }
21470
21427
 
21471
- .pf-c-tree-view__node-check {
21472
- margin-right: var(--pf-c-tree-view__node-check--MarginRight);
21428
+ .pf-c-toolbar__content.pf-m-chip-container,
21429
+ .pf-c-toolbar__group.pf-m-chip-container {
21430
+ display: flex;
21431
+ flex-wrap: wrap;
21432
+ align-items: baseline;
21433
+ margin-top: var(--pf-c-toolbar__group--m-chip-container--MarginTop);
21434
+ grid-row-gap: 0;
21473
21435
  }
21474
21436
 
21475
- .pf-c-tree-view__node-toggle {
21476
- position: var(--pf-c-tree-view__node-toggle--Position);
21477
- top: var(--pf-c-tree-view__list-item__list-item__node-toggle--Top);
21478
- left: var(--pf-c-tree-view__list-item__list-item__node-toggle--Left);
21479
- display: inline-flex;
21480
- align-items: center;
21481
- justify-content: center;
21482
- padding: var(--pf-c-tree-view__node-toggle-button--PaddingTop) var(--pf-c-tree-view__node-toggle-button--PaddingRight) var(--pf-c-tree-view__node-toggle-button--PaddingBottom) var(--pf-c-tree-view__node-toggle-button--PaddingLeft);
21483
- margin-top: var(--pf-c-tree-view__node-toggle-button--MarginTop);
21484
- margin-bottom: var(--pf-c-tree-view__node-toggle-button--MarginBottom);
21485
- color: var(--pf-c-tree-view__node-toggle--Color);
21486
- border: 0;
21487
- transform: translateX(var(--pf-c-tree-view__list-item__list-item__node-toggle--TranslateX));
21437
+ .pf-c-toolbar__content.pf-m-chip-container .pf-c-toolbar__item,
21438
+ .pf-c-toolbar__group.pf-m-chip-container .pf-c-toolbar__item {
21439
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--spacer);
21440
+ margin-top: var(--pf-c-toolbar__group--m-chip-container__item--MarginTop);
21488
21441
  }
21489
21442
 
21490
- .pf-c-tree-view__node-title.pf-m-truncate,
21491
- .pf-c-tree-view__node-text.pf-m-truncate {
21492
- --pf-c-tree-view__node-content--Overflow: hidden;
21493
- overflow: hidden;
21494
- text-overflow: ellipsis;
21495
- white-space: nowrap;
21443
+ .pf-c-toolbar__content.pf-m-chip-container .pf-c-toolbar__group,
21444
+ .pf-c-toolbar__group.pf-m-chip-container .pf-c-toolbar__group {
21445
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--spacer);
21446
+ display: flex;
21447
+ flex-wrap: wrap;
21448
+ grid-row-gap: 0;
21496
21449
  }
21497
21450
 
21498
- .pf-c-tree-view.pf-m-truncate .pf-c-tree-view__node-title,
21499
- .pf-c-tree-view.pf-m-truncate .pf-c-tree-view__node-text {
21500
- --pf-c-tree-view__node-content--Overflow: hidden;
21501
- overflow: hidden;
21502
- text-overflow: ellipsis;
21503
- white-space: nowrap;
21451
+ .pf-c-toolbar__content.pf-m-chip-container .pf-c-toolbar__group:last-child,
21452
+ .pf-c-toolbar__content.pf-m-chip-container .pf-c-toolbar__item:last-child,
21453
+ .pf-c-toolbar__group.pf-m-chip-container .pf-c-toolbar__group:last-child,
21454
+ .pf-c-toolbar__group.pf-m-chip-container .pf-c-toolbar__item:last-child {
21455
+ --pf-c-toolbar--spacer: 0;
21504
21456
  }
21505
21457
 
21506
- label.pf-c-tree-view__node-text {
21507
- cursor: pointer;
21458
+ .pf-c-toolbar .pf-c-chip-group:last-child {
21459
+ --pf-c-chip-group--MarginRight: 0;
21508
21460
  }
21509
21461
 
21510
- .pf-c-tree-view__node-title {
21511
- font-weight: var(--pf-c-tree-view__node-title--FontWeight);
21462
+ .pf-c-toolbar .pf-c-chip-group li:last-child {
21463
+ --pf-c-chip-group__li--m-toolbar--MarginRight: 0;
21512
21464
  }
21513
21465
 
21514
- .pf-c-tree-view__search {
21515
- padding: var(--pf-c-tree-view__search--PaddingTop) var(--pf-c-tree-view__search--PaddingRight) var(--pf-c-tree-view__search--PaddingBottom) var(--pf-c-tree-view__search--PaddingLeft);
21466
+ .pf-c-toolbar__toggle.pf-m-expanded .pf-c-button.pf-m-plain {
21467
+ color: var(--pf-c-toolbar__toggle--m-expanded__c-button--m-plain--Color);
21516
21468
  }
21517
21469
 
21518
- .pf-c-tree-view__node-icon {
21519
- padding-right: var(--pf-c-tree-view__node-icon--PaddingRight);
21520
- color: var(--pf-c-tree-view__node-icon--Color);
21470
+ .pf-m-toggle-group.pf-m-show {
21471
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
21521
21472
  }
21522
21473
 
21523
- .pf-c-tree-view__content {
21474
+ .pf-m-toggle-group.pf-m-show .pf-c-toolbar__group,
21475
+ .pf-m-toggle-group.pf-m-show .pf-c-toolbar__item {
21524
21476
  display: flex;
21525
- align-items: center;
21477
+ flex: 0 1 auto;
21478
+ visibility: visible;
21526
21479
  }
21527
21480
 
21528
- .pf-c-tree-view__content:hover,
21529
- .pf-c-tree-view__content:focus-within {
21530
- background-color: var(--pf-c-tree-view__node--hover--BackgroundColor);
21481
+ .pf-m-toggle-group.pf-m-show .pf-c-toolbar__toggle {
21482
+ display: none;
21483
+ visibility: hidden;
21531
21484
  }
21532
21485
 
21533
- .pf-c-tree-view__action {
21534
- margin-left: var(--pf-c-tree-view__action--MarginLeft);
21535
- color: var(--pf-c-tree-view__action--Color);
21536
- border: 0;
21537
- }
21486
+ @media (min-width: 576px) {
21487
+ .pf-m-toggle-group.pf-m-show-on-sm {
21488
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
21489
+ }
21538
21490
 
21539
- .pf-c-tree-view__action:hover {
21540
- --pf-c-tree-view__action--Color: var(--pf-c-tree-view__action--hover--Color);
21541
- }
21491
+ .pf-m-toggle-group.pf-m-show-on-sm .pf-c-toolbar__group,
21492
+ .pf-m-toggle-group.pf-m-show-on-sm .pf-c-toolbar__item {
21493
+ display: flex;
21494
+ flex: 0 1 auto;
21495
+ visibility: visible;
21496
+ }
21542
21497
 
21543
- .pf-c-tree-view__action:focus {
21544
- --pf-c-tree-view__action--Color: var(--pf-c-tree-view__action--focus--Color);
21545
- background-color: var(--pf-c-tree-view__action--focus--BackgroundColor);
21498
+ .pf-m-toggle-group.pf-m-show-on-sm .pf-c-toolbar__toggle {
21499
+ display: none;
21500
+ visibility: hidden;
21501
+ }
21546
21502
  }
21503
+ @media (min-width: 768px) {
21504
+ .pf-m-toggle-group.pf-m-show-on-md {
21505
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
21506
+ }
21547
21507
 
21548
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21549
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
21550
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 1 + var(--pf-c-tree-view__node--indent--base));
21551
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
21552
- }
21508
+ .pf-m-toggle-group.pf-m-show-on-md .pf-c-toolbar__group,
21509
+ .pf-m-toggle-group.pf-m-show-on-md .pf-c-toolbar__item {
21510
+ display: flex;
21511
+ flex: 0 1 auto;
21512
+ visibility: visible;
21513
+ }
21553
21514
 
21554
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21555
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
21556
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 2 + var(--pf-c-tree-view__node--indent--base));
21557
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
21558
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 1 + var(--pf-c-tree-view--m-compact__node--indent--base));
21559
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
21560
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 1 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
21561
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
21515
+ .pf-m-toggle-group.pf-m-show-on-md .pf-c-toolbar__toggle {
21516
+ display: none;
21517
+ visibility: hidden;
21518
+ }
21562
21519
  }
21520
+ @media (min-width: 992px) {
21521
+ .pf-m-toggle-group.pf-m-show-on-lg {
21522
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
21523
+ }
21563
21524
 
21564
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21565
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
21566
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 3 + var(--pf-c-tree-view__node--indent--base));
21567
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
21568
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 2 + var(--pf-c-tree-view--m-compact__node--indent--base));
21569
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
21570
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 2 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
21571
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
21572
- }
21525
+ .pf-m-toggle-group.pf-m-show-on-lg .pf-c-toolbar__group,
21526
+ .pf-m-toggle-group.pf-m-show-on-lg .pf-c-toolbar__item {
21527
+ display: flex;
21528
+ flex: 0 1 auto;
21529
+ visibility: visible;
21530
+ }
21573
21531
 
21574
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21575
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
21576
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 4 + var(--pf-c-tree-view__node--indent--base));
21577
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
21578
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 3 + var(--pf-c-tree-view--m-compact__node--indent--base));
21579
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
21580
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 3 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
21581
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
21532
+ .pf-m-toggle-group.pf-m-show-on-lg .pf-c-toolbar__toggle {
21533
+ display: none;
21534
+ visibility: hidden;
21535
+ }
21582
21536
  }
21537
+ @media (min-width: 1200px) {
21538
+ .pf-m-toggle-group.pf-m-show-on-xl {
21539
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
21540
+ }
21583
21541
 
21584
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21585
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
21586
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 5 + var(--pf-c-tree-view__node--indent--base));
21587
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
21588
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 4 + var(--pf-c-tree-view--m-compact__node--indent--base));
21589
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
21590
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 4 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
21591
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
21592
- }
21542
+ .pf-m-toggle-group.pf-m-show-on-xl .pf-c-toolbar__group,
21543
+ .pf-m-toggle-group.pf-m-show-on-xl .pf-c-toolbar__item {
21544
+ display: flex;
21545
+ flex: 0 1 auto;
21546
+ visibility: visible;
21547
+ }
21593
21548
 
21594
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21595
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
21596
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 6 + var(--pf-c-tree-view__node--indent--base));
21597
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
21598
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 5 + var(--pf-c-tree-view--m-compact__node--indent--base));
21599
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
21600
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 5 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
21601
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
21549
+ .pf-m-toggle-group.pf-m-show-on-xl .pf-c-toolbar__toggle {
21550
+ display: none;
21551
+ visibility: hidden;
21552
+ }
21602
21553
  }
21554
+ @media (min-width: 1450px) {
21555
+ .pf-m-toggle-group.pf-m-show-on-2xl {
21556
+ --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
21557
+ }
21603
21558
 
21604
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21605
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
21606
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 7 + var(--pf-c-tree-view__node--indent--base));
21607
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
21608
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 6 + var(--pf-c-tree-view--m-compact__node--indent--base));
21609
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
21610
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 6 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
21611
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
21612
- }
21559
+ .pf-m-toggle-group.pf-m-show-on-2xl .pf-c-toolbar__group,
21560
+ .pf-m-toggle-group.pf-m-show-on-2xl .pf-c-toolbar__item {
21561
+ display: flex;
21562
+ flex: 0 1 auto;
21563
+ visibility: visible;
21564
+ }
21613
21565
 
21614
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21615
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
21616
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 8 + var(--pf-c-tree-view__node--indent--base));
21617
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
21618
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 7 + var(--pf-c-tree-view--m-compact__node--indent--base));
21619
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
21620
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 7 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
21621
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
21566
+ .pf-m-toggle-group.pf-m-show-on-2xl .pf-c-toolbar__toggle {
21567
+ display: none;
21568
+ visibility: hidden;
21569
+ }
21570
+ }
21571
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right,
21572
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right {
21573
+ margin-left: auto;
21622
21574
  }
21623
21575
 
21624
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21625
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
21626
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 9 + var(--pf-c-tree-view__node--indent--base));
21627
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
21628
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 8 + var(--pf-c-tree-view--m-compact__node--indent--base));
21629
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
21630
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 8 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
21631
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
21576
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right ~ .pf-m-pagination,
21577
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right ~ .pf-m-pagination {
21578
+ margin-left: 0;
21632
21579
  }
21633
21580
 
21634
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
21635
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
21636
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 10 + var(--pf-c-tree-view__node--indent--base));
21637
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
21638
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 9 + var(--pf-c-tree-view--m-compact__node--indent--base));
21639
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
21640
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 9 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
21641
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
21581
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left,
21582
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left {
21583
+ margin-left: 0;
21642
21584
  }
21643
21585
 
21644
- :where(.pf-theme-dark) .pf-c-tree-view {
21645
- --pf-c-tree-view__node--hover--BackgroundColor: var(--pf-global--BackgroundColor--300);
21646
- --pf-c-tree-view__node--focus--BackgroundColor: var(--pf-global--BackgroundColor--300);
21586
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left ~ .pf-m-pagination,
21587
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left ~ .pf-m-pagination {
21588
+ margin-left: auto;
21647
21589
  }
21648
21590
 
21649
- .pf-c-toolbar__content-section, .pf-c-toolbar__content, .pf-c-toolbar__item, .pf-c-toolbar__group {
21650
- --pf-hidden-visible--visible--Visibility: visible;
21651
- --pf-hidden-visible--hidden--Display: none;
21652
- --pf-hidden-visible--hidden--Visibility: hidden;
21653
- --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
21654
- --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
21655
- display: var(--pf-hidden-visible--Display);
21656
- visibility: var(--pf-hidden-visible--Visibility);
21591
+ .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap,
21592
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap {
21593
+ flex-wrap: nowrap;
21657
21594
  }
21658
21595
 
21659
- .pf-m-hidden.pf-c-toolbar__content-section, .pf-m-hidden.pf-c-toolbar__content, .pf-m-hidden.pf-c-toolbar__item, .pf-m-hidden.pf-c-toolbar__group {
21660
- --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
21661
- --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
21596
+ .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap,
21597
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap {
21598
+ flex-wrap: wrap;
21662
21599
  }
21663
21600
 
21664
- @media screen and (min-width: 576px) {
21665
- .pf-m-hidden-on-sm.pf-c-toolbar__content-section, .pf-m-hidden-on-sm.pf-c-toolbar__content, .pf-m-hidden-on-sm.pf-c-toolbar__item, .pf-m-hidden-on-sm.pf-c-toolbar__group {
21666
- --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
21667
- --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
21601
+ @media (min-width: 576px) {
21602
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-sm,
21603
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-sm {
21604
+ margin-left: auto;
21668
21605
  }
21669
21606
 
21670
- .pf-m-visible-on-sm.pf-c-toolbar__content-section, .pf-m-visible-on-sm.pf-c-toolbar__content, .pf-m-visible-on-sm.pf-c-toolbar__item, .pf-m-visible-on-sm.pf-c-toolbar__group {
21671
- --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
21672
- --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
21607
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-sm ~ .pf-m-pagination,
21608
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-sm ~ .pf-m-pagination {
21609
+ margin-left: 0;
21673
21610
  }
21674
- }
21675
- @media screen and (min-width: 768px) {
21676
- .pf-m-hidden-on-md.pf-c-toolbar__content-section, .pf-m-hidden-on-md.pf-c-toolbar__content, .pf-m-hidden-on-md.pf-c-toolbar__item, .pf-m-hidden-on-md.pf-c-toolbar__group {
21677
- --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
21678
- --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
21611
+
21612
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-sm,
21613
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-sm {
21614
+ margin-left: 0;
21679
21615
  }
21680
21616
 
21681
- .pf-m-visible-on-md.pf-c-toolbar__content-section, .pf-m-visible-on-md.pf-c-toolbar__content, .pf-m-visible-on-md.pf-c-toolbar__item, .pf-m-visible-on-md.pf-c-toolbar__group {
21682
- --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
21683
- --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
21617
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-sm ~ .pf-m-pagination,
21618
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-sm ~ .pf-m-pagination {
21619
+ margin-left: auto;
21684
21620
  }
21685
- }
21686
- @media screen and (min-width: 992px) {
21687
- .pf-m-hidden-on-lg.pf-c-toolbar__content-section, .pf-m-hidden-on-lg.pf-c-toolbar__content, .pf-m-hidden-on-lg.pf-c-toolbar__item, .pf-m-hidden-on-lg.pf-c-toolbar__group {
21688
- --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
21689
- --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
21621
+
21622
+ .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-sm,
21623
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-sm {
21624
+ flex-wrap: nowrap;
21690
21625
  }
21691
21626
 
21692
- .pf-m-visible-on-lg.pf-c-toolbar__content-section, .pf-m-visible-on-lg.pf-c-toolbar__content, .pf-m-visible-on-lg.pf-c-toolbar__item, .pf-m-visible-on-lg.pf-c-toolbar__group {
21693
- --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
21694
- --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
21627
+ .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-sm,
21628
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-sm {
21629
+ flex-wrap: wrap;
21695
21630
  }
21696
21631
  }
21697
- @media screen and (min-width: 1200px) {
21698
- .pf-m-hidden-on-xl.pf-c-toolbar__content-section, .pf-m-hidden-on-xl.pf-c-toolbar__content, .pf-m-hidden-on-xl.pf-c-toolbar__item, .pf-m-hidden-on-xl.pf-c-toolbar__group {
21699
- --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
21700
- --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
21632
+ @media (min-width: 768px) {
21633
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-md,
21634
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-md {
21635
+ margin-left: auto;
21701
21636
  }
21702
21637
 
21703
- .pf-m-visible-on-xl.pf-c-toolbar__content-section, .pf-m-visible-on-xl.pf-c-toolbar__content, .pf-m-visible-on-xl.pf-c-toolbar__item, .pf-m-visible-on-xl.pf-c-toolbar__group {
21704
- --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
21705
- --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
21706
- }
21707
- }
21708
- @media screen and (min-width: 1450px) {
21709
- .pf-m-hidden-on-2xl.pf-c-toolbar__content-section, .pf-m-hidden-on-2xl.pf-c-toolbar__content, .pf-m-hidden-on-2xl.pf-c-toolbar__item, .pf-m-hidden-on-2xl.pf-c-toolbar__group {
21710
- --pf-hidden-visible--Display: var(--pf-hidden-visible--hidden--Display);
21711
- --pf-hidden-visible--Visibility: var(--pf-hidden-visible--hidden--Visibility);
21638
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-md ~ .pf-m-pagination,
21639
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-md ~ .pf-m-pagination {
21640
+ margin-left: 0;
21712
21641
  }
21713
21642
 
21714
- .pf-m-visible-on-2xl.pf-c-toolbar__content-section, .pf-m-visible-on-2xl.pf-c-toolbar__content, .pf-m-visible-on-2xl.pf-c-toolbar__item, .pf-m-visible-on-2xl.pf-c-toolbar__group {
21715
- --pf-hidden-visible--Display: var(--pf-hidden-visible--visible--Display);
21716
- --pf-hidden-visible--Visibility: var(--pf-hidden-visible--visible--Visibility);
21643
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-md,
21644
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-md {
21645
+ margin-left: 0;
21717
21646
  }
21718
- }
21719
- .pf-c-toolbar {
21720
- --pf-c-toolbar--BackgroundColor: var(--pf-global--BackgroundColor--100);
21721
- --pf-c-toolbar--RowGap: var(--pf-global--spacer--lg);
21722
- --pf-c-toolbar--PaddingTop: var(--pf-global--spacer--md);
21723
- --pf-c-toolbar--PaddingBottom: var(--pf-global--spacer--md);
21724
- --pf-c-toolbar__item--Display: block;
21725
- --pf-c-toolbar__item--MinWidth--base: auto;
21726
- --pf-c-toolbar__group--Display: flex;
21727
- --pf-c-toolbar--m-sticky--ZIndex: var(--pf-global--ZIndex--xs);
21728
- --pf-c-toolbar--m-sticky--BoxShadow: var(--pf-global--BoxShadow--sm-bottom);
21729
- --pf-c-toolbar__content--Display: flex;
21730
- --pf-c-toolbar__content--PaddingRight: var(--pf-global--spacer--md);
21731
- --pf-c-toolbar__content--PaddingLeft: var(--pf-global--spacer--md);
21732
- --pf-c-toolbar__content-section--Display: flex;
21733
- --pf-c-toolbar--m-page-insets--inset: var(--pf-global--spacer--md);
21734
- --pf-c-toolbar--m-page-insets--xl--inset: var(--pf-global--spacer--lg);
21735
- --pf-c-toolbar__expandable-content--Display: grid;
21736
- --pf-c-toolbar__expandable-content--PaddingTop: var(--pf-c-toolbar--RowGap);
21737
- --pf-c-toolbar__expandable-content--PaddingRight: var(--pf-c-toolbar__content--PaddingRight);
21738
- --pf-c-toolbar__expandable-content--PaddingBottom: var(--pf-global--spacer--md);
21739
- --pf-c-toolbar__expandable-content--PaddingLeft: var(--pf-c-toolbar__content--PaddingLeft);
21740
- --pf-c-toolbar__expandable-content--lg--PaddingRight: 0;
21741
- --pf-c-toolbar__expandable-content--lg--PaddingBottom: 0;
21742
- --pf-c-toolbar__expandable-content--lg--PaddingLeft: 0;
21743
- --pf-c-toolbar__expandable-content--ZIndex: var(--pf-global--ZIndex--sm);
21744
- --pf-c-toolbar__expandable-content--BoxShadow: var(--pf-global--BoxShadow--md-bottom);
21745
- --pf-c-toolbar__expandable-content--BackgroundColor: var(--pf-c-toolbar--BackgroundColor);
21746
- --pf-c-toolbar__expandable-content--m-expanded--GridRowGap: var(--pf-global--gutter--md);
21747
- --pf-c-toolbar__group--m-chip-container--MarginTop: calc(var(--pf-global--spacer--md) * -1);
21748
- --pf-c-toolbar__group--m-chip-container__item--MarginTop: var(--pf-global--spacer--md);
21749
- --pf-c-toolbar--spacer--base: var(--pf-global--spacer--md);
21750
- --pf-c-toolbar__item--spacer: var(--pf-c-toolbar--spacer--base);
21751
- --pf-c-toolbar__group--spacer: var(--pf-c-toolbar--spacer--base);
21752
- --pf-c-toolbar__item--Width: auto;
21753
- --pf-c-toolbar__group--m-toggle-group--spacer: var(--pf-global--spacer--sm);
21754
- --pf-c-toolbar__group--m-toggle-group--m-show--spacer: var(--pf-c-toolbar__group--spacer);
21755
- --pf-c-toolbar__group--m-icon-button-group--spacer: var(--pf-c-toolbar__group--spacer);
21756
- --pf-c-toolbar__group--m-icon-button-group--space-items: 0;
21757
- --pf-c-toolbar__group--m-button-group--spacer: var(--pf-c-toolbar__group--spacer);
21758
- --pf-c-toolbar__group--m-button-group--space-items: var(--pf-global--spacer--sm);
21759
- --pf-c-toolbar__group--m-filter-group--spacer: var(--pf-c-toolbar__group--spacer);
21760
- --pf-c-toolbar__group--m-filter-group--space-items: 0;
21761
- --pf-c-toolbar__item--m-overflow-menu--spacer: var(--pf-c-toolbar__item--spacer);
21762
- --pf-c-toolbar__item--m-bulk-select--spacer: var(--pf-global--spacer--lg);
21763
- --pf-c-toolbar__expand-all-icon--Rotate: 0;
21764
- --pf-c-toolbar__expand-all-icon--Transition: var(--pf-global--Transition);
21765
- --pf-c-toolbar__item--m-expand-all--m-expanded__expand-all-icon--Rotate: 90deg;
21766
- --pf-c-toolbar__item--m-search-filter--spacer: var(--pf-global--spacer--sm);
21767
- --pf-c-toolbar__item--m-chip-group--spacer: var(--pf-global--spacer--sm);
21768
- --pf-c-toolbar__item--m-label--spacer: var(--pf-c-toolbar__item--spacer);
21769
- --pf-c-toolbar__item--m-label--FontWeight: var(--pf-global--FontWeight--bold);
21770
- --pf-c-toolbar__expandable-content__item--m-label--MarginBottom: calc(-1 * var(--pf-c-toolbar__expandable-content--m-expanded--GridRowGap) + var(--pf-global--spacer--sm));
21771
- --pf-c-toolbar__expandable-content__item--m-label--FontSize: var(--pf-global--FontSize--sm);
21772
- --pf-c-toolbar__toggle--m-expanded__c-button--m-plain--Color: var(--pf-global--Color--100);
21773
- --pf-c-toolbar--c-divider--m-vertical--spacer: var(--pf-c-toolbar--spacer--base);
21774
- --pf-c-toolbar--m-full-height--PaddingTop: 0;
21775
- --pf-c-toolbar--m-full-height--PaddingBottom: 0;
21776
- --pf-c-toolbar--m-full-height__item--Display: flex;
21777
- --pf-c-toolbar--m-full-height__item--AlignItems: center;
21778
- position: relative;
21779
- row-gap: var(--pf-c-toolbar--RowGap);
21780
- display: grid;
21781
- padding-top: var(--pf-c-toolbar--PaddingTop);
21782
- padding-bottom: var(--pf-c-toolbar--PaddingBottom);
21783
- background-color: var(--pf-c-toolbar--BackgroundColor);
21784
- }
21785
21647
 
21786
- @media screen and (min-width: 992px) {
21787
- .pf-c-toolbar {
21788
- --pf-c-toolbar__expandable-content--PaddingRight: var(--pf-c-toolbar__expandable-content--lg--PaddingRight);
21789
- --pf-c-toolbar__expandable-content--PaddingBottom: var(--pf-c-toolbar__expandable-content--lg--PaddingBottom);
21790
- --pf-c-toolbar__expandable-content--PaddingLeft: var(--pf-c-toolbar__expandable-content--lg--PaddingLeft);
21648
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-md ~ .pf-m-pagination,
21649
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-md ~ .pf-m-pagination {
21650
+ margin-left: auto;
21791
21651
  }
21792
- }
21793
- @media screen and (min-width: 1200px) {
21794
- .pf-c-toolbar {
21795
- --pf-c-toolbar--m-page-insets--inset: var(--pf-c-toolbar--m-page-insets--xl--inset);
21652
+
21653
+ .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-md,
21654
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-md {
21655
+ flex-wrap: nowrap;
21796
21656
  }
21797
- }
21798
- .pf-c-toolbar.pf-m-page-insets {
21799
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--m-page-insets--inset);
21800
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--m-page-insets--inset);
21801
- }
21802
21657
 
21803
- .pf-c-toolbar.pf-m-sticky {
21804
- position: sticky;
21805
- top: 0;
21806
- z-index: var(--pf-c-toolbar--m-sticky--ZIndex);
21807
- box-shadow: var(--pf-c-toolbar--m-sticky--BoxShadow);
21658
+ .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-md,
21659
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-md {
21660
+ flex-wrap: wrap;
21661
+ }
21808
21662
  }
21663
+ @media (min-width: 992px) {
21664
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-lg,
21665
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-lg {
21666
+ margin-left: auto;
21667
+ }
21809
21668
 
21810
- .pf-c-toolbar.pf-m-full-height {
21811
- --pf-c-toolbar--PaddingTop: var(--pf-c-toolbar--m-full-height--PaddingTop);
21812
- --pf-c-toolbar--PaddingBottom: var(--pf-c-toolbar--m-full-height--PaddingTop);
21813
- --pf-c-toolbar__item--Display: var(--pf-c-toolbar--m-full-height__item--Display);
21814
- height: 100%;
21815
- }
21669
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-lg ~ .pf-m-pagination,
21670
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-lg ~ .pf-m-pagination {
21671
+ margin-left: 0;
21672
+ }
21816
21673
 
21817
- .pf-c-toolbar.pf-m-full-height,
21818
- .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__content,
21819
- .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__content-section,
21820
- .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__expandable-content,
21821
- .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__group {
21822
- min-width: 0;
21823
- }
21674
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-lg,
21675
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-lg {
21676
+ margin-left: 0;
21677
+ }
21824
21678
 
21825
- .pf-c-toolbar.pf-m-full-height,
21826
- .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__content,
21827
- .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__content-section,
21828
- .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__group,
21829
- .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__item {
21830
- align-self: stretch;
21831
- }
21679
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-lg ~ .pf-m-pagination,
21680
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-lg ~ .pf-m-pagination {
21681
+ margin-left: auto;
21682
+ }
21832
21683
 
21833
- .pf-c-toolbar.pf-m-full-height .pf-c-toolbar__item {
21834
- align-items: var(--pf-c-toolbar--m-full-height__item--AlignItems);
21835
- }
21684
+ .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-lg,
21685
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-lg {
21686
+ flex-wrap: nowrap;
21687
+ }
21836
21688
 
21837
- .pf-c-toolbar.pf-m-static,
21838
- .pf-c-toolbar.pf-m-static .pf-c-toolbar__content {
21839
- position: static;
21689
+ .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-lg,
21690
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-lg {
21691
+ flex-wrap: wrap;
21692
+ }
21840
21693
  }
21694
+ @media (min-width: 1200px) {
21695
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-xl,
21696
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-xl {
21697
+ margin-left: auto;
21698
+ }
21841
21699
 
21842
- .pf-c-toolbar.pf-m-static .pf-c-toolbar__expandable-content {
21843
- position: absolute;
21844
- }
21700
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-xl ~ .pf-m-pagination,
21701
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-xl ~ .pf-m-pagination {
21702
+ margin-left: 0;
21703
+ }
21845
21704
 
21846
- .pf-c-toolbar__content-section > .pf-c-divider,
21847
- .pf-c-toolbar__group > .pf-c-divider {
21848
- --pf-c-toolbar--spacer: var(--pf-c-toolbar--c-divider--m-vertical--spacer);
21849
- }
21705
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-xl,
21706
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-xl {
21707
+ margin-left: 0;
21708
+ }
21850
21709
 
21851
- .pf-c-toolbar__content-section > .pf-c-divider.pf-m-vertical,
21852
- .pf-c-toolbar__group > .pf-c-divider.pf-m-vertical {
21853
- margin-right: var(--pf-c-toolbar--spacer);
21854
- }
21710
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-xl ~ .pf-m-pagination,
21711
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-xl ~ .pf-m-pagination {
21712
+ margin-left: auto;
21713
+ }
21855
21714
 
21856
- .pf-c-toolbar__content-section > .pf-c-divider.pf-m-vertical:last-child,
21857
- .pf-c-toolbar__group > .pf-c-divider.pf-m-vertical:last-child {
21858
- --pf-c-toolbar--spacer: 0;
21859
- }
21715
+ .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-xl,
21716
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-xl {
21717
+ flex-wrap: nowrap;
21718
+ }
21860
21719
 
21861
- .pf-c-toolbar__group {
21862
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--spacer);
21863
- --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__group--Display);
21864
- align-items: center;
21865
- margin-right: var(--pf-c-toolbar--spacer);
21720
+ .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-xl,
21721
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-xl {
21722
+ flex-wrap: wrap;
21723
+ }
21866
21724
  }
21725
+ @media (min-width: 1450px) {
21726
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-2xl,
21727
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-2xl {
21728
+ margin-left: auto;
21729
+ }
21867
21730
 
21868
- .pf-c-toolbar__group.pf-m-button-group {
21869
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-button-group--spacer);
21870
- }
21731
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-2xl ~ .pf-m-pagination,
21732
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-2xl ~ .pf-m-pagination {
21733
+ margin-left: 0;
21734
+ }
21871
21735
 
21872
- .pf-c-toolbar__group.pf-m-button-group > * {
21873
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-button-group--space-items);
21874
- }
21736
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-2xl,
21737
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-2xl {
21738
+ margin-left: 0;
21739
+ }
21875
21740
 
21876
- .pf-c-toolbar__group.pf-m-icon-button-group {
21877
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-icon-button-group--spacer);
21741
+ .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-2xl ~ .pf-m-pagination,
21742
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-2xl ~ .pf-m-pagination {
21743
+ margin-left: auto;
21744
+ }
21745
+
21746
+ .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-2xl,
21747
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-2xl {
21748
+ flex-wrap: nowrap;
21749
+ }
21750
+
21751
+ .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-2xl,
21752
+ .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-2xl {
21753
+ flex-wrap: wrap;
21754
+ }
21755
+ }
21756
+ .pf-c-toolbar .pf-m-space-items-none > * {
21757
+ --pf-c-toolbar--spacer: 0;
21878
21758
  }
21879
21759
 
21880
- .pf-c-toolbar__group.pf-m-icon-button-group > * {
21881
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-icon-button-group--space-items);
21760
+ .pf-c-toolbar .pf-m-space-items-none > :last-child {
21761
+ --pf-c-toolbar--spacer: 0;
21882
21762
  }
21883
21763
 
21884
- .pf-c-toolbar__group.pf-m-filter-group {
21885
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-filter-group--spacer);
21764
+ .pf-c-toolbar .pf-m-space-items-sm > * {
21765
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
21886
21766
  }
21887
21767
 
21888
- .pf-c-toolbar__group.pf-m-filter-group > * {
21889
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-filter-group--space-items);
21768
+ .pf-c-toolbar .pf-m-space-items-sm > :last-child {
21769
+ --pf-c-toolbar--spacer: 0;
21890
21770
  }
21891
21771
 
21892
- .pf-c-toolbar__group.pf-m-filter-group > * + * {
21893
- margin-left: -1px;
21772
+ .pf-c-toolbar .pf-m-space-items-md > * {
21773
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
21894
21774
  }
21895
21775
 
21896
- .pf-c-toolbar__group.pf-m-toggle-group {
21897
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--spacer);
21776
+ .pf-c-toolbar .pf-m-space-items-md > :last-child {
21777
+ --pf-c-toolbar--spacer: 0;
21898
21778
  }
21899
21779
 
21900
- .pf-c-toolbar__group.pf-m-toggle-group .pf-c-toolbar__group,
21901
- .pf-c-toolbar__group.pf-m-toggle-group .pf-c-toolbar__item {
21902
- display: none;
21903
- visibility: hidden;
21780
+ .pf-c-toolbar .pf-m-space-items-lg > * {
21781
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
21904
21782
  }
21905
21783
 
21906
- .pf-c-toolbar__group.pf-m-toggle-group .pf-c-toolbar__toggle {
21907
- display: inline-block;
21908
- visibility: visible;
21909
- }
21910
-
21911
- .pf-c-toolbar__group:last-child {
21784
+ .pf-c-toolbar .pf-m-space-items-lg > :last-child {
21912
21785
  --pf-c-toolbar--spacer: 0;
21913
21786
  }
21914
21787
 
21915
- .pf-c-toolbar__item {
21916
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--spacer);
21917
- --pf-c-toolbar__item--Width--base: var(--pf-c-toolbar__item--Width);
21918
- --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth);
21919
- --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__item--Display);
21920
- width: var(--pf-c-toolbar__item--Width--base);
21921
- min-width: var(--pf-c-toolbar__item--MinWidth--base);
21922
- margin-right: var(--pf-c-toolbar--spacer);
21923
- }
21924
-
21925
21788
  @media (min-width: 576px) {
21926
- .pf-c-toolbar__item {
21927
- --pf-c-toolbar__item--Width--base: var(--pf-c-toolbar__item--Width-on-sm, var(--pf-c-toolbar__item--Width));
21789
+ .pf-c-toolbar .pf-m-space-items-none-on-sm > * {
21790
+ --pf-c-toolbar--spacer: 0;
21928
21791
  }
21929
- }
21930
- @media (min-width: 768px) {
21931
- .pf-c-toolbar__item {
21932
- --pf-c-toolbar__item--Width--base: var(--pf-c-toolbar__item--Width-on-md, var(--pf-c-toolbar__item--Width-on-sm, var(--pf-c-toolbar__item--Width)));
21792
+
21793
+ .pf-c-toolbar .pf-m-space-items-none-on-sm > :last-child {
21794
+ --pf-c-toolbar--spacer: 0;
21933
21795
  }
21934
- }
21935
- @media (min-width: 992px) {
21936
- .pf-c-toolbar__item {
21937
- --pf-c-toolbar__item--Width--base: var(--pf-c-toolbar__item--Width-on-lg, var(--pf-c-toolbar__item--Width-on-md, var(--pf-c-toolbar__item--Width-on-sm, var(--pf-c-toolbar__item--Width))));
21796
+
21797
+ .pf-c-toolbar .pf-m-space-items-sm-on-sm > * {
21798
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
21938
21799
  }
21939
- }
21940
- @media (min-width: 1200px) {
21941
- .pf-c-toolbar__item {
21942
- --pf-c-toolbar__item--Width--base: var(--pf-c-toolbar__item--Width-on-xl, var(--pf-c-toolbar__item--Width-on-lg, var(--pf-c-toolbar__item--Width-on-md, var(--pf-c-toolbar__item--Width-on-sm, var(--pf-c-toolbar__item--Width)))));
21800
+
21801
+ .pf-c-toolbar .pf-m-space-items-sm-on-sm > :last-child {
21802
+ --pf-c-toolbar--spacer: 0;
21943
21803
  }
21944
- }
21945
- @media (min-width: 1450px) {
21946
- .pf-c-toolbar__item {
21947
- --pf-c-toolbar__item--Width--base: var(--pf-c-toolbar__item--Width-on-2xl, var(--pf-c-toolbar__item--Width-on-xl, var(--pf-c-toolbar__item--Width-on-lg, var(--pf-c-toolbar__item--Width-on-md, var(--pf-c-toolbar__item--Width-on-sm, var(--pf-c-toolbar__item--Width))))));
21804
+
21805
+ .pf-c-toolbar .pf-m-space-items-md-on-sm > * {
21806
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
21948
21807
  }
21949
- }
21950
- @media (min-width: 576px) {
21951
- .pf-c-toolbar__item {
21952
- --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth-on-sm, var(--pf-c-toolbar__item--MinWidth));
21808
+
21809
+ .pf-c-toolbar .pf-m-space-items-md-on-sm > :last-child {
21810
+ --pf-c-toolbar--spacer: 0;
21811
+ }
21812
+
21813
+ .pf-c-toolbar .pf-m-space-items-lg-on-sm > * {
21814
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
21815
+ }
21816
+
21817
+ .pf-c-toolbar .pf-m-space-items-lg-on-sm > :last-child {
21818
+ --pf-c-toolbar--spacer: 0;
21953
21819
  }
21954
21820
  }
21955
21821
  @media (min-width: 768px) {
21956
- .pf-c-toolbar__item {
21957
- --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth-on-md, var(--pf-c-toolbar__item--MinWidth-on-sm, var(--pf-c-toolbar__item--MinWidth)));
21822
+ .pf-c-toolbar .pf-m-space-items-none-on-md > * {
21823
+ --pf-c-toolbar--spacer: 0;
21824
+ }
21825
+
21826
+ .pf-c-toolbar .pf-m-space-items-none-on-md > :last-child {
21827
+ --pf-c-toolbar--spacer: 0;
21828
+ }
21829
+
21830
+ .pf-c-toolbar .pf-m-space-items-sm-on-md > * {
21831
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
21832
+ }
21833
+
21834
+ .pf-c-toolbar .pf-m-space-items-sm-on-md > :last-child {
21835
+ --pf-c-toolbar--spacer: 0;
21836
+ }
21837
+
21838
+ .pf-c-toolbar .pf-m-space-items-md-on-md > * {
21839
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
21840
+ }
21841
+
21842
+ .pf-c-toolbar .pf-m-space-items-md-on-md > :last-child {
21843
+ --pf-c-toolbar--spacer: 0;
21844
+ }
21845
+
21846
+ .pf-c-toolbar .pf-m-space-items-lg-on-md > * {
21847
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
21848
+ }
21849
+
21850
+ .pf-c-toolbar .pf-m-space-items-lg-on-md > :last-child {
21851
+ --pf-c-toolbar--spacer: 0;
21958
21852
  }
21959
21853
  }
21960
21854
  @media (min-width: 992px) {
21961
- .pf-c-toolbar__item {
21962
- --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth-on-lg, var(--pf-c-toolbar__item--MinWidth-on-md, var(--pf-c-toolbar__item--MinWidth-on-sm, var(--pf-c-toolbar__item--MinWidth))));
21855
+ .pf-c-toolbar .pf-m-space-items-none-on-lg > * {
21856
+ --pf-c-toolbar--spacer: 0;
21857
+ }
21858
+
21859
+ .pf-c-toolbar .pf-m-space-items-none-on-lg > :last-child {
21860
+ --pf-c-toolbar--spacer: 0;
21861
+ }
21862
+
21863
+ .pf-c-toolbar .pf-m-space-items-sm-on-lg > * {
21864
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
21865
+ }
21866
+
21867
+ .pf-c-toolbar .pf-m-space-items-sm-on-lg > :last-child {
21868
+ --pf-c-toolbar--spacer: 0;
21869
+ }
21870
+
21871
+ .pf-c-toolbar .pf-m-space-items-md-on-lg > * {
21872
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
21873
+ }
21874
+
21875
+ .pf-c-toolbar .pf-m-space-items-md-on-lg > :last-child {
21876
+ --pf-c-toolbar--spacer: 0;
21877
+ }
21878
+
21879
+ .pf-c-toolbar .pf-m-space-items-lg-on-lg > * {
21880
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
21881
+ }
21882
+
21883
+ .pf-c-toolbar .pf-m-space-items-lg-on-lg > :last-child {
21884
+ --pf-c-toolbar--spacer: 0;
21963
21885
  }
21964
21886
  }
21965
21887
  @media (min-width: 1200px) {
21966
- .pf-c-toolbar__item {
21967
- --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth-on-xl, var(--pf-c-toolbar__item--MinWidth-on-lg, var(--pf-c-toolbar__item--MinWidth-on-md, var(--pf-c-toolbar__item--MinWidth-on-sm, var(--pf-c-toolbar__item--MinWidth)))));
21888
+ .pf-c-toolbar .pf-m-space-items-none-on-xl > * {
21889
+ --pf-c-toolbar--spacer: 0;
21890
+ }
21891
+
21892
+ .pf-c-toolbar .pf-m-space-items-none-on-xl > :last-child {
21893
+ --pf-c-toolbar--spacer: 0;
21894
+ }
21895
+
21896
+ .pf-c-toolbar .pf-m-space-items-sm-on-xl > * {
21897
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
21898
+ }
21899
+
21900
+ .pf-c-toolbar .pf-m-space-items-sm-on-xl > :last-child {
21901
+ --pf-c-toolbar--spacer: 0;
21902
+ }
21903
+
21904
+ .pf-c-toolbar .pf-m-space-items-md-on-xl > * {
21905
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
21906
+ }
21907
+
21908
+ .pf-c-toolbar .pf-m-space-items-md-on-xl > :last-child {
21909
+ --pf-c-toolbar--spacer: 0;
21910
+ }
21911
+
21912
+ .pf-c-toolbar .pf-m-space-items-lg-on-xl > * {
21913
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
21914
+ }
21915
+
21916
+ .pf-c-toolbar .pf-m-space-items-lg-on-xl > :last-child {
21917
+ --pf-c-toolbar--spacer: 0;
21968
21918
  }
21969
21919
  }
21970
21920
  @media (min-width: 1450px) {
21971
- .pf-c-toolbar__item {
21972
- --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth-on-2xl, var(--pf-c-toolbar__item--MinWidth-on-xl, var(--pf-c-toolbar__item--MinWidth-on-lg, var(--pf-c-toolbar__item--MinWidth-on-md, var(--pf-c-toolbar__item--MinWidth-on-sm, var(--pf-c-toolbar__item--MinWidth))))));
21921
+ .pf-c-toolbar .pf-m-space-items-none-on-2xl > * {
21922
+ --pf-c-toolbar--spacer: 0;
21973
21923
  }
21974
- }
21975
- .pf-c-toolbar__item.pf-m-overflow-menu {
21976
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--m-overflow-menu--spacer);
21977
- }
21978
21924
 
21979
- .pf-c-toolbar__item.pf-m-bulk-select {
21980
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--m-bulk-select--spacer);
21981
- }
21925
+ .pf-c-toolbar .pf-m-space-items-none-on-2xl > :last-child {
21926
+ --pf-c-toolbar--spacer: 0;
21927
+ }
21982
21928
 
21983
- .pf-c-toolbar__item.pf-m-expand-all.pf-m-expanded {
21984
- --pf-c-toolbar__expand-all-icon--Rotate: var(--pf-c-toolbar__item--m-expand-all--m-expanded__expand-all-icon--Rotate);
21985
- }
21929
+ .pf-c-toolbar .pf-m-space-items-sm-on-2xl > * {
21930
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
21931
+ }
21986
21932
 
21987
- .pf-c-toolbar__item.pf-m-search-filter {
21988
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--m-search-filter--spacer);
21989
- }
21933
+ .pf-c-toolbar .pf-m-space-items-sm-on-2xl > :last-child {
21934
+ --pf-c-toolbar--spacer: 0;
21935
+ }
21990
21936
 
21991
- .pf-c-toolbar__item.pf-m-chip-group {
21992
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--m-chip-group--spacer);
21993
- }
21937
+ .pf-c-toolbar .pf-m-space-items-md-on-2xl > * {
21938
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
21939
+ }
21994
21940
 
21995
- .pf-c-toolbar__item.pf-m-label {
21996
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--m-label--spacer);
21997
- font-weight: var(--pf-c-toolbar__item--m-label--FontWeight);
21998
- }
21941
+ .pf-c-toolbar .pf-m-space-items-md-on-2xl > :last-child {
21942
+ --pf-c-toolbar--spacer: 0;
21943
+ }
21999
21944
 
22000
- .pf-c-toolbar__item.pf-m-pagination {
22001
- margin-left: auto;
22002
- }
21945
+ .pf-c-toolbar .pf-m-space-items-lg-on-2xl > * {
21946
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
21947
+ }
22003
21948
 
22004
- .pf-c-toolbar__item.pf-m-pagination .pf-c-pagination {
22005
- flex-wrap: nowrap;
21949
+ .pf-c-toolbar .pf-m-space-items-lg-on-2xl > :last-child {
21950
+ --pf-c-toolbar--spacer: 0;
21951
+ }
21952
+ }
21953
+ .pf-c-toolbar .pf-m-spacer-none {
21954
+ --pf-c-toolbar--spacer: 0;
22006
21955
  }
22007
21956
 
22008
- .pf-c-toolbar__item:last-child {
21957
+ .pf-c-toolbar .pf-m-spacer-none:last-child {
22009
21958
  --pf-c-toolbar--spacer: 0;
22010
21959
  }
22011
21960
 
22012
- .pf-c-toolbar__group.pf-m-overflow-container,
22013
- .pf-c-toolbar__item.pf-m-overflow-container {
22014
- flex: 1;
22015
- overflow: hidden;
21961
+ .pf-c-toolbar .pf-m-spacer-sm {
21962
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22016
21963
  }
22017
21964
 
22018
- .pf-c-toolbar__expand-all-icon {
22019
- display: inline-block;
22020
- transition: var(--pf-c-toolbar__expand-all-icon--Transition);
22021
- transform: rotate(var(--pf-c-toolbar__expand-all-icon--Rotate));
21965
+ .pf-c-toolbar .pf-m-spacer-sm:last-child {
21966
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22022
21967
  }
22023
21968
 
22024
- .pf-c-toolbar__content,
22025
- .pf-c-toolbar__content-section {
22026
- flex-wrap: wrap;
22027
- align-items: center;
21969
+ .pf-c-toolbar .pf-m-spacer-md {
21970
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22028
21971
  }
22029
21972
 
22030
- .pf-c-toolbar__content {
22031
- --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__content--Display);
22032
- position: relative;
22033
- padding-right: var(--pf-c-toolbar__content--PaddingRight);
22034
- padding-left: var(--pf-c-toolbar__content--PaddingLeft);
21973
+ .pf-c-toolbar .pf-m-spacer-md:last-child {
21974
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22035
21975
  }
22036
21976
 
22037
- .pf-c-toolbar__content-section {
22038
- --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__content-section--Display);
22039
- width: 100%;
21977
+ .pf-c-toolbar .pf-m-spacer-lg {
21978
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22040
21979
  }
22041
21980
 
22042
- .pf-c-toolbar__expandable-content {
22043
- position: absolute;
22044
- top: 100%;
22045
- right: 0;
22046
- left: 0;
22047
- z-index: var(--pf-c-toolbar__expandable-content--ZIndex);
22048
- display: none;
22049
- width: 100%;
22050
- padding: var(--pf-c-toolbar__expandable-content--PaddingTop) var(--pf-c-toolbar__expandable-content--PaddingRight) var(--pf-c-toolbar__expandable-content--PaddingBottom) var(--pf-c-toolbar__expandable-content--PaddingLeft);
22051
- visibility: hidden;
22052
- background-color: var(--pf-c-toolbar__expandable-content--BackgroundColor);
22053
- box-shadow: var(--pf-c-toolbar__expandable-content--BoxShadow);
21981
+ .pf-c-toolbar .pf-m-spacer-lg:last-child {
21982
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22054
21983
  }
22055
21984
 
22056
- @media screen and (min-width: 992px) {
22057
- .pf-c-toolbar__expandable-content {
22058
- position: static;
22059
- box-shadow: none;
21985
+ @media (min-width: 576px) {
21986
+ .pf-c-toolbar .pf-m-spacer-none-on-sm {
21987
+ --pf-c-toolbar--spacer: 0;
22060
21988
  }
22061
- }
22062
- .pf-c-toolbar__expandable-content.pf-m-expanded {
22063
- display: grid;
22064
- grid-row-gap: var(--pf-c-toolbar__expandable-content--m-expanded--GridRowGap);
22065
- visibility: visible;
22066
- }
22067
-
22068
- .pf-c-toolbar__expandable-content .pf-c-toolbar__group,
22069
- .pf-c-toolbar__expandable-content .pf-c-toolbar__item {
22070
- --pf-c-toolbar--spacer: 0;
22071
- }
22072
-
22073
- .pf-c-toolbar__expandable-content .pf-c-toolbar__group {
22074
- display: grid;
22075
- grid-row-gap: var(--pf-c-toolbar__expandable-content--m-expanded--GridRowGap);
22076
- }
22077
-
22078
- .pf-c-toolbar__expandable-content .pf-m-label {
22079
- margin-bottom: var(--pf-c-toolbar__expandable-content__item--m-label--MarginBottom);
22080
- font-size: var(--pf-c-toolbar__expandable-content__item--m-label--FontSize);
22081
- }
22082
-
22083
- .pf-c-toolbar__content.pf-m-chip-container,
22084
- .pf-c-toolbar__group.pf-m-chip-container {
22085
- display: flex;
22086
- flex-wrap: wrap;
22087
- align-items: baseline;
22088
- margin-top: var(--pf-c-toolbar__group--m-chip-container--MarginTop);
22089
- grid-row-gap: 0;
22090
- }
22091
-
22092
- .pf-c-toolbar__content.pf-m-chip-container .pf-c-toolbar__item,
22093
- .pf-c-toolbar__group.pf-m-chip-container .pf-c-toolbar__item {
22094
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--spacer);
22095
- margin-top: var(--pf-c-toolbar__group--m-chip-container__item--MarginTop);
22096
- }
22097
-
22098
- .pf-c-toolbar__content.pf-m-chip-container .pf-c-toolbar__group,
22099
- .pf-c-toolbar__group.pf-m-chip-container .pf-c-toolbar__group {
22100
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--spacer);
22101
- display: flex;
22102
- flex-wrap: wrap;
22103
- grid-row-gap: 0;
22104
- }
22105
-
22106
- .pf-c-toolbar__content.pf-m-chip-container .pf-c-toolbar__group:last-child,
22107
- .pf-c-toolbar__content.pf-m-chip-container .pf-c-toolbar__item:last-child,
22108
- .pf-c-toolbar__group.pf-m-chip-container .pf-c-toolbar__group:last-child,
22109
- .pf-c-toolbar__group.pf-m-chip-container .pf-c-toolbar__item:last-child {
22110
- --pf-c-toolbar--spacer: 0;
22111
- }
22112
-
22113
- .pf-c-toolbar .pf-c-chip-group:last-child {
22114
- --pf-c-chip-group--MarginRight: 0;
22115
- }
22116
-
22117
- .pf-c-toolbar .pf-c-chip-group li:last-child {
22118
- --pf-c-chip-group__li--m-toolbar--MarginRight: 0;
22119
- }
22120
21989
 
22121
- .pf-c-toolbar__toggle.pf-m-expanded .pf-c-button.pf-m-plain {
22122
- color: var(--pf-c-toolbar__toggle--m-expanded__c-button--m-plain--Color);
22123
- }
21990
+ .pf-c-toolbar .pf-m-spacer-none-on-sm:last-child {
21991
+ --pf-c-toolbar--spacer: 0;
21992
+ }
22124
21993
 
22125
- .pf-m-toggle-group.pf-m-show {
22126
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
22127
- }
21994
+ .pf-c-toolbar .pf-m-spacer-sm-on-sm {
21995
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
21996
+ }
22128
21997
 
22129
- .pf-m-toggle-group.pf-m-show .pf-c-toolbar__group,
22130
- .pf-m-toggle-group.pf-m-show .pf-c-toolbar__item {
22131
- display: flex;
22132
- flex: 0 1 auto;
22133
- visibility: visible;
22134
- }
21998
+ .pf-c-toolbar .pf-m-spacer-sm-on-sm:last-child {
21999
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22000
+ }
22135
22001
 
22136
- .pf-m-toggle-group.pf-m-show .pf-c-toolbar__toggle {
22137
- display: none;
22138
- visibility: hidden;
22139
- }
22002
+ .pf-c-toolbar .pf-m-spacer-md-on-sm {
22003
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22004
+ }
22140
22005
 
22141
- @media (min-width: 576px) {
22142
- .pf-m-toggle-group.pf-m-show-on-sm {
22143
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
22006
+ .pf-c-toolbar .pf-m-spacer-md-on-sm:last-child {
22007
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22144
22008
  }
22145
22009
 
22146
- .pf-m-toggle-group.pf-m-show-on-sm .pf-c-toolbar__group,
22147
- .pf-m-toggle-group.pf-m-show-on-sm .pf-c-toolbar__item {
22148
- display: flex;
22149
- flex: 0 1 auto;
22150
- visibility: visible;
22010
+ .pf-c-toolbar .pf-m-spacer-lg-on-sm {
22011
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22151
22012
  }
22152
22013
 
22153
- .pf-m-toggle-group.pf-m-show-on-sm .pf-c-toolbar__toggle {
22154
- display: none;
22155
- visibility: hidden;
22014
+ .pf-c-toolbar .pf-m-spacer-lg-on-sm:last-child {
22015
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22156
22016
  }
22157
22017
  }
22158
22018
  @media (min-width: 768px) {
22159
- .pf-m-toggle-group.pf-m-show-on-md {
22160
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
22019
+ .pf-c-toolbar .pf-m-spacer-none-on-md {
22020
+ --pf-c-toolbar--spacer: 0;
22161
22021
  }
22162
22022
 
22163
- .pf-m-toggle-group.pf-m-show-on-md .pf-c-toolbar__group,
22164
- .pf-m-toggle-group.pf-m-show-on-md .pf-c-toolbar__item {
22165
- display: flex;
22166
- flex: 0 1 auto;
22167
- visibility: visible;
22023
+ .pf-c-toolbar .pf-m-spacer-none-on-md:last-child {
22024
+ --pf-c-toolbar--spacer: 0;
22168
22025
  }
22169
22026
 
22170
- .pf-m-toggle-group.pf-m-show-on-md .pf-c-toolbar__toggle {
22171
- display: none;
22172
- visibility: hidden;
22173
- }
22174
- }
22175
- @media (min-width: 992px) {
22176
- .pf-m-toggle-group.pf-m-show-on-lg {
22177
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
22027
+ .pf-c-toolbar .pf-m-spacer-sm-on-md {
22028
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22178
22029
  }
22179
22030
 
22180
- .pf-m-toggle-group.pf-m-show-on-lg .pf-c-toolbar__group,
22181
- .pf-m-toggle-group.pf-m-show-on-lg .pf-c-toolbar__item {
22182
- display: flex;
22183
- flex: 0 1 auto;
22184
- visibility: visible;
22031
+ .pf-c-toolbar .pf-m-spacer-sm-on-md:last-child {
22032
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22185
22033
  }
22186
22034
 
22187
- .pf-m-toggle-group.pf-m-show-on-lg .pf-c-toolbar__toggle {
22188
- display: none;
22189
- visibility: hidden;
22035
+ .pf-c-toolbar .pf-m-spacer-md-on-md {
22036
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22190
22037
  }
22191
- }
22192
- @media (min-width: 1200px) {
22193
- .pf-m-toggle-group.pf-m-show-on-xl {
22194
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
22038
+
22039
+ .pf-c-toolbar .pf-m-spacer-md-on-md:last-child {
22040
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22195
22041
  }
22196
22042
 
22197
- .pf-m-toggle-group.pf-m-show-on-xl .pf-c-toolbar__group,
22198
- .pf-m-toggle-group.pf-m-show-on-xl .pf-c-toolbar__item {
22199
- display: flex;
22200
- flex: 0 1 auto;
22201
- visibility: visible;
22043
+ .pf-c-toolbar .pf-m-spacer-lg-on-md {
22044
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22202
22045
  }
22203
22046
 
22204
- .pf-m-toggle-group.pf-m-show-on-xl .pf-c-toolbar__toggle {
22205
- display: none;
22206
- visibility: hidden;
22047
+ .pf-c-toolbar .pf-m-spacer-lg-on-md:last-child {
22048
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22207
22049
  }
22208
22050
  }
22209
- @media (min-width: 1450px) {
22210
- .pf-m-toggle-group.pf-m-show-on-2xl {
22211
- --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
22051
+ @media (min-width: 992px) {
22052
+ .pf-c-toolbar .pf-m-spacer-none-on-lg {
22053
+ --pf-c-toolbar--spacer: 0;
22212
22054
  }
22213
22055
 
22214
- .pf-m-toggle-group.pf-m-show-on-2xl .pf-c-toolbar__group,
22215
- .pf-m-toggle-group.pf-m-show-on-2xl .pf-c-toolbar__item {
22216
- display: flex;
22217
- flex: 0 1 auto;
22218
- visibility: visible;
22056
+ .pf-c-toolbar .pf-m-spacer-none-on-lg:last-child {
22057
+ --pf-c-toolbar--spacer: 0;
22219
22058
  }
22220
22059
 
22221
- .pf-m-toggle-group.pf-m-show-on-2xl .pf-c-toolbar__toggle {
22222
- display: none;
22223
- visibility: hidden;
22060
+ .pf-c-toolbar .pf-m-spacer-sm-on-lg {
22061
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22224
22062
  }
22225
- }
22226
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right,
22227
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right {
22228
- margin-left: auto;
22229
- }
22230
22063
 
22231
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right ~ .pf-m-pagination,
22232
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right ~ .pf-m-pagination {
22233
- margin-left: 0;
22234
- }
22064
+ .pf-c-toolbar .pf-m-spacer-sm-on-lg:last-child {
22065
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22066
+ }
22235
22067
 
22236
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left,
22237
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left {
22238
- margin-left: 0;
22239
- }
22068
+ .pf-c-toolbar .pf-m-spacer-md-on-lg {
22069
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22070
+ }
22240
22071
 
22241
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left ~ .pf-m-pagination,
22242
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left ~ .pf-m-pagination {
22243
- margin-left: auto;
22244
- }
22072
+ .pf-c-toolbar .pf-m-spacer-md-on-lg:last-child {
22073
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22074
+ }
22245
22075
 
22246
- .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap,
22247
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap {
22248
- flex-wrap: nowrap;
22249
- }
22076
+ .pf-c-toolbar .pf-m-spacer-lg-on-lg {
22077
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22078
+ }
22250
22079
 
22251
- .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap,
22252
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap {
22253
- flex-wrap: wrap;
22080
+ .pf-c-toolbar .pf-m-spacer-lg-on-lg:last-child {
22081
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22082
+ }
22254
22083
  }
22255
-
22256
- @media (min-width: 576px) {
22257
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-sm,
22258
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-sm {
22259
- margin-left: auto;
22084
+ @media (min-width: 1200px) {
22085
+ .pf-c-toolbar .pf-m-spacer-none-on-xl {
22086
+ --pf-c-toolbar--spacer: 0;
22260
22087
  }
22261
22088
 
22262
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-sm ~ .pf-m-pagination,
22263
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-sm ~ .pf-m-pagination {
22264
- margin-left: 0;
22089
+ .pf-c-toolbar .pf-m-spacer-none-on-xl:last-child {
22090
+ --pf-c-toolbar--spacer: 0;
22265
22091
  }
22266
22092
 
22267
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-sm,
22268
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-sm {
22269
- margin-left: 0;
22093
+ .pf-c-toolbar .pf-m-spacer-sm-on-xl {
22094
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22270
22095
  }
22271
22096
 
22272
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-sm ~ .pf-m-pagination,
22273
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-sm ~ .pf-m-pagination {
22274
- margin-left: auto;
22097
+ .pf-c-toolbar .pf-m-spacer-sm-on-xl:last-child {
22098
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22275
22099
  }
22276
22100
 
22277
- .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-sm,
22278
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-sm {
22279
- flex-wrap: nowrap;
22101
+ .pf-c-toolbar .pf-m-spacer-md-on-xl {
22102
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22280
22103
  }
22281
22104
 
22282
- .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-sm,
22283
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-sm {
22284
- flex-wrap: wrap;
22285
- }
22286
- }
22287
- @media (min-width: 768px) {
22288
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-md,
22289
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-md {
22290
- margin-left: auto;
22291
- }
22292
-
22293
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-md ~ .pf-m-pagination,
22294
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-md ~ .pf-m-pagination {
22295
- margin-left: 0;
22296
- }
22297
-
22298
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-md,
22299
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-md {
22300
- margin-left: 0;
22301
- }
22302
-
22303
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-md ~ .pf-m-pagination,
22304
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-md ~ .pf-m-pagination {
22305
- margin-left: auto;
22306
- }
22307
-
22308
- .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-md,
22309
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-md {
22310
- flex-wrap: nowrap;
22311
- }
22312
-
22313
- .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-md,
22314
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-md {
22315
- flex-wrap: wrap;
22316
- }
22317
- }
22318
- @media (min-width: 992px) {
22319
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-lg,
22320
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-lg {
22321
- margin-left: auto;
22322
- }
22323
-
22324
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-lg ~ .pf-m-pagination,
22325
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-lg ~ .pf-m-pagination {
22326
- margin-left: 0;
22327
- }
22328
-
22329
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-lg,
22330
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-lg {
22331
- margin-left: 0;
22332
- }
22333
-
22334
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-lg ~ .pf-m-pagination,
22335
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-lg ~ .pf-m-pagination {
22336
- margin-left: auto;
22105
+ .pf-c-toolbar .pf-m-spacer-md-on-xl:last-child {
22106
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22337
22107
  }
22338
22108
 
22339
- .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-lg,
22340
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-lg {
22341
- flex-wrap: nowrap;
22109
+ .pf-c-toolbar .pf-m-spacer-lg-on-xl {
22110
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22342
22111
  }
22343
22112
 
22344
- .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-lg,
22345
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-lg {
22346
- flex-wrap: wrap;
22113
+ .pf-c-toolbar .pf-m-spacer-lg-on-xl:last-child {
22114
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22347
22115
  }
22348
22116
  }
22349
- @media (min-width: 1200px) {
22350
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-xl,
22351
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-xl {
22352
- margin-left: auto;
22353
- }
22354
-
22355
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-xl ~ .pf-m-pagination,
22356
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-xl ~ .pf-m-pagination {
22357
- margin-left: 0;
22358
- }
22359
-
22360
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-xl,
22361
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-xl {
22362
- margin-left: 0;
22363
- }
22364
-
22365
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-xl ~ .pf-m-pagination,
22366
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-xl ~ .pf-m-pagination {
22367
- margin-left: auto;
22117
+ @media (min-width: 1450px) {
22118
+ .pf-c-toolbar .pf-m-spacer-none-on-2xl {
22119
+ --pf-c-toolbar--spacer: 0;
22368
22120
  }
22369
22121
 
22370
- .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-xl,
22371
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-xl {
22372
- flex-wrap: nowrap;
22122
+ .pf-c-toolbar .pf-m-spacer-none-on-2xl:last-child {
22123
+ --pf-c-toolbar--spacer: 0;
22373
22124
  }
22374
22125
 
22375
- .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-xl,
22376
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-xl {
22377
- flex-wrap: wrap;
22378
- }
22379
- }
22380
- @media (min-width: 1450px) {
22381
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-2xl,
22382
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-2xl {
22383
- margin-left: auto;
22126
+ .pf-c-toolbar .pf-m-spacer-sm-on-2xl {
22127
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22384
22128
  }
22385
22129
 
22386
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-2xl ~ .pf-m-pagination,
22387
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-2xl ~ .pf-m-pagination {
22388
- margin-left: 0;
22130
+ .pf-c-toolbar .pf-m-spacer-sm-on-2xl:last-child {
22131
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22389
22132
  }
22390
22133
 
22391
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-2xl,
22392
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-2xl {
22393
- margin-left: 0;
22134
+ .pf-c-toolbar .pf-m-spacer-md-on-2xl {
22135
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22394
22136
  }
22395
22137
 
22396
- .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-2xl ~ .pf-m-pagination,
22397
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-2xl ~ .pf-m-pagination {
22398
- margin-left: auto;
22138
+ .pf-c-toolbar .pf-m-spacer-md-on-2xl:last-child {
22139
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22399
22140
  }
22400
22141
 
22401
- .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-2xl,
22402
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-2xl {
22403
- flex-wrap: nowrap;
22142
+ .pf-c-toolbar .pf-m-spacer-lg-on-2xl {
22143
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22404
22144
  }
22405
22145
 
22406
- .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-2xl,
22407
- .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-2xl {
22408
- flex-wrap: wrap;
22146
+ .pf-c-toolbar .pf-m-spacer-lg-on-2xl:last-child {
22147
+ --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22409
22148
  }
22410
22149
  }
22411
- .pf-c-toolbar .pf-m-space-items-none > * {
22412
- --pf-c-toolbar--spacer: 0;
22413
- }
22414
-
22415
- .pf-c-toolbar .pf-m-space-items-none > :last-child {
22416
- --pf-c-toolbar--spacer: 0;
22417
- }
22418
-
22419
- .pf-c-toolbar .pf-m-space-items-sm > * {
22420
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22150
+ .pf-c-toolbar.pf-m-inset-none {
22151
+ --pf-c-toolbar--inset: 0;
22152
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22153
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22421
22154
  }
22422
22155
 
22423
- .pf-c-toolbar .pf-m-space-items-sm > :last-child {
22424
- --pf-c-toolbar--spacer: 0;
22156
+ .pf-c-toolbar.pf-m-inset-sm {
22157
+ --pf-c-toolbar--inset: var(--pf-global--spacer--sm);
22158
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22159
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22425
22160
  }
22426
22161
 
22427
- .pf-c-toolbar .pf-m-space-items-md > * {
22428
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22162
+ .pf-c-toolbar.pf-m-inset-md {
22163
+ --pf-c-toolbar--inset: var(--pf-global--spacer--md);
22164
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22165
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22429
22166
  }
22430
22167
 
22431
- .pf-c-toolbar .pf-m-space-items-md > :last-child {
22432
- --pf-c-toolbar--spacer: 0;
22168
+ .pf-c-toolbar.pf-m-inset-lg {
22169
+ --pf-c-toolbar--inset: var(--pf-global--spacer--lg);
22170
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22171
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22433
22172
  }
22434
22173
 
22435
- .pf-c-toolbar .pf-m-space-items-lg > * {
22436
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22174
+ .pf-c-toolbar.pf-m-inset-xl {
22175
+ --pf-c-toolbar--inset: var(--pf-global--spacer--xl);
22176
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22177
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22437
22178
  }
22438
22179
 
22439
- .pf-c-toolbar .pf-m-space-items-lg > :last-child {
22440
- --pf-c-toolbar--spacer: 0;
22180
+ .pf-c-toolbar.pf-m-inset-2xl {
22181
+ --pf-c-toolbar--inset: var(--pf-global--spacer--2xl);
22182
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22183
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22441
22184
  }
22442
22185
 
22443
22186
  @media (min-width: 576px) {
22444
- .pf-c-toolbar .pf-m-space-items-none-on-sm > * {
22445
- --pf-c-toolbar--spacer: 0;
22446
- }
22447
-
22448
- .pf-c-toolbar .pf-m-space-items-none-on-sm > :last-child {
22449
- --pf-c-toolbar--spacer: 0;
22450
- }
22451
-
22452
- .pf-c-toolbar .pf-m-space-items-sm-on-sm > * {
22453
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22187
+ .pf-c-toolbar.pf-m-inset-none-on-sm {
22188
+ --pf-c-toolbar--inset: 0;
22189
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22190
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22454
22191
  }
22455
22192
 
22456
- .pf-c-toolbar .pf-m-space-items-sm-on-sm > :last-child {
22457
- --pf-c-toolbar--spacer: 0;
22193
+ .pf-c-toolbar.pf-m-inset-sm-on-sm {
22194
+ --pf-c-toolbar--inset: var(--pf-global--spacer--sm);
22195
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22196
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22458
22197
  }
22459
22198
 
22460
- .pf-c-toolbar .pf-m-space-items-md-on-sm > * {
22461
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22199
+ .pf-c-toolbar.pf-m-inset-md-on-sm {
22200
+ --pf-c-toolbar--inset: var(--pf-global--spacer--md);
22201
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22202
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22462
22203
  }
22463
22204
 
22464
- .pf-c-toolbar .pf-m-space-items-md-on-sm > :last-child {
22465
- --pf-c-toolbar--spacer: 0;
22205
+ .pf-c-toolbar.pf-m-inset-lg-on-sm {
22206
+ --pf-c-toolbar--inset: var(--pf-global--spacer--lg);
22207
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22208
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22466
22209
  }
22467
22210
 
22468
- .pf-c-toolbar .pf-m-space-items-lg-on-sm > * {
22469
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22211
+ .pf-c-toolbar.pf-m-inset-xl-on-sm {
22212
+ --pf-c-toolbar--inset: var(--pf-global--spacer--xl);
22213
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22214
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22470
22215
  }
22471
22216
 
22472
- .pf-c-toolbar .pf-m-space-items-lg-on-sm > :last-child {
22473
- --pf-c-toolbar--spacer: 0;
22217
+ .pf-c-toolbar.pf-m-inset-2xl-on-sm {
22218
+ --pf-c-toolbar--inset: var(--pf-global--spacer--2xl);
22219
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22220
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22474
22221
  }
22475
22222
  }
22476
22223
  @media (min-width: 768px) {
22477
- .pf-c-toolbar .pf-m-space-items-none-on-md > * {
22478
- --pf-c-toolbar--spacer: 0;
22224
+ .pf-c-toolbar.pf-m-inset-none-on-md {
22225
+ --pf-c-toolbar--inset: 0;
22226
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22227
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22479
22228
  }
22480
22229
 
22481
- .pf-c-toolbar .pf-m-space-items-none-on-md > :last-child {
22482
- --pf-c-toolbar--spacer: 0;
22230
+ .pf-c-toolbar.pf-m-inset-sm-on-md {
22231
+ --pf-c-toolbar--inset: var(--pf-global--spacer--sm);
22232
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22233
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22483
22234
  }
22484
22235
 
22485
- .pf-c-toolbar .pf-m-space-items-sm-on-md > * {
22486
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22236
+ .pf-c-toolbar.pf-m-inset-md-on-md {
22237
+ --pf-c-toolbar--inset: var(--pf-global--spacer--md);
22238
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22239
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22487
22240
  }
22488
22241
 
22489
- .pf-c-toolbar .pf-m-space-items-sm-on-md > :last-child {
22490
- --pf-c-toolbar--spacer: 0;
22242
+ .pf-c-toolbar.pf-m-inset-lg-on-md {
22243
+ --pf-c-toolbar--inset: var(--pf-global--spacer--lg);
22244
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22245
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22491
22246
  }
22492
22247
 
22493
- .pf-c-toolbar .pf-m-space-items-md-on-md > * {
22494
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22248
+ .pf-c-toolbar.pf-m-inset-xl-on-md {
22249
+ --pf-c-toolbar--inset: var(--pf-global--spacer--xl);
22250
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22251
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22495
22252
  }
22496
22253
 
22497
- .pf-c-toolbar .pf-m-space-items-md-on-md > :last-child {
22498
- --pf-c-toolbar--spacer: 0;
22254
+ .pf-c-toolbar.pf-m-inset-2xl-on-md {
22255
+ --pf-c-toolbar--inset: var(--pf-global--spacer--2xl);
22256
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22257
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22258
+ }
22259
+ }
22260
+ @media (min-width: 992px) {
22261
+ .pf-c-toolbar.pf-m-inset-none-on-lg {
22262
+ --pf-c-toolbar--inset: 0;
22263
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22264
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22499
22265
  }
22500
22266
 
22501
- .pf-c-toolbar .pf-m-space-items-lg-on-md > * {
22502
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22503
- }
22504
-
22505
- .pf-c-toolbar .pf-m-space-items-lg-on-md > :last-child {
22506
- --pf-c-toolbar--spacer: 0;
22507
- }
22508
- }
22509
- @media (min-width: 992px) {
22510
- .pf-c-toolbar .pf-m-space-items-none-on-lg > * {
22511
- --pf-c-toolbar--spacer: 0;
22512
- }
22513
-
22514
- .pf-c-toolbar .pf-m-space-items-none-on-lg > :last-child {
22515
- --pf-c-toolbar--spacer: 0;
22516
- }
22517
-
22518
- .pf-c-toolbar .pf-m-space-items-sm-on-lg > * {
22519
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22520
- }
22521
-
22522
- .pf-c-toolbar .pf-m-space-items-sm-on-lg > :last-child {
22523
- --pf-c-toolbar--spacer: 0;
22267
+ .pf-c-toolbar.pf-m-inset-sm-on-lg {
22268
+ --pf-c-toolbar--inset: var(--pf-global--spacer--sm);
22269
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22270
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22524
22271
  }
22525
22272
 
22526
- .pf-c-toolbar .pf-m-space-items-md-on-lg > * {
22527
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22273
+ .pf-c-toolbar.pf-m-inset-md-on-lg {
22274
+ --pf-c-toolbar--inset: var(--pf-global--spacer--md);
22275
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22276
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22528
22277
  }
22529
22278
 
22530
- .pf-c-toolbar .pf-m-space-items-md-on-lg > :last-child {
22531
- --pf-c-toolbar--spacer: 0;
22279
+ .pf-c-toolbar.pf-m-inset-lg-on-lg {
22280
+ --pf-c-toolbar--inset: var(--pf-global--spacer--lg);
22281
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22282
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22532
22283
  }
22533
22284
 
22534
- .pf-c-toolbar .pf-m-space-items-lg-on-lg > * {
22535
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22285
+ .pf-c-toolbar.pf-m-inset-xl-on-lg {
22286
+ --pf-c-toolbar--inset: var(--pf-global--spacer--xl);
22287
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22288
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22536
22289
  }
22537
22290
 
22538
- .pf-c-toolbar .pf-m-space-items-lg-on-lg > :last-child {
22539
- --pf-c-toolbar--spacer: 0;
22291
+ .pf-c-toolbar.pf-m-inset-2xl-on-lg {
22292
+ --pf-c-toolbar--inset: var(--pf-global--spacer--2xl);
22293
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22294
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22540
22295
  }
22541
22296
  }
22542
22297
  @media (min-width: 1200px) {
22543
- .pf-c-toolbar .pf-m-space-items-none-on-xl > * {
22544
- --pf-c-toolbar--spacer: 0;
22545
- }
22546
-
22547
- .pf-c-toolbar .pf-m-space-items-none-on-xl > :last-child {
22548
- --pf-c-toolbar--spacer: 0;
22549
- }
22550
-
22551
- .pf-c-toolbar .pf-m-space-items-sm-on-xl > * {
22552
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22298
+ .pf-c-toolbar.pf-m-inset-none-on-xl {
22299
+ --pf-c-toolbar--inset: 0;
22300
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22301
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22553
22302
  }
22554
22303
 
22555
- .pf-c-toolbar .pf-m-space-items-sm-on-xl > :last-child {
22556
- --pf-c-toolbar--spacer: 0;
22304
+ .pf-c-toolbar.pf-m-inset-sm-on-xl {
22305
+ --pf-c-toolbar--inset: var(--pf-global--spacer--sm);
22306
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22307
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22557
22308
  }
22558
22309
 
22559
- .pf-c-toolbar .pf-m-space-items-md-on-xl > * {
22560
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22310
+ .pf-c-toolbar.pf-m-inset-md-on-xl {
22311
+ --pf-c-toolbar--inset: var(--pf-global--spacer--md);
22312
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22313
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22561
22314
  }
22562
22315
 
22563
- .pf-c-toolbar .pf-m-space-items-md-on-xl > :last-child {
22564
- --pf-c-toolbar--spacer: 0;
22316
+ .pf-c-toolbar.pf-m-inset-lg-on-xl {
22317
+ --pf-c-toolbar--inset: var(--pf-global--spacer--lg);
22318
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22319
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22565
22320
  }
22566
22321
 
22567
- .pf-c-toolbar .pf-m-space-items-lg-on-xl > * {
22568
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22322
+ .pf-c-toolbar.pf-m-inset-xl-on-xl {
22323
+ --pf-c-toolbar--inset: var(--pf-global--spacer--xl);
22324
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22325
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22569
22326
  }
22570
22327
 
22571
- .pf-c-toolbar .pf-m-space-items-lg-on-xl > :last-child {
22572
- --pf-c-toolbar--spacer: 0;
22328
+ .pf-c-toolbar.pf-m-inset-2xl-on-xl {
22329
+ --pf-c-toolbar--inset: var(--pf-global--spacer--2xl);
22330
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22331
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22573
22332
  }
22574
22333
  }
22575
22334
  @media (min-width: 1450px) {
22576
- .pf-c-toolbar .pf-m-space-items-none-on-2xl > * {
22577
- --pf-c-toolbar--spacer: 0;
22578
- }
22579
-
22580
- .pf-c-toolbar .pf-m-space-items-none-on-2xl > :last-child {
22581
- --pf-c-toolbar--spacer: 0;
22582
- }
22583
-
22584
- .pf-c-toolbar .pf-m-space-items-sm-on-2xl > * {
22585
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22335
+ .pf-c-toolbar.pf-m-inset-none-on-2xl {
22336
+ --pf-c-toolbar--inset: 0;
22337
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22338
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22586
22339
  }
22587
22340
 
22588
- .pf-c-toolbar .pf-m-space-items-sm-on-2xl > :last-child {
22589
- --pf-c-toolbar--spacer: 0;
22341
+ .pf-c-toolbar.pf-m-inset-sm-on-2xl {
22342
+ --pf-c-toolbar--inset: var(--pf-global--spacer--sm);
22343
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22344
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22590
22345
  }
22591
22346
 
22592
- .pf-c-toolbar .pf-m-space-items-md-on-2xl > * {
22593
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22347
+ .pf-c-toolbar.pf-m-inset-md-on-2xl {
22348
+ --pf-c-toolbar--inset: var(--pf-global--spacer--md);
22349
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22350
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22594
22351
  }
22595
22352
 
22596
- .pf-c-toolbar .pf-m-space-items-md-on-2xl > :last-child {
22597
- --pf-c-toolbar--spacer: 0;
22353
+ .pf-c-toolbar.pf-m-inset-lg-on-2xl {
22354
+ --pf-c-toolbar--inset: var(--pf-global--spacer--lg);
22355
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22356
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22598
22357
  }
22599
22358
 
22600
- .pf-c-toolbar .pf-m-space-items-lg-on-2xl > * {
22601
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22359
+ .pf-c-toolbar.pf-m-inset-xl-on-2xl {
22360
+ --pf-c-toolbar--inset: var(--pf-global--spacer--xl);
22361
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22362
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22602
22363
  }
22603
22364
 
22604
- .pf-c-toolbar .pf-m-space-items-lg-on-2xl > :last-child {
22605
- --pf-c-toolbar--spacer: 0;
22365
+ .pf-c-toolbar.pf-m-inset-2xl-on-2xl {
22366
+ --pf-c-toolbar--inset: var(--pf-global--spacer--2xl);
22367
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22368
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22606
22369
  }
22607
22370
  }
22608
- .pf-c-toolbar .pf-m-spacer-none {
22371
+ .pf-c-toolbar__content-section > :last-child {
22609
22372
  --pf-c-toolbar--spacer: 0;
22610
22373
  }
22611
22374
 
22612
- .pf-c-toolbar .pf-m-spacer-none:last-child {
22613
- --pf-c-toolbar--spacer: 0;
22375
+ .pf-c-tooltip {
22376
+ --pf-c-tooltip--MaxWidth: 18.75rem;
22377
+ --pf-c-tooltip--BoxShadow: var(--pf-global--BoxShadow--md);
22378
+ --pf-c-tooltip__content--PaddingTop: var(--pf-global--spacer--sm);
22379
+ --pf-c-tooltip__content--PaddingRight: var(--pf-global--spacer--sm);
22380
+ --pf-c-tooltip__content--PaddingBottom: var(--pf-global--spacer--sm);
22381
+ --pf-c-tooltip__content--PaddingLeft: var(--pf-global--spacer--sm);
22382
+ --pf-c-tooltip__content--Color: var(--pf-global--Color--light-100);
22383
+ --pf-c-tooltip__content--BackgroundColor: var(--pf-global--BackgroundColor--dark-100);
22384
+ --pf-c-tooltip__content--FontSize: var(--pf-global--FontSize--sm);
22385
+ --pf-c-tooltip__arrow--Width: 0.5rem;
22386
+ --pf-c-tooltip__arrow--Height: 0.5rem;
22387
+ --pf-c-tooltip__arrow--m-top--TranslateX: -50%;
22388
+ --pf-c-tooltip__arrow--m-top--TranslateY: 50%;
22389
+ --pf-c-tooltip__arrow--m-top--Rotate: 45deg;
22390
+ --pf-c-tooltip__arrow--m-right--TranslateX: -50%;
22391
+ --pf-c-tooltip__arrow--m-right--TranslateY: -50%;
22392
+ --pf-c-tooltip__arrow--m-right--Rotate: 45deg;
22393
+ --pf-c-tooltip__arrow--m-bottom--TranslateX: -50%;
22394
+ --pf-c-tooltip__arrow--m-bottom--TranslateY: -50%;
22395
+ --pf-c-tooltip__arrow--m-bottom--Rotate: 45deg;
22396
+ --pf-c-tooltip__arrow--m-left--TranslateX: 50%;
22397
+ --pf-c-tooltip__arrow--m-left--TranslateY: -50%;
22398
+ --pf-c-tooltip__arrow--m-left--Rotate: 45deg;
22399
+ position: relative;
22400
+ max-width: var(--pf-c-tooltip--MaxWidth);
22401
+ box-shadow: var(--pf-c-tooltip--BoxShadow);
22614
22402
  }
22615
22403
 
22616
- .pf-c-toolbar .pf-m-spacer-sm {
22617
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22404
+ .pf-c-tooltip.pf-m-top .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-top-left .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-top-right .pf-c-tooltip__arrow {
22405
+ bottom: 0;
22406
+ left: 50%;
22407
+ transform: translateX(var(--pf-c-tooltip__arrow--m-top--TranslateX)) translateY(var(--pf-c-tooltip__arrow--m-top--TranslateY)) rotate(var(--pf-c-tooltip__arrow--m-top--Rotate));
22618
22408
  }
22619
22409
 
22620
- .pf-c-toolbar .pf-m-spacer-sm:last-child {
22621
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22410
+ .pf-c-tooltip.pf-m-bottom .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-bottom-left .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-bottom-right .pf-c-tooltip__arrow {
22411
+ top: 0;
22412
+ left: 50%;
22413
+ transform: translateX(var(--pf-c-tooltip__arrow--m-bottom--TranslateX)) translateY(var(--pf-c-tooltip__arrow--m-bottom--TranslateY)) rotate(var(--pf-c-tooltip__arrow--m-bottom--Rotate));
22622
22414
  }
22623
22415
 
22624
- .pf-c-toolbar .pf-m-spacer-md {
22625
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22416
+ .pf-c-tooltip.pf-m-left .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-left-top .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-left-bottom .pf-c-tooltip__arrow {
22417
+ top: 50%;
22418
+ right: 0;
22419
+ transform: translateX(var(--pf-c-tooltip__arrow--m-left--TranslateX)) translateY(var(--pf-c-tooltip__arrow--m-left--TranslateY)) rotate(var(--pf-c-tooltip__arrow--m-left--Rotate));
22626
22420
  }
22627
22421
 
22628
- .pf-c-toolbar .pf-m-spacer-md:last-child {
22629
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22422
+ .pf-c-tooltip.pf-m-right .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-right-top .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-right-bottom .pf-c-tooltip__arrow {
22423
+ top: 50%;
22424
+ left: 0;
22425
+ transform: translateX(var(--pf-c-tooltip__arrow--m-right--TranslateX)) translateY(var(--pf-c-tooltip__arrow--m-right--TranslateY)) rotate(var(--pf-c-tooltip__arrow--m-right--Rotate));
22630
22426
  }
22631
22427
 
22632
- .pf-c-toolbar .pf-m-spacer-lg {
22633
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22428
+ .pf-c-tooltip.pf-m-left-top .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-right-top .pf-c-tooltip__arrow {
22429
+ top: var(--pf-c-tooltip__arrow--Height);
22634
22430
  }
22635
22431
 
22636
- .pf-c-toolbar .pf-m-spacer-lg:last-child {
22637
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22432
+ .pf-c-tooltip.pf-m-left-bottom .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-right-bottom .pf-c-tooltip__arrow {
22433
+ top: auto;
22434
+ bottom: 0;
22638
22435
  }
22639
22436
 
22640
- @media (min-width: 576px) {
22641
- .pf-c-toolbar .pf-m-spacer-none-on-sm {
22642
- --pf-c-toolbar--spacer: 0;
22643
- }
22644
-
22645
- .pf-c-toolbar .pf-m-spacer-none-on-sm:last-child {
22646
- --pf-c-toolbar--spacer: 0;
22647
- }
22437
+ .pf-c-tooltip.pf-m-top-left .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-bottom-left .pf-c-tooltip__arrow {
22438
+ left: var(--pf-c-tooltip__arrow--Width);
22439
+ }
22648
22440
 
22649
- .pf-c-toolbar .pf-m-spacer-sm-on-sm {
22650
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22651
- }
22441
+ .pf-c-tooltip.pf-m-top-right .pf-c-tooltip__arrow, .pf-c-tooltip.pf-m-bottom-right .pf-c-tooltip__arrow {
22442
+ right: 0;
22443
+ left: auto;
22444
+ }
22652
22445
 
22653
- .pf-c-toolbar .pf-m-spacer-sm-on-sm:last-child {
22654
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22655
- }
22446
+ .pf-c-tooltip__content {
22447
+ position: relative;
22448
+ padding: var(--pf-c-tooltip__content--PaddingTop) var(--pf-c-tooltip__content--PaddingRight) var(--pf-c-tooltip__content--PaddingBottom) var(--pf-c-tooltip__content--PaddingLeft);
22449
+ font-size: var(--pf-c-tooltip__content--FontSize);
22450
+ color: var(--pf-c-tooltip__content--Color);
22451
+ text-align: center;
22452
+ word-break: break-word;
22453
+ background-color: var(--pf-c-tooltip__content--BackgroundColor);
22454
+ }
22656
22455
 
22657
- .pf-c-toolbar .pf-m-spacer-md-on-sm {
22658
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22659
- }
22456
+ .pf-c-tooltip__content.pf-m-text-align-left {
22457
+ text-align: left;
22458
+ }
22660
22459
 
22661
- .pf-c-toolbar .pf-m-spacer-md-on-sm:last-child {
22662
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22663
- }
22460
+ .pf-c-tooltip__arrow {
22461
+ position: absolute;
22462
+ width: var(--pf-c-tooltip__arrow--Width);
22463
+ height: var(--pf-c-tooltip__arrow--Height);
22464
+ pointer-events: none;
22465
+ background-color: var(--pf-c-tooltip__content--BackgroundColor);
22466
+ }
22664
22467
 
22665
- .pf-c-toolbar .pf-m-spacer-lg-on-sm {
22666
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22667
- }
22468
+ :where(.pf-theme-dark) .pf-c-tooltip {
22469
+ --pf-c-tooltip--BoxShadow: none;
22470
+ --pf-c-tooltip__content--BackgroundColor: var(--pf-global--BackgroundColor--300);
22471
+ }
22668
22472
 
22669
- .pf-c-toolbar .pf-m-spacer-lg-on-sm:last-child {
22670
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22671
- }
22473
+ :where(.pf-theme-dark) .pf-c-tooltip,
22474
+ :where(.pf-theme-dark) .pf-c-tooltip__arrow {
22475
+ border: var(--pf-global--BorderWidth--lg) solid var(--pf-global--BorderColor--300);
22672
22476
  }
22673
- @media (min-width: 768px) {
22674
- .pf-c-toolbar .pf-m-spacer-none-on-md {
22675
- --pf-c-toolbar--spacer: 0;
22676
- }
22677
22477
 
22678
- .pf-c-toolbar .pf-m-spacer-none-on-md:last-child {
22679
- --pf-c-toolbar--spacer: 0;
22680
- }
22478
+ :where(.pf-theme-dark) .pf-c-tooltip__arrow {
22479
+ --pf-c-tooltip__arrow--Width: 0.9375rem;
22480
+ --pf-c-tooltip__arrow--Height: 0.9375rem;
22481
+ }
22681
22482
 
22682
- .pf-c-toolbar .pf-m-spacer-sm-on-md {
22683
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22684
- }
22483
+ .pf-c-number-input .pf-c-form-control {
22484
+ appearance: textfield;
22485
+ }
22685
22486
 
22686
- .pf-c-toolbar .pf-m-spacer-sm-on-md:last-child {
22687
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22688
- }
22487
+ .pf-c-number-input .pf-c-form-control::-webkit-inner-spin-button, .pf-c-number-input .pf-c-form-control::-webkit-outer-spin-button {
22488
+ appearance: none;
22489
+ margin: 0;
22490
+ }
22689
22491
 
22690
- .pf-c-toolbar .pf-m-spacer-md-on-md {
22691
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22692
- }
22492
+ .pf-c-number-input {
22493
+ --pf-c-number-input__unit--c-input-group--MarginLeft: var(--pf-global--spacer--sm);
22494
+ --pf-c-number-input__icon--FontSize: var(--pf-global--FontSize--xs);
22495
+ --pf-c-number-input--c-form-control--width-base: calc(var(--pf-global--spacer--sm) * 2 + var(--pf-global--BorderWidth--sm) * 2);
22496
+ --pf-c-number-input--c-form-control--width-icon: 0px;
22497
+ --pf-c-number-input--m-status--c-form-control--width-icon: var(--pf-global--spacer--xl);
22498
+ --pf-c-number-input--c-form-control--width-chars: 4;
22499
+ --pf-c-number-input--c-form-control--Width:
22500
+ calc(
22501
+ calc(
22502
+ var(--pf-c-number-input--c-form-control--width-base) + var(--pf-c-number-input--c-form-control--width-chars) * 1ch
22503
+ ) + var(--pf-c-number-input--c-form-control--width-icon)
22504
+ );
22505
+ display: inline-flex;
22506
+ align-items: center;
22507
+ }
22693
22508
 
22694
- .pf-c-toolbar .pf-m-spacer-md-on-md:last-child {
22695
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22696
- }
22509
+ .pf-c-number-input.pf-m-status {
22510
+ --pf-c-number-input--c-form-control--width-icon: var(--pf-c-number-input--m-status--c-form-control--width-icon);
22511
+ }
22697
22512
 
22698
- .pf-c-toolbar .pf-m-spacer-lg-on-md {
22699
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22700
- }
22513
+ .pf-c-number-input .pf-c-form-control {
22514
+ display: inline-flex;
22515
+ width: var(--pf-c-number-input--c-form-control--Width);
22516
+ text-align: right;
22517
+ }
22701
22518
 
22702
- .pf-c-toolbar .pf-m-spacer-lg-on-md:last-child {
22703
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22704
- }
22519
+ .pf-c-input-group + .pf-c-number-input__unit,
22520
+ .pf-c-number-input__unit + .pf-c-input-group {
22521
+ margin-left: var(--pf-c-number-input__unit--c-input-group--MarginLeft);
22705
22522
  }
22706
- @media (min-width: 992px) {
22707
- .pf-c-toolbar .pf-m-spacer-none-on-lg {
22708
- --pf-c-toolbar--spacer: 0;
22709
- }
22710
22523
 
22711
- .pf-c-toolbar .pf-m-spacer-none-on-lg:last-child {
22712
- --pf-c-toolbar--spacer: 0;
22713
- }
22524
+ .pf-c-number-input__icon {
22525
+ display: flex;
22526
+ font-size: var(--pf-c-number-input__icon--FontSize);
22527
+ }
22714
22528
 
22715
- .pf-c-toolbar .pf-m-spacer-sm-on-lg {
22716
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22717
- }
22529
+ .pf-c-tree-view {
22530
+ --pf-c-tree-view--PaddingTop: var(--pf-global--spacer--sm);
22531
+ --pf-c-tree-view--PaddingBottom: var(--pf-global--spacer--sm);
22532
+ --pf-c-tree-view__node--indent--base: calc(var(--pf-global--spacer--md) * 2 + var(--pf-c-tree-view__node-toggle-icon--MinWidth));
22533
+ --pf-c-tree-view__node--nested-indent--base: calc(var(--pf-c-tree-view__node--indent--base) - var(--pf-global--spacer--md));
22534
+ --pf-c-tree-view__node--PaddingTop--base: var(--pf-global--spacer--sm);
22535
+ --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view__node--PaddingTop--base);
22536
+ --pf-c-tree-view__node--PaddingRight: var(--pf-global--spacer--sm);
22537
+ --pf-c-tree-view__node--PaddingBottom: var(--pf-global--spacer--sm);
22538
+ --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view__node--indent--base);
22539
+ --pf-c-tree-view__node--Color: var(--pf-global--Color--100);
22540
+ --pf-c-tree-view__node--m-current--Color: var(--pf-global--link--Color);
22541
+ --pf-c-tree-view__node--m-current--FontWeight: var(--pf-global--FontWeight--bold);
22542
+ --pf-c-tree-view__node-container--Display: contents;
22543
+ --pf-c-tree-view__node-content--RowGap: var(--pf-global--spacer--sm);
22544
+ --pf-c-tree-view__node-content--Overflow: visible;
22545
+ --pf-c-tree-view__node--hover--BackgroundColor: var(--pf-global--BackgroundColor--200);
22546
+ --pf-c-tree-view__node--focus--BackgroundColor: var(--pf-global--palette--black-200);
22547
+ --pf-c-tree-view__list-item__list-item__node-toggle--Top: var(--pf-c-tree-view__node--PaddingTop--base);
22548
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
22549
+ --pf-c-tree-view__list-item__list-item__node-toggle--TranslateX: -100%;
22550
+ --pf-c-tree-view__node-toggle--Position: absolute;
22551
+ --pf-c-tree-view__node-toggle--Color--base: var(--pf-global--Color--200);
22552
+ --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--Color--base);
22553
+ --pf-c-tree-view__node-toggle--hover--Color: var(--pf-global--Color--100);
22554
+ --pf-c-tree-view__node-toggle--focus--Color: var(--pf-global--Color--100);
22555
+ --pf-c-tree-view__node-toggle--active--Color: var(--pf-global--Color--100);
22556
+ --pf-c-tree-view__list-item--m-expanded__node-toggle--Color: var(--pf-global--Color--100);
22557
+ --pf-c-tree-view__node-toggle-icon--MinWidth: var(--pf-global--FontSize--md);
22558
+ --pf-c-tree-view__node-toggle-icon--Transition: transform var(--pf-global--TransitionDuration) var(--pf-global--TimingFunction);
22559
+ --pf-c-tree-view__node-toggle-button--PaddingTop: var(--pf-global--spacer--form-element);
22560
+ --pf-c-tree-view__node-toggle-button--PaddingRight: var(--pf-global--spacer--md);
22561
+ --pf-c-tree-view__node-toggle-button--PaddingBottom: var(--pf-global--spacer--form-element);
22562
+ --pf-c-tree-view__node-toggle-button--PaddingLeft: var(--pf-global--spacer--md);
22563
+ --pf-c-tree-view__node-toggle-button--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
22564
+ --pf-c-tree-view__node-toggle-button--MarginBottom: calc(var(--pf-global--spacer--form-element) * -1);
22565
+ --pf-c-tree-view__node-check--MarginRight: var(--pf-global--spacer--sm);
22566
+ --pf-c-tree-view__node-count--MarginLeft: var(--pf-global--spacer--sm);
22567
+ --pf-c-tree-view__node-count--c-badge--m-read--BackgroundColor: var(--pf-global--disabled-color--200);
22568
+ --pf-c-tree-view__search--PaddingTop: var(--pf-global--spacer--sm);
22569
+ --pf-c-tree-view__search--PaddingRight: var(--pf-global--spacer--sm);
22570
+ --pf-c-tree-view__search--PaddingBottom: var(--pf-global--spacer--sm);
22571
+ --pf-c-tree-view__search--PaddingLeft: var(--pf-global--spacer--sm);
22572
+ --pf-c-tree-view__node-icon--PaddingRight: var(--pf-global--spacer--sm);
22573
+ --pf-c-tree-view__node-icon--Color: var(--pf-global--icon--Color--light);
22574
+ --pf-c-tree-view__node-toggle-icon--base--Rotate: 0;
22575
+ --pf-c-tree-view__node-toggle-icon--Rotate: var(--pf-c-tree-view__node-toggle-icon--base--Rotate);
22576
+ --pf-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate: 90deg;
22577
+ --pf-c-tree-view__node-text--max-lines: 1;
22578
+ --pf-c-tree-view__node-title--FontWeight: var(--pf-global--FontWeight--bold);
22579
+ --pf-c-tree-view__action--MarginLeft: var(--pf-global--spacer--md);
22580
+ --pf-c-tree-view__action--focus--BackgroundColor: var(--pf-global--BackgroundColor--200);
22581
+ --pf-c-tree-view__action--Color: var(--pf-global--icon--Color--light);
22582
+ --pf-c-tree-view__action--hover--Color: var(--pf-global--icon--Color--dark);
22583
+ --pf-c-tree-view__action--focus--Color: var(--pf-global--icon--Color--dark);
22584
+ --pf-c-tree-view--m-guides--guide--Left: var(--pf-c-tree-view--m-guides--guide-left--base);
22585
+ --pf-c-tree-view--m-guides--guide-color--base: var(--pf-global--BorderColor--100);
22586
+ --pf-c-tree-view--m-guides--guide-width--base: var(--pf-global--BorderWidth--sm);
22587
+ --pf-c-tree-view--m-guides--guide-left--base: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides__list-node--guide-width--base));
22588
+ --pf-c-tree-view--m-guides--guide-left--base--offset: calc(var(--pf-c-tree-view__list-item__list-item__node-toggle--Left) + var(--pf-c-tree-view__node-toggle-icon--MinWidth) / 2);
22589
+ --pf-c-tree-view--m-guides__list-node--guide-width--base: var(--pf-global--spacer--lg);
22590
+ --pf-c-tree-view--m-guides__list-item--before--Top: 0;
22591
+ --pf-c-tree-view--m-guides__list-item--before--Width: var(--pf-c-tree-view--m-guides--guide-width--base);
22592
+ --pf-c-tree-view--m-guides__list-item--before--Height: 100%;
22593
+ --pf-c-tree-view--m-guides__list-item--before--BackgroundColor: var(--pf-c-tree-view--m-guides--guide-color--base);
22594
+ --pf-c-tree-view--m-guides__list-item--last-child--before--Top: var(--pf-c-tree-view--m-guides__node--before--Top);
22595
+ --pf-c-tree-view--m-guides__list-item--last-child--before--Height: var(--pf-c-tree-view--m-guides__list-item--last-child--before--Top);
22596
+ --pf-c-tree-view--m-guides__list-item--ZIndex: var(--pf-global--ZIndex--xs);
22597
+ --pf-c-tree-view--m-guides__node--before--Width: 1rem;
22598
+ --pf-c-tree-view--m-guides__node--before--Height: var(--pf-c-tree-view--m-guides--guide-width--base);
22599
+ --pf-c-tree-view--m-guides__node--before--Top: 1.125rem;
22600
+ --pf-c-tree-view--m-guides__node--before--BackgroundColor: var(--pf-c-tree-view--m-guides--guide-color--base);
22601
+ --pf-c-tree-view--m-compact--base-border--Left--offset: var(--pf-global--spacer--md);
22602
+ --pf-c-tree-view--m-compact--base-border--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
22603
+ --pf-c-tree-view--m-compact__node--indent--base: var(--pf-c-tree-view__node--indent--base);
22604
+ --pf-c-tree-view--m-compact__node--nested-indent--base: var(--pf-global--spacer--lg);
22605
+ --pf-c-tree-view--m-compact--border--Left: var(--pf-c-tree-view--m-compact--base-border--Left);
22606
+ --pf-c-tree-view--m-compact__node--PaddingTop: 0;
22607
+ --pf-c-tree-view--m-compact__node--PaddingBottom: 0;
22608
+ --pf-c-tree-view--m-compact__node--nested--PaddingTop: var(--pf-global--spacer--sm);
22609
+ --pf-c-tree-view--m-compact__node--nested--PaddingBottom: var(--pf-global--spacer--sm);
22610
+ --pf-c-tree-view--m-compact__list-item__list-item__node-toggle--Top: calc(var(--pf-c-tree-view--m-compact__node-container--PaddingTop));
22611
+ --pf-c-tree-view--m-compact__list-item--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
22612
+ --pf-c-tree-view--m-compact__list-item--BorderBottomColor: var(--pf-global--BorderColor--100);
22613
+ --pf-c-tree-view--m-compact__list-item--before--Top: 0;
22614
+ --pf-c-tree-view--m-compact__list-item--last-child--before--Height: var(--pf-c-tree-view--m-compact__node--before--Top);
22615
+ --pf-c-tree-view--m-compact__list-item--nested--before--Top: calc(var(--pf-c-tree-view__node--PaddingTop--base) * -1);
22616
+ --pf-c-tree-view--m-compact__list-item--nested--last-child--before--Height: calc(var(--pf-c-tree-view--m-compact__node--before--Top) + var(--pf-c-tree-view__node--PaddingTop--base));
22617
+ --pf-c-tree-view--m-compact__node--PaddingLeft: var(--pf-c-tree-view--m-compact__node--indent--base);
22618
+ --pf-c-tree-view--m-compact__node--before--Top: calc(var(--pf-c-tree-view--m-compact__node-container--PaddingTop) + var(--pf-c-tree-view--m-compact__node--nested--PaddingTop) + 0.25rem);
22619
+ --pf-c-tree-view--m-compact__node--level-2--PaddingLeft: var(--pf-c-tree-view--m-compact__node--indent--base);
22620
+ --pf-c-tree-view--m-compact__node-toggle--nested--MarginRight: calc(var(--pf-c-tree-view__node-toggle-button--PaddingLeft) * -.5);
22621
+ --pf-c-tree-view--m-compact__node-toggle--nested--MarginLeft: calc(var(--pf-c-tree-view__node-toggle-button--PaddingLeft) * -1.5);
22622
+ --pf-c-tree-view--m-compact__node-container--Display: flex;
22623
+ --pf-c-tree-view--m-compact__node-container--PaddingBottom--base: var(--pf-global--spacer--lg);
22624
+ --pf-c-tree-view--m-compact__node-container--PaddingTop: var(--pf-global--spacer--lg);
22625
+ --pf-c-tree-view--m-compact__node-container--PaddingRight: var(--pf-global--spacer--lg);
22626
+ --pf-c-tree-view--m-compact__node-container--PaddingBottom: var(--pf-c-tree-view--m-compact__node-container--PaddingBottom--base);
22627
+ --pf-c-tree-view--m-compact__node-container--PaddingLeft: var(--pf-global--spacer--xs);
22628
+ --pf-c-tree-view--m-compact__node-container--nested--PaddingTop: var(--pf-global--spacer--md);
22629
+ --pf-c-tree-view--m-compact__node-container--nested--PaddingRight: var(--pf-global--spacer--lg);
22630
+ --pf-c-tree-view--m-compact__node-container--nested--PaddingBottom: var(--pf-global--spacer--md);
22631
+ --pf-c-tree-view--m-compact__node-container--nested--PaddingLeft: var(--pf-global--spacer--lg);
22632
+ --pf-c-tree-view--m-compact__node-container--nested--BackgroundColor: var(--pf-global--BackgroundColor--200);
22633
+ --pf-c-tree-view--m-compact__list-item--m-expanded__node-container--PaddingBottom: 0;
22634
+ --pf-c-tree-view--m-no-background__node-container--BackgroundColor: transparent;
22635
+ --pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset: var(--pf-global--spacer--sm);
22636
+ --pf-c-tree-view--m-compact--m-no-background--base-border--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
22637
+ --pf-c-tree-view--m-compact--m-no-background__node--indent--base: var(--pf-c-tree-view__node--indent--base);
22638
+ --pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base: var(--pf-global--spacer--2xl);
22639
+ --pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingTop: 0;
22640
+ --pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingBottom: 0;
22641
+ --pf-c-tree-view--m-compact--m-no-background__node--before--Top: calc(var(--pf-c-tree-view--m-compact__node-container--nested--PaddingTop) + var(--pf-c-tree-view--m-compact__node--nested--PaddingTop) + 0.25rem);
22642
+ padding-top: var(--pf-c-tree-view--PaddingTop);
22643
+ padding-bottom: var(--pf-c-tree-view--PaddingBottom);
22644
+ }
22718
22645
 
22719
- .pf-c-toolbar .pf-m-spacer-sm-on-lg:last-child {
22720
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22721
- }
22646
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item {
22647
+ position: relative;
22648
+ }
22722
22649
 
22723
- .pf-c-toolbar .pf-m-spacer-md-on-lg {
22724
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22725
- }
22650
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before,
22651
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before,
22652
+ .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
22653
+ position: absolute;
22654
+ left: var(--pf-c-tree-view--m-guides--guide--Left);
22655
+ content: "";
22656
+ }
22726
22657
 
22727
- .pf-c-toolbar .pf-m-spacer-md-on-lg:last-child {
22728
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22729
- }
22658
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before {
22659
+ top: var(--pf-c-tree-view--m-guides__list-item--before--Top);
22660
+ z-index: var(--pf-c-tree-view--m-guides__list-item--ZIndex);
22661
+ width: var(--pf-c-tree-view--m-guides__list-item--before--Width);
22662
+ height: var(--pf-c-tree-view--m-guides__list-item--before--Height);
22663
+ background-color: var(--pf-c-tree-view--m-guides__list-item--before--BackgroundColor);
22664
+ }
22730
22665
 
22731
- .pf-c-toolbar .pf-m-spacer-lg-on-lg {
22732
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22733
- }
22666
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
22667
+ top: var(--pf-c-tree-view--m-guides__node--before--Top);
22668
+ width: var(--pf-c-tree-view--m-guides__node--before--Width);
22669
+ height: var(--pf-c-tree-view--m-guides__node--before--Height);
22670
+ background-color: var(--pf-c-tree-view--m-guides__node--before--BackgroundColor);
22671
+ }
22734
22672
 
22735
- .pf-c-toolbar .pf-m-spacer-lg-on-lg:last-child {
22736
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22737
- }
22673
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item:last-child::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item:last-child::before {
22674
+ height: var(--pf-c-tree-view--m-guides__list-item--last-child--before--Height);
22738
22675
  }
22739
- @media (min-width: 1200px) {
22740
- .pf-c-toolbar .pf-m-spacer-none-on-xl {
22741
- --pf-c-toolbar--spacer: 0;
22742
- }
22743
22676
 
22744
- .pf-c-toolbar .pf-m-spacer-none-on-xl:last-child {
22745
- --pf-c-toolbar--spacer: 0;
22746
- }
22677
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22678
+ --pf-c-tree-view--m-guides--guide--Left: var(--pf-c-tree-view--m-guides--border--nested--Left);
22679
+ }
22747
22680
 
22748
- .pf-c-toolbar .pf-m-spacer-sm-on-xl {
22749
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22750
- }
22681
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item:last-child, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item:last-child {
22682
+ --pf-c-tree-view--m-compact__list-item--BorderBottomWidth: 0;
22683
+ }
22751
22684
 
22752
- .pf-c-toolbar .pf-m-spacer-sm-on-xl:last-child {
22753
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22754
- }
22685
+ .pf-c-tree-view.pf-m-compact {
22686
+ --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view--m-compact__node--PaddingTop);
22687
+ --pf-c-tree-view__node--PaddingBottom: var(--pf-c-tree-view--m-compact__node--PaddingBottom);
22688
+ --pf-c-tree-view__node-container--Display: var(--pf-c-tree-view--m-compact__node-container--Display);
22689
+ --pf-c-tree-view__node--hover--BackgroundColor: transparent;
22690
+ --pf-c-tree-view__node--focus--BackgroundColor: transparent;
22691
+ --pf-c-tree-view__list-item__list-item__node-toggle--Top: var(--pf-c-tree-view--m-compact__list-item__list-item__node-toggle--Top);
22692
+ }
22755
22693
 
22756
- .pf-c-toolbar .pf-m-spacer-md-on-xl {
22757
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22758
- }
22694
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item {
22695
+ border-bottom: var(--pf-c-tree-view--m-compact__list-item--BorderBottomWidth) solid var(--pf-c-tree-view--m-compact__list-item--BorderBottomColor);
22696
+ }
22759
22697
 
22760
- .pf-c-toolbar .pf-m-spacer-md-on-xl:last-child {
22761
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22762
- }
22698
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item.pf-m-expanded {
22699
+ --pf-c-tree-view--m-compact__node-container--PaddingBottom: var(--pf-c-tree-view--m-compact__list-item--m-expanded__node-container--PaddingBottom);
22700
+ }
22763
22701
 
22764
- .pf-c-toolbar .pf-m-spacer-lg-on-xl {
22765
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22766
- }
22702
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22703
+ --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view--m-compact__node--nested--PaddingTop);
22704
+ --pf-c-tree-view__node--PaddingBottom: var(--pf-c-tree-view--m-compact__node--nested--PaddingBottom);
22705
+ --pf-c-tree-view__node-toggle--Position: static;
22706
+ --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view--m-compact__node--level-2--PaddingLeft);
22707
+ --pf-c-tree-view__list-item__list-item__node-toggle--TranslateX: 0;
22708
+ --pf-c-tree-view--m-compact__list-item--BorderBottomWidth: 0;
22709
+ --pf-c-tree-view--m-compact__node-container--PaddingBottom: var(--pf-c-tree-view--m-compact__node-container--PaddingBottom--base);
22710
+ }
22767
22711
 
22768
- .pf-c-toolbar .pf-m-spacer-lg-on-xl:last-child {
22769
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22770
- }
22712
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before,
22713
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
22714
+ left: var(--pf-c-tree-view--m-compact--border--Left);
22771
22715
  }
22772
- @media (min-width: 1450px) {
22773
- .pf-c-toolbar .pf-m-spacer-none-on-2xl {
22774
- --pf-c-toolbar--spacer: 0;
22775
- }
22776
22716
 
22777
- .pf-c-toolbar .pf-m-spacer-none-on-2xl:last-child {
22778
- --pf-c-toolbar--spacer: 0;
22779
- }
22717
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before {
22718
+ top: var(--pf-c-tree-view--m-compact__list-item--before--Top);
22719
+ }
22780
22720
 
22781
- .pf-c-toolbar .pf-m-spacer-sm-on-2xl {
22782
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22783
- }
22721
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
22722
+ top: var(--pf-c-tree-view--m-compact__node--before--Top);
22723
+ }
22784
22724
 
22785
- .pf-c-toolbar .pf-m-spacer-sm-on-2xl:last-child {
22786
- --pf-c-toolbar--spacer: var(--pf-global--spacer--sm);
22787
- }
22725
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item:last-child::before {
22726
+ height: var(--pf-c-tree-view--m-compact__list-item--last-child--before--Height);
22727
+ }
22788
22728
 
22789
- .pf-c-toolbar .pf-m-spacer-md-on-2xl {
22790
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22791
- }
22729
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22730
+ --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view--m-compact__node--PaddingLeft);
22731
+ --pf-c-tree-view--m-compact--border--Left: var(--pf-c-tree-view--m-compact--border--nested--Left);
22732
+ --pf-c-tree-view--m-compact__list-item--before--Top: var(--pf-c-tree-view--m-compact__list-item--nested--before--Top);
22733
+ --pf-c-tree-view--m-compact__list-item--last-child--before--Height: var(--pf-c-tree-view--m-compact__list-item--nested--last-child--before--Height);
22734
+ }
22792
22735
 
22793
- .pf-c-toolbar .pf-m-spacer-md-on-2xl:last-child {
22794
- --pf-c-toolbar--spacer: var(--pf-global--spacer--md);
22795
- }
22736
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node-container {
22737
+ padding: var(--pf-c-tree-view--m-compact__node-container--nested--PaddingTop) var(--pf-c-tree-view--m-compact__node-container--nested--PaddingRight) var(--pf-c-tree-view--m-compact__node-container--nested--PaddingBottom) var(--pf-c-tree-view--m-compact__node-container--nested--PaddingLeft);
22738
+ background-color: var(--pf-c-tree-view--m-compact__node-container--nested--BackgroundColor);
22739
+ }
22796
22740
 
22797
- .pf-c-toolbar .pf-m-spacer-lg-on-2xl {
22798
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22799
- }
22741
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node-toggle {
22742
+ margin-right: var(--pf-c-tree-view--m-compact__node-toggle--nested--MarginRight);
22743
+ margin-left: var(--pf-c-tree-view--m-compact__node-toggle--nested--MarginLeft);
22744
+ }
22800
22745
 
22801
- .pf-c-toolbar .pf-m-spacer-lg-on-2xl:last-child {
22802
- --pf-c-toolbar--spacer: var(--pf-global--spacer--lg);
22803
- }
22746
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__node-container {
22747
+ padding: var(--pf-c-tree-view--m-compact__node-container--PaddingTop) var(--pf-c-tree-view--m-compact__node-container--PaddingRight) var(--pf-c-tree-view--m-compact__node-container--PaddingBottom) var(--pf-c-tree-view--m-compact__node-container--PaddingLeft);
22804
22748
  }
22805
- .pf-c-toolbar.pf-m-inset-none {
22806
- --pf-c-toolbar--inset: 0;
22807
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22808
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22749
+
22750
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item:not([aria-expanded]) > .pf-c-tree-view__content > .pf-c-tree-view__node,
22751
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item:not([aria-expanded]) > .pf-c-tree-view__content > .pf-c-tree-view__node > .pf-c-tree-view__node-container {
22752
+ cursor: default;
22809
22753
  }
22810
22754
 
22811
- .pf-c-toolbar.pf-m-inset-sm {
22812
- --pf-c-toolbar--inset: var(--pf-global--spacer--sm);
22813
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22814
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22755
+ .pf-c-tree-view.pf-m-compact.pf-m-no-background {
22756
+ --pf-c-tree-view--m-compact__node--before--Top: var(--pf-c-tree-view--m-compact--m-no-background__node--before--Top);
22815
22757
  }
22816
22758
 
22817
- .pf-c-toolbar.pf-m-inset-md {
22818
- --pf-c-toolbar--inset: var(--pf-global--spacer--md);
22819
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22820
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22759
+ .pf-c-tree-view.pf-m-compact.pf-m-no-background .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22760
+ --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingTop);
22761
+ --pf-c-tree-view__node--PaddingBottom: var(--pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingBottom);
22821
22762
  }
22822
22763
 
22823
- .pf-c-toolbar.pf-m-inset-lg {
22824
- --pf-c-toolbar--inset: var(--pf-global--spacer--lg);
22825
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22826
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22764
+ .pf-c-tree-view.pf-m-compact.pf-m-no-background .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22765
+ --pf-c-tree-view--m-compact--border--Left: var(--pf-c-tree-view--m-compact--m-no-background--border--nested--Left);
22766
+ --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft);
22827
22767
  }
22828
22768
 
22829
- .pf-c-toolbar.pf-m-inset-xl {
22830
- --pf-c-toolbar--inset: var(--pf-global--spacer--xl);
22831
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22832
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22769
+ .pf-c-tree-view.pf-m-no-background {
22770
+ --pf-c-tree-view--m-compact__node-container--nested--BackgroundColor: var(--pf-c-tree-view--m-no-background__node-container--BackgroundColor);
22833
22771
  }
22834
22772
 
22835
- .pf-c-toolbar.pf-m-inset-2xl {
22836
- --pf-c-toolbar--inset: var(--pf-global--spacer--2xl);
22837
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22838
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22773
+ .pf-c-tree-view__node-toggle-icon {
22774
+ display: inline-block;
22775
+ min-width: var(--pf-c-tree-view__node-toggle-icon--MinWidth);
22776
+ text-align: center;
22777
+ transition: var(--pf-c-tree-view__node-toggle-icon--Transition);
22778
+ transform: rotate(var(--pf-c-tree-view__node-toggle-icon--Rotate));
22839
22779
  }
22840
22780
 
22841
- @media (min-width: 576px) {
22842
- .pf-c-toolbar.pf-m-inset-none-on-sm {
22843
- --pf-c-toolbar--inset: 0;
22844
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22845
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22846
- }
22781
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22782
+ --pf-c-tree-view__node-toggle-icon--Rotate: var(--pf-c-tree-view__node-toggle-icon--base--Rotate);
22783
+ --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--Color--base);
22784
+ }
22847
22785
 
22848
- .pf-c-toolbar.pf-m-inset-sm-on-sm {
22849
- --pf-c-toolbar--inset: var(--pf-global--spacer--sm);
22850
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22851
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22852
- }
22786
+ .pf-c-tree-view__list-item.pf-m-expanded {
22787
+ --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__list-item--m-expanded__node-toggle--Color);
22788
+ --pf-c-tree-view__node-toggle-icon--Rotate: var(--pf-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate);
22789
+ }
22853
22790
 
22854
- .pf-c-toolbar.pf-m-inset-md-on-sm {
22855
- --pf-c-toolbar--inset: var(--pf-global--spacer--md);
22856
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22857
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22858
- }
22791
+ .pf-c-tree-view__node,
22792
+ .pf-c-tree-view__node-container {
22793
+ flex: 1 1;
22794
+ align-items: flex-start;
22795
+ min-width: 0;
22796
+ text-align: left;
22797
+ cursor: pointer;
22798
+ border: 0;
22799
+ }
22859
22800
 
22860
- .pf-c-toolbar.pf-m-inset-lg-on-sm {
22861
- --pf-c-toolbar--inset: var(--pf-global--spacer--lg);
22862
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22863
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22864
- }
22801
+ .pf-c-tree-view__node {
22802
+ position: relative;
22803
+ display: flex;
22804
+ padding: var(--pf-c-tree-view__node--PaddingTop) var(--pf-c-tree-view__node--PaddingRight) var(--pf-c-tree-view__node--PaddingBottom) var(--pf-c-tree-view__node--PaddingLeft);
22805
+ color: var(--pf-c-tree-view__node--Color);
22806
+ }
22865
22807
 
22866
- .pf-c-toolbar.pf-m-inset-xl-on-sm {
22867
- --pf-c-toolbar--inset: var(--pf-global--spacer--xl);
22868
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22869
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22870
- }
22808
+ .pf-c-tree-view__node.pf-m-current {
22809
+ --pf-c-tree-view__node--Color: var(--pf-c-tree-view__node--m-current--Color);
22810
+ font-weight: var(--pf-c-tree-view__node--m-current--FontWeight);
22811
+ }
22871
22812
 
22872
- .pf-c-toolbar.pf-m-inset-2xl-on-sm {
22873
- --pf-c-toolbar--inset: var(--pf-global--spacer--2xl);
22874
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22875
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22876
- }
22813
+ .pf-c-tree-view__node:focus {
22814
+ background-color: var(--pf-c-tree-view__node--focus--BackgroundColor);
22815
+ }
22816
+
22817
+ .pf-c-tree-view__node .pf-c-tree-view__node-count {
22818
+ margin-left: var(--pf-c-tree-view__node-count--MarginLeft);
22819
+ }
22820
+
22821
+ .pf-c-tree-view__node .pf-c-tree-view__node-count .pf-c-badge.pf-m-read {
22822
+ --pf-c-badge--m-read--BackgroundColor: var(--pf-c-tree-view__node-count--c-badge--m-read--BackgroundColor);
22823
+ }
22824
+
22825
+ .pf-c-tree-view__node:not(.pf-m-selectable):hover, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:hover {
22826
+ --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--hover--Color);
22827
+ }
22828
+
22829
+ .pf-c-tree-view__node:not(.pf-m-selectable):focus, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:focus {
22830
+ --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--focus--Color);
22831
+ }
22832
+
22833
+ .pf-c-tree-view__node:not(.pf-m-selectable):active, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:active {
22834
+ --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--active--Color);
22835
+ }
22836
+
22837
+ .pf-c-tree-view__node-container {
22838
+ display: var(--pf-c-tree-view__node-container--Display);
22839
+ flex-grow: 1;
22840
+ }
22841
+
22842
+ .pf-c-tree-view__node-content {
22843
+ display: flex;
22844
+ flex-direction: column;
22845
+ overflow: var(--pf-c-tree-view__node-content--Overflow);
22846
+ }
22847
+
22848
+ .pf-c-tree-view__node-content > * + * {
22849
+ margin-top: var(--pf-c-tree-view__node-content--RowGap);
22850
+ }
22851
+
22852
+ .pf-c-tree-view__node-check {
22853
+ margin-right: var(--pf-c-tree-view__node-check--MarginRight);
22854
+ }
22855
+
22856
+ .pf-c-tree-view__node-toggle {
22857
+ position: var(--pf-c-tree-view__node-toggle--Position);
22858
+ top: var(--pf-c-tree-view__list-item__list-item__node-toggle--Top);
22859
+ left: var(--pf-c-tree-view__list-item__list-item__node-toggle--Left);
22860
+ display: inline-flex;
22861
+ align-items: center;
22862
+ justify-content: center;
22863
+ padding: var(--pf-c-tree-view__node-toggle-button--PaddingTop) var(--pf-c-tree-view__node-toggle-button--PaddingRight) var(--pf-c-tree-view__node-toggle-button--PaddingBottom) var(--pf-c-tree-view__node-toggle-button--PaddingLeft);
22864
+ margin-top: var(--pf-c-tree-view__node-toggle-button--MarginTop);
22865
+ margin-bottom: var(--pf-c-tree-view__node-toggle-button--MarginBottom);
22866
+ color: var(--pf-c-tree-view__node-toggle--Color);
22867
+ border: 0;
22868
+ transform: translateX(var(--pf-c-tree-view__list-item__list-item__node-toggle--TranslateX));
22869
+ }
22870
+
22871
+ .pf-c-tree-view__node-title.pf-m-truncate,
22872
+ .pf-c-tree-view__node-text.pf-m-truncate {
22873
+ --pf-c-tree-view__node-content--Overflow: hidden;
22874
+ overflow: hidden;
22875
+ text-overflow: ellipsis;
22876
+ white-space: nowrap;
22877
22877
  }
22878
- @media (min-width: 768px) {
22879
- .pf-c-toolbar.pf-m-inset-none-on-md {
22880
- --pf-c-toolbar--inset: 0;
22881
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22882
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22883
- }
22884
22878
 
22885
- .pf-c-toolbar.pf-m-inset-sm-on-md {
22886
- --pf-c-toolbar--inset: var(--pf-global--spacer--sm);
22887
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22888
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22889
- }
22879
+ .pf-c-tree-view.pf-m-truncate .pf-c-tree-view__node-title,
22880
+ .pf-c-tree-view.pf-m-truncate .pf-c-tree-view__node-text {
22881
+ --pf-c-tree-view__node-content--Overflow: hidden;
22882
+ overflow: hidden;
22883
+ text-overflow: ellipsis;
22884
+ white-space: nowrap;
22885
+ }
22890
22886
 
22891
- .pf-c-toolbar.pf-m-inset-md-on-md {
22892
- --pf-c-toolbar--inset: var(--pf-global--spacer--md);
22893
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22894
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22895
- }
22887
+ label.pf-c-tree-view__node-text {
22888
+ cursor: pointer;
22889
+ }
22896
22890
 
22897
- .pf-c-toolbar.pf-m-inset-lg-on-md {
22898
- --pf-c-toolbar--inset: var(--pf-global--spacer--lg);
22899
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22900
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22901
- }
22891
+ .pf-c-tree-view__node-title {
22892
+ font-weight: var(--pf-c-tree-view__node-title--FontWeight);
22893
+ }
22902
22894
 
22903
- .pf-c-toolbar.pf-m-inset-xl-on-md {
22904
- --pf-c-toolbar--inset: var(--pf-global--spacer--xl);
22905
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22906
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22907
- }
22895
+ .pf-c-tree-view__search {
22896
+ padding: var(--pf-c-tree-view__search--PaddingTop) var(--pf-c-tree-view__search--PaddingRight) var(--pf-c-tree-view__search--PaddingBottom) var(--pf-c-tree-view__search--PaddingLeft);
22897
+ }
22908
22898
 
22909
- .pf-c-toolbar.pf-m-inset-2xl-on-md {
22910
- --pf-c-toolbar--inset: var(--pf-global--spacer--2xl);
22911
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22912
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22913
- }
22899
+ .pf-c-tree-view__node-icon {
22900
+ padding-right: var(--pf-c-tree-view__node-icon--PaddingRight);
22901
+ color: var(--pf-c-tree-view__node-icon--Color);
22914
22902
  }
22915
- @media (min-width: 992px) {
22916
- .pf-c-toolbar.pf-m-inset-none-on-lg {
22917
- --pf-c-toolbar--inset: 0;
22918
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22919
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22920
- }
22921
22903
 
22922
- .pf-c-toolbar.pf-m-inset-sm-on-lg {
22923
- --pf-c-toolbar--inset: var(--pf-global--spacer--sm);
22924
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22925
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22926
- }
22904
+ .pf-c-tree-view__content {
22905
+ display: flex;
22906
+ align-items: center;
22907
+ }
22927
22908
 
22928
- .pf-c-toolbar.pf-m-inset-md-on-lg {
22929
- --pf-c-toolbar--inset: var(--pf-global--spacer--md);
22930
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22931
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22932
- }
22909
+ .pf-c-tree-view__content:hover,
22910
+ .pf-c-tree-view__content:focus-within {
22911
+ background-color: var(--pf-c-tree-view__node--hover--BackgroundColor);
22912
+ }
22933
22913
 
22934
- .pf-c-toolbar.pf-m-inset-lg-on-lg {
22935
- --pf-c-toolbar--inset: var(--pf-global--spacer--lg);
22936
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22937
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22938
- }
22914
+ .pf-c-tree-view__action {
22915
+ margin-left: var(--pf-c-tree-view__action--MarginLeft);
22916
+ color: var(--pf-c-tree-view__action--Color);
22917
+ border: 0;
22918
+ }
22939
22919
 
22940
- .pf-c-toolbar.pf-m-inset-xl-on-lg {
22941
- --pf-c-toolbar--inset: var(--pf-global--spacer--xl);
22942
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22943
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22944
- }
22920
+ .pf-c-tree-view__action:hover {
22921
+ --pf-c-tree-view__action--Color: var(--pf-c-tree-view__action--hover--Color);
22922
+ }
22945
22923
 
22946
- .pf-c-toolbar.pf-m-inset-2xl-on-lg {
22947
- --pf-c-toolbar--inset: var(--pf-global--spacer--2xl);
22948
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22949
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22950
- }
22924
+ .pf-c-tree-view__action:focus {
22925
+ --pf-c-tree-view__action--Color: var(--pf-c-tree-view__action--focus--Color);
22926
+ background-color: var(--pf-c-tree-view__action--focus--BackgroundColor);
22951
22927
  }
22952
- @media (min-width: 1200px) {
22953
- .pf-c-toolbar.pf-m-inset-none-on-xl {
22954
- --pf-c-toolbar--inset: 0;
22955
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22956
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22957
- }
22958
22928
 
22959
- .pf-c-toolbar.pf-m-inset-sm-on-xl {
22960
- --pf-c-toolbar--inset: var(--pf-global--spacer--sm);
22961
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22962
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22963
- }
22929
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22930
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
22931
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 1 + var(--pf-c-tree-view__node--indent--base));
22932
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
22933
+ }
22964
22934
 
22965
- .pf-c-toolbar.pf-m-inset-md-on-xl {
22966
- --pf-c-toolbar--inset: var(--pf-global--spacer--md);
22967
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22968
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22969
- }
22935
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22936
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
22937
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 2 + var(--pf-c-tree-view__node--indent--base));
22938
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
22939
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 1 + var(--pf-c-tree-view--m-compact__node--indent--base));
22940
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
22941
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 1 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
22942
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
22943
+ }
22970
22944
 
22971
- .pf-c-toolbar.pf-m-inset-lg-on-xl {
22972
- --pf-c-toolbar--inset: var(--pf-global--spacer--lg);
22973
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22974
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22975
- }
22945
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22946
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
22947
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 3 + var(--pf-c-tree-view__node--indent--base));
22948
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
22949
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 2 + var(--pf-c-tree-view--m-compact__node--indent--base));
22950
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
22951
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 2 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
22952
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
22953
+ }
22976
22954
 
22977
- .pf-c-toolbar.pf-m-inset-xl-on-xl {
22978
- --pf-c-toolbar--inset: var(--pf-global--spacer--xl);
22979
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22980
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22981
- }
22955
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22956
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
22957
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 4 + var(--pf-c-tree-view__node--indent--base));
22958
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
22959
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 3 + var(--pf-c-tree-view--m-compact__node--indent--base));
22960
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
22961
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 3 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
22962
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
22963
+ }
22982
22964
 
22983
- .pf-c-toolbar.pf-m-inset-2xl-on-xl {
22984
- --pf-c-toolbar--inset: var(--pf-global--spacer--2xl);
22985
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22986
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22987
- }
22965
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22966
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
22967
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 5 + var(--pf-c-tree-view__node--indent--base));
22968
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
22969
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 4 + var(--pf-c-tree-view--m-compact__node--indent--base));
22970
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
22971
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 4 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
22972
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
22988
22973
  }
22989
- @media (min-width: 1450px) {
22990
- .pf-c-toolbar.pf-m-inset-none-on-2xl {
22991
- --pf-c-toolbar--inset: 0;
22992
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22993
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
22994
- }
22995
22974
 
22996
- .pf-c-toolbar.pf-m-inset-sm-on-2xl {
22997
- --pf-c-toolbar--inset: var(--pf-global--spacer--sm);
22998
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
22999
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
23000
- }
22975
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22976
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
22977
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 6 + var(--pf-c-tree-view__node--indent--base));
22978
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
22979
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 5 + var(--pf-c-tree-view--m-compact__node--indent--base));
22980
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
22981
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 5 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
22982
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
22983
+ }
23001
22984
 
23002
- .pf-c-toolbar.pf-m-inset-md-on-2xl {
23003
- --pf-c-toolbar--inset: var(--pf-global--spacer--md);
23004
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
23005
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
23006
- }
22985
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22986
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
22987
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 7 + var(--pf-c-tree-view__node--indent--base));
22988
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
22989
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 6 + var(--pf-c-tree-view--m-compact__node--indent--base));
22990
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
22991
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 6 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
22992
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
22993
+ }
23007
22994
 
23008
- .pf-c-toolbar.pf-m-inset-lg-on-2xl {
23009
- --pf-c-toolbar--inset: var(--pf-global--spacer--lg);
23010
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
23011
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
23012
- }
22995
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22996
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
22997
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 8 + var(--pf-c-tree-view__node--indent--base));
22998
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
22999
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 7 + var(--pf-c-tree-view--m-compact__node--indent--base));
23000
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23001
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 7 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23002
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23003
+ }
23013
23004
 
23014
- .pf-c-toolbar.pf-m-inset-xl-on-2xl {
23015
- --pf-c-toolbar--inset: var(--pf-global--spacer--xl);
23016
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
23017
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
23018
- }
23005
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23006
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23007
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 9 + var(--pf-c-tree-view__node--indent--base));
23008
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23009
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 8 + var(--pf-c-tree-view--m-compact__node--indent--base));
23010
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23011
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 8 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23012
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23013
+ }
23019
23014
 
23020
- .pf-c-toolbar.pf-m-inset-2xl-on-2xl {
23021
- --pf-c-toolbar--inset: var(--pf-global--spacer--2xl);
23022
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-toolbar--inset);
23023
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-toolbar--inset);
23024
- }
23015
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23016
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23017
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 10 + var(--pf-c-tree-view__node--indent--base));
23018
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23019
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 9 + var(--pf-c-tree-view--m-compact__node--indent--base));
23020
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23021
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 9 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23022
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23025
23023
  }
23026
- .pf-c-toolbar__content-section > :last-child {
23027
- --pf-c-toolbar--spacer: 0;
23024
+
23025
+ :where(.pf-theme-dark) .pf-c-tree-view {
23026
+ --pf-c-tree-view__node--hover--BackgroundColor: var(--pf-global--BackgroundColor--300);
23027
+ --pf-c-tree-view__node--focus--BackgroundColor: var(--pf-global--BackgroundColor--300);
23028
23028
  }
23029
23029
 
23030
23030
  .pf-c-wizard__header {