@patternfly/patternfly 4.173.0 → 4.176.1

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 (18) hide show
  1. package/components/AlertGroup/alert-group.css +36 -0
  2. package/components/AlertGroup/alert-group.scss +41 -0
  3. package/components/Label/label.css +43 -12
  4. package/components/Label/label.scss +45 -13
  5. package/components/TextInputGroup/text-input-group.css +4 -0
  6. package/components/TextInputGroup/text-input-group.scss +5 -0
  7. package/docs/components/AlertGroup/examples/AlertGroup.md +8 -3
  8. package/docs/components/Label/examples/Label.md +33 -67
  9. package/docs/components/LabelGroup/examples/LabelGroup.md +64 -107
  10. package/docs/components/Table/examples/Table.md +175 -0
  11. package/docs/components/TextInputGroup/examples/TextInputGroup.md +2 -1
  12. package/docs/demos/Card/examples/Card.md +0 -22
  13. package/docs/demos/Tabs/examples/Tabs.md +0 -2
  14. package/package.json +1 -1
  15. package/patternfly-no-reset.css +83 -12
  16. package/patternfly.css +83 -12
  17. package/patternfly.min.css +1 -1
  18. package/patternfly.min.css.map +1 -1
package/docs/demos/Card/examples/Card.md CHANGED
@@ -86,7 +86,6 @@ wrapperTag: div
86
86
  <span class="pf-c-label__icon">
87
87
  <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
88
88
  </span>
89
-
90
89
  Set up your cluster
91
90
  </span>
92
91
  </span>
@@ -97,7 +96,6 @@ wrapperTag: div
97
96
  <span class="pf-c-label__icon">
98
97
  <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
99
98
  </span>
100
-
101
99
  Guided tours
102
100
  </span>
103
101
  </span>
@@ -108,7 +106,6 @@ wrapperTag: div
108
106
  <span class="pf-c-label__icon">
109
107
  <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
110
108
  </span>
111
-
112
109
  Quick starts
113
110
  </span>
114
111
  </span>
@@ -213,7 +210,6 @@ wrapperTag: div
213
210
  <span class="pf-c-label__icon">
214
211
  <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
215
212
  </span>
216
-
217
213
  Set up your cluster
218
214
  </span>
219
215
  </span>
@@ -250,7 +246,6 @@ wrapperTag: div
250
246
  <span class="pf-c-label__icon">
251
247
  <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
252
248
  </span>
253
-
254
249
  Guided tours
255
250
  </span>
256
251
  </span>
@@ -282,7 +277,6 @@ wrapperTag: div
282
277
  <span class="pf-c-label__icon">
283
278
  <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
284
279
  </span>
285
-
286
280
  Quick starts
287
281
  </span>
288
282
  </span>
@@ -317,7 +311,6 @@ wrapperTag: div
317
311
  <span class="pf-c-label__icon">
318
312
  <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
319
313
  </span>
320
-
321
314
  Learning resources
322
315
  </span>
323
316
  </span>
@@ -979,7 +972,6 @@ wrapperTag: div
979
972
  aria-hidden="true"
980
973
  ></i>
981
974
  </span>
982
-
983
975
  1
984
976
  </span>
985
977
  </span>
@@ -991,7 +983,6 @@ wrapperTag: div
991
983
  aria-hidden="true"
992
984
  ></i>
993
985
  </span>
994
-
995
986
  3
996
987
  </span>
997
988
  </span>
@@ -1000,7 +991,6 @@ wrapperTag: div
1000
991
  <span class="pf-c-label__icon">
1001
992
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
1002
993
  </span>
1003
-
1004
994
  3
1005
995
  </span>
1006
996
  </span>
@@ -1009,7 +999,6 @@ wrapperTag: div
1009
999
  <span class="pf-c-label__icon">
1010
1000
  <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
1011
1001
  </span>
1012
-
1013
1002
  3
1014
1003
  </span>
1015
1004
  </span>
@@ -1018,7 +1007,6 @@ wrapperTag: div
1018
1007
  <span class="pf-c-label__icon">
1019
1008
  <i class="fas fa-fw fa-bell" aria-hidden="true"></i>
1020
1009
  </span>
1021
-
1022
1010
  3
1023
1011
  </span>
1024
1012
  </span>
@@ -1177,7 +1165,6 @@ wrapperTag: div
1177
1165
  aria-hidden="true"
1178
1166
  ></i>
1179
1167
  </span>
1180
-
1181
1168
  1
1182
1169
  </span>
1183
1170
  </span>
@@ -1189,7 +1176,6 @@ wrapperTag: div
1189
1176
  aria-hidden="true"
1190
1177
  ></i>
1191
1178
  </span>
1192
-
1193
1179
  3
1194
1180
  </span>
1195
1181
  </span>
@@ -1198,7 +1184,6 @@ wrapperTag: div
1198
1184
  <span class="pf-c-label__icon">
1199
1185
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
1200
1186
  </span>
1201
-
1202
1187
  3
1203
1188
  </span>
1204
1189
  </span>
