@patternfly/patternfly 6.3.0-prerelease.63 → 6.3.0-prerelease.64

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/components/Alert/alert-group.css +4 -15
  2. package/components/Alert/alert-group.scss +6 -18
  3. package/components/_index.css +4 -15
  4. package/docs/components/Alert/examples/Alert.md +1 -2
  5. package/package.json +1 -1
  6. package/patternfly-no-globals.css +4 -15
  7. package/patternfly.css +4 -15
  8. package/patternfly.min.css +1 -1
  9. package/patternfly.min.css.map +1 -1
package/components/Alert/alert-group.css CHANGED
@@ -64,7 +64,7 @@
64
64
  --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration: initial;
65
65
  --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction: initial;
66
66
  --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition: initial;
67
- --pf-v6-c-alert-group__overflow-button--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
67
+ --pf-v6-c-alert-group__overflow-button--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
68
68
  --pf-v6-c-alert-group__overflow-button--BorderColor: var(--pf-t--global--border--color--high-contrast);
69
69
  --pf-v6-c-alert-group__overflow-button--BorderRadius: var(--pf-t--global--border--radius--medium);
70
70
  --pf-v6-c-alert-group__overflow-button--PaddingBlockStart: var(--pf-t--global--spacer--md);
@@ -74,7 +74,7 @@
74
74
  --pf-v6-c-alert-group__overflow-button--Color: var(--pf-t--global--text--color--link--default);
75
75
  --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-t--global--box-shadow--lg);
76
76
  --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-t--global--background--color--floating--default);
77
- --pf-v6-c-alert-group__overflow-button--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
77
+ --pf-v6-c-alert-group__overflow-button--hover--BorderWidth: var(--pf-t--global--border--width--high-contrast--strong);
78
78
  --pf-v6-c-alert-group__overflow-button--hover--Color: var(--pf-t--global--text--color--link--hover);
79
79
  --pf-v6-c-alert-group__overflow-button--hover--BackgroundColor: var(--pf-t--global--background--color--floating--hover);
80
80
  --pf-v6-c-alert-group__overflow-button--hover--BoxShadow: var(--pf-t--global--box-shadow--lg), var(--pf-t--global--box-shadow--lg--bottom);
@@ -119,6 +119,8 @@
119
119
  }
120
120
  .pf-v6-c-alert-group__overflow-button:hover, .pf-v6-c-alert-group__overflow-button:focus {
121
121
  --pf-v6-c-alert-group__overflow-button--BorderWidth: var(--pf-v6-c-alert-group__overflow-button--hover--BorderWidth);
122
+ --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-v6-c-alert-group__overflow-button--hover--BackgroundColor);
123
+ --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--hover--Color);
122
124
  }
123
125
 
124
126
  .pf-v6-c-alert-group__item {
@@ -174,17 +176,4 @@
174
176
  .pf-v6-c-alert-group__item.pf-m-offstage-right .pf-v6-c-alert, .pf-v6-c-alert-group__item.pf-m-outgoing .pf-v6-c-alert {
175
177
  transition: var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--Transition));
176
178
  }
177
- }
178
- .pf-v6-c-alert-group__item:hover {
179
- --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--hover--Color);
180
- --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-v6-c-alert-group__overflow-button--hover--BackgroundColor);
181
- --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--hover--BoxShadow);
182
- }
183
- .pf-v6-c-alert-group__item:focus {
184
- --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--focus--Color);
185
- --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--focus--BoxShadow);
186
- }
187
- .pf-v6-c-alert-group__item:active {
188
- --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--active--Color);
189
- --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--active--BoxShadow);
190
179
  }
package/components/Alert/alert-group.scss CHANGED
@@ -90,7 +90,7 @@
90
90
  --#{$alert-group}--m-toast__item--m-offstage-right--c-alert--Transition: initial;
91
91
 
92
92
  // Overflow button
93
- --#{$alert-group}__overflow-button--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
93
+ --#{$alert-group}__overflow-button--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
94
94
  --#{$alert-group}__overflow-button--BorderColor: var(--pf-t--global--border--color--high-contrast);
95
95
  --#{$alert-group}__overflow-button--BorderRadius: var(--pf-t--global--border--radius--medium);
96
96
  --#{$alert-group}__overflow-button--PaddingBlockStart: var(--pf-t--global--spacer--md);
@@ -100,9 +100,11 @@
100
100
  --#{$alert-group}__overflow-button--Color: var(--pf-t--global--text--color--link--default);
