@patternfly/patternfly 6.0.0-alpha.52 → 6.0.0-alpha.54

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 (10) hide show
  1. package/components/Button/button.css +7 -2
  2. package/components/Button/button.scss +7 -2
  3. package/components/InlineEdit/inline-edit.css +3 -2
  4. package/components/InlineEdit/inline-edit.scss +3 -2
  5. package/package.json +1 -1
  6. package/patternfly-no-globals.css +10 -4
  7. package/patternfly-theme-dark-unversioned.css +10 -4
  8. package/patternfly.css +10 -4
  9. package/patternfly.min.css +1 -1
  10. package/patternfly.min.css.map +1 -1
package/components/Button/button.css CHANGED
@@ -1,5 +1,6 @@
1
1
  :root,
2
2
  .pf-v5-c-button {
3
+ --pf-v5-c-button--Display: inline-block;
3
4
  --pf-v5-c-button--PaddingTop: var(--pf-t--global--spacer--sm);
4
5
  --pf-v5-c-button--PaddingRight: var(--pf-t--global--spacer--lg);
5
6
  --pf-v5-c-button--PaddingBottom: var(--pf-t--global--spacer--sm);
@@ -17,6 +18,7 @@
17
18
  --pf-v5-c-button--BorderStartEndRadius: var(--pf-v5-c-button--BorderRadius);
18
19
  --pf-v5-c-button--BorderEndStartRadius: var(--pf-v5-c-button--BorderRadius);
19
20
  --pf-v5-c-button--BorderEndEndRadius: var(--pf-v5-c-button--BorderRadius);
21
+ --pf-v5-c-button--MixBlendMode: normal;
20
22
  --pf-v5-c-button--hover--BackgroundColor: transparent;
21
23
  --pf-v5-c-button--hover--BorderColor: transparent;
22
24
  --pf-v5-c-button--hover--BorderWidth: var(--pf-t--global--border--width--button--hover);
@@ -65,6 +67,7 @@
65
67
  --pf-v5-c-button--m-link--PaddingLeft: var(--pf-t--global--spacer--md);
66
68
  --pf-v5-c-button--m-link--Color: var(--pf-t--global--text--color--brand--default);
67
69
  --pf-v5-c-button--m-link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
70
+ --pf-v5-c-button--m-link--MixBlendMode: var(--pf-t--global--background--color--action--plain--hover--blend);
68
71
  --pf-v5-c-button--m-link__icon--Color: var(--pf-t--global--icon--color--brand--default);
69
72
  --pf-v5-c-button--m-link--hover--Color: var(--pf-t--global--text--color--brand--hover);
70
73
  --pf-v5-c-button--m-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
@@ -216,7 +219,7 @@
216
219
 
217
220
  .pf-v5-c-button {
218
221
  position: relative;
219
- display: var(--pf-v5-c-button--Display, initial);
222
+ display: var(--pf-v5-c-button--Display);
220
223
  flex: var(--pf-v5-c-button--Flex, initial);
221
224
  align-items: var(--pf-v5-c-button--AlignItems, initial);
222
225
  justify-content: var(--pf-v5-c-button--JustifyContent, initial);
@@ -239,6 +242,7 @@
239
242
  border-start-end-radius: var(--pf-v5-c-button--BorderStartEndRadius);
240
243
  border-end-start-radius: var(--pf-v5-c-button--BorderEndStartRadius);
241
244
  border-end-end-radius: var(--pf-v5-c-button--BorderEndEndRadius);
245
+ mix-blend-mode: var(--pf-v5-c-button--MixBlendMode);
242
246
  }
243
247
  .pf-v5-c-button::after {
244
248
  position: absolute;
@@ -305,6 +309,7 @@
305
309
  --pf-v5-c-button--Color: var(--pf-v5-c-button--m-link--Color);
306
310
  --pf-v5-c-button--BorderRadius: var(--pf-v5-c-button--m-link--BorderRadius);
307
311
  --pf-v5-c-button--BackgroundColor: var(--pf-v5-c-button--m-link--BackgroundColor);
312
+ --pf-v5-c-button--MixBlendMode: var(--pf-v5-c-button--m-link--MixBlendMode);
308
313
  --pf-v5-c-button__icon--Color: var(--pf-v5-c-button--m-link__icon--Color);
309
314
  --pf-v5-c-button--hover--Color: var(--pf-v5-c-button--m-link--hover--Color);
310
315
  --pf-v5-c-button--hover--BackgroundColor: var(--pf-v5-c-button--m-link--hover--BackgroundColor);
@@ -430,6 +435,7 @@
430
435
  --pf-v5-c-button--PaddingRight: var(--pf-v5-c-button--m-plain--PaddingRight);
431
436
  --pf-v5-c-button--PaddingBottom: var(--pf-v5-c-button--m-plain--PaddingBottom);
432
437
  --pf-v5-c-button--PaddingLeft: var(--pf-v5-c-button--m-plain--PaddingLeft);
438
+ --pf-v5-c-button--MixBlendMode: var(--pf-v5-c-button--m-plain--MixBlendMode);
433
439
  --pf-v5-c-button--m-small--PaddingTop: var(--pf-v5-c-button--m-plain--m-small--PaddingTop);
434
440
  --pf-v5-c-button--m-small--PaddingRight: var(--pf-v5-c-button--m-plain--m-small--PaddingRight);
435
441
  --pf-v5-c-button--m-small--PaddingBottom: var(--pf-v5-c-button--m-plain--m-small--PaddingBottom);
@@ -444,7 +450,6 @@
444
450
  --pf-v5-c-button--disabled--Color: var(--pf-v5-c-button--m-plain--disabled--Color);
445
451
  --pf-v5-c-button__progress--Color: var(--pf-v5-c-button--m-in-progress--m-plain--Color);
446
452
  min-width: var(--pf-v5-c-button--m-plain--MinWidth);
447
- mix-blend-mode: var(--pf-v5-c-button--m-plain--MixBlendMode);
448
453
  }
449
454
  .pf-v5-c-button.pf-m-plain.pf-m-no-padding {
450
455
  min-width: auto;
package/components/Button/button.scss CHANGED
@@ -1,5 +1,6 @@
1
1
  :root,
2
2
  .#{$button} {
3
+ --#{$button}--Display: inline-block;
3
4
  --#{$button}--PaddingTop: var(--pf-t--global--spacer--sm);
4
5
  --#{$button}--PaddingRight: var(--pf-t--global--spacer--lg);
5
6
  --#{$button}--PaddingBottom: var(--pf-t--global--spacer--sm);
@@ -17,6 +18,7 @@
17
18
  --#{$button}--BorderStartEndRadius: var(--#{$button}--BorderRadius);
18
19
  --#{$button}--BorderEndStartRadius: var(--#{$button}--BorderRadius);
19
20
  --#{$button}--BorderEndEndRadius: var(--#{$button}--BorderRadius);
21
+ --#{$button}--MixBlendMode: normal;
20
22
 
21
23
  // Hover
22
24
  --#{$button}--hover--BackgroundColor: transparent;
@@ -77,6 +79,7 @@
77
79
  --#{$button}--m-link--PaddingLeft: var(--pf-t--global--spacer--md);
78
80
  --#{$button}--m-link--Color: var(--pf-t--global--text--color--brand--default);
79
81
  --#{$button}--m-link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
82
+ --#{$button}--m-link--MixBlendMode: var(--pf-t--global--background--color--action--plain--hover--blend);
80
83
  --#{$button}--m-link__icon--Color: var(--pf-t--global--icon--color--brand--default);
81
84
  --#{$button}--m-link--hover--Color: var(--pf-t--global--text--color--brand--hover);
82
85
  --#{$button}--m-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
@@ -259,7 +262,7 @@
259
262
 
260
263
  .#{$button} {
261
264
  position: relative;
262
- display: var(--#{$button}--Display, initial);
265
+ display: var(--#{$button}--Display);
263
266
  flex: var(--#{$button}--Flex, initial);
264
267
  align-items: var(--#{$button}--AlignItems, initial);
265
268
  justify-content: var(--#{$button}--JustifyContent, initial);
@@ -282,6 +285,7 @@
282
285
  border-start-end-radius: var(--#{$button}--BorderStartEndRadius);
283
286
  border-end-start-radius: var(--#{$button}--BorderEndStartRadius);
284
287
  border-end-end-radius: var(--#{$button}--BorderEndEndRadius);
288
+ mix-blend-mode: var(--#{$button}--MixBlendMode);
285
289
 
286
290
  &::after {
287
291
  position: absolute;
@@ -358,6 +362,7 @@
358
362
  --#{$button}--Color: var(--#{$button}--m-link--Color);
359
363
  --#{$button}--BorderRadius: var(--#{$button}--m-link--BorderRadius);
360
364
  --#{$button}--BackgroundColor: var(--#{$button}--m-link--BackgroundColor);
365
+ --#{$button}--MixBlendMode: var(--#{$button}--m-link--MixBlendMode);
361
366
  --#{$button}__icon--Color: var(--#{$button}--m-link__icon--Color);
362
367
  --#{$button}--hover--Color: var(--#{$button}--m-link--hover--Color);
363
368
  --#{$button}--hover--BackgroundColor: var(--#{$button}--m-link--hover--BackgroundColor);
@@ -503,6 +508,7 @@
503
508
  --#{$button}--PaddingRight: var(--#{$button}--m-plain--PaddingRight);
504
509
  --#{$button}--PaddingBottom: var(--#{$button}--m-plain--PaddingBottom);
505
510
  --#{$button}--PaddingLeft: var(--#{$button}--m-plain--PaddingLeft);
511
+ --#{$button}--MixBlendMode: var(--#{$button}--m-plain--MixBlendMode);
506
512
  --#{$button}--m-small--PaddingTop: var(--#{$button}--m-plain--m-small--PaddingTop);
507
513
  --#{$button}--m-small--PaddingRight: var(--#{$button}--m-plain--m-small--PaddingRight);
508
514
  --#{$button}--m-small--PaddingBottom: var(--#{$button}--m-plain--m-small--PaddingBottom);
@@ -524,7 +530,6 @@
524
530
  }
525
531
 
526
532
  min-width: var(--#{$button}--m-plain--MinWidth);
527
- mix-blend-mode: var(--#{$button}--m-plain--MixBlendMode);
528
533
  }
529
534
 
530
535
  &.pf-m-block {
package/components/InlineEdit/inline-edit.css CHANGED
@@ -1,8 +1,9 @@
1
- .pf-v5-c-inline-edit {
1
+ :where(:root),
2
+ :where(.pf-v5-c-inline-edit) {
2
3
  --pf-v5-c-inline-edit__group--item--MarginRight: var(--pf-t--global--spacer--sm);
3
4
  --pf-v5-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
4
5
  --pf-v5-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
5
- --pf-v5-c-inline-edit__action--m-icon-group--item--MarginRight: 0;
6
+ --pf-v5-c-inline-edit__action--m-icon-group--item--MarginRight: var(--pf-t--global--spacer--sm);
6
7
  --pf-v5-c-inline-edit__group--m-footer--MarginTop: var(--pf-t--global--spacer--xl);
7
8
  --pf-v5-c-inline-edit__label--m-bold--FontWeight: var(--pf-t--global--font--weight--body--bold);
8
9
  }
package/components/InlineEdit/inline-edit.scss CHANGED
@@ -1,6 +1,7 @@
1
1
  // @debug $inline-edit; // check your variable names located in src/patternfly/sass-utilities/component-namespaces.scss
2
2
 
3
- .#{$inline-edit} {
3
+ :where(:root),
4
+ :where( .#{$inline-edit}) {
4
5
  // Group
5
6
  --#{$inline-edit}__group--item--MarginRight: var(--pf-t--global--spacer--sm);
6
7
 
@@ -9,7 +10,7 @@
9
10
  --#{$inline-edit}__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
10
11
 
11
12
  // Icon button
12
- --#{$inline-edit}__action--m-icon-group--item--MarginRight: 0;
13
+ --#{$inline-edit}__action--m-icon-group--item--MarginRight: var(--pf-t--global--spacer--sm);
13
14
 
14
15
  // Footer group
15
16
  --#{$inline-edit}__group--m-footer--MarginTop: var(--pf-t--global--spacer--xl);
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": "6.0.0-alpha.52",
4
+ "version": "6.0.0-alpha.54",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
package/patternfly-no-globals.css CHANGED
@@ -7788,6 +7788,7 @@ button.pf-v5-c-breadcrumb__link {
7788
7788
 
7789
7789
  :root,
7790
7790
  .pf-v5-c-button {
7791
+ --pf-v5-c-button--Display: inline-block;
7791
7792
  --pf-v5-c-button--PaddingTop: var(--pf-t--global--spacer--sm);
7792
7793
  --pf-v5-c-button--PaddingRight: var(--pf-t--global--spacer--lg);
7793
7794
  --pf-v5-c-button--PaddingBottom: var(--pf-t--global--spacer--sm);
@@ -7805,6 +7806,7 @@ button.pf-v5-c-breadcrumb__link {
7805
7806
  --pf-v5-c-button--BorderStartEndRadius: var(--pf-v5-c-button--BorderRadius);
7806
7807
  --pf-v5-c-button--BorderEndStartRadius: var(--pf-v5-c-button--BorderRadius);
7807
7808
  --pf-v5-c-button--BorderEndEndRadius: var(--pf-v5-c-button--BorderRadius);
7809
+ --pf-v5-c-button--MixBlendMode: normal;
7808
7810
  --pf-v5-c-button--hover--BackgroundColor: transparent;
7809
7811
  --pf-v5-c-button--hover--BorderColor: transparent;
7810
7812
  --pf-v5-c-button--hover--BorderWidth: var(--pf-t--global--border--width--button--hover);
@@ -7853,6 +7855,7 @@ button.pf-v5-c-breadcrumb__link {
7853
7855
  --pf-v5-c-button--m-link--PaddingLeft: var(--pf-t--global--spacer--md);
7854
7856
  --pf-v5-c-button--m-link--Color: var(--pf-t--global--text--color--brand--default);
7855
7857
  --pf-v5-c-button--m-link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
7858
+ --pf-v5-c-button--m-link--MixBlendMode: var(--pf-t--global--background--color--action--plain--hover--blend);
7856
7859
  --pf-v5-c-button--m-link__icon--Color: var(--pf-t--global--icon--color--brand--default);
7857
7860
  --pf-v5-c-button--m-link--hover--Color: var(--pf-t--global--text--color--brand--hover);
7858
7861
  --pf-v5-c-button--m-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
@@ -8004,7 +8007,7 @@ button.pf-v5-c-breadcrumb__link {
8004
8007
 
8005
8008
  .pf-v5-c-button {
8006
8009
  position: relative;
8007
- display: var(--pf-v5-c-button--Display, initial);
8010
+ display: var(--pf-v5-c-button--Display);
8008
8011
  flex: var(--pf-v5-c-button--Flex, initial);
8009
8012
  align-items: var(--pf-v5-c-button--AlignItems, initial);
8010
8013
  justify-content: var(--pf-v5-c-button--JustifyContent, initial);
@@ -8027,6 +8030,7 @@ button.pf-v5-c-breadcrumb__link {
8027
8030
  border-start-end-radius: var(--pf-v5-c-button--BorderStartEndRadius);
8028
8031
  border-end-start-radius: var(--pf-v5-c-button--BorderEndStartRadius);
8029
8032
  border-end-end-radius: var(--pf-v5-c-button--BorderEndEndRadius);
8033
+ mix-blend-mode: var(--pf-v5-c-button--MixBlendMode);
8030
8034
  }
8031
8035
  .pf-v5-c-button::after {
8032
8036
  position: absolute;
@@ -8093,6 +8097,7 @@ button.pf-v5-c-breadcrumb__link {
8093
8097
  --pf-v5-c-button--Color: var(--pf-v5-c-button--m-link--Color);
8094
8098
  --pf-v5-c-button--BorderRadius: var(--pf-v5-c-button--m-link--BorderRadius);
8095
8099
  --pf-v5-c-button--BackgroundColor: var(--pf-v5-c-button--m-link--BackgroundColor);
8100
+ --pf-v5-c-button--MixBlendMode: var(--pf-v5-c-button--m-link--MixBlendMode);
8096
8101
  --pf-v5-c-button__icon--Color: var(--pf-v5-c-button--m-link__icon--Color);
8097
8102
  --pf-v5-c-button--hover--Color: var(--pf-v5-c-button--m-link--hover--Color);
8098
8103
  --pf-v5-c-button--hover--BackgroundColor: var(--pf-v5-c-button--m-link--hover--BackgroundColor);
@@ -8218,6 +8223,7 @@ button.pf-v5-c-breadcrumb__link {
8218
8223
  --pf-v5-c-button--PaddingRight: var(--pf-v5-c-button--m-plain--PaddingRight);
8219
8224
  --pf-v5-c-button--PaddingBottom: var(--pf-v5-c-button--m-plain--PaddingBottom);
8220
8225
  --pf-v5-c-button--PaddingLeft: var(--pf-v5-c-button--m-plain--PaddingLeft);
8226
+ --pf-v5-c-button--MixBlendMode: var(--pf-v5-c-button--m-plain--MixBlendMode);
8221
8227
  --pf-v5-c-button--m-small--PaddingTop: var(--pf-v5-c-button--m-plain--m-small--PaddingTop);
8222
8228
  --pf-v5-c-button--m-small--PaddingRight: var(--pf-v5-c-button--m-plain--m-small--PaddingRight);
8223
8229
  --pf-v5-c-button--m-small--PaddingBottom: var(--pf-v5-c-button--m-plain--m-small--PaddingBottom);
@@ -8232,7 +8238,6 @@ button.pf-v5-c-breadcrumb__link {
8232
8238
  --pf-v5-c-button--disabled--Color: var(--pf-v5-c-button--m-plain--disabled--Color);
8233
8239
  --pf-v5-c-button__progress--Color: var(--pf-v5-c-button--m-in-progress--m-plain--Color);
8234
8240
  min-width: var(--pf-v5-c-button--m-plain--MinWidth);
8235
- mix-blend-mode: var(--pf-v5-c-button--m-plain--MixBlendMode);
8236
8241
  }
8237
8242
  .pf-v5-c-button.pf-m-plain.pf-m-no-padding {
8238
8243
  min-width: auto;
@@ -16062,11 +16067,12 @@ select ~ .pf-v5-c-form-control__utilities {
16062
16067
  transform: translateY(calc(-50% - 0.5 * var(--pf-v5-c-icon__content--svg--VerticalAlign)));
16063
16068
  }
16064
16069
 
16065
- .pf-v5-c-inline-edit {
16070
+ :where(:root),
16071
+ :where(.pf-v5-c-inline-edit) {
16066
16072
  --pf-v5-c-inline-edit__group--item--MarginRight: var(--pf-t--global--spacer--sm);
16067
16073
  --pf-v5-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
16068
16074
  --pf-v5-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
16069
- --pf-v5-c-inline-edit__action--m-icon-group--item--MarginRight: 0;
16075
+ --pf-v5-c-inline-edit__action--m-icon-group--item--MarginRight: var(--pf-t--global--spacer--sm);
16070
16076
  --pf-v5-c-inline-edit__group--m-footer--MarginTop: var(--pf-t--global--spacer--xl);
16071
16077
  --pf-v5-c-inline-edit__label--m-bold--FontWeight: var(--pf-t--global--font--weight--body--bold);
16072
16078
  }
package/patternfly-theme-dark-unversioned.css CHANGED
@@ -7905,6 +7905,7 @@ button.pf-v5-c-breadcrumb__link {
7905
7905
 
7906
7906
  :root,
7907
7907
  .pf-v5-c-button {
7908
+ --pf-v5-c-button--Display: inline-block;
7908
7909
  --pf-v5-c-button--PaddingTop: var(--pf-t--global--spacer--sm);
7909
7910
  --pf-v5-c-button--PaddingRight: var(--pf-t--global--spacer--lg);
7910
7911
  --pf-v5-c-button--PaddingBottom: var(--pf-t--global--spacer--sm);
@@ -7922,6 +7923,7 @@ button.pf-v5-c-breadcrumb__link {
7922
7923
  --pf-v5-c-button--BorderStartEndRadius: var(--pf-v5-c-button--BorderRadius);
7923
7924
  --pf-v5-c-button--BorderEndStartRadius: var(--pf-v5-c-button--BorderRadius);
7924
7925
  --pf-v5-c-button--BorderEndEndRadius: var(--pf-v5-c-button--BorderRadius);
7926
+ --pf-v5-c-button--MixBlendMode: normal;
7925
7927
  --pf-v5-c-button--hover--BackgroundColor: transparent;
7926
7928
  --pf-v5-c-button--hover--BorderColor: transparent;
7927
7929
  --pf-v5-c-button--hover--BorderWidth: var(--pf-t--global--border--width--button--hover);
@@ -7970,6 +7972,7 @@ button.pf-v5-c-breadcrumb__link {
7970
7972
  --pf-v5-c-button--m-link--PaddingLeft: var(--pf-t--global--spacer--md);
7971
7973
  --pf-v5-c-button--m-link--Color: var(--pf-t--global--text--color--brand--default);
7972
7974
  --pf-v5-c-button--m-link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
7975
+ --pf-v5-c-button--m-link--MixBlendMode: var(--pf-t--global--background--color--action--plain--hover--blend);
7973
7976
  --pf-v5-c-button--m-link__icon--Color: var(--pf-t--global--icon--color--brand--default);
7974
7977
  --pf-v5-c-button--m-link--hover--Color: var(--pf-t--global--text--color--brand--hover);
7975
7978
  --pf-v5-c-button--m-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
@@ -8121,7 +8124,7 @@ button.pf-v5-c-breadcrumb__link {
8121
8124
 
8122
8125
  .pf-v5-c-button {
8123
8126
  position: relative;
8124
- display: var(--pf-v5-c-button--Display, initial);
8127
+ display: var(--pf-v5-c-button--Display);
8125
8128
  flex: var(--pf-v5-c-button--Flex, initial);
8126
8129
  align-items: var(--pf-v5-c-button--AlignItems, initial);
8127
8130
  justify-content: var(--pf-v5-c-button--JustifyContent, initial);
@@ -8144,6 +8147,7 @@ button.pf-v5-c-breadcrumb__link {
8144
8147
  border-start-end-radius: var(--pf-v5-c-button--BorderStartEndRadius);
8145
8148
  border-end-start-radius: var(--pf-v5-c-button--BorderEndStartRadius);
8146
8149
  border-end-end-radius: var(--pf-v5-c-button--BorderEndEndRadius);
8150
+ mix-blend-mode: var(--pf-v5-c-button--MixBlendMode);
8147
8151
  }
8148
8152
  .pf-v5-c-button::after {
8149
8153
  position: absolute;
@@ -8210,6 +8214,7 @@ button.pf-v5-c-breadcrumb__link {
8210
8214
  --pf-v5-c-button--Color: var(--pf-v5-c-button--m-link--Color);
8211
8215
  --pf-v5-c-button--BorderRadius: var(--pf-v5-c-button--m-link--BorderRadius);
8212
8216
  --pf-v5-c-button--BackgroundColor: var(--pf-v5-c-button--m-link--BackgroundColor);
8217
+ --pf-v5-c-button--MixBlendMode: var(--pf-v5-c-button--m-link--MixBlendMode);
8213
8218
  --pf-v5-c-button__icon--Color: var(--pf-v5-c-button--m-link__icon--Color);
8214
8219
  --pf-v5-c-button--hover--Color: var(--pf-v5-c-button--m-link--hover--Color);
8215
8220
  --pf-v5-c-button--hover--BackgroundColor: var(--pf-v5-c-button--m-link--hover--BackgroundColor);
@@ -8335,6 +8340,7 @@ button.pf-v5-c-breadcrumb__link {
8335
8340
  --pf-v5-c-button--PaddingRight: var(--pf-v5-c-button--m-plain--PaddingRight);
8336
8341
  --pf-v5-c-button--PaddingBottom: var(--pf-v5-c-button--m-plain--PaddingBottom);
8337
8342
  --pf-v5-c-button--PaddingLeft: var(--pf-v5-c-button--m-plain--PaddingLeft);
8343
+ --pf-v5-c-button--MixBlendMode: var(--pf-v5-c-button--m-plain--MixBlendMode);
8338
8344
  --pf-v5-c-button--m-small--PaddingTop: var(--pf-v5-c-button--m-plain--m-small--PaddingTop);
8339
8345
  --pf-v5-c-button--m-small--PaddingRight: var(--pf-v5-c-button--m-plain--m-small--PaddingRight);
8340
8346
  --pf-v5-c-button--m-small--PaddingBottom: var(--pf-v5-c-button--m-plain--m-small--PaddingBottom);
@@ -8349,7 +8355,6 @@ button.pf-v5-c-breadcrumb__link {
8349
8355
  --pf-v5-c-button--disabled--Color: var(--pf-v5-c-button--m-plain--disabled--Color);
8350
8356
  --pf-v5-c-button__progress--Color: var(--pf-v5-c-button--m-in-progress--m-plain--Color);
8351
8357
  min-width: var(--pf-v5-c-button--m-plain--MinWidth);
8352
- mix-blend-mode: var(--pf-v5-c-button--m-plain--MixBlendMode);
8353
8358
  }
8354
8359
  .pf-v5-c-button.pf-m-plain.pf-m-no-padding {
8355
8360
  min-width: auto;
@@ -16179,11 +16184,12 @@ select ~ .pf-v5-c-form-control__utilities {
16179
16184
  transform: translateY(calc(-50% - 0.5 * var(--pf-v5-c-icon__content--svg--VerticalAlign)));
16180
16185
  }
16181
16186
 
16182
- .pf-v5-c-inline-edit {
16187
+ :where(:root),
16188
+ :where(.pf-v5-c-inline-edit) {
16183
16189
  --pf-v5-c-inline-edit__group--item--MarginRight: var(--pf-t--global--spacer--sm);
16184
16190
  --pf-v5-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
16185
16191
  --pf-v5-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
16186
- --pf-v5-c-inline-edit__action--m-icon-group--item--MarginRight: 0;
16192
+ --pf-v5-c-inline-edit__action--m-icon-group--item--MarginRight: var(--pf-t--global--spacer--sm);
16187
16193
  --pf-v5-c-inline-edit__group--m-footer--MarginTop: var(--pf-t--global--spacer--xl);
16188
16194
  --pf-v5-c-inline-edit__label--m-bold--FontWeight: var(--pf-t--global--font--weight--body--bold);
16189
16195
  }
package/patternfly.css CHANGED
@@ -7905,6 +7905,7 @@ button.pf-v5-c-breadcrumb__link {
7905
7905
 
7906
7906
  :root,
7907
7907
  .pf-v5-c-button {
7908
+ --pf-v5-c-button--Display: inline-block;
7908
7909
  --pf-v5-c-button--PaddingTop: var(--pf-t--global--spacer--sm);
7909
7910
  --pf-v5-c-button--PaddingRight: var(--pf-t--global--spacer--lg);
7910
7911
  --pf-v5-c-button--PaddingBottom: var(--pf-t--global--spacer--sm);
@@ -7922,6 +7923,7 @@ button.pf-v5-c-breadcrumb__link {
7922
7923
  --pf-v5-c-button--BorderStartEndRadius: var(--pf-v5-c-button--BorderRadius);
7923
7924
  --pf-v5-c-button--BorderEndStartRadius: var(--pf-v5-c-button--BorderRadius);
7924
7925
  --pf-v5-c-button--BorderEndEndRadius: var(--pf-v5-c-button--BorderRadius);
7926
+ --pf-v5-c-button--MixBlendMode: normal;
7925
7927
  --pf-v5-c-button--hover--BackgroundColor: transparent;
7926
7928
  --pf-v5-c-button--hover--BorderColor: transparent;
7927
7929
  --pf-v5-c-button--hover--BorderWidth: var(--pf-t--global--border--width--button--hover);
@@ -7970,6 +7972,7 @@ button.pf-v5-c-breadcrumb__link {
7970
7972
  --pf-v5-c-button--m-link--PaddingLeft: var(--pf-t--global--spacer--md);
7971
7973
  --pf-v5-c-button--m-link--Color: var(--pf-t--global--text--color--brand--default);
7972
7974
  --pf-v5-c-button--m-link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
7975
+ --pf-v5-c-button--m-link--MixBlendMode: var(--pf-t--global--background--color--action--plain--hover--blend);
7973
7976
  --pf-v5-c-button--m-link__icon--Color: var(--pf-t--global--icon--color--brand--default);
7974
7977
  --pf-v5-c-button--m-link--hover--Color: var(--pf-t--global--text--color--brand--hover);
7975
7978
  --pf-v5-c-button--m-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
@@ -8121,7 +8124,7 @@ button.pf-v5-c-breadcrumb__link {
8121
8124
 
8122
8125
  .pf-v5-c-button {
8123
8126
  position: relative;
8124
- display: var(--pf-v5-c-button--Display, initial);
8127
+ display: var(--pf-v5-c-button--Display);
8125
8128
  flex: var(--pf-v5-c-button--Flex, initial);
8126
8129
  align-items: var(--pf-v5-c-button--AlignItems, initial);
8127
8130
  justify-content: var(--pf-v5-c-button--JustifyContent, initial);
@@ -8144,6 +8147,7 @@ button.pf-v5-c-breadcrumb__link {
8144
8147
  border-start-end-radius: var(--pf-v5-c-button--BorderStartEndRadius);
8145
8148
  border-end-start-radius: var(--pf-v5-c-button--BorderEndStartRadius);
8146
8149
  border-end-end-radius: var(--pf-v5-c-button--BorderEndEndRadius);
8150
+ mix-blend-mode: var(--pf-v5-c-button--MixBlendMode);
8147
8151
  }
8148
8152
  .pf-v5-c-button::after {
8149
8153
  position: absolute;
@@ -8210,6 +8214,7 @@ button.pf-v5-c-breadcrumb__link {
8210
8214
  --pf-v5-c-button--Color: var(--pf-v5-c-button--m-link--Color);
8211
8215
  --pf-v5-c-button--BorderRadius: var(--pf-v5-c-button--m-link--BorderRadius);
8212
8216
  --pf-v5-c-button--BackgroundColor: var(--pf-v5-c-button--m-link--BackgroundColor);
8217
+ --pf-v5-c-button--MixBlendMode: var(--pf-v5-c-button--m-link--MixBlendMode);
8213
8218
  --pf-v5-c-button__icon--Color: var(--pf-v5-c-button--m-link__icon--Color);
8214
8219
  --pf-v5-c-button--hover--Color: var(--pf-v5-c-button--m-link--hover--Color);
8215
8220
  --pf-v5-c-button--hover--BackgroundColor: var(--pf-v5-c-button--m-link--hover--BackgroundColor);
@@ -8335,6 +8340,7 @@ button.pf-v5-c-breadcrumb__link {
8335
8340
  --pf-v5-c-button--PaddingRight: var(--pf-v5-c-button--m-plain--PaddingRight);
8336
8341
  --pf-v5-c-button--PaddingBottom: var(--pf-v5-c-button--m-plain--PaddingBottom);
8337
8342
  --pf-v5-c-button--PaddingLeft: var(--pf-v5-c-button--m-plain--PaddingLeft);
8343
+ --pf-v5-c-button--MixBlendMode: var(--pf-v5-c-button--m-plain--MixBlendMode);
8338
8344
  --pf-v5-c-button--m-small--PaddingTop: var(--pf-v5-c-button--m-plain--m-small--PaddingTop);
8339
8345
  --pf-v5-c-button--m-small--PaddingRight: var(--pf-v5-c-button--m-plain--m-small--PaddingRight);
8340
8346
  --pf-v5-c-button--m-small--PaddingBottom: var(--pf-v5-c-button--m-plain--m-small--PaddingBottom);
@@ -8349,7 +8355,6 @@ button.pf-v5-c-breadcrumb__link {
8349
8355
  --pf-v5-c-button--disabled--Color: var(--pf-v5-c-button--m-plain--disabled--Color);
8350
8356
  --pf-v5-c-button__progress--Color: var(--pf-v5-c-button--m-in-progress--m-plain--Color);
8351
8357
  min-width: var(--pf-v5-c-button--m-plain--MinWidth);
8352
- mix-blend-mode: var(--pf-v5-c-button--m-plain--MixBlendMode);
8353
8358
  }
8354
8359
  .pf-v5-c-button.pf-m-plain.pf-m-no-padding {
8355
8360
  min-width: auto;
@@ -16179,11 +16184,12 @@ select ~ .pf-v5-c-form-control__utilities {
16179
16184
  transform: translateY(calc(-50% - 0.5 * var(--pf-v5-c-icon__content--svg--VerticalAlign)));
16180
16185
  }
16181
16186
 
16182
- .pf-v5-c-inline-edit {
16187
+ :where(:root),
16188
+ :where(.pf-v5-c-inline-edit) {
16183
16189
  --pf-v5-c-inline-edit__group--item--MarginRight: var(--pf-t--global--spacer--sm);
16184
16190
  --pf-v5-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
16185
16191
  --pf-v5-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
16186
- --pf-v5-c-inline-edit__action--m-icon-group--item--MarginRight: 0;
16192
+ --pf-v5-c-inline-edit__action--m-icon-group--item--MarginRight: var(--pf-t--global--spacer--sm);
16187
16193
  --pf-v5-c-inline-edit__group--m-footer--MarginTop: var(--pf-t--global--spacer--xl);
16188
16194
  --pf-v5-c-inline-edit__label--m-bold--FontWeight: var(--pf-t--global--font--weight--body--bold);
16189
16195
  }