@@ -1207,7 +1192,6 @@ wrapperTag: div
1207
1192
  <span class="pf-c-label__icon">
1208
1193
  <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
1209
1194
  </span>
1210
-
1211
1195
  3
1212
1196
  </span>
1213
1197
  </span>
@@ -1216,7 +1200,6 @@ wrapperTag: div
1216
1200
  <span class="pf-c-label__icon">
1217
1201
  <i class="fas fa-fw fa-bell" aria-hidden="true"></i>
1218
1202
  </span>
1219
-
1220
1203
  3
1221
1204
  </span>
1222
1205
  </span>
@@ -1628,7 +1611,6 @@ wrapperTag: div
1628
1611
  aria-hidden="true"
1629
1612
  ></i>
1630
1613
  </span>
1631
-
1632
1614
  1
1633
1615
  </span>
1634
1616
  </span>
@@ -1640,7 +1622,6 @@ wrapperTag: div
1640
1622
  aria-hidden="true"
1641
1623
  ></i>
1642
1624
  </span>
1643
-
1644
1625
  3
1645
1626
  </span>
1646
1627
  </span>
@@ -1649,7 +1630,6 @@ wrapperTag: div
1649
1630
  <span class="pf-c-label__icon">
1650
1631
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
1651
1632
  </span>
1652
-
1653
1633
  3
1654
1634
  </span>
1655
1635
  </span>
@@ -1658,7 +1638,6 @@ wrapperTag: div
1658
1638
  <span class="pf-c-label__icon">
1659
1639
  <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
1660
1640
  </span>
1661
-
1662
1641
  3
1663
1642
  </span>
1664
1643
  </span>
@@ -1667,7 +1646,6 @@ wrapperTag: div
1667
1646
  <span class="pf-c-label__icon">
1668
1647
  <i class="fas fa-fw fa-bell" aria-hidden="true"></i>
1669
1648
  </span>
1670
-
1671
1649
  3
1672
1650
  </span>
1673
1651
  </span>
package/docs/demos/Tabs/examples/Tabs.md CHANGED
@@ -244,7 +244,6 @@ section: components
244
244
  <span class="pf-c-label__icon">
245
245
  <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
246
246
  </span>
247
-
248
247
  Running
249
248
  </span>
250
249
  </span>
@@ -771,7 +770,6 @@ section: components
771
770
  <span class="pf-c-label__icon">
772
771
  <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
773
772
  </span>
774
-
775
773
  Running
776
774
  </span>
777
775
  </span>
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@patternfly/patternfly",
3
3
  "description": "Assets, source, tooling, and content for PatternFly 4",
4
- "version": "4.173.0",
4
+ "version": "4.176.1",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
package/patternfly-no-reset.css CHANGED
@@ -6026,6 +6026,20 @@ html {
6026
6026
  --pf-c-alert-group--m-toast--Right: var(--pf-global--spacer--xl);
6027
6027
  --pf-c-alert-group--m-toast--MaxWidth: 37.5rem;
6028
6028
  --pf-c-alert-group--m-toast--ZIndex: var(--pf-global--ZIndex--2xl);
6029
+ --pf-c-alert-group__overflow-button--BorderWidth: 0;
6030
+ --pf-c-alert-group__overflow-button--PaddingTop: var(--pf-global--spacer--lg);
6031
+ --pf-c-alert-group__overflow-button--PaddingRight: var(--pf-global--spacer--md);
6032
+ --pf-c-alert-group__overflow-button--PaddingBottom: var(--pf-global--spacer--lg);
6033
+ --pf-c-alert-group__overflow-button--PaddingLeft: var(--pf-global--spacer--md);
6034
+ --pf-c-alert-group__overflow-button--Color: var(--pf-global--link--Color);
6035
+ --pf-c-alert-group__overflow-button--BoxShadow: var(--pf-global--BoxShadow--lg);
6036
+ --pf-c-alert-group__overflow-button--BackgroundColor: var(--pf-global--BackgroundColor--100);
6037
+ --pf-c-alert-group__overflow-button--hover--Color: var(--pf-global--link--Color--hover);
6038
+ --pf-c-alert-group__overflow-button--hover--BoxShadow: var(--pf-global--BoxShadow--lg), var(--pf-global--BoxShadow--lg-bottom);
6039
+ --pf-c-alert-group__overflow-button--focus--Color: var(--pf-global--link--Color--hover);
6040
+ --pf-c-alert-group__overflow-button--focus--BoxShadow: var(--pf-global--BoxShadow--lg), var(--pf-global--BoxShadow--lg-bottom);
6041
+ --pf-c-alert-group__overflow-button--active--Color: var(--pf-global--link--Color--hover);
6042
+ --pf-c-alert-group__overflow-button--active--BoxShadow: var(--pf-global--BoxShadow--lg), var(--pf-global--BoxShadow--lg-bottom);
6029
6043
  }