101
101
  --#{$alert-group}__overflow-button--BoxShadow: var(--pf-t--global--box-shadow--lg);
102
102
  --#{$alert-group}__overflow-button--BackgroundColor: var(--pf-t--global--background--color--floating--default);
103
- --#{$alert-group}__overflow-button--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
103
+ --#{$alert-group}__overflow-button--hover--BorderWidth: var(--pf-t--global--border--width--high-contrast--strong);
104
104
  --#{$alert-group}__overflow-button--hover--Color: var(--pf-t--global--text--color--link--hover);
105
105
  --#{$alert-group}__overflow-button--hover--BackgroundColor: var(--pf-t--global--background--color--floating--hover);
106
+
107
+ // TODO - remove this block in breaking change, not used
106
108
  --#{$alert-group}__overflow-button--hover--BoxShadow: var(--pf-t--global--box-shadow--lg), var(--pf-t--global--box-shadow--lg--bottom);
107
109
  --#{$alert-group}__overflow-button--focus--Color: var(--pf-t--global--text--color--link--hover);
108
110
  --#{$alert-group}__overflow-button--focus--BoxShadow: var(--pf-t--global--box-shadow--lg), var(--pf-t--global--box-shadow--lg--bottom);
@@ -152,6 +154,8 @@
152
154
  &:hover,
153
155
  &:focus {
154
156
  --#{$alert-group}__overflow-button--BorderWidth: var(--#{$alert-group}__overflow-button--hover--BorderWidth);
157
+ --#{$alert-group}__overflow-button--BackgroundColor: var(--#{$alert-group}__overflow-button--hover--BackgroundColor);
158
+ --#{$alert-group}__overflow-button--Color: var(--#{$alert-group}__overflow-button--hover--Color);
155
159
  }
156
160
  }
157
161
 
@@ -278,20 +282,4 @@
278
282
  }
279
283
  }
280
284
  }
281
-
282
- &:hover {
283
- --#{$alert-group}__overflow-button--Color: var(--#{$alert-group}__overflow-button--hover--Color);
284
- --#{$alert-group}__overflow-button--BackgroundColor: var(--#{$alert-group}__overflow-button--hover--BackgroundColor);
285
- --#{$alert-group}__overflow-button--BoxShadow: var(--#{$alert-group}__overflow-button--hover--BoxShadow);
286
- }
287
-
288
- &:focus {
289
- --#{$alert-group}__overflow-button--Color: var(--#{$alert-group}__overflow-button--focus--Color);
290
- --#{$alert-group}__overflow-button--BoxShadow: var(--#{$alert-group}__overflow-button--focus--BoxShadow);
291
- }
292
-
293
- &:active {
294
- --#{$alert-group}__overflow-button--Color: var(--#{$alert-group}__overflow-button--active--Color);
295
- --#{$alert-group}__overflow-button--BoxShadow: var(--#{$alert-group}__overflow-button--active--BoxShadow);
296
- }
297
285
  }
package/components/_index.css CHANGED
@@ -732,7 +732,7 @@
732
732
  --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration: initial;
733
733
  --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction: initial;
734
734
  --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition: initial;
735
- --pf-v6-c-alert-group__overflow-button--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
735
+ --pf-v6-c-alert-group__overflow-button--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
736
736
  --pf-v6-c-alert-group__overflow-button--BorderColor: var(--pf-t--global--border--color--high-contrast);
737
737
  --pf-v6-c-alert-group__overflow-button--BorderRadius: var(--pf-t--global--border--radius--medium);
738
738
  --pf-v6-c-alert-group__overflow-button--PaddingBlockStart: var(--pf-t--global--spacer--md);
@@ -742,7 +742,7 @@
742
742
  --pf-v6-c-alert-group__overflow-button--Color: var(--pf-t--global--text--color--link--default);
743
743
  --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-t--global--box-shadow--lg);
744
744
  --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-t--global--background--color--floating--default);
745
- --pf-v6-c-alert-group__overflow-button--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
745
+ --pf-v6-c-alert-group__overflow-button--hover--BorderWidth: var(--pf-t--global--border--width--high-contrast--strong);
746
746
  --pf-v6-c-alert-group__overflow-button--hover--Color: var(--pf-t--global--text--color--link--hover);
747
747
  --pf-v6-c-alert-group__overflow-button--hover--BackgroundColor: var(--pf-t--global--background--color--floating--hover);
