@patternfly/patternfly 6.1.0-prerelease.1 → 6.1.0-prerelease.11

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 (84) hide show
  1. package/README.md +5 -5
  2. package/components/Button/button.css +18 -2
  3. package/components/Button/button.scss +19 -3
  4. package/components/CodeEditor/code-editor.css +15 -0
  5. package/components/CodeEditor/code-editor.scss +16 -1
  6. package/components/Content/content.css +9 -0
  7. package/components/Content/content.scss +7 -0
  8. package/components/DataList/data-list.css +6 -0
  9. package/components/DataList/data-list.scss +7 -0
  10. package/components/Label/label-group.css +12 -0
  11. package/components/Label/label-group.scss +14 -0
  12. package/components/Label/label.css +5 -0
  13. package/components/Label/label.scss +5 -0
  14. package/components/Menu/menu.css +7 -3
  15. package/components/Menu/menu.scss +5 -3
  16. package/components/MenuToggle/menu-toggle.css +27 -11
  17. package/components/MenuToggle/menu-toggle.scss +24 -17
  18. package/components/Page/page.css +4 -1
  19. package/components/Page/page.scss +3 -2
  20. package/components/Table/table-grid.css +12 -12
  21. package/components/Table/table-grid.scss +4 -4
  22. package/components/Table/table-tree-view.css +4 -4
  23. package/components/Table/table-tree-view.scss +4 -4
  24. package/components/Table/table.css +10 -4
  25. package/components/Table/table.scss +13 -5
  26. package/components/Title/title.css +4 -0
  27. package/components/Title/title.scss +7 -0
  28. package/components/Wizard/wizard.css +1 -1
  29. package/components/Wizard/wizard.scss +1 -1
  30. package/components/_index.css +134 -38
  31. package/docs/components/Button/examples/Button.md +1 -1
  32. package/docs/components/CodeEditor/examples/CodeEditor.css +3 -0
  33. package/docs/components/CodeEditor/examples/CodeEditor.md +158 -7
  34. package/docs/components/Content/examples/Content.md +8 -7
  35. package/docs/components/DataList/examples/DataList.md +15 -13
  36. package/docs/components/InlineEdit/examples/InlineEdit.md +3 -18
  37. package/docs/components/Label/examples/Label.css +12 -0
  38. package/docs/components/Label/examples/Label.md +162 -0
  39. package/docs/components/Menu/examples/Menu.md +24 -32
  40. package/docs/components/MenuToggle/examples/MenuToggle.md +1309 -533
  41. package/docs/components/Page/examples/Page.css +1 -1
  42. package/docs/components/Page/examples/Page.md +10 -7
  43. package/docs/components/Table/examples/Table.md +469 -2769
  44. package/docs/components/Title/examples/Title.md +10 -0
  45. package/docs/demos/AboutModal/examples/AboutModal.md +2 -4
  46. package/docs/demos/Alert/examples/Alert.md +6 -12
  47. package/docs/demos/BackToTop/examples/BackToTop.md +2 -4
  48. package/docs/demos/Banner/examples/Banner.md +4 -8
  49. package/docs/demos/Card/examples/Card.css +4 -0
  50. package/docs/demos/Card/examples/Card.md +13 -21
  51. package/docs/demos/CardView/examples/CardView.md +2 -4
  52. package/docs/demos/Dashboard/examples/Dashboard.md +2 -4
  53. package/docs/demos/DataList/examples/DataList.md +13 -46
  54. package/docs/demos/DescriptionList/examples/DescriptionList.md +11 -42
  55. package/docs/demos/Drawer/examples/Drawer.md +6 -12
  56. package/docs/demos/JumpLinks/examples/JumpLinks.md +8 -16
  57. package/docs/demos/Masthead/examples/Masthead.md +18 -36
  58. package/docs/demos/Modal/examples/Modal.md +12 -24
  59. package/docs/demos/Nav/examples/Nav.md +12 -24
  60. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +10 -20
  61. package/docs/demos/Page/examples/Page.md +24 -48
  62. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +14 -28
  63. package/docs/demos/Skeleton/examples/Skeleton.md +2 -4
  64. package/docs/demos/Table/examples/Table.md +191 -984
  65. package/docs/demos/Tabs/examples/Tabs.md +18 -60
  66. package/docs/demos/Toolbar/examples/Toolbar.md +16 -80
  67. package/docs/demos/Wizard/examples/Wizard.md +18 -36
  68. package/docs/layouts/Level/examples/Level.css +1 -2
  69. package/docs/layouts/Level/examples/Level.md +15 -3
  70. package/docs/layouts/Split/examples/Split.css +1 -2
  71. package/docs/layouts/Split/examples/Split.md +4 -4
  72. package/docs/layouts/Stack/examples/Stack.css +1 -2
  73. package/docs/layouts/Stack/examples/Stack.md +4 -4
  74. package/layouts/Split/split.css +1 -2
  75. package/layouts/Split/split.scss +4 -3
  76. package/layouts/Stack/stack.css +1 -2
  77. package/layouts/Stack/stack.scss +4 -3
  78. package/layouts/_index.css +2 -4
  79. package/package.json +3 -3
  80. package/patternfly-no-globals.css +136 -42
  81. package/patternfly.css +136 -42
  82. package/patternfly.min.css +1 -1
  83. package/patternfly.min.css.map +1 -1
  84. package/sass-utilities/functions.scss +6 -0