6030
6044
  .pf-c-alert-group > * + * {
6031
6045
  margin-top: var(--pf-c-alert-group__item--MarginTop);
@@ -6039,6 +6053,28 @@ html {
6039
6053
  max-width: var(--pf-c-alert-group--m-toast--MaxWidth);
6040
6054
  }
6041
6055
 
6056
+ .pf-c-alert-group__overflow-button {
6057
+ position: relative;
6058
+ width: 100%;
6059
+ padding: var(--pf-c-alert-group__overflow-button--PaddingTop) var(--pf-c-alert-group__overflow-button--PaddingRight) var(--pf-c-alert-group__overflow-button--PaddingBottom) var(--pf-c-alert-group__overflow-button--PaddingLeft);
6060
+ color: var(--pf-c-alert-group__overflow-button--Color);
6061
+ background-color: var(--pf-c-alert-group__overflow-button--BackgroundColor);
6062
+ border-width: var(--pf-c-alert-group__overflow-button--BorderWidth);
6063
+ box-shadow: var(--pf-c-alert-group__overflow-button--BoxShadow);
6064
+ }
6065
+ .pf-c-alert-group__overflow-button:hover {
6066
+ --pf-c-alert-group__overflow-button--Color: var(--pf-c-alert-group__overflow-button--hover--Color);
6067
+ --pf-c-alert-group__overflow-button--BoxShadow: var(--pf-c-alert-group__overflow-button--hover--BoxShadow);
6068
+ }
6069
+ .pf-c-alert-group__overflow-button:focus {
6070
+ --pf-c-alert-group__overflow-button--Color: var(--pf-c-alert-group__overflow-button--focus--Color);
6071
+ --pf-c-alert-group__overflow-button--BoxShadow: var(--pf-c-alert-group__overflow-button--focus--BoxShadow);
6072
+ }
6073
+ .pf-c-alert-group__overflow-button:active {
6074
+ --pf-c-alert-group__overflow-button--Color: var(--pf-c-alert-group__overflow-button--active--Color);
6075
+ --pf-c-alert-group__overflow-button--BoxShadow: var(--pf-c-alert-group__overflow-button--active--BoxShadow);
6076
+ }
6077
+
6042
6078
  .pf-c-app-launcher {
6043
6079
  --pf-c-app-launcher__menu--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
6044
6080
  --pf-c-app-launcher__menu--BoxShadow: var(--pf-global--BoxShadow--md);
@@ -14635,7 +14671,9 @@ label.pf-c-input-group__text {
14635
14671
  --pf-c-label--m-compact--FontSize: var(--pf-global--FontSize--xs);
14636
14672
  --pf-c-label--m-compact--m-editable--TextDecorationOffset: 0.0625rem;
14637
14673
  --pf-c-label__content--Color: var(--pf-global--Color--100);
14674
+ --pf-c-label__content--MaxWidth: 100%;
14638
14675
  --pf-c-label--m-outline__content--Color: var(--pf-global--Color--100);
14676
+ --pf-c-label--m-editable__content--MaxWidth: 16ch;
14639
14677
  --pf-c-label__text--MaxWidth: 16ch;
14640
14678
  --pf-c-label__icon--Color: var(--pf-global--Color--100);
14641
14679
  --pf-c-label__icon--MarginRight: var(--pf-global--spacer--xs);
@@ -14648,8 +14686,6 @@ label.pf-c-input-group__text {
14648
14686
  --pf-c-label__c-button--PaddingRight: var(--pf-global--spacer--sm);
14649
14687
  --pf-c-label__c-button--PaddingBottom: var(--pf-global--spacer--xs);
14650
14688
  --pf-c-label__c-button--PaddingLeft: var(--pf-global--spacer--sm);
14651
- --pf-c-label__editable-text--MaxWidth: 16ch;
14652
- --pf-c-label__editable-text--BorderWidth: 0;
14653
14689
  --pf-c-label--m-editable--Cursor: pointer;
14654
14690
  --pf-c-label--m-editable--TextDecoration: underline;
14655
14691
  --pf-c-label--m-editable--TextDecorationStyle: dashed;
@@ -14658,6 +14694,12 @@ label.pf-c-input-group__text {
14658
14694
  --pf-c-label--m-editable--TextDecorationColor: var(--pf-global--BorderColor--200);
14659
14695
  --pf-c-label--m-editable--hover--TextDecorationColor: var(--pf-global--Color--100);
14660
14696
  --pf-c-label--m-editable--focus--TextDecorationColor: var(--pf-global--Color--100);
14697
+ --pf-c-label--m-editable__content--before--BorderWidth: var(--pf-global--BorderWidth--sm);
14698
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-global--BorderColor--100);
14699
+ --pf-c-label--m-editable__content--hover--before--BorderWidth: var(--pf-global--BorderWidth--sm);
14700
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-global--BorderColor--100);
14701
+ --pf-c-label--m-editable__content--focus--before--BorderWidth: var(--pf-global--BorderWidth--sm);
14702
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-global--BorderColor--100);
14661
14703
  --pf-c-label--m-editable--m-editable-active--Cursor: auto;
14662
14704
  --pf-c-label--m-editable--m-editable-active--TextDecoration: none;
14663
14705
  --pf-c-label--m-editable--m-editable-active--BackgroundColor: transparent;
@@ -14691,6 +14733,9 @@ label.pf-c-input-group__text {
14691
14733
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-blue__content--before--BorderColor);
14692
14734
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-blue__content--link--hover--before--BorderColor);
14693
14735
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-blue__content--link--focus--before--BorderColor);
14736
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-blue__content--before--BorderColor);
14737
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-blue__content--before--BorderColor);
14738
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-blue__content--before--BorderColor);
14694
14739
  }
