@patternfly/react-templates 6.2.0-prerelease.11 → 6.2.0-prerelease.13

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 (6) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/components/package.json +1 -1
  3. package/dist/dynamic/components/Dropdown/package.json +1 -1
  4. package/dist/dynamic/components/Select/package.json +1 -1
  5. package/dist/umd/assets/{output-CkZE5zuR.css → output-BGXor_qB.css} +730 -730
  6. package/package.json +3 -3
package/dist/umd/assets/{output-CkZE5zuR.css → output-BGXor_qB.css} RENAMED
@@ -3,88 +3,6 @@
3
3
  pointer-events: none;
4
4
  }
5
5
 
6
- .pf-v6-c-check {
7
- --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
8
- --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
9
- --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
10
- --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
11
- --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
12
- --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
13
- --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
14
- --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
15
- --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
16
- --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
17
- --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
18
- --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
19
- --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
20
- --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
21
- }
22
-
23
- .pf-v6-c-check {
24
- display: grid;
25
- grid-template-columns: auto 1fr;
26
- grid-gap: var(--pf-v6-c-check--GridGap);
27
- accent-color: var(--pf-v6-c-check--AccentColor);
28
- }
29
-
30
- .pf-v6-c-check.pf-m-standalone {
31
- display: inline-grid;
32
- grid-template-columns: auto;
33
- min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
34
- }
35
-
36
- .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
37
- align-self: center;
38
- transform: none;
39
- }
40
-
41
- .pf-v6-c-check__input {
42
- align-self: start;
43
- font-size: var(--pf-v6-c-check__label--FontSize);
44
- line-height: var(--pf-v6-c-check__label--LineHeight);
45
- transform: translateY(var(--pf-v6-c-check__input--TranslateY));
46
- }
47
-
48
- .pf-v6-c-check__label {
49
- font-size: var(--pf-v6-c-check__label--FontSize);
50
- font-weight: var(--pf-v6-c-check__label--FontWeight);
51
- line-height: var(--pf-v6-c-check__label--LineHeight);
52
- color: var(--pf-v6-c-check__label--Color);
53
- }
54
-
55
- .pf-v6-c-check__description {
56
- grid-column: 2;
57
- font-size: var(--pf-v6-c-check__description--FontSize);
58
- color: var(--pf-v6-c-check__description--Color);
59
- }
60
-
61
- .pf-v6-c-check__body {
62
- grid-column: 2;
63
- }
64
-
65
- .pf-v6-c-check__label,
66
- .pf-v6-c-check__input {
67
- justify-self: start;
68
- }
69
-
70
- label.pf-v6-c-check, .pf-v6-c-check__label,
71
- .pf-v6-c-check__input {
72
- cursor: pointer;
73
- }
74
-
75
- .pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
76
- .pf-v6-c-check__input:disabled,
77
- .pf-v6-c-check__input.pf-m-disabled {
78
- --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
79
- cursor: not-allowed;
80
- }
81
-
82
- .pf-v6-c-check__label-required {
83
- margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
84
- font-size: var(--pf-v6-c-check__label-required--FontSize);
85
- color: var(--pf-v6-c-check__label-required--Color);
86
- }
87
-
88
6
  .pf-v6-c-menu-toggle {
89
7
  --pf-v6-c-menu-toggle--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
90
8
  --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
@@ -557,6 +475,88 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
557
475
  color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
558
476
  }
559
477
 
478
+ .pf-v6-c-check {
479
+ --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
480
+ --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
481
+ --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
482
+ --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
483
+ --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
484
+ --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
485
+ --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
486
+ --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
487
+ --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
488
+ --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
489
+ --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
490
+ --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
491
+ --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
492
+ --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
493
+ }
494
+
495
+ .pf-v6-c-check {
496
+ display: grid;
497
+ grid-template-columns: auto 1fr;
498
+ grid-gap: var(--pf-v6-c-check--GridGap);
499
+ accent-color: var(--pf-v6-c-check--AccentColor);
500
+ }
501
+
502
+ .pf-v6-c-check.pf-m-standalone {
503
+ display: inline-grid;
504
+ grid-template-columns: auto;
505
+ min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
506
+ }
507
+
508
+ .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
509
+ align-self: center;
510
+ transform: none;
511
+ }
512
+
513
+ .pf-v6-c-check__input {
514
+ align-self: start;
515
+ font-size: var(--pf-v6-c-check__label--FontSize);
516
+ line-height: var(--pf-v6-c-check__label--LineHeight);
517
+ transform: translateY(var(--pf-v6-c-check__input--TranslateY));
518
+ }
519
+
520
+ .pf-v6-c-check__label {
521
+ font-size: var(--pf-v6-c-check__label--FontSize);
522
+ font-weight: var(--pf-v6-c-check__label--FontWeight);
523
+ line-height: var(--pf-v6-c-check__label--LineHeight);
524
+ color: var(--pf-v6-c-check__label--Color);
525
+ }
526
+
527
+ .pf-v6-c-check__description {
528
+ grid-column: 2;
529
+ font-size: var(--pf-v6-c-check__description--FontSize);
530
+ color: var(--pf-v6-c-check__description--Color);
531
+ }
532
+
533
+ .pf-v6-c-check__body {
534
+ grid-column: 2;
535
+ }
536
+
537
+ .pf-v6-c-check__label,
538
+ .pf-v6-c-check__input {
539
+ justify-self: start;
540
+ }
541
+
542
+ label.pf-v6-c-check, .pf-v6-c-check__label,
543
+ .pf-v6-c-check__input {
544
+ cursor: pointer;
545
+ }
546
+
547
+ .pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
548
+ .pf-v6-c-check__input:disabled,
549
+ .pf-v6-c-check__input.pf-m-disabled {
550
+ --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
551
+ cursor: not-allowed;
552
+ }
553
+
554
+ .pf-v6-c-check__label-required {
555
+ margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
556
+ font-size: var(--pf-v6-c-check__label-required--FontSize);
557
+ color: var(--pf-v6-c-check__label-required--Color);
558
+ }
559
+
560
560
  .pf-v6-c-badge {
561
561
  --pf-v6-c-badge--BorderColor: transparent;
562
562
  --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
@@ -1278,62 +1278,218 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
1278
1278
  align-items: center;
1279
1279
  }
1280
1280
 
