@patternfly/patternfly 6.0.0-alpha.139 → 6.0.0-alpha.140

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 (34) hide show
  1. package/components/MultipleFileUpload/multiple-file-upload.css +1 -1
  2. package/components/MultipleFileUpload/multiple-file-upload.scss +1 -1
  3. package/components/Nav/nav.css +7 -0
  4. package/components/Nav/nav.scss +11 -0
  5. package/components/_index.css +8 -1
  6. package/docs/components/Nav/examples/Navigation.md +253 -194
  7. package/docs/demos/AboutModal/examples/AboutModal.md +15 -5
  8. package/docs/demos/Alert/examples/Alert.md +45 -15
  9. package/docs/demos/BackToTop/examples/BackToTop.md +15 -5
  10. package/docs/demos/Banner/examples/Banner.md +30 -10
  11. package/docs/demos/CardView/examples/CardView.md +33 -13
  12. package/docs/demos/ContextSelector/examples/ContextSelector.md +60 -20
  13. package/docs/demos/Dashboard/examples/Dashboard.md +15 -5
  14. package/docs/demos/DataList/examples/DataList.md +60 -20
  15. package/docs/demos/DescriptionList/examples/DescriptionList.md +45 -15
  16. package/docs/demos/Drawer/examples/Drawer.md +75 -25
  17. package/docs/demos/JumpLinks/examples/JumpLinks.md +90 -30
  18. package/docs/demos/Masthead/examples/Masthead.md +135 -45
  19. package/docs/demos/Modal/examples/Modal.md +90 -30
  20. package/docs/demos/Nav/examples/Nav.md +132 -46
  21. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +75 -25
  22. package/docs/demos/Page/examples/Page.md +141 -47
  23. package/docs/demos/Page/examples/Penta.md +36 -12
  24. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +105 -35
  25. package/docs/demos/Skeleton/examples/Skeleton.md +15 -5
  26. package/docs/demos/Table/examples/Table.md +225 -75
  27. package/docs/demos/Tabs/examples/Tabs.md +90 -30
  28. package/docs/demos/Toolbar/examples/Toolbar.md +30 -10
  29. package/docs/demos/Wizard/examples/Wizard.md +135 -45
  30. package/package.json +1 -1
  31. package/patternfly-no-globals.css +8 -1
  32. package/patternfly.css +8 -1
  33. package/patternfly.min.css +1 -1
  34. package/patternfly.min.css.map +1 -1
package/components/MultipleFileUpload/multiple-file-upload.css CHANGED
@@ -61,7 +61,7 @@
61
61
  --pf-v6-c-multiple-file-upload__status--PaddingInlineEnd: var(--pf-t--global--spacer--md);
62
62
  --pf-v6-c-multiple-file-upload__status-progress--GridTemplateColumns: auto 1fr;
63
63
  --pf-v6-c-multiple-file-upload__status-progress--Gap: var(--pf-t--global--spacer--sm);
64
- --pf-v6-c-multiple-file-upload__status-progress-icon--Color: var(--pf-t--global--icon--color--regular);
64
+ --pf-v6-c-multiple-file-upload__status-progress-icon--Color: var(--pf-t--global--icon--color--brand--default);
65
65
  --pf-v6-c-multiple-file-upload__status-item--PaddingBlockStart: var(--pf-t--global--spacer--md);
66
66
  --pf-v6-c-multiple-file-upload__status-item--PaddingBlockEnd: var(--pf-t--global--spacer--md);
67
67
  --pf-v6-c-multiple-file-upload__status-item--GridTemplateColumns: auto 1fr auto;
package/components/MultipleFileUpload/multiple-file-upload.scss CHANGED
@@ -87,7 +87,7 @@
87
87
  --#{$multiple-file-upload}__status-progress--Gap: var(--pf-t--global--spacer--sm);
88
88
 
89
89
  // status progress icon
90
- --#{$multiple-file-upload}__status-progress-icon--Color: var(--pf-t--global--icon--color--regular);
90
+ --#{$multiple-file-upload}__status-progress-icon--Color: var(--pf-t--global--icon--color--brand--default);
91
91
 
92
92
  // status item
93
93
  --#{$multiple-file-upload}__status-item--PaddingBlockStart: var(--pf-t--global--spacer--md);
package/components/Nav/nav.css CHANGED
@@ -40,6 +40,8 @@
40
40
  --pf-v6-c-nav__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--alt--hover);
41
41
  --pf-v6-c-nav__link--m-current--BackgroundColor: var(--pf-t--global--background--color--action--plain--alt--clicked);
42
42
  --pf-v6-c-nav__link--m-current--Color: var(--pf-t--global--text--color--regular);
43
+ --pf-v6-c-nav__link-icon--Color: var(--pf-t--global--icon--color--subtle);
44
+ --pf-v6-c-nav__link--m-current__link-icon--Color: var(--pf-t--global--icon--color--regular);
43
45
  --pf-v6-c-nav__subnav--RowGap: var(--pf-t--global--border--width--extra-strong);
44
46
  --pf-v6-c-nav__subnav--PaddingInlineStart: var(--pf-t--global--spacer--md);
45
47
  --pf-v6-c-nav__scroll-button--BorderColor: var(--pf-t--global--border--color--default);
@@ -182,10 +184,15 @@
182
184
  background-color: var(--pf-v6-c-nav__link--hover--BackgroundColor);
183
185
  }