14695
14740
  .pf-c-label.pf-m-green {
14696
14741
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-green--BackgroundColor);
@@ -14703,6 +14748,9 @@ label.pf-c-input-group__text {
14703
14748
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-green__content--before--BorderColor);
14704
14749
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-green__content--link--hover--before--BorderColor);
14705
14750
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-green__content--link--focus--before--BorderColor);
14751
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-green__content--before--BorderColor);
14752
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-green__content--before--BorderColor);
14753
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-green__content--before--BorderColor);
14706
14754
  }
14707
14755
  .pf-c-label.pf-m-orange {
14708
14756
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-orange--BackgroundColor);
@@ -14715,6 +14763,9 @@ label.pf-c-input-group__text {
14715
14763
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-orange__content--before--BorderColor);
14716
14764
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-orange__content--link--hover--before--BorderColor);
14717
14765
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-orange__content--link--focus--before--BorderColor);
14766
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-orange__content--before--BorderColor);
14767
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-orange__content--before--BorderColor);
14768
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-orange__content--before--BorderColor);
14718
14769
  }
14719
14770
  .pf-c-label.pf-m-red {
14720
14771
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-red--BackgroundColor);
@@ -14727,6 +14778,9 @@ label.pf-c-input-group__text {
14727
14778
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-red__content--before--BorderColor);
14728
14779
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-red__content--link--hover--before--BorderColor);
14729
14780
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-red__content--link--focus--before--BorderColor);
14781
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-red__content--before--BorderColor);
14782
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-red__content--before--BorderColor);
14783
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-red__content--before--BorderColor);
14730
14784
  }
14731
14785
  .pf-c-label.pf-m-purple {
14732
14786
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-purple--BackgroundColor);
@@ -14739,6 +14793,9 @@ label.pf-c-input-group__text {
14739
14793
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-purple__content--before--BorderColor);
14740
14794
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-purple__content--link--hover--before--BorderColor);
14741
14795
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-purple__content--link--focus--before--BorderColor);
14796
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-purple__content--before--BorderColor);
14797
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-purple__content--before--BorderColor);
14798
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-purple__content--before--BorderColor);
14742
14799
  }
14743
14800
  .pf-c-label.pf-m-cyan {
14744
14801
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-cyan--BackgroundColor);
@@ -14751,12 +14808,18 @@ label.pf-c-input-group__text {
14751
14808
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-cyan__content--before--BorderColor);
14752
14809
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-cyan__content--link--hover--before--BorderColor);
14753
14810
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-cyan__content--link--focus--before--BorderColor);
14811
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-cyan__content--before--BorderColor);
14812
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-cyan__content--before--BorderColor);
14813
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-cyan__content--before--BorderColor);
14754
14814
  }
14755
14815
  .pf-c-label.pf-m-outline {
14756
14816
  --pf-c-label__content--Color: var(--pf-c-label--m-outline__content--Color);
14757
14817
  --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-outline__content--before--BorderWidth);
14758
14818
  --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14759
14819
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-outline--BackgroundColor);
14820
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14821
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14822
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14760
14823
  }
14761
14824
  .pf-c-label.pf-m-overflow:hover, .pf-c-label.pf-m-outline a.pf-c-label__content:hover,
14762
14825
  .pf-c-label.pf-m-outline button.pf-c-label__content:hover {
@@ -14776,6 +14839,15 @@ label.pf-c-input-group__text {
14776
14839
  text-decoration-thickness: var(--pf-c-label--m-editable--TextDecorationThickness);
14777
14840
  text-underline-offset: var(--pf-c-label--m-editable--TextDecorationOffset);
14778
14841
  text-decoration-color: var(--pf-c-label--m-editable--TextDecorationColor);
14842
+ --pf-c-label__content--MaxWidth: var(--pf-c-label--m-editable__content--MaxWidth);
14843
+ --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-editable__content--before--BorderWidth);
14844
+ --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-editable__content--before--BorderColor);
14845
+ --pf-c-label__content--link--hover--before--BorderWidth: var(--pf-c-label--m-editable__content--hover--before--BorderWidth);
14846
+ --pf-c-label__content--link--hover--before--BorderColor: var(--pf-c-label--m-editable__content--hover--before--BorderColor);
14847
+ --pf-c-label__content--link--focus--before--BorderWidth: var(--pf-c-label--m-editable__content--focus--before--BorderWidth);
14848
+ --pf-c-label__content--link--focus--before--BorderColor: var(--pf-c-label--m-editable__content--focus--before--BorderColor);
14849
+ --pf-c-label--m-outline__content--link--hover--before--BorderWidth: var(--pf-c-label--m-editable__content--before--BorderWidth);
14850
+ --pf-c-label--m-outline__content--link--focus--before--BorderWidth: var(--pf-c-label--m-editable__content--before--BorderWidth);
14779
14851
  }