748
748
  --pf-v6-c-alert-group__overflow-button--hover--BoxShadow: var(--pf-t--global--box-shadow--lg), var(--pf-t--global--box-shadow--lg--bottom);
@@ -787,6 +787,8 @@
787
787
  }
788
788
  .pf-v6-c-alert-group__overflow-button:hover, .pf-v6-c-alert-group__overflow-button:focus {
789
789
  --pf-v6-c-alert-group__overflow-button--BorderWidth: var(--pf-v6-c-alert-group__overflow-button--hover--BorderWidth);
790
+ --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-v6-c-alert-group__overflow-button--hover--BackgroundColor);
791
+ --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--hover--Color);
790
792
  }
791
793
 
792
794
  .pf-v6-c-alert-group__item {
@@ -843,19 +845,6 @@
843
845
  transition: var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--Transition));
844
846
  }
845
847
  }
846
- .pf-v6-c-alert-group__item:hover {
847
- --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--hover--Color);
848
- --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-v6-c-alert-group__overflow-button--hover--BackgroundColor);
849
- --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--hover--BoxShadow);
850
- }
851
- .pf-v6-c-alert-group__item:focus {
852
- --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--focus--Color);
853
- --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--focus--BoxShadow);
854
- }
855
- .pf-v6-c-alert-group__item:active {
856
- --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--active--Color);
857
- --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--active--BoxShadow);
858
- }
859
848
 
860
849
  .pf-v6-c-avatar {
861
850
  --pf-v6-c-avatar--BorderColor: transparent;
package/docs/components/Alert/examples/Alert.md CHANGED
@@ -798,8 +798,7 @@ For sighted users, interactive elements can be included in this message in one o
798
798
  </div>
799
799
  </div>
800
800
  </li>
801
-
802
- <li class="pf-v6-c-alert-group__item">
801
+ <li>
803
802
  <button
804
803
  class="pf-v6-c-alert-group__overflow-button"
805
804
  >View 3 more notifications</button>
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.3.0-prerelease.63",
4
+ "version": "6.3.0-prerelease.64",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "engines": {
package/patternfly-no-globals.css CHANGED
@@ -9399,7 +9399,7 @@
9399
9399
  --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration: initial;
9400
9400
  --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction: initial;
9401
9401
  --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition: initial;
9402
- --pf-v6-c-alert-group__overflow-button--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
9402
+ --pf-v6-c-alert-group__overflow-button--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
9403
9403
  --pf-v6-c-alert-group__overflow-button--BorderColor: var(--pf-t--global--border--color--high-contrast);
9404
9404
  --pf-v6-c-alert-group__overflow-button--BorderRadius: var(--pf-t--global--border--radius--medium);
9405
9405
  --pf-v6-c-alert-group__overflow-button--PaddingBlockStart: var(--pf-t--global--spacer--md);
@@ -9409,7 +9409,7 @@
9409
9409
  --pf-v6-c-alert-group__overflow-button--Color: var(--pf-t--global--text--color--link--default);
9410
9410
  --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-t--global--box-shadow--lg);
9411
9411
  --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-t--global--background--color--floating--default);
9412
- --pf-v6-c-alert-group__overflow-button--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
9412
+ --pf-v6-c-alert-group__overflow-button--hover--BorderWidth: var(--pf-t--global--border--width--high-contrast--strong);
9413
9413
  --pf-v6-c-alert-group__overflow-button--hover--Color: var(--pf-t--global--text--color--link--hover);
9414
9414
  --pf-v6-c-alert-group__overflow-button--hover--BackgroundColor: var(--pf-t--global--background--color--floating--hover);
9415
9415
  --pf-v6-c-alert-group__overflow-button--hover--BoxShadow: var(--pf-t--global--box-shadow--lg), var(--pf-t--global--box-shadow--lg--bottom);
@@ -9454,6 +9454,8 @@
9454
9454
  }
9455
9455
  .pf-v6-c-alert-group__overflow-button:hover, .pf-v6-c-alert-group__overflow-button:focus {
9456
9456
  --pf-v6-c-alert-group__overflow-button--BorderWidth: var(--pf-v6-c-alert-group__overflow-button--hover--BorderWidth);
9457
+ --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-v6-c-alert-group__overflow-button--hover--BackgroundColor);
9458
+ --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--hover--Color);
9457
9459
  }
9458
9460
 