1281
- .pf-v6-c-text-input-group {
1282
- --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
1283
- --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
1284
- --pf-v6-c-text-input-group--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
1285
- --pf-v6-c-text-input-group--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
1286
- --pf-v6-c-text-input-group--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--default);
1287
- --pf-v6-c-text-input-group--BorderWidth: var(--pf-t--global--border--width--control--default);
1288
- --pf-v6-c-text-input-group__LineHeight: var(--pf-t--global--font--line-height--body);
1289
- --pf-v6-c-text-input-group__FontSize: var(--pf-t--global--font--size--body--default);
1290
- --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-t--global--border--color--hover);
1291
- --pf-v6-c-text-input-group--m-hover--m-success--BorderColor: var(--pf-t--global--border--color--status--success--hover);
1292
- --pf-v6-c-text-input-group--m-hover--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
1293
- --pf-v6-c-text-input-group--m-hover--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
1294
- --pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
1295
- --pf-v6-c-text-input-group__main--m-icon__text-input--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
1296
- --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
1297
- --pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--sm) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
1298
- --pf-v6-c-text-input-group__main--RowGap: var(--pf-t--global--spacer--xs);
1299
- --pf-v6-c-text-input-group__main--ColumnGap: var(--pf-t--global--spacer--xs);
1300
- --pf-v6-c-text-input-group__text--BorderRadius--base: var(--pf-t--global--border--radius--small);
1301
- --pf-v6-c-text-input-group__text--BorderStartStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
1302
- --pf-v6-c-text-input-group__text--BorderStartEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
1303
- --pf-v6-c-text-input-group__text--BorderEndEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
1304
- --pf-v6-c-text-input-group__text--BorderEndStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
1305
- --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
1306
- --pf-v6-c-text-input-group--c-label-group__main--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
1307
- --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
1308
- --pf-v6-c-text-input-group__text-input--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
1309
- --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
1310
- --pf-v6-c-text-input-group__text-input--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
1311
- --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
1312
- --pf-v6-c-text-input-group__text-input--MinWidth: 12ch;
1313
- --pf-v6-c-text-input-group__text-input--m-hint--Color: var(--pf-t--global--text--color--placeholder);
1314
- --pf-v6-c-text-input-group__text-input--placeholder--Color: var(--pf-t--global--text--color--placeholder);
1315
- --pf-v6-c-text-input-group__text-input--BackgroundColor: transparent;
1316
- --pf-v6-c-text-input-group__text-input--OutlineOffset: -6px;
1317
- --pf-v6-c-text-input-group__icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
1318
- --pf-v6-c-text-input-group__icon--InsetInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
1319
- --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
1320
- --pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--sm);
1321
- --pf-v6-c-text-input-group__icon--Color: var(--pf-t--global--icon--color--regular);
1322
- --pf-v6-c-text-input-group--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
1323
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
1324
- --pf-v6-c-text-input-group--m-disabled__icon--m-status--Color: var(--pf-t--global--icon--color--on-disabled);
1325
- --pf-v6-c-text-input-group__main--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
1326
- --pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
1327
- --pf-v6-c-text-input-group__main--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
1328
- --pf-v6-c-text-input-group__icon--TranslateY: -50%;
1329
- --pf-v6-c-text-input-group__utilities--child--MarginInlineStart: var(--pf-t--global--spacer--xs);
1330
- --pf-v6-c-text-input-group--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
1331
- --pf-v6-c-text-input-group--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1281
+ .pf-v6-c-label-group {
1282
+ --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
1283
+ --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
1284
+ --pf-v6-c-label-group--MaxWidth: 100%;
1285
+ --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
1286
+ --pf-v6-c-label-group--m-vertical--ColumnGap: var(--pf-t--global--spacer--sm);
1287
+ --pf-v6-c-label-group__main--RowGap: var(--pf-t--global--spacer--xs);
1288
+ --pf-v6-c-label-group__main--ColumnGap: var(--pf-t--global--spacer--sm);
1289
+ --pf-v6-c-label-group__main--MaxWidth: 100%;
1290
+ --pf-v6-c-label-group__main--MinWidth: 0;
1291
+ --pf-v6-c-label-group--m-vertical__main--RowGap: var(--pf-t--global--spacer--sm);
1292
+ --pf-v6-c-label-group--m-vertical__main--ColumnGap: var(--pf-t--global--spacer--xs);
1293
+ --pf-v6-c-label-group__list--RowGap: var(--pf-t--global--spacer--xs);
1294
+ --pf-v6-c-label-group__list--ColumnGap: var(--pf-t--global--spacer--xs);
1295
+ --pf-v6-c-label-group__list--MaxWidth: 100%;
1296
+ --pf-v6-c-label-group__list--MinWidth: 0;
1297
+ --pf-v6-c-label-group--m-vertical__list--RowGap: var(--pf-t--global--spacer--xs);
1298
+ --pf-v6-c-label-group--m-vertical__list--ColumnGap: var(--pf-t--global--spacer--xs);
1299
+ --pf-v6-c-label-group__list-item--MaxWidth: 100%;
1300
+ --pf-v6-c-label-group--m-category--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1301
+ --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1302
+ --pf-v6-c-label-group--m-category--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1303
+ --pf-v6-c-label-group--m-category--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1304
+ --pf-v6-c-label-group--m-category--BorderRadius: var(--pf-t--global--border--radius--small);
1305
+ --pf-v6-c-label-group--m-category--BorderWidth: var(--pf-t--global--border--width--regular);
1306
+ --pf-v6-c-label-group--m-category--BorderColor: var(--pf-t--global--border--color--default);
1307
+ --pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1308
+ --pf-v6-c-label-group__label--MaxWidth: 18ch;
1309
+ --pf-v6-c-label-group__close--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
1310
+ --pf-v6-c-label-group__close--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1311
+ --pf-v6-c-label-group__close--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1312
+ --pf-v6-c-label-group__close--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1313
+ --pf-v6-c-label-group__close--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1314
+ --pf-v6-c-label-group__textarea--MinWidth: 12.5rem;
1315
+ --pf-v6-c-label-group__textarea--PaddingBlockStart: 0.125rem;
1316
+ --pf-v6-c-label-group__textarea--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
1317
+ --pf-v6-c-label-group__textarea--PaddingBlockEnd: 0;
1318
+ --pf-v6-c-label-group__textarea--PaddingInlineStart: var(--pf-t--global--spacer--xs);
1332
1319
  }
1333
1320
 
1334
- .pf-v6-c-text-input-group {
1335
- position: relative;
1336
- display: flex;
1321
+ .pf-v6-c-label-group {
1322
+ display: inline-flex;
1323
+ row-gap: var(--pf-v6-c-label-group--RowGap);
1324
+ column-gap: var(--pf-v6-c-label-group--ColumnGap);
1325
+ align-items: center;
1326
+ max-width: var(--pf-v6-c-label-group--MaxWidth);
1327
+ }
1328
+
1329
+ .pf-v6-c-label-group.pf-m-category {
1330
+ padding-block-start: var(--pf-v6-c-label-group--m-category--PaddingBlockStart);
1331
+ padding-block-end: var(--pf-v6-c-label-group--m-category--PaddingBlockEnd);
1332
+ padding-inline-start: var(--pf-v6-c-label-group--m-category--PaddingInlineStart);
1333
+ padding-inline-end: var(--pf-v6-c-label-group--m-category--PaddingInlineEnd);
1334
+ background-color: var(--pf-v6-c-label-group--m-category--BackgroundColor);
1335
+ border: var(--pf-v6-c-label-group--m-category--BorderWidth) solid var(--pf-v6-c-label-group--m-category--BorderColor);
1336
+ border-radius: var(--pf-v6-c-label-group--m-category--BorderRadius);
1337
+ }
1338
+
1339
+ .pf-v6-c-label-group.pf-m-vertical {
1340
+ --pf-v6-c-label-group--RowGap: var(--pf-v6-c-label-group--m-vertical--RowGap);
1341
+ --pf-v6-c-label-group--ColumnGap: var(--pf-v6-c-label-group--m-vertical--ColumnGap);
1342
+ --pf-v6-c-label-group__main--RowGap: var(--pf-v6-c-label-group--m-vertical__main--RowGap);
1343
+ --pf-v6-c-label-group__main--ColumnGap: var(--pf-v6-c-label-group--m-vertical__main--ColumnGap);
1344
+ --pf-v6-c-label-group__list--RowGap: var(--pf-v6-c-label-group--m-vertical__list--RowGap);
1345
+ --pf-v6-c-label-group__list--ColumnGap: var(--pf-v6-c-label-group--m-vertical__list--ColumnGap);
1346
+ --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd);
1347
+ }
1348
+
1349
+ .pf-v6-c-label-group.pf-m-vertical.pf-v6-c-label-group {
1350
+ align-items: flex-start;
1351
+ }
1352
+
1353
+ .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__list {
1354
+ flex-direction: column;
1355
+ align-items: flex-start;
1356
+ max-width: var(--pf-v6-c-label-group__list--MaxWidth);
1357
+ }
1358
+
1359
+ .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__main {
1360
+ flex-direction: column;
1361
+ min-width: var(--pf-v6-c-label-group__main--MinWidth);
1362
+ }
1363
+
1364
+ .pf-v6-c-label-group.pf-m-editable,
1365
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1366
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list {
1367
+ display: flex;
1368
+ }
1369
+
1370
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1371
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list,
1372
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list-item.pf-m-textarea,
1373
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__textarea {
1374
+ flex: 1;
1375
+ }
1376
+
1377
+ .pf-v6-c-label-group__main {
1378
+ display: flex;
1379
+ flex: 1;
1380
+ flex-wrap: wrap;
1381
+ row-gap: var(--pf-v6-c-label-group__main--RowGap);
1382
+ column-gap: var(--pf-v6-c-label-group__main--ColumnGap);
1383
+ align-items: baseline;
1384
+ min-width: var(--pf-v6-c-label-group__main--MinWidth);
1385
+ }
1386
+
1387
+ .pf-v6-c-label-group__list {
1388
+ display: inline-flex;
1389
+ flex-wrap: wrap;
1390
+ row-gap: var(--pf-v6-c-label-group__list--RowGap);
1391
+ column-gap: var(--pf-v6-c-label-group__list--ColumnGap);
1392
+ min-width: var(--pf-v6-c-label-group__list--MinWidth);
1393
+ }
1394
+
1395
+ .pf-v6-c-label-group__list-item {
1396
+ display: inline-flex;
1397
+ max-width: var(--pf-v6-c-label-group__list-item--MaxWidth);
1398
+ }
1399
+
1400
+ .pf-v6-c-label-group__label {
1401
+ overflow: hidden;
1402
+ text-overflow: ellipsis;
1403
+ white-space: nowrap;
1404
+ max-width: var(--pf-v6-c-label-group__label--MaxWidth);
1405
+ }
1406
+
1407
+ .pf-v6-c-label-group__close {
1408
+ display: flex;
1409
+ align-self: flex-start;
1410
+ }
1411
+
1412
+ .pf-v6-c-label-group__close .pf-v6-c-button {
1413
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-label-group__close--c-button--FontSize);
1414
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label-group__close--c-button--PaddingBlockStart);
1415
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label-group__close--c-button--PaddingInlineEnd);
1416
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label-group__close--c-button--PaddingBlockEnd);
1417
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label-group__close--c-button--PaddingInlineStart);
1418
+ }
1419
+
1420
+ .pf-v6-c-label-group__textarea {
1421
+ min-width: var(--pf-v6-c-label-group__textarea--MinWidth);
1422
+ padding-block-start: var(--pf-v6-c-label-group__textarea--PaddingBlockStart);
1423
+ padding-block-end: var(--pf-v6-c-label-group__textarea--PaddingBlockEnd);
1424
+ padding-inline-start: var(--pf-v6-c-label-group__textarea--PaddingInlineStart);
1425
+ padding-inline-end: var(--pf-v6-c-label-group__textarea--PaddingInlineEnd);
1426
+ white-space: nowrap;
1427
+ resize: none;
1428
+ border: 0;
1429
+ -ms-overflow-style: none;
1430
+ scrollbar-width: none;
1431
+ }
1432
+
1433
+ .pf-v6-c-label-group__textarea::-webkit-scrollbar {
1434
+ display: none;
1435
+ }
1436
+
1437
+ .pf-v6-c-text-input-group {
1438
+ --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
1439
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
1440
+ --pf-v6-c-text-input-group--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
1441
+ --pf-v6-c-text-input-group--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
1442
+ --pf-v6-c-text-input-group--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--default);
1443
+ --pf-v6-c-text-input-group--BorderWidth: var(--pf-t--global--border--width--control--default);
1444
+ --pf-v6-c-text-input-group__LineHeight: var(--pf-t--global--font--line-height--body);
1445
+ --pf-v6-c-text-input-group__FontSize: var(--pf-t--global--font--size--body--default);
1446
+ --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-t--global--border--color--hover);
1447
+ --pf-v6-c-text-input-group--m-hover--m-success--BorderColor: var(--pf-t--global--border--color--status--success--hover);
1448
+ --pf-v6-c-text-input-group--m-hover--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
1449
+ --pf-v6-c-text-input-group--m-hover--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
1450
+ --pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
1451
+ --pf-v6-c-text-input-group__main--m-icon__text-input--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
1452
+ --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
1453
+ --pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--sm) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
1454
+ --pf-v6-c-text-input-group__main--RowGap: var(--pf-t--global--spacer--xs);
1455
+ --pf-v6-c-text-input-group__main--ColumnGap: var(--pf-t--global--spacer--xs);
1456
+ --pf-v6-c-text-input-group__text--BorderRadius--base: var(--pf-t--global--border--radius--small);
1457
+ --pf-v6-c-text-input-group__text--BorderStartStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
1458
+ --pf-v6-c-text-input-group__text--BorderStartEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
1459
+ --pf-v6-c-text-input-group__text--BorderEndEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
1460
+ --pf-v6-c-text-input-group__text--BorderEndStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
1461
+ --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
1462
+ --pf-v6-c-text-input-group--c-label-group__main--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
1463
+ --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
1464
+ --pf-v6-c-text-input-group__text-input--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
1465
+ --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
1466
+ --pf-v6-c-text-input-group__text-input--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
1467
+ --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
1468
+ --pf-v6-c-text-input-group__text-input--MinWidth: 12ch;
1469
+ --pf-v6-c-text-input-group__text-input--m-hint--Color: var(--pf-t--global--text--color--placeholder);
1470
+ --pf-v6-c-text-input-group__text-input--placeholder--Color: var(--pf-t--global--text--color--placeholder);
1471
+ --pf-v6-c-text-input-group__text-input--BackgroundColor: transparent;
1472
+ --pf-v6-c-text-input-group__text-input--OutlineOffset: -6px;
1473
+ --pf-v6-c-text-input-group__icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
1474
+ --pf-v6-c-text-input-group__icon--InsetInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
1475
+ --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
1476
+ --pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--sm);
1477
+ --pf-v6-c-text-input-group__icon--Color: var(--pf-t--global--icon--color--regular);
1478
+ --pf-v6-c-text-input-group--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
1479
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
1480
+ --pf-v6-c-text-input-group--m-disabled__icon--m-status--Color: var(--pf-t--global--icon--color--on-disabled);
1481
+ --pf-v6-c-text-input-group__main--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
1482
+ --pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
1483
+ --pf-v6-c-text-input-group__main--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
1484
+ --pf-v6-c-text-input-group__icon--TranslateY: -50%;
1485
+ --pf-v6-c-text-input-group__utilities--child--MarginInlineStart: var(--pf-t--global--spacer--xs);
1486
+ --pf-v6-c-text-input-group--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
1487
+ --pf-v6-c-text-input-group--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1488
+ }
1489
+
1490
+ .pf-v6-c-text-input-group {
1491
+ position: relative;
1492
+ display: flex;
1337
1493
  width: 100%;
1338
1494
  font-size: var(--pf-v6-c-text-input-group__FontSize);
1339
1495
  line-height: var(--pf-v6-c-text-input-group__LineHeight);
@@ -1497,162 +1653,322 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
1497
1653
  display: flex;
1498
1654
  }