14780
14852
  .pf-c-label.pf-m-editable:hover {
14781
14853
  --pf-c-label--m-editable--TextDecorationColor: var(--pf-c-label--m-editable--hover--TextDecorationColor);
@@ -14787,19 +14859,10 @@ label.pf-c-input-group__text {
14787
14859
  --pf-c-label--m-editable--Cursor: var(--pf-c-label--m-editable--m-editable-active--Cursor);
14788
14860
  --pf-c-label--m-editable--TextDecoration: var(--pf-c-label--m-editable--m-editable-active--TextDecoration);
14789
14861
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-editable--m-editable-active--BackgroundColor);
14790
- --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-editable--m-editable-active__content--before--BorderWidth);
14791
- --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-editable--m-editable-active__content--before--BorderColor);
14792
14862
  }
14793
14863
  .pf-c-label.pf-m-editable-active .pf-c-button {
14794
14864
  visibility: hidden;
14795
14865
  }
14796
- .pf-c-label .pf-c-label__editable-text {
14797
- overflow: hidden;
14798
- text-overflow: ellipsis;
14799
- white-space: nowrap;
14800
- max-width: var(--pf-c-label__editable-text--MaxWidth);
14801
- border-width: var(--pf-c-label__editable-text--BorderWidth);
14802
- }
14803
14866
  .pf-c-label .pf-c-button {
14804
14867
  --pf-c-button--FontSize: var(--pf-c-label__c-button--FontSize);
14805
14868
  --pf-c-button--PaddingTop: var(--pf-c-label__c-button--PaddingTop);
@@ -14836,8 +14899,12 @@ label.pf-c-input-group__text {
14836
14899
  }
14837
14900
 
14838
14901
  .pf-c-label__content {
14902
+ overflow: hidden;
14903
+ text-overflow: ellipsis;
14904
+ white-space: nowrap;
14905
+ max-width: var(--pf-c-label__content--MaxWidth);
14839
14906
  color: var(--pf-c-label__content--Color);
14840
- border: 0;
14907
+ border-width: 0;
14841
14908
  }
14842
14909
  .pf-c-label__content::before {
14843
14910
  position: absolute;
@@ -26743,6 +26810,7 @@ svg.pf-c-spinner.pf-m-xl {
26743
26810
  --pf-c-text-input-group__text-input--PaddingLeft: var(--pf-global--spacer--sm);
26744
26811
  --pf-c-text-input-group__text-input--MinWidth: 12ch;
26745
26812
  --pf-c-text-input-group__text-input--m-hint--Color: var(--pf-global--Color--dark-200);
26813
+ --pf-c-text-input-group--placeholder--Color: var(--pf-global--Color--dark-200);
26746
26814
  --pf-c-text-input-group__icon--Left: var(--pf-global--spacer--sm);
26747
26815
  --pf-c-text-input-group__icon--Color: var(--pf-global--Color--200);
26748
26816
  --pf-c-text-input-group__text--hover__icon--Color: var(--pf-global--Color--100);
@@ -26849,6 +26917,9 @@ svg.pf-c-spinner.pf-m-xl {
26849
26917
  .pf-c-text-input-group__text-input.pf-m-hint {
26850
26918
  color: var(--pf-c-text-input-group__text-input--m-hint--Color);
26851
26919
  }
26920
+ .pf-c-text-input-group__text-input::placeholder {
26921
+ color: var(--pf-c-text-input-group--placeholder--Color);
26922
+ }
26852
26923
 
26853
26924
  .pf-c-text-input-group__utilities {
26854
26925
  display: flex;
package/patternfly.css CHANGED
@@ -6148,6 +6148,20 @@ a {
6148
6148
  --pf-c-alert-group--m-toast--Right: var(--pf-global--spacer--xl);
6149
6149
  --pf-c-alert-group--m-toast--MaxWidth: 37.5rem;
6150
6150
  --pf-c-alert-group--m-toast--ZIndex: var(--pf-global--ZIndex--2xl);
6151
+ --pf-c-alert-group__overflow-button--BorderWidth: 0;
6152
+ --pf-c-alert-group__overflow-button--PaddingTop: var(--pf-global--spacer--lg);
6153
+ --pf-c-alert-group__overflow-button--PaddingRight: var(--pf-global--spacer--md);
6154
+ --pf-c-alert-group__overflow-button--PaddingBottom: var(--pf-global--spacer--lg);
6155
+ --pf-c-alert-group__overflow-button--PaddingLeft: var(--pf-global--spacer--md);
6156
+ --pf-c-alert-group__overflow-button--Color: var(--pf-global--link--Color);
6157
+ --pf-c-alert-group__overflow-button--BoxShadow: var(--pf-global--BoxShadow--lg);
6158
+ --pf-c-alert-group__overflow-button--BackgroundColor: var(--pf-global--BackgroundColor--100);
6159
+ --pf-c-alert-group__overflow-button--hover--Color: var(--pf-global--link--Color--hover);
6160
+ --pf-c-alert-group__overflow-button--hover--BoxShadow: var(--pf-global--BoxShadow--lg), var(--pf-global--BoxShadow--lg-bottom);
6161
+ --pf-c-alert-group__overflow-button--focus--Color: var(--pf-global--link--Color--hover);
6162
+ --pf-c-alert-group__overflow-button--focus--BoxShadow: var(--pf-global--BoxShadow--lg), var(--pf-global--BoxShadow--lg-bottom);
6163
+ --pf-c-alert-group__overflow-button--active--Color: var(--pf-global--link--Color--hover);
6164
+ --pf-c-alert-group__overflow-button--active--BoxShadow: var(--pf-global--BoxShadow--lg), var(--pf-global--BoxShadow--lg-bottom);
6151
6165
  }
6152
6166
  .pf-c-alert-group > * + * {
6153
6167
  margin-top: var(--pf-c-alert-group__item--MarginTop);
@@ -6161,6 +6175,28 @@ a {
6161
6175
  max-width: var(--pf-c-alert-group--m-toast--MaxWidth);
6162
6176
  }
6163
6177
 
6178
+ .pf-c-alert-group__overflow-button {
6179
+ position: relative;
6180
+ width: 100%;
6181
+ padding: var(--pf-c-alert-group__overflow-button--PaddingTop) var(--pf-c-alert-group__overflow-button--PaddingRight) var(--pf-c-alert-group__overflow-button--PaddingBottom) var(--pf-c-alert-group__overflow-button--PaddingLeft);
6182
+ color: var(--pf-c-alert-group__overflow-button--Color);
6183
+ background-color: var(--pf-c-alert-group__overflow-button--BackgroundColor);
6184
+ border-width: var(--pf-c-alert-group__overflow-button--BorderWidth);
6185
+ box-shadow: var(--pf-c-alert-group__overflow-button--BoxShadow);
6186
+ }
6187
+ .pf-c-alert-group__overflow-button:hover {
6188
+ --pf-c-alert-group__overflow-button--Color: var(--pf-c-alert-group__overflow-button--hover--Color);
6189
+ --pf-c-alert-group__overflow-button--BoxShadow: var(--pf-c-alert-group__overflow-button--hover--BoxShadow);
6190
+ }
6191
+ .pf-c-alert-group__overflow-button:focus {
6192
+ --pf-c-alert-group__overflow-button--Color: var(--pf-c-alert-group__overflow-button--focus--Color);
6193
+ --pf-c-alert-group__overflow-button--BoxShadow: var(--pf-c-alert-group__overflow-button--focus--BoxShadow);
6194
+ }
6195
+ .pf-c-alert-group__overflow-button:active {
6196
+ --pf-c-alert-group__overflow-button--Color: var(--pf-c-alert-group__overflow-button--active--Color);
6197
+ --pf-c-alert-group__overflow-button--BoxShadow: var(--pf-c-alert-group__overflow-button--active--BoxShadow);
6198
+ }
6199
+
6164
6200
  .pf-c-app-launcher {
6165
6201
  --pf-c-app-launcher__menu--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
6166
6202
  --pf-c-app-launcher__menu--BoxShadow: var(--pf-global--BoxShadow--md);
@@ -14757,7 +14793,9 @@ label.pf-c-input-group__text {
14757
14793
  --pf-c-label--m-compact--FontSize: var(--pf-global--FontSize--xs);
14758
14794
  --pf-c-label--m-compact--m-editable--TextDecorationOffset: 0.0625rem;
14759
14795
  --pf-c-label__content--Color: var(--pf-global--Color--100);
14796
+ --pf-c-label__content--MaxWidth: 100%;
14760
14797
  --pf-c-label--m-outline__content--Color: var(--pf-global--Color--100);
14798
+ --pf-c-label--m-editable__content--MaxWidth: 16ch;
14761
14799
  --pf-c-label__text--MaxWidth: 16ch;
14762
14800
  --pf-c-label__icon--Color: var(--pf-global--Color--100);
14763
14801
  --pf-c-label__icon--MarginRight: var(--pf-global--spacer--xs);
@@ -14770,8 +14808,6 @@ label.pf-c-input-group__text {
14770
14808
  --pf-c-label__c-button--PaddingRight: var(--pf-global--spacer--sm);
14771
14809
  --pf-c-label__c-button--PaddingBottom: var(--pf-global--spacer--xs);
14772
14810
  --pf-c-label__c-button--PaddingLeft: var(--pf-global--spacer--sm);
14773
- --pf-c-label__editable-text--MaxWidth: 16ch;
14774
- --pf-c-label__editable-text--BorderWidth: 0;
14775
14811
  --pf-c-label--m-editable--Cursor: pointer;
14776
14812
  --pf-c-label--m-editable--TextDecoration: underline;
14777
14813
  --pf-c-label--m-editable--TextDecorationStyle: dashed;
@@ -14780,6 +14816,12 @@ label.pf-c-input-group__text {
14780
14816
  --pf-c-label--m-editable--TextDecorationColor: var(--pf-global--BorderColor--200);
14781
14817
  --pf-c-label--m-editable--hover--TextDecorationColor: var(--pf-global--Color--100);
14782
14818
  --pf-c-label--m-editable--focus--TextDecorationColor: var(--pf-global--Color--100);
14819
+ --pf-c-label--m-editable__content--before--BorderWidth: var(--pf-global--BorderWidth--sm);
14820
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-global--BorderColor--100);
14821
+ --pf-c-label--m-editable__content--hover--before--BorderWidth: var(--pf-global--BorderWidth--sm);
14822
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-global--BorderColor--100);
14823
+ --pf-c-label--m-editable__content--focus--before--BorderWidth: var(--pf-global--BorderWidth--sm);
14824
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-global--BorderColor--100);
14783
14825
  --pf-c-label--m-editable--m-editable-active--Cursor: auto;
14784
14826
  --pf-c-label--m-editable--m-editable-active--TextDecoration: none;
14785
14827
  --pf-c-label--m-editable--m-editable-active--BackgroundColor: transparent;
@@ -14813,6 +14855,9 @@ label.pf-c-input-group__text {
14813
14855
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-blue__content--before--BorderColor);
14814
14856
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-blue__content--link--hover--before--BorderColor);
14815
14857
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-blue__content--link--focus--before--BorderColor);
14858
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-blue__content--before--BorderColor);
14859
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-blue__content--before--BorderColor);
14860
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-blue__content--before--BorderColor);
14816
14861
  }
14817
14862
  .pf-c-label.pf-m-green {
14818
14863
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-green--BackgroundColor);
@@ -14825,6 +14870,9 @@ label.pf-c-input-group__text {
14825
14870
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-green__content--before--BorderColor);
14826
14871
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-green__content--link--hover--before--BorderColor);
14827
14872
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-green__content--link--focus--before--BorderColor);
14873
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-green__content--before--BorderColor);
14874
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-green__content--before--BorderColor);
14875
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-green__content--before--BorderColor);
14828
14876
  }