184
186
  .pf-v6-c-nav__link.pf-m-current, .pf-v6-c-nav__link.pf-m-current:hover {
187
+ --pf-v6-c-nav__link-icon--Color: var(--pf-v6-c-nav__link--m-current__link-icon--Color);
185
188
  color: var(--pf-v6-c-nav__link--m-current--Color);
186
189
  background-color: var(--pf-v6-c-nav__link--m-current--BackgroundColor);
187
190
  }
188
191
 
192
+ .pf-v6-c-nav__link-icon {
193
+ color: var(--pf-v6-c-nav__link-icon--Color);
194
+ }
195
+
189
196
  .pf-v6-c-nav__toggle {
190
197
  flex: none;
191
198
  align-self: start;
package/components/Nav/nav.scss CHANGED
@@ -54,6 +54,10 @@
54
54
  --#{$nav}__link--m-current--BackgroundColor: var(--pf-t--global--background--color--action--plain--alt--clicked);
55
55
  --#{$nav}__link--m-current--Color: var(--pf-t--global--text--color--regular);
56
56
 
57
+ // * Nav link icon
58
+ --#{$nav}__link-icon--Color: var(--pf-t--global--icon--color--subtle);
59
+ --#{$nav}__link--m-current__link-icon--Color: var(--pf-t--global--icon--color--regular);
60
+
57
61
  // * Nav subnav
58
62
  --#{$nav}__subnav--RowGap: var(--pf-t--global--border--width--extra-strong);
59
63
  --#{$nav}__subnav--PaddingInlineStart: var(--pf-t--global--spacer--md);
@@ -230,11 +234,18 @@
230
234
 
231
235
  &.pf-m-current,
232
236
  &.pf-m-current:hover {
237
+ --#{$nav}__link-icon--Color: var(--#{$nav}__link--m-current__link-icon--Color);
238
+
233
239
  color: var(--#{$nav}__link--m-current--Color);
234
240
  background-color: var(--#{$nav}__link--m-current--BackgroundColor);
235
241
  }
236
242
  }
237
243
 
244
+ // - Nav toggle caret
245
+ .#{$nav}__link-icon {
246
+ color: var(--#{$nav}__link-icon--Color);
247
+ }
248
+
238
249
  // - Nav toggle caret
239
250
  .#{$nav}__toggle {
240
251
  flex: none;
package/components/_index.css CHANGED
@@ -10581,7 +10581,7 @@ ul.pf-v6-c-list {
10581
10581
  --pf-v6-c-multiple-file-upload__status--PaddingInlineEnd: var(--pf-t--global--spacer--md);
10582
10582
  --pf-v6-c-multiple-file-upload__status-progress--GridTemplateColumns: auto 1fr;
10583
10583
  --pf-v6-c-multiple-file-upload__status-progress--Gap: var(--pf-t--global--spacer--sm);
10584
- --pf-v6-c-multiple-file-upload__status-progress-icon--Color: var(--pf-t--global--icon--color--regular);
10584
+ --pf-v6-c-multiple-file-upload__status-progress-icon--Color: var(--pf-t--global--icon--color--brand--default);
10585
10585
  --pf-v6-c-multiple-file-upload__status-item--PaddingBlockStart: var(--pf-t--global--spacer--md);
10586
10586
  --pf-v6-c-multiple-file-upload__status-item--PaddingBlockEnd: var(--pf-t--global--spacer--md);
10587
10587
  --pf-v6-c-multiple-file-upload__status-item--GridTemplateColumns: auto 1fr auto;
@@ -10770,6 +10770,8 @@ ul.pf-v6-c-list {
10770
10770
  --pf-v6-c-nav__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--alt--hover);
10771
10771
  --pf-v6-c-nav__link--m-current--BackgroundColor: var(--pf-t--global--background--color--action--plain--alt--clicked);
10772
10772
  --pf-v6-c-nav__link--m-current--Color: var(--pf-t--global--text--color--regular);
10773
+ --pf-v6-c-nav__link-icon--Color: var(--pf-t--global--icon--color--subtle);
10774
+ --pf-v6-c-nav__link--m-current__link-icon--Color: var(--pf-t--global--icon--color--regular);
10773
10775
  --pf-v6-c-nav__subnav--RowGap: var(--pf-t--global--border--width--extra-strong);
10774
10776
  --pf-v6-c-nav__subnav--PaddingInlineStart: var(--pf-t--global--spacer--md);
10775
10777
  --pf-v6-c-nav__scroll-button--BorderColor: var(--pf-t--global--border--color--default);
@@ -10912,10 +10914,15 @@ ul.pf-v6-c-list {
10912
10914
  background-color: var(--pf-v6-c-nav__link--hover--BackgroundColor);
10913
10915
  }
10914
10916
  .pf-v6-c-nav__link.pf-m-current, .pf-v6-c-nav__link.pf-m-current:hover {
10917
+ --pf-v6-c-nav__link-icon--Color: var(--pf-v6-c-nav__link--m-current__link-icon--Color);
10915
10918
  color: var(--pf-v6-c-nav__link--m-current--Color);
10916
10919
  background-color: var(--pf-v6-c-nav__link--m-current--BackgroundColor);
10917
10920
  }
10918
10921
 
10922
+ .pf-v6-c-nav__link-icon {
10923
+ color: var(--pf-v6-c-nav__link-icon--Color);
10924
+ }
10925
+
10919
10926
  .pf-v6-c-nav__toggle {
10920
10927
  flex: none;
10921
10928
  align-self: start;