package/docs/components/Page/examples/Page.css CHANGED
@@ -1,5 +1,5 @@
1
1
  /* Because the page component has height:100dvh, override it just for the embedded examples */
2
- .ws-mdx-content-content [id^=ws-core-c-page-] .pf-v6-c-page {
2
+ #ws-page-main [id^=ws-core-c-page-] .pf-v6-c-page {
3
3
  height: min-content;
4
4
  min-height: 30em;
5
5
  }
package/docs/components/Page/examples/Page.md CHANGED
@@ -152,10 +152,11 @@ wrapperTag: div
152
152
  </header>
153
153
  <div class="pf-v6-c-page__sidebar">
154
154
  <div class="pf-v6-c-page__sidebar-body">Navigation</div>
155
+ <div class="pf-v6-c-page__sidebar-body pf-m-fill">inset content</div>
155
156
  <div
156
- class="pf-v6-c-page__sidebar-body pf-m-fill pf-m-page-insets"
157
- >inset content</div>
158
- <div class="pf-v6-c-page__sidebar-body pf-m-page-insets">footer content</div>
157
+ class="pf-v6-c-page__sidebar-body pf-m-fill pf-m-inset-none"
158
+ >content that is not inset</div>
159
+ <div class="pf-v6-c-page__sidebar-body pf-m-no-fill">footer content</div>
159
160
  </div>
160
161
  <div class="pf-v6-c-page__main-container" tabindex="-1">
161
162
  <main class="pf-v6-c-page__main" tabindex="-1">
@@ -193,7 +194,7 @@ wrapperTag: div
193
194
  <span>Content</span>
194
195
  </div>
195
196
  </header>
196
- <div class="pf-v6-c-page__main-container" tabindex="-1">
197
+ <div class="pf-v6-c-page__main-container pf-m-fill" tabindex="-1">
197
198
  <main class="pf-v6-c-page__main" tabindex="-1">
198
199
  <section class="pf-v6-c-page__main-section">
199
200
  <div class="pf-v6-c-page__main-body">A regular page section.</div>
@@ -201,13 +202,15 @@ wrapperTag: div
201
202
  <section class="pf-v6-c-page__main-section pf-m-fill">
202
203
  <div class="pf-v6-c-page__main-body">
203
204
  This section uses
204
- <code>.pf-m-fill</code> to fill the available space.
205
+ <code>.pf-m-fill</code> to fill the available space. The
206
+ <code>.pf-v6-c-page__main-container</code> must also have
207
+ <code>.pf-m-fill</code> in order for the section to have space to stretch to full height.
205
208
  </div>
206
209
  </section>
207
210
  <section class="pf-v6-c-page__main-section pf-m-no-fill">
208
211
  <div class="pf-v6-c-page__main-body">
209
212
  This section uses
210
- <code>.pf-m-no-fill</code> not to fill the available space.
213
+ <code>.pf-m-no-fill</code> and will not fill the available space.
211
214
  </div>
212
215
  </section>
213
216
  </main>
@@ -416,7 +419,7 @@ This component provides the basic chrome for a page, including sidebar and main
416
419
  | `.pf-m-inset-none` | `.pf-v6-c-page__sidebar-body` | Removes a sidebar body left/right inset. |
417
420
  | `.pf-m-padding{-on-[breakpoint]}` | `.pf-v6-c-page__main-section` | Modifies the main page section to add padding back in at an optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). Should be used with pf-m-no-padding. |
418
421
  | `.pf-m-no-padding{-on-[breakpoint]}` | `.pf-v6-c-page__main-section` | Removes padding from the main page section at an optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). |
419
- | `.pf-m-fill` | `.pf-v6-c-page__main-container`, `.pf-v6-c-page__main-section`, `.pf-v6-c-page__main-group`, `.pf-v6-c-page__main-wizard`, `.pf-v6-c-page__sidebar-body` | Modifies the element to grow to fill the available space. |
422
+ | `.pf-m-fill` | `.pf-v6-c-page__main-container`, `.pf-v6-c-page__main-section`, `.pf-v6-c-page__main-group`, `.pf-v6-c-page__main-wizard`, `.pf-v6-c-page__sidebar-body` | Modifies the element to grow to fill the available space. Note that `.pf-v6-c-page__main-container` must also have `.pf-m-fill` applied in order for the section to have space to stretch to full height.|
420
423
  | `.pf-m-no-fill` | `.pf-v6-c-page__main-section`, `.pf-v6-c-page__main-group`, `.pf-v6-c-page__main-wizard`, `.pf-v6-c-page__sidebar-body` | Modifies the element not to grow to fill the available vertical space. |
421
424
  | `.pf-m-limit-width` | `.pf-v6-c-page__main-section` | Modifies a page section to limit the `max-width` of the content inside. |
422
425
  | `.pf-m-align-center` | `.pf-v6-c-page__main-section.pf-m-limit-width` | Modifies a page section body to align center. |