1499
1655
 
1500
- .pf-v6-c-label-group {
1501
- --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
1502
- --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
1503
- --pf-v6-c-label-group--MaxWidth: 100%;
1504
- --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
1505
- --pf-v6-c-label-group--m-vertical--ColumnGap: var(--pf-t--global--spacer--sm);
1506
- --pf-v6-c-label-group__main--RowGap: var(--pf-t--global--spacer--xs);
1507
- --pf-v6-c-label-group__main--ColumnGap: var(--pf-t--global--spacer--sm);
1508
- --pf-v6-c-label-group__main--MaxWidth: 100%;
1509
- --pf-v6-c-label-group__main--MinWidth: 0;
1510
- --pf-v6-c-label-group--m-vertical__main--RowGap: var(--pf-t--global--spacer--sm);
1511
- --pf-v6-c-label-group--m-vertical__main--ColumnGap: var(--pf-t--global--spacer--xs);
1512
- --pf-v6-c-label-group__list--RowGap: var(--pf-t--global--spacer--xs);
1513
- --pf-v6-c-label-group__list--ColumnGap: var(--pf-t--global--spacer--xs);
1514
- --pf-v6-c-label-group__list--MaxWidth: 100%;
1515
- --pf-v6-c-label-group__list--MinWidth: 0;
1516
- --pf-v6-c-label-group--m-vertical__list--RowGap: var(--pf-t--global--spacer--xs);
1517
- --pf-v6-c-label-group--m-vertical__list--ColumnGap: var(--pf-t--global--spacer--xs);
1518
- --pf-v6-c-label-group__list-item--MaxWidth: 100%;
1519
- --pf-v6-c-label-group--m-category--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1520
- --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1521
- --pf-v6-c-label-group--m-category--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1522
- --pf-v6-c-label-group--m-category--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1523
- --pf-v6-c-label-group--m-category--BorderRadius: var(--pf-t--global--border--radius--small);
1524
- --pf-v6-c-label-group--m-category--BorderWidth: var(--pf-t--global--border--width--regular);
1525
- --pf-v6-c-label-group--m-category--BorderColor: var(--pf-t--global--border--color--default);
1526
- --pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1527
- --pf-v6-c-label-group__label--MaxWidth: 18ch;
1528
- --pf-v6-c-label-group__close--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
1529
- --pf-v6-c-label-group__close--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1530
- --pf-v6-c-label-group__close--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1531
- --pf-v6-c-label-group__close--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1532
- --pf-v6-c-label-group__close--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1533
- --pf-v6-c-label-group__textarea--MinWidth: 12.5rem;
1534
- --pf-v6-c-label-group__textarea--PaddingBlockStart: 0.125rem;
1535
- --pf-v6-c-label-group__textarea--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
1536
- --pf-v6-c-label-group__textarea--PaddingBlockEnd: 0;
1537
- --pf-v6-c-label-group__textarea--PaddingInlineStart: var(--pf-t--global--spacer--xs);
1538
- }
1539
-
1540
- .pf-v6-c-label-group {
1541
- display: inline-flex;
1542
- row-gap: var(--pf-v6-c-label-group--RowGap);
1543
- column-gap: var(--pf-v6-c-label-group--ColumnGap);
1544
- align-items: center;
1545
- max-width: var(--pf-v6-c-label-group--MaxWidth);
1656
+ .pf-v6-c-divider {
1657
+ --pf-v6-c-divider--Display: flex;
1658
+ --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
1659
+ --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
1660
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1546
1661
  }
1547
1662
 
1548
- .pf-v6-c-label-group.pf-m-category {
1549
- padding-block-start: var(--pf-v6-c-label-group--m-category--PaddingBlockStart);
1550
- padding-block-end: var(--pf-v6-c-label-group--m-category--PaddingBlockEnd);
1551
- padding-inline-start: var(--pf-v6-c-label-group--m-category--PaddingInlineStart);
1552
- padding-inline-end: var(--pf-v6-c-label-group--m-category--PaddingInlineEnd);
1553
- background-color: var(--pf-v6-c-label-group--m-category--BackgroundColor);
1554
- border: var(--pf-v6-c-label-group--m-category--BorderWidth) solid var(--pf-v6-c-label-group--m-category--BorderColor);
1555
- border-radius: var(--pf-v6-c-label-group--m-category--BorderRadius);
1663
+ .pf-v6-c-divider {
1664
+ flex-direction: row;
1665
+ width: 100%;
1666
+ height: var(--pf-v6-c-divider--Size);
1667
+ --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
1668
+ --pf-v6-hidden-visible--hidden--Display: none;
1669
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1670
+ display: var(--pf-v6-hidden-visible--Display);
1671
+ flex-shrink: 0;
1672
+ align-items: stretch;
1673
+ align-self: stretch;
1674
+ justify-content: center;
1675
+ border: 0;
1556
1676
  }
1557
1677
 
1558
- .pf-v6-c-label-group.pf-m-vertical {
1559
- --pf-v6-c-label-group--RowGap: var(--pf-v6-c-label-group--m-vertical--RowGap);
1560
- --pf-v6-c-label-group--ColumnGap: var(--pf-v6-c-label-group--m-vertical--ColumnGap);
1561
- --pf-v6-c-label-group__main--RowGap: var(--pf-v6-c-label-group--m-vertical__main--RowGap);
1562
- --pf-v6-c-label-group__main--ColumnGap: var(--pf-v6-c-label-group--m-vertical__main--ColumnGap);
1563
- --pf-v6-c-label-group__list--RowGap: var(--pf-v6-c-label-group--m-vertical__list--RowGap);
1564
- --pf-v6-c-label-group__list--ColumnGap: var(--pf-v6-c-label-group--m-vertical__list--ColumnGap);
1565
- --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd);
1678
+ .pf-v6-c-divider.pf-m-hidden {
1679
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1566
1680
  }
1567
1681
 
1568
- .pf-v6-c-label-group.pf-m-vertical.pf-v6-c-label-group {
1569
- align-items: flex-start;
1682
+ @media screen and (min-width: 36rem) {
1683
+ .pf-v6-c-divider.pf-m-hidden-on-sm {
1684
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1685
+ }
1686
+ .pf-v6-c-divider.pf-m-visible-on-sm {
1687
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1688
+ }
1689
+ }
1690
+ @media screen and (min-width: 48rem) {
1691
+ .pf-v6-c-divider.pf-m-hidden-on-md {
1692
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1693
+ }
1694
+ .pf-v6-c-divider.pf-m-visible-on-md {
1695
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1696
+ }
1697
+ }
1698
+ @media screen and (min-width: 62rem) {
1699
+ .pf-v6-c-divider.pf-m-hidden-on-lg {
1700
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1701
+ }
1702
+ .pf-v6-c-divider.pf-m-visible-on-lg {
1703
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1704
+ }
1705
+ }
1706
+ @media screen and (min-width: 75rem) {
1707
+ .pf-v6-c-divider.pf-m-hidden-on-xl {
1708
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1709
+ }
1710
+ .pf-v6-c-divider.pf-m-visible-on-xl {
1711
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1712
+ }
1713
+ }
1714
+ @media screen and (min-width: 90.625rem) {
1715
+ .pf-v6-c-divider.pf-m-hidden-on-2xl {
1716
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
1717
+ }
1718
+ .pf-v6-c-divider.pf-m-visible-on-2xl {
1719
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
1720
+ }
1721
+ }
1722
+ .pf-v6-c-divider::before {
1723
+ flex-basis: var(--pf-v6-c-divider--before--FlexBasis);
1724
+ content: "";
1725
+ background-color: var(--pf-v6-c-divider--Color);
1570
1726
  }
1571
1727
 
1572
- .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__list {
1573
- flex-direction: column;
1574
- align-items: flex-start;
1575
- max-width: var(--pf-v6-c-label-group__list--MaxWidth);
1728
+ .pf-v6-c-divider.pf-m-horizontal {
1729
+ flex-direction: row;
1730
+ width: 100%;
1731
+ height: var(--pf-v6-c-divider--Size);
1576
1732
  }
1577
1733
 
1578
- .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__main {
1734
+ .pf-v6-c-divider.pf-m-vertical {
1579
1735
  flex-direction: column;
1580
- min-width: var(--pf-v6-c-label-group__main--MinWidth);
1736
+ width: var(--pf-v6-c-divider--Size);
1737
+ height: inherit;
1581
1738
  }
1582
1739
 
1583
- .pf-v6-c-label-group.pf-m-editable,
1584
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1585
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list {
1586
- display: flex;
1740
+ .pf-v6-c-divider.pf-m-inset-none {
1741
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - 0% * 2);
1587
1742
  }
1588
1743
 
1589
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1590
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list,
1591
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list-item.pf-m-textarea,
1592
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__textarea {
1593
- flex: 1;
1744
+ .pf-v6-c-divider.pf-m-inset-xs {
1745
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1594
1746
  }
1595
1747
 
1596
- .pf-v6-c-label-group__main {
1597
- display: flex;
1598
- flex: 1;
1599
- flex-wrap: wrap;
1600
- row-gap: var(--pf-v6-c-label-group__main--RowGap);
1601
- column-gap: var(--pf-v6-c-label-group__main--ColumnGap);
1602
- align-items: baseline;
1603
- min-width: var(--pf-v6-c-label-group__main--MinWidth);
1748
+ .pf-v6-c-divider.pf-m-inset-sm {
1749
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1604
1750
  }
1605
1751
 
1606
- .pf-v6-c-label-group__list {
1607
- display: inline-flex;
1608
- flex-wrap: wrap;
1609
- row-gap: var(--pf-v6-c-label-group__list--RowGap);
1610
- column-gap: var(--pf-v6-c-label-group__list--ColumnGap);
1611
- min-width: var(--pf-v6-c-label-group__list--MinWidth);
1752
+ .pf-v6-c-divider.pf-m-inset-md {
1753
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1612
1754
  }
1613
1755
 
1614
- .pf-v6-c-label-group__list-item {
1615
- display: inline-flex;
1616
- max-width: var(--pf-v6-c-label-group__list-item--MaxWidth);
1756
+ .pf-v6-c-divider.pf-m-inset-lg {
1757
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1617
1758
  }
1618
1759
 
1619
- .pf-v6-c-label-group__label {
1620
- overflow: hidden;
1621
- text-overflow: ellipsis;
1622
- white-space: nowrap;
1623
- max-width: var(--pf-v6-c-label-group__label--MaxWidth);
1760
+ .pf-v6-c-divider.pf-m-inset-xl {
1761
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1624
1762
  }
1625
1763
 
1626
- .pf-v6-c-label-group__close {
1627
- display: flex;
1628
- align-self: flex-start;
1764
+ .pf-v6-c-divider.pf-m-inset-2xl {
1765
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1629
1766
  }
1630
1767
 
1631
- .pf-v6-c-label-group__close .pf-v6-c-button {
1632
- --pf-v6-c-button--FontSize: var(--pf-v6-c-label-group__close--c-button--FontSize);
1633
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label-group__close--c-button--PaddingBlockStart);
1634
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label-group__close--c-button--PaddingInlineEnd);
1635
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label-group__close--c-button--PaddingBlockEnd);
1636
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label-group__close--c-button--PaddingInlineStart);
1768
+ .pf-v6-c-divider.pf-m-inset-3xl {
1769
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1637
1770
  }
1638
1771
 
1639
- .pf-v6-c-label-group__textarea {
1640
- min-width: var(--pf-v6-c-label-group__textarea--MinWidth);
1641
- padding-block-start: var(--pf-v6-c-label-group__textarea--PaddingBlockStart);
1642
- padding-block-end: var(--pf-v6-c-label-group__textarea--PaddingBlockEnd);
1643
- padding-inline-start: var(--pf-v6-c-label-group__textarea--PaddingInlineStart);
1644
- padding-inline-end: var(--pf-v6-c-label-group__textarea--PaddingInlineEnd);
1645
- white-space: nowrap;
1646
- resize: none;
1647
- border: 0;
1648
- -ms-overflow-style: none;
1649
- scrollbar-width: none;
1772
+ @media (min-width: 36rem) {
1773
+ .pf-v6-c-divider.pf-m-horizontal-on-sm {
1774
+ flex-direction: row;
1775
+ width: 100%;
1776
+ height: var(--pf-v6-c-divider--Size);
1777
+ }
1650
1778
  }
1651
-
1652
- .pf-v6-c-label-group__textarea::-webkit-scrollbar {
1653
- display: none;
1779
+ @media (min-width: 36rem) {
1780
+ .pf-v6-c-divider.pf-m-vertical-on-sm {
1781
+ flex-direction: column;
1782
+ width: var(--pf-v6-c-divider--Size);
1783
+ height: inherit;
1784
+ }
1785
+ }
1786
+ @media (min-width: 36rem) {
1787
+ .pf-v6-c-divider.pf-m-inset-none-on-sm {
1788
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1789
+ }
1790
+ .pf-v6-c-divider.pf-m-inset-xs-on-sm {
1791
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1792
+ }
1793
+ .pf-v6-c-divider.pf-m-inset-sm-on-sm {
1794
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1795
+ }
1796
+ .pf-v6-c-divider.pf-m-inset-md-on-sm {
1797
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1798
+ }
1799
+ .pf-v6-c-divider.pf-m-inset-lg-on-sm {
1800
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1801
+ }
1802
+ .pf-v6-c-divider.pf-m-inset-xl-on-sm {
1803
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1804
+ }
1805
+ .pf-v6-c-divider.pf-m-inset-2xl-on-sm {
1806
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1807
+ }
1808
+ .pf-v6-c-divider.pf-m-inset-3xl-on-sm {
1809
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1810
+ }
1811
+ }
1812
+ @media (min-width: 48rem) {
1813
+ .pf-v6-c-divider.pf-m-horizontal-on-md {
1814
+ flex-direction: row;
1815
+ width: 100%;
1816
+ height: var(--pf-v6-c-divider--Size);
1817
+ }
1818
+ }
1819
+ @media (min-width: 48rem) {
1820
+ .pf-v6-c-divider.pf-m-vertical-on-md {
1821
+ flex-direction: column;
1822
+ width: var(--pf-v6-c-divider--Size);
1823
+ height: inherit;
1824
+ }
1825
+ }
1826
+ @media (min-width: 48rem) {
1827
+ .pf-v6-c-divider.pf-m-inset-none-on-md {
1828
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1829
+ }
1830
+ .pf-v6-c-divider.pf-m-inset-xs-on-md {
1831
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1832
+ }
1833
+ .pf-v6-c-divider.pf-m-inset-sm-on-md {
1834
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1835
+ }
1836
+ .pf-v6-c-divider.pf-m-inset-md-on-md {
1837
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1838
+ }
1839
+ .pf-v6-c-divider.pf-m-inset-lg-on-md {
1840
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1841
+ }
1842
+ .pf-v6-c-divider.pf-m-inset-xl-on-md {
1843
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1844
+ }
1845
+ .pf-v6-c-divider.pf-m-inset-2xl-on-md {
1846
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1847
+ }
1848
+ .pf-v6-c-divider.pf-m-inset-3xl-on-md {
1849
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1850
+ }
1851
+ }
1852
+ @media (min-width: 62rem) {
1853
+ .pf-v6-c-divider.pf-m-horizontal-on-lg {
1854
+ flex-direction: row;
1855
+ width: 100%;
1856
+ height: var(--pf-v6-c-divider--Size);
1857
+ }
1858
+ }
1859
+ @media (min-width: 62rem) {
1860
+ .pf-v6-c-divider.pf-m-vertical-on-lg {
1861
+ flex-direction: column;
1862
+ width: var(--pf-v6-c-divider--Size);
1863
+ height: inherit;
1864
+ }
1865
+ }
1866
+ @media (min-width: 62rem) {
1867
+ .pf-v6-c-divider.pf-m-inset-none-on-lg {
1868
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1869
+ }
1870
+ .pf-v6-c-divider.pf-m-inset-xs-on-lg {
1871
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1872
+ }
1873
+ .pf-v6-c-divider.pf-m-inset-sm-on-lg {
1874
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1875
+ }
1876
+ .pf-v6-c-divider.pf-m-inset-md-on-lg {
1877
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1878
+ }
1879
+ .pf-v6-c-divider.pf-m-inset-lg-on-lg {
1880
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1881
+ }
1882
+ .pf-v6-c-divider.pf-m-inset-xl-on-lg {
1883
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1884
+ }
1885
+ .pf-v6-c-divider.pf-m-inset-2xl-on-lg {
1886
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1887
+ }
1888
+ .pf-v6-c-divider.pf-m-inset-3xl-on-lg {
1889
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1890
+ }
1891
+ }
1892
+ @media (min-width: 75rem) {
1893
+ .pf-v6-c-divider.pf-m-horizontal-on-xl {
1894
+ flex-direction: row;
1895
+ width: 100%;
1896
+ height: var(--pf-v6-c-divider--Size);
1897
+ }
1898
+ }
1899
+ @media (min-width: 75rem) {
1900
+ .pf-v6-c-divider.pf-m-vertical-on-xl {
1901
+ flex-direction: column;
1902
+ width: var(--pf-v6-c-divider--Size);
1903
+ height: inherit;
1904
+ }
1905
+ }
1906
+ @media (min-width: 75rem) {
1907
+ .pf-v6-c-divider.pf-m-inset-none-on-xl {
1908
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1909
+ }
1910
+ .pf-v6-c-divider.pf-m-inset-xs-on-xl {
1911
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1912
+ }
1913
+ .pf-v6-c-divider.pf-m-inset-sm-on-xl {
1914
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1915
+ }
1916
+ .pf-v6-c-divider.pf-m-inset-md-on-xl {
1917
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1918
+ }
1919
+ .pf-v6-c-divider.pf-m-inset-lg-on-xl {
1920
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1921
+ }
1922
+ .pf-v6-c-divider.pf-m-inset-xl-on-xl {
1923
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1924
+ }
1925
+ .pf-v6-c-divider.pf-m-inset-2xl-on-xl {
1926
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1927
+ }
1928
+ .pf-v6-c-divider.pf-m-inset-3xl-on-xl {
1929
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1930
+ }
1931
+ }
1932
+ @media (min-width: 90.625rem) {
1933
+ .pf-v6-c-divider.pf-m-horizontal-on-2xl {
1934
+ flex-direction: row;
1935
+ width: 100%;
1936
+ height: var(--pf-v6-c-divider--Size);
1937
+ }
1938
+ }
1939
+ @media (min-width: 90.625rem) {
1940
+ .pf-v6-c-divider.pf-m-vertical-on-2xl {
1941
+ flex-direction: column;
1942
+ width: var(--pf-v6-c-divider--Size);
1943
+ height: inherit;
1944
+ }
1945
+ }
1946
+ @media (min-width: 90.625rem) {
1947
+ .pf-v6-c-divider.pf-m-inset-none-on-2xl {
1948
+ --pf-v6-c-divider--before--FlexBasis: 100%;
1949
+ }
1950
+ .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
1951
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
1952
+ }
1953
+ .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
1954
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
1955
+ }
1956
+ .pf-v6-c-divider.pf-m-inset-md-on-2xl {
1957
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
1958
+ }
1959
+ .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
1960
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
1961
+ }
1962
+ .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
1963
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
1964
+ }
1965
+ .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
1966
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
1967
+ }
1968
+ .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
1969
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1970
+ }
1654
1971
  }
1655
-
1656
1972
  .pf-v6-c-label {
1657
1973
  --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1658
1974
  --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
@@ -2185,320 +2501,200 @@ input.pf-v6-c-label__content {
2185
2501
  outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
2186
2502
  }
2187
2503
 
2188
- .pf-v6-c-divider {
2189
- --pf-v6-c-divider--Display: flex;
2190
- --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
2191
- --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
2192
- --pf-v6-c-divider--before--FlexBasis: 100%;
2193
- }
2194
-
2195
- .pf-v6-c-divider {
2196
- flex-direction: row;
2197
- width: 100%;
2198
- height: var(--pf-v6-c-divider--Size);
2199
- --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
2200
- --pf-v6-hidden-visible--hidden--Display: none;
2201
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2202
- display: var(--pf-v6-hidden-visible--Display);
2203
- flex-shrink: 0;
2204
- align-items: stretch;
2205
- align-self: stretch;
2206
- justify-content: center;
2207
- border: 0;
2208
- }
2209
-
2210
- .pf-v6-c-divider.pf-m-hidden {
2211
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2504
+ .pf-v6-c-breadcrumb {
2505
+ --pf-v6-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
2506
+ --pf-v6-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
2507
+ --pf-v6-c-breadcrumb__item--MarginInlineEnd: var(--pf-t--global--spacer--sm);
2508
+ --pf-v6-c-breadcrumb__item-divider--Color: var(--pf-t--global--icon--color--regular);
2509
+ --pf-v6-c-breadcrumb__item-divider--MarginInlineEnd: var(--pf-t--global--spacer--sm);
2510
+ --pf-v6-c-breadcrumb__item-divider--FontSize: var( --pf-t--global--font--size--body--sm);
2511
+ --pf-v6-c-breadcrumb__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
2512
+ --pf-v6-c-breadcrumb__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
2513
+ --pf-v6-c-breadcrumb__link--Color: var(--pf-t--global--text--color--link--default);
2514
+ --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
2515
+ --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
2516
+ --pf-v6-c-breadcrumb__link--hover--Color: var(--pf-t--global--text--color--link--hover);
2517
+ --pf-v6-c-breadcrumb__link--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
2518
+ --pf-v6-c-breadcrumb__link--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
2519
+ --pf-v6-c-breadcrumb__link--m-current--Color: var(--pf-t--global--text--color--regular);
2520
+ --pf-v6-c-breadcrumb__link--BackgroundColor: transparent;
2521
+ --pf-v6-c-breadcrumb__heading--FontSize: var( --pf-t--global--font--size--body--sm);
2522
+ --pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
2523
+ --pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
2524
+ --pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
2525
+ --pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
2212
2526
  }
2213
2527
 
2214
- @media screen and (min-width: 36rem) {
2215
- .pf-v6-c-divider.pf-m-hidden-on-sm {
2216
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2217
- }
2218
- .pf-v6-c-divider.pf-m-visible-on-sm {
2219
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2220
- }
2221
- }
2222
- @media screen and (min-width: 48rem) {
2223
- .pf-v6-c-divider.pf-m-hidden-on-md {
2224
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2225
- }
2226
- .pf-v6-c-divider.pf-m-visible-on-md {
2227
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2228
- }
2229
- }
2230
- @media screen and (min-width: 62rem) {
2231
- .pf-v6-c-divider.pf-m-hidden-on-lg {
2232
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2233
- }
2234
- .pf-v6-c-divider.pf-m-visible-on-lg {
2235
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2236
- }
2237
- }
2238
- @media screen and (min-width: 75rem) {
2239
- .pf-v6-c-divider.pf-m-hidden-on-xl {
2240
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2241
- }
2242
- .pf-v6-c-divider.pf-m-visible-on-xl {
2243
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2244
- }
2245
- }
2246
- @media screen and (min-width: 90.625rem) {
2247
- .pf-v6-c-divider.pf-m-hidden-on-2xl {
2248
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
2249
- }
2250
- .pf-v6-c-divider.pf-m-visible-on-2xl {
2251
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
2252
- }
2253
- }
2254
- .pf-v6-c-divider::before {
2255
- flex-basis: var(--pf-v6-c-divider--before--FlexBasis);
2256
- content: "";
2257
- background-color: var(--pf-v6-c-divider--Color);
2528
+ .pf-v6-c-breadcrumb {
2529
+ display: inline-flex;
2258
2530
  }
2259
2531
 
2260
- .pf-v6-c-divider.pf-m-horizontal {
2261
- flex-direction: row;
2262
- width: 100%;
2263
- height: var(--pf-v6-c-divider--Size);
2532
+ .pf-v6-c-breadcrumb__list {
2533
+ display: flex;
2534
+ flex-wrap: wrap;
2535
+ align-items: center;
2264
2536
  }
2265
2537
 
2266
- .pf-v6-c-divider.pf-m-vertical {
2267
- flex-direction: column;
2268
- width: var(--pf-v6-c-divider--Size);
2269
- height: inherit;
2538
+ .pf-v6-c-breadcrumb__item {
2539
+ display: flex;
2540
+ align-items: baseline;
2541
+ font-size: var(--pf-v6-c-breadcrumb__item--FontSize);
2542
+ font-weight: var(--pf-v6-c-breadcrumb__item--FontWeight);
2543
+ line-height: var(--pf-v6-c-breadcrumb__item--LineHeight);
2544
+ white-space: nowrap;
2545
+ list-style: none;
2270
2546
  }
2271
2547
 
2272
- .pf-v6-c-divider.pf-m-inset-none {
2273
- --pf-v6-c-divider--before--FlexBasis: calc(100% - 0% * 2);
2548
+ .pf-v6-c-breadcrumb__item:first-child:has(.pf-v6-c-breadcrumb__link) {
2549
+ --pf-v6-c-breadcrumb__link--PaddingInlineStart: 0;
2274
2550
  }
2275
2551
 
2276
- .pf-v6-c-divider.pf-m-inset-xs {
2277
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2552
+ .pf-v6-c-breadcrumb__item:not(:last-child) {
2553
+ margin-inline-end: var(--pf-v6-c-breadcrumb__item--MarginInlineEnd);
2278
2554
  }
2279
2555
 
2280
- .pf-v6-c-divider.pf-m-inset-sm {
2281
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2556
+ .pf-v6-c-breadcrumb__item-divider {
2557
+ margin-inline-end: var(--pf-v6-c-breadcrumb__item-divider--MarginInlineEnd);
2558
+ font-size: var(--pf-v6-c-breadcrumb__item-divider--FontSize);
2559
+ line-height: 1;
2560
+ color: var(--pf-v6-c-breadcrumb__item-divider--Color);
2282
2561
  }
2283
2562
 
2284
- .pf-v6-c-divider.pf-m-inset-md {
2285
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2563
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-breadcrumb__item-divider {
2564
+ scale: -1 1;
2286
2565
  }
2287
2566
 
2288
- .pf-v6-c-divider.pf-m-inset-lg {
2289
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2567
+ .pf-v6-c-breadcrumb__link {
2568
+ padding-inline-start: var(--pf-v6-c-breadcrumb__link--PaddingInlineStart);
2569
+ padding-inline-end: var(--pf-v6-c-breadcrumb__link--PaddingInlineEnd);
2570
+ font-size: inherit;
2571
+ font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
2572
+ line-height: inherit;
2573
+ color: var(--pf-v6-c-breadcrumb__link--Color);
2574
+ text-decoration: var(--pf-v6-c-breadcrumb__link--TextDecorationLine) var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
2575
+ word-break: break-word;
2576
+ background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
2290
2577
  }
2291
2578
 
2292
- .pf-v6-c-divider.pf-m-inset-xl {
2293
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2579
+ .pf-v6-c-breadcrumb__link:is(:hover, :focus) {
2580
+ --pf-v6-c-breadcrumb__link--Color: var(--pf-v6-c-breadcrumb__link--hover--Color);
2581
+ --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationLine);
2582
+ --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationStyle);
2294
2583
  }
2295
2584
 
2296
- .pf-v6-c-divider.pf-m-inset-2xl {
2297
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2585
+ .pf-v6-c-breadcrumb__link.pf-m-current {
2586
+ cursor: default;
2298
2587
  }
2299
2588
 
2300
- .pf-v6-c-divider.pf-m-inset-3xl {
2301
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2589
+ .pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
2590
+ color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
2591
+ text-decoration: none;
2302
2592
  }
2303
2593
 
2304
- @media (min-width: 36rem) {
2305
- .pf-v6-c-divider.pf-m-horizontal-on-sm {
2306
- flex-direction: row;
2307
- width: 100%;
2308
- height: var(--pf-v6-c-divider--Size);
2309
- }
2310
- }
2311
- @media (min-width: 36rem) {
2312
- .pf-v6-c-divider.pf-m-vertical-on-sm {
2313
- flex-direction: column;
2314
- width: var(--pf-v6-c-divider--Size);
2315
- height: inherit;
2316
- }
2317
- }
2318
- @media (min-width: 36rem) {
2319
- .pf-v6-c-divider.pf-m-inset-none-on-sm {
2320
- --pf-v6-c-divider--before--FlexBasis: 100%;
2321
- }
2322
- .pf-v6-c-divider.pf-m-inset-xs-on-sm {
2323
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2324
- }
2325
- .pf-v6-c-divider.pf-m-inset-sm-on-sm {
2326
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2327
- }
2328
- .pf-v6-c-divider.pf-m-inset-md-on-sm {
2329
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2330
- }
2331
- .pf-v6-c-divider.pf-m-inset-lg-on-sm {
2332
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2333
- }
2334
- .pf-v6-c-divider.pf-m-inset-xl-on-sm {
2335
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2336
- }
2337
- .pf-v6-c-divider.pf-m-inset-2xl-on-sm {
2338
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2339
- }
2340
- .pf-v6-c-divider.pf-m-inset-3xl-on-sm {
2341
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2342
- }
2594
+ button.pf-v6-c-breadcrumb__link {
2595
+ border: none;
2343
2596
  }
2344
- @media (min-width: 48rem) {
2345
- .pf-v6-c-divider.pf-m-horizontal-on-md {
2346
- flex-direction: row;
2347
- width: 100%;
2348
- height: var(--pf-v6-c-divider--Size);
2349
- }
2597
+
2598
+ .pf-v6-c-breadcrumb__dropdown {
2599
+ margin-block-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart);
2600
+ margin-block-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd);
2601
+ margin-inline-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart);
2602
+ margin-inline-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd);
2350
2603
  }
2351
- @media (min-width: 48rem) {
2352
- .pf-v6-c-divider.pf-m-vertical-on-md {
2353
- flex-direction: column;
2354
- width: var(--pf-v6-c-divider--Size);
2355
- height: inherit;
2356
- }
2604
+
2605
+ .pf-v6-c-breadcrumb__heading {
2606
+ display: inline;
2607
+ font-size: var(--pf-v6-c-breadcrumb__heading--FontSize);
2357
2608
  }
2358
- @media (min-width: 48rem) {
2359
- .pf-v6-c-divider.pf-m-inset-none-on-md {
2360
- --pf-v6-c-divider--before--FlexBasis: 100%;
2361
- }
2362
- .pf-v6-c-divider.pf-m-inset-xs-on-md {
2363
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2364
- }
2365
- .pf-v6-c-divider.pf-m-inset-sm-on-md {
2366
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2367
- }
2368
- .pf-v6-c-divider.pf-m-inset-md-on-md {
2369
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2370
- }
2371
- .pf-v6-c-divider.pf-m-inset-lg-on-md {
2372
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2373
- }
2374
- .pf-v6-c-divider.pf-m-inset-xl-on-md {
2375
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2376
- }
2377
- .pf-v6-c-divider.pf-m-inset-2xl-on-md {
2378
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2379
- }
2380
- .pf-v6-c-divider.pf-m-inset-3xl-on-md {
2381
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2382
- }
2609
+
2610
+ .pf-v6-c-breadcrumb__link,
2611
+ .pf-v6-c-breadcrumb__heading {
2612
+ white-space: normal;
2383
2613
  }
2384
- @media (min-width: 62rem) {
2385
- .pf-v6-c-divider.pf-m-horizontal-on-lg {
2386
- flex-direction: row;
2387
- width: 100%;
2388
- height: var(--pf-v6-c-divider--Size);
2389
- }
2614
+
2615
+ .pf-v6-c-breadcrumb__list > :first-child .pf-v6-c-breadcrumb__item-divider {
2616
+ display: none;
2390
2617
  }
2391
- @media (min-width: 62rem) {
2392
- .pf-v6-c-divider.pf-m-vertical-on-lg {
2393
- flex-direction: column;
2394
- width: var(--pf-v6-c-divider--Size);
2395
- height: inherit;
2396
- }
2618
+
2619
+ .pf-v6-c-spinner {
2620
+ --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
2621
+ --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);
2622
+ --pf-v6-c-spinner--Height: var(--pf-v6-c-spinner--diameter);
2623
+ --pf-v6-c-spinner--Color: var(--pf-t--global--icon--color--brand--default);
2624
+ --pf-v6-c-spinner--AnimationDuration: 1.4s;
2625
+ --pf-v6-c-spinner--AnimationTimingFunction: linear;
2626
+ --pf-v6-c-spinner--StrokeWidth: 10;
2627
+ --pf-v6-c-spinner__path--StrokeWidth: var(--pf-v6-c-spinner--StrokeWidth);
2628
+ --pf-v6-c-spinner__path--AnimationTimingFunction: ease-in-out;
2629
+ --pf-v6-c-spinner--m-sm--diameter: var(--pf-t--global--icon--size--md);
2630
+ --pf-v6-c-spinner--m-md--diameter: var(--pf-t--global--icon--size--lg);
2631
+ --pf-v6-c-spinner--m-lg--diameter: var(--pf-t--global--icon--size--xl);
2632
+ --pf-v6-c-spinner--m-xl--diameter: var(--pf-t--global--icon--size--2xl);
2633
+ --pf-v6-c-spinner--m-inline--diameter: 1em;
2397
2634
  }
2398
- @media (min-width: 62rem) {
2399
- .pf-v6-c-divider.pf-m-inset-none-on-lg {
2400
- --pf-v6-c-divider--before--FlexBasis: 100%;
2401
- }
2402
- .pf-v6-c-divider.pf-m-inset-xs-on-lg {
2403
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2404
- }
2405
- .pf-v6-c-divider.pf-m-inset-sm-on-lg {
2406
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2407
- }
2408
- .pf-v6-c-divider.pf-m-inset-md-on-lg {
2409
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2410
- }
2411
- .pf-v6-c-divider.pf-m-inset-lg-on-lg {
2412
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2413
- }
2414
- .pf-v6-c-divider.pf-m-inset-xl-on-lg {
2415
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2416
- }
2417
- .pf-v6-c-divider.pf-m-inset-2xl-on-lg {
2418
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2419
- }
2420
- .pf-v6-c-divider.pf-m-inset-3xl-on-lg {
2421
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2422
- }
2635
+
2636
+ .pf-v6-c-spinner {
2637
+ width: var(--pf-v6-c-spinner--Width);
2638
+ height: var(--pf-v6-c-spinner--Height);
2639
+ overflow: hidden;
2640
+ animation: pf-v6-c-spinner-animation-rotate calc(var(--pf-v6-c-spinner--AnimationDuration) * 2) var(--pf-v6-c-spinner--AnimationTimingFunction) infinite;
2423
2641
  }
2424
- @media (min-width: 75rem) {
2425
- .pf-v6-c-divider.pf-m-horizontal-on-xl {
2426
- flex-direction: row;
2427
- width: 100%;
2428
- height: var(--pf-v6-c-divider--Size);
2429
- }
2642
+
2643
+ .pf-v6-c-spinner.pf-m-inline {
2644
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-inline--diameter);
2430
2645
  }
2431
- @media (min-width: 75rem) {
2432
- .pf-v6-c-divider.pf-m-vertical-on-xl {
2433
- flex-direction: column;
2434
- width: var(--pf-v6-c-divider--Size);
2435
- height: inherit;
2436
- }
2646
+
2647
+ .pf-v6-c-spinner.pf-m-sm {
2648
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-sm--diameter);
2437
2649
  }
2438
- @media (min-width: 75rem) {
2439
- .pf-v6-c-divider.pf-m-inset-none-on-xl {
2440
- --pf-v6-c-divider--before--FlexBasis: 100%;
2441
- }
2442
- .pf-v6-c-divider.pf-m-inset-xs-on-xl {
2443
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2444
- }
2445
- .pf-v6-c-divider.pf-m-inset-sm-on-xl {
2446
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2447
- }
2448
- .pf-v6-c-divider.pf-m-inset-md-on-xl {
2449
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2450
- }
2451
- .pf-v6-c-divider.pf-m-inset-lg-on-xl {
2452
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2453
- }
2454
- .pf-v6-c-divider.pf-m-inset-xl-on-xl {
2455
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2456
- }
2457
- .pf-v6-c-divider.pf-m-inset-2xl-on-xl {
2458
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2459
- }
2460
- .pf-v6-c-divider.pf-m-inset-3xl-on-xl {
2461
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2462
- }
2650
+
2651
+ .pf-v6-c-spinner.pf-m-md {
2652
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-md--diameter);
2463
2653
  }
2464
- @media (min-width: 90.625rem) {
2465
- .pf-v6-c-divider.pf-m-horizontal-on-2xl {
2466
- flex-direction: row;
2467
- width: 100%;
2468
- height: var(--pf-v6-c-divider--Size);
2469
- }
2654
+
2655
+ .pf-v6-c-spinner.pf-m-lg {
2656
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-lg--diameter);
2470
2657
  }
2471
- @media (min-width: 90.625rem) {
2472
- .pf-v6-c-divider.pf-m-vertical-on-2xl {
2473
- flex-direction: column;
2474
- width: var(--pf-v6-c-divider--Size);
2475
- height: inherit;
2476
- }
2658
+
2659
+ .pf-v6-c-spinner.pf-m-xl {
2660
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-xl--diameter);
2477
2661
  }
2478
- @media (min-width: 90.625rem) {
2479
- .pf-v6-c-divider.pf-m-inset-none-on-2xl {
2480
- --pf-v6-c-divider--before--FlexBasis: 100%;
2481
- }
2482
- .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
2483
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
2484
- }
2485
- .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
2486
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
2662
+
2663
+ .pf-v6-c-spinner__path {
2664
+ width: 100%;
2665
+ height: 100%;
2666
+ stroke: var(--pf-v6-c-spinner--Color);
2667
+ stroke-dasharray: 283;
2668
+ stroke-dashoffset: 280;
2669
+ stroke-linecap: round;
2670
+ stroke-width: var(--pf-v6-c-spinner--StrokeWidth);
2671
+ transform-origin: 50% 50%;
2672
+ animation: pf-v6-c-spinner-animation-dash var(--pf-v6-c-spinner--AnimationDuration) var(--pf-v6-c-spinner__path--AnimationTimingFunction) infinite;
2673
+ }
2674
+
2675
+ @keyframes pf-v6-c-spinner-animation-rotate {
2676
+ 0% {
2677
+ transform: rotate(0deg);
2487
2678
  }
2488
- .pf-v6-c-divider.pf-m-inset-md-on-2xl {
2489
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
2679
+ 100% {
2680
+ transform: rotate(360deg);
2490
2681
  }
2491
- .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
2492
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
2682
+ }
2683
+ @keyframes pf-v6-c-spinner-animation-dash {
2684
+ 0% {
2685
+ stroke-dashoffset: 280;
2686
+ transform: rotate(0);
2493
2687
  }
2494
- .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
2495
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
2688
+ 15% {
2689
+ stroke-width: calc(var(--pf-v6-c-spinner__path--StrokeWidth) - 4);
2496
2690
  }
2497
- .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
2498
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
2691
+ 40% {
2692
+ stroke-dasharray: 220;
2693
+ stroke-dashoffset: 150;
2499
2694
  }
2500
- .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
2501
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
2695
+ 100% {
2696
+ stroke-dashoffset: 280;
2697
+ transform: rotate(720deg);
2502
2698
  }
2503
2699
  }
2504
2700
  .pf-v6-c-menu {
@@ -3137,202 +3333,6 @@ input.pf-v6-c-label__content {
3137
3333
  outline-offset: var(--pf-v6-c-menu--OutlineOffset);
3138
3334
  }
3139
3335
 
3140
- .pf-v6-c-spinner {
3141
- --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
3142
- --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);
3143
- --pf-v6-c-spinner--Height: var(--pf-v6-c-spinner--diameter);
3144
- --pf-v6-c-spinner--Color: var(--pf-t--global--icon--color--brand--default);
3145
- --pf-v6-c-spinner--AnimationDuration: 1.4s;
3146
- --pf-v6-c-spinner--AnimationTimingFunction: linear;
3147
- --pf-v6-c-spinner--StrokeWidth: 10;
3148
- --pf-v6-c-spinner__path--StrokeWidth: var(--pf-v6-c-spinner--StrokeWidth);
3149
- --pf-v6-c-spinner__path--AnimationTimingFunction: ease-in-out;
3150
- --pf-v6-c-spinner--m-sm--diameter: var(--pf-t--global--icon--size--md);
3151
- --pf-v6-c-spinner--m-md--diameter: var(--pf-t--global--icon--size--lg);
3152
- --pf-v6-c-spinner--m-lg--diameter: var(--pf-t--global--icon--size--xl);
3153
- --pf-v6-c-spinner--m-xl--diameter: var(--pf-t--global--icon--size--2xl);
3154
- --pf-v6-c-spinner--m-inline--diameter: 1em;
3155
- }
3156
-
3157
- .pf-v6-c-spinner {
3158
- width: var(--pf-v6-c-spinner--Width);
3159
- height: var(--pf-v6-c-spinner--Height);
3160
- overflow: hidden;
3161
- animation: pf-v6-c-spinner-animation-rotate calc(var(--pf-v6-c-spinner--AnimationDuration) * 2) var(--pf-v6-c-spinner--AnimationTimingFunction) infinite;
3162
- }
3163
-
3164
- .pf-v6-c-spinner.pf-m-inline {
3165
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-inline--diameter);
3166
- }
3167
-
3168
- .pf-v6-c-spinner.pf-m-sm {
3169
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-sm--diameter);
3170
- }
3171
-
3172
- .pf-v6-c-spinner.pf-m-md {
3173
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-md--diameter);
3174
- }
3175
-
3176
- .pf-v6-c-spinner.pf-m-lg {
3177
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-lg--diameter);
3178
- }
3179
-
3180
- .pf-v6-c-spinner.pf-m-xl {
3181
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-xl--diameter);
3182
- }
3183
-
3184
- .pf-v6-c-spinner__path {
3185
- width: 100%;
3186
- height: 100%;
3187
- stroke: var(--pf-v6-c-spinner--Color);
3188
- stroke-dasharray: 283;
3189
- stroke-dashoffset: 280;
3190
- stroke-linecap: round;
3191
- stroke-width: var(--pf-v6-c-spinner--StrokeWidth);
3192
- transform-origin: 50% 50%;
3193
- animation: pf-v6-c-spinner-animation-dash var(--pf-v6-c-spinner--AnimationDuration) var(--pf-v6-c-spinner__path--AnimationTimingFunction) infinite;
3194
- }
3195
-
3196
- @keyframes pf-v6-c-spinner-animation-rotate {
3197
- 0% {
3198
- transform: rotate(0deg);
3199
- }
3200
- 100% {
3201
- transform: rotate(360deg);
3202
- }
3203
- }
3204
- @keyframes pf-v6-c-spinner-animation-dash {
3205
- 0% {
3206
- stroke-dashoffset: 280;
3207
- transform: rotate(0);
3208
- }
3209
- 15% {
3210
- stroke-width: calc(var(--pf-v6-c-spinner__path--StrokeWidth) - 4);
3211
- }
3212
- 40% {
3213
- stroke-dasharray: 220;
3214
- stroke-dashoffset: 150;
3215
- }
3216
- 100% {
3217
- stroke-dashoffset: 280;
3218
- transform: rotate(720deg);
3219
- }
3220
- }
3221
- .pf-v6-c-breadcrumb {
3222
- --pf-v6-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
3223
- --pf-v6-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
3224
- --pf-v6-c-breadcrumb__item--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3225
- --pf-v6-c-breadcrumb__item-divider--Color: var(--pf-t--global--icon--color--regular);
3226
- --pf-v6-c-breadcrumb__item-divider--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3227
- --pf-v6-c-breadcrumb__item-divider--FontSize: var( --pf-t--global--font--size--body--sm);
3228
- --pf-v6-c-breadcrumb__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
3229
- --pf-v6-c-breadcrumb__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
3230
- --pf-v6-c-breadcrumb__link--Color: var(--pf-t--global--text--color--link--default);
3231
- --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
3232
- --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
3233
- --pf-v6-c-breadcrumb__link--hover--Color: var(--pf-t--global--text--color--link--hover);
3234
- --pf-v6-c-breadcrumb__link--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
3235
- --pf-v6-c-breadcrumb__link--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
3236
- --pf-v6-c-breadcrumb__link--m-current--Color: var(--pf-t--global--text--color--regular);
3237
- --pf-v6-c-breadcrumb__link--BackgroundColor: transparent;
3238
- --pf-v6-c-breadcrumb__heading--FontSize: var( --pf-t--global--font--size--body--sm);
3239
- --pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3240
- --pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
3241
- --pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3242
- --pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
3243
- }
3244
-
3245
- .pf-v6-c-breadcrumb {
3246
- display: inline-flex;
3247
- }
3248
-
3249
- .pf-v6-c-breadcrumb__list {
3250
- display: flex;
3251
- flex-wrap: wrap;
3252
- align-items: center;
3253
- }
3254
-
3255
- .pf-v6-c-breadcrumb__item {
3256
- display: flex;
3257
- align-items: baseline;
3258
- font-size: var(--pf-v6-c-breadcrumb__item--FontSize);
3259
- font-weight: var(--pf-v6-c-breadcrumb__item--FontWeight);
3260
- line-height: var(--pf-v6-c-breadcrumb__item--LineHeight);
3261
- white-space: nowrap;
3262
- list-style: none;
3263
- }
3264
-
3265
- .pf-v6-c-breadcrumb__item:first-child:has(.pf-v6-c-breadcrumb__link) {
3266
- --pf-v6-c-breadcrumb__link--PaddingInlineStart: 0;
3267
- }
3268
-
3269
- .pf-v6-c-breadcrumb__item:not(:last-child) {
3270
- margin-inline-end: var(--pf-v6-c-breadcrumb__item--MarginInlineEnd);
3271
- }
3272
-
3273
- .pf-v6-c-breadcrumb__item-divider {
3274
- margin-inline-end: var(--pf-v6-c-breadcrumb__item-divider--MarginInlineEnd);
3275
- font-size: var(--pf-v6-c-breadcrumb__item-divider--FontSize);
3276
- line-height: 1;
3277
- color: var(--pf-v6-c-breadcrumb__item-divider--Color);
3278
- }
3279
-
3280
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-breadcrumb__item-divider {
3281
- scale: -1 1;
3282
- }
3283
-
3284
- .pf-v6-c-breadcrumb__link {
3285
- padding-inline-start: var(--pf-v6-c-breadcrumb__link--PaddingInlineStart);
3286
- padding-inline-end: var(--pf-v6-c-breadcrumb__link--PaddingInlineEnd);
3287
- font-size: inherit;
3288
- font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
3289
- line-height: inherit;
3290
- color: var(--pf-v6-c-breadcrumb__link--Color);
3291
- text-decoration: var(--pf-v6-c-breadcrumb__link--TextDecorationLine) var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
3292
- word-break: break-word;
3293
- background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
3294
- }
3295
-
3296
- .pf-v6-c-breadcrumb__link:is(:hover, :focus) {
3297
- --pf-v6-c-breadcrumb__link--Color: var(--pf-v6-c-breadcrumb__link--hover--Color);
3298
- --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationLine);
3299
- --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationStyle);
3300
- }
3301
-
3302
- .pf-v6-c-breadcrumb__link.pf-m-current {
3303
- cursor: default;
3304
- }
3305
-
3306
- .pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
3307
- color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
3308
- text-decoration: none;
3309
- }
3310
-
3311
- button.pf-v6-c-breadcrumb__link {
3312
- border: none;
3313
- }
3314
-
3315
- .pf-v6-c-breadcrumb__dropdown {
3316
- margin-block-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart);
3317
- margin-block-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd);
3318
- margin-inline-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart);
3319
- margin-inline-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd);
3320
- }
3321
-
3322
- .pf-v6-c-breadcrumb__heading {
3323
- display: inline;
3324
- font-size: var(--pf-v6-c-breadcrumb__heading--FontSize);
3325
- }
3326
-
3327
- .pf-v6-c-breadcrumb__link,
3328
- .pf-v6-c-breadcrumb__heading {
3329
- white-space: normal;
3330
- }
3331
-
3332
- .pf-v6-c-breadcrumb__list > :first-child .pf-v6-c-breadcrumb__item-divider {
3333
- display: none;
3334
- }
3335
-
3336
3336
  .pf-v6-c-tooltip {
3337
3337
  --pf-v6-c-tooltip--MaxWidth: 18.75rem;
3338
3338
  --pf-v6-c-tooltip--BoxShadow: var(--pf-t--global--box-shadow--md);