9459
9461
  .pf-v6-c-alert-group__item {
@@ -9510,19 +9512,6 @@
9510
9512
  transition: var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--Transition));
9511
9513
  }
9512
9514
  }
9513
- .pf-v6-c-alert-group__item:hover {
9514
- --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--hover--Color);
9515
- --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-v6-c-alert-group__overflow-button--hover--BackgroundColor);
9516
- --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--hover--BoxShadow);
9517
- }
9518
- .pf-v6-c-alert-group__item:focus {
9519
- --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--focus--Color);
9520
- --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--focus--BoxShadow);
9521
- }
9522
- .pf-v6-c-alert-group__item:active {
9523
- --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--active--Color);
9524
- --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--active--BoxShadow);
9525
- }
9526
9515
 
9527
9516
  .pf-v6-c-avatar {
9528
9517
  --pf-v6-c-avatar--BorderColor: transparent;
package/patternfly.css CHANGED
@@ -9539,7 +9539,7 @@ button) {
9539
9539
  --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionDuration: initial;
9540
9540
  --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--TransitionTimingFunction: initial;
9541
9541
  --pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition: initial;
9542
- --pf-v6-c-alert-group__overflow-button--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
9542
+ --pf-v6-c-alert-group__overflow-button--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
9543
9543
  --pf-v6-c-alert-group__overflow-button--BorderColor: var(--pf-t--global--border--color--high-contrast);
9544
9544
  --pf-v6-c-alert-group__overflow-button--BorderRadius: var(--pf-t--global--border--radius--medium);
9545
9545
  --pf-v6-c-alert-group__overflow-button--PaddingBlockStart: var(--pf-t--global--spacer--md);
@@ -9549,7 +9549,7 @@ button) {
9549
9549
  --pf-v6-c-alert-group__overflow-button--Color: var(--pf-t--global--text--color--link--default);
9550
9550
  --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-t--global--box-shadow--lg);
9551
9551
  --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-t--global--background--color--floating--default);
9552
- --pf-v6-c-alert-group__overflow-button--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
9552
+ --pf-v6-c-alert-group__overflow-button--hover--BorderWidth: var(--pf-t--global--border--width--high-contrast--strong);
9553
9553
  --pf-v6-c-alert-group__overflow-button--hover--Color: var(--pf-t--global--text--color--link--hover);
9554
9554
  --pf-v6-c-alert-group__overflow-button--hover--BackgroundColor: var(--pf-t--global--background--color--floating--hover);
9555
9555
  --pf-v6-c-alert-group__overflow-button--hover--BoxShadow: var(--pf-t--global--box-shadow--lg), var(--pf-t--global--box-shadow--lg--bottom);
@@ -9594,6 +9594,8 @@ button) {
9594
9594
  }
9595
9595
  .pf-v6-c-alert-group__overflow-button:hover, .pf-v6-c-alert-group__overflow-button:focus {
9596
9596
  --pf-v6-c-alert-group__overflow-button--BorderWidth: var(--pf-v6-c-alert-group__overflow-button--hover--BorderWidth);
9597
+ --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-v6-c-alert-group__overflow-button--hover--BackgroundColor);
9598
+ --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--hover--Color);
9597
9599
  }
9598
9600
 
9599
9601
  .pf-v6-c-alert-group__item {
@@ -9650,19 +9652,6 @@ button) {
9650
9652
  transition: var(--pf-v6-c-alert-group--m-toast__item--m-offstage-right--c-alert--Transition, var(--pf-v6-c-alert-group--m-toast__item--m-outgoing--c-alert--Transition));
9651
9653
  }
9652
9654
  }
9653
- .pf-v6-c-alert-group__item:hover {
9654
- --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--hover--Color);
9655
- --pf-v6-c-alert-group__overflow-button--BackgroundColor: var(--pf-v6-c-alert-group__overflow-button--hover--BackgroundColor);
9656
- --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--hover--BoxShadow);
9657
- }
9658
- .pf-v6-c-alert-group__item:focus {
9659
- --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--focus--Color);
9660
- --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--focus--BoxShadow);
9661
- }
9662
- .pf-v6-c-alert-group__item:active {
9663
- --pf-v6-c-alert-group__overflow-button--Color: var(--pf-v6-c-alert-group__overflow-button--active--Color);
9664
- --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--active--BoxShadow);
9665
- }
9666
9655
 
9667
9656
  .pf-v6-c-avatar {
9668
9657
  --pf-v6-c-avatar--BorderColor: transparent;