14829
14877
  .pf-c-label.pf-m-orange {
14830
14878
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-orange--BackgroundColor);
@@ -14837,6 +14885,9 @@ label.pf-c-input-group__text {
14837
14885
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-orange__content--before--BorderColor);
14838
14886
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-orange__content--link--hover--before--BorderColor);
14839
14887
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-orange__content--link--focus--before--BorderColor);
14888
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-orange__content--before--BorderColor);
14889
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-orange__content--before--BorderColor);
14890
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-orange__content--before--BorderColor);
14840
14891
  }
14841
14892
  .pf-c-label.pf-m-red {
14842
14893
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-red--BackgroundColor);
@@ -14849,6 +14900,9 @@ label.pf-c-input-group__text {
14849
14900
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-red__content--before--BorderColor);
14850
14901
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-red__content--link--hover--before--BorderColor);
14851
14902
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-red__content--link--focus--before--BorderColor);
14903
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-red__content--before--BorderColor);
14904
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-red__content--before--BorderColor);
14905
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-red__content--before--BorderColor);
14852
14906
  }
14853
14907
  .pf-c-label.pf-m-purple {
14854
14908
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-purple--BackgroundColor);
@@ -14861,6 +14915,9 @@ label.pf-c-input-group__text {
14861
14915
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-purple__content--before--BorderColor);
14862
14916
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-purple__content--link--hover--before--BorderColor);
14863
14917
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-purple__content--link--focus--before--BorderColor);
14918
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-purple__content--before--BorderColor);
14919
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-purple__content--before--BorderColor);
14920
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-purple__content--before--BorderColor);
14864
14921
  }
14865
14922
  .pf-c-label.pf-m-cyan {
14866
14923
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-cyan--BackgroundColor);
@@ -14873,12 +14930,18 @@ label.pf-c-input-group__text {
14873
14930
  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-cyan__content--before--BorderColor);
14874
14931
  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-cyan__content--link--hover--before--BorderColor);
14875
14932
  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-cyan__content--link--focus--before--BorderColor);
14933
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-cyan__content--before--BorderColor);
14934
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-cyan__content--before--BorderColor);
14935
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-cyan__content--before--BorderColor);
14876
14936
  }
14877
14937
  .pf-c-label.pf-m-outline {
14878
14938
  --pf-c-label__content--Color: var(--pf-c-label--m-outline__content--Color);
14879
14939
  --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-outline__content--before--BorderWidth);
14880
14940
  --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14881
14941
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-outline--BackgroundColor);
14942
+ --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14943
+ --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14944
+ --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-outline__content--before--BorderColor);
14882
14945
  }
14883
14946
  .pf-c-label.pf-m-overflow:hover, .pf-c-label.pf-m-outline a.pf-c-label__content:hover,
14884
14947
  .pf-c-label.pf-m-outline button.pf-c-label__content:hover {
@@ -14898,6 +14961,15 @@ label.pf-c-input-group__text {
14898
14961
  text-decoration-thickness: var(--pf-c-label--m-editable--TextDecorationThickness);
14899
14962
  text-underline-offset: var(--pf-c-label--m-editable--TextDecorationOffset);
14900
14963
  text-decoration-color: var(--pf-c-label--m-editable--TextDecorationColor);
14964
+ --pf-c-label__content--MaxWidth: var(--pf-c-label--m-editable__content--MaxWidth);
14965
+ --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-editable__content--before--BorderWidth);
14966
+ --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-editable__content--before--BorderColor);
14967
+ --pf-c-label__content--link--hover--before--BorderWidth: var(--pf-c-label--m-editable__content--hover--before--BorderWidth);
14968
+ --pf-c-label__content--link--hover--before--BorderColor: var(--pf-c-label--m-editable__content--hover--before--BorderColor);
14969
+ --pf-c-label__content--link--focus--before--BorderWidth: var(--pf-c-label--m-editable__content--focus--before--BorderWidth);
14970
+ --pf-c-label__content--link--focus--before--BorderColor: var(--pf-c-label--m-editable__content--focus--before--BorderColor);
14971
+ --pf-c-label--m-outline__content--link--hover--before--BorderWidth: var(--pf-c-label--m-editable__content--before--BorderWidth);
14972
+ --pf-c-label--m-outline__content--link--focus--before--BorderWidth: var(--pf-c-label--m-editable__content--before--BorderWidth);
14901
14973
  }
14902
14974
  .pf-c-label.pf-m-editable:hover {
14903
14975
  --pf-c-label--m-editable--TextDecorationColor: var(--pf-c-label--m-editable--hover--TextDecorationColor);
@@ -14909,19 +14981,10 @@ label.pf-c-input-group__text {
14909
14981
  --pf-c-label--m-editable--Cursor: var(--pf-c-label--m-editable--m-editable-active--Cursor);
14910
14982
  --pf-c-label--m-editable--TextDecoration: var(--pf-c-label--m-editable--m-editable-active--TextDecoration);
14911
14983
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-editable--m-editable-active--BackgroundColor);
14912
- --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-editable--m-editable-active__content--before--BorderWidth);
14913
- --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-editable--m-editable-active__content--before--BorderColor);
14914
14984
  }
14915
14985
  .pf-c-label.pf-m-editable-active .pf-c-button {
14916
14986
  visibility: hidden;
14917
14987
  }
14918
- .pf-c-label .pf-c-label__editable-text {
14919
- overflow: hidden;
14920
- text-overflow: ellipsis;
14921
- white-space: nowrap;
14922
- max-width: var(--pf-c-label__editable-text--MaxWidth);
14923
- border-width: var(--pf-c-label__editable-text--BorderWidth);
14924
- }
14925
14988
  .pf-c-label .pf-c-button {
14926
14989
  --pf-c-button--FontSize: var(--pf-c-label__c-button--FontSize);
14927
14990
  --pf-c-button--PaddingTop: var(--pf-c-label__c-button--PaddingTop);
@@ -14958,8 +15021,12 @@ label.pf-c-input-group__text {
14958
15021
  }
14959
15022
 
14960
15023
  .pf-c-label__content {
15024
+ overflow: hidden;
15025
+ text-overflow: ellipsis;
15026
+ white-space: nowrap;
15027
+ max-width: var(--pf-c-label__content--MaxWidth);
14961
15028
  color: var(--pf-c-label__content--Color);
14962
- border: 0;
15029
+ border-width: 0;
14963
15030
  }
14964
15031
  .pf-c-label__content::before {
14965
15032
  position: absolute;
@@ -26865,6 +26932,7 @@ svg.pf-c-spinner.pf-m-xl {
26865
26932
  --pf-c-text-input-group__text-input--PaddingLeft: var(--pf-global--spacer--sm);
26866
26933
  --pf-c-text-input-group__text-input--MinWidth: 12ch;
26867
26934
  --pf-c-text-input-group__text-input--m-hint--Color: var(--pf-global--Color--dark-200);
26935
+ --pf-c-text-input-group--placeholder--Color: var(--pf-global--Color--dark-200);
26868
26936
  --pf-c-text-input-group__icon--Left: var(--pf-global--spacer--sm);
26869
26937
  --pf-c-text-input-group__icon--Color: var(--pf-global--Color--200);
26870
26938
  --pf-c-text-input-group__text--hover__icon--Color: var(--pf-global--Color--100);
@@ -26971,6 +27039,9 @@ svg.pf-c-spinner.pf-m-xl {
26971
27039
  .pf-c-text-input-group__text-input.pf-m-hint {
26972
27040
  color: var(--pf-c-text-input-group__text-input--m-hint--Color);
26973
27041
  }
27042
+ .pf-c-text-input-group__text-input::placeholder {
27043
+ color: var(--pf-c-text-input-group--placeholder--Color);
27044
+ }
26974
27045
 
26975
27046
  .pf-c-text-input-group__utilities {
26976
27047
  display: flex;