@patternfly/patternfly 6.5.0-prerelease.26 → 6.5.0-prerelease.27

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 (37) hide show
  1. package/docs/components/Avatar/examples/Avatar.md +4 -4
  2. package/docs/components/Brand/examples/Brand.md +2 -2
  3. package/docs/components/Compass/examples/Compass.md +1 -1
  4. package/docs/components/DataList/examples/DataList.md +3 -3
  5. package/docs/components/DescriptionList/examples/DescriptionList.md +2 -2
  6. package/docs/components/Divider/examples/Divider.md +2 -2
  7. package/docs/components/Drawer/examples/Drawer.md +3 -3
  8. package/docs/components/Icon/examples/Icon.md +1 -1
  9. package/docs/components/JumpLinks/examples/JumpLinks.md +2 -2
  10. package/docs/components/Masthead/examples/masthead.md +1 -1
  11. package/docs/components/Menu/examples/Menu.md +2 -2
  12. package/docs/components/Page/examples/Page.md +2 -2
  13. package/docs/components/Pagination/examples/Pagination.md +3 -3
  14. package/docs/components/ProgressStepper/examples/ProgressStepper.md +2 -2
  15. package/docs/components/Sidebar/examples/Sidebar.md +1 -1
  16. package/docs/components/Table/examples/Table.md +3 -3
  17. package/docs/components/Tabs/examples/Tabs.md +3 -3
  18. package/docs/components/Toolbar/examples/Toolbar.md +7 -7
  19. package/docs/demos/Compass/examples/Compass.md +1 -1
  20. package/docs/layouts/Bullseye/examples/Bullseye.md +2 -1
  21. package/docs/layouts/Flex/examples/Flex.md +3 -2
  22. package/docs/layouts/Gallery/examples/Gallery.md +4 -3
  23. package/docs/layouts/Grid/examples/Grid.md +6 -5
  24. package/docs/layouts/Level/examples/Level.md +2 -1
  25. package/docs/layouts/Split/examples/Split.md +2 -1
  26. package/docs/layouts/Stack/examples/Stack.md +2 -1
  27. package/docs/utilities/Accessibility/examples/Accessibility.md +3 -2
  28. package/docs/utilities/Alignment/examples/Alignment.md +3 -2
  29. package/docs/utilities/BackgroundColor/examples/BackgroundColor.md +5 -4
  30. package/docs/utilities/BoxShadow/examples/box-shadow.md +2 -1
  31. package/docs/utilities/Display/examples/Display.md +3 -2
  32. package/docs/utilities/Flex/examples/Flex.md +3 -2
  33. package/docs/utilities/Float/examples/Float.md +3 -2
  34. package/docs/utilities/Sizing/examples/Sizing.md +8 -7
  35. package/docs/utilities/Spacing/examples/Spacing.md +3 -2
  36. package/docs/utilities/Text/examples/Text.md +4 -3
  37. package/package.json +1 -1
package/docs/components/Avatar/examples/Avatar.md CHANGED
@@ -88,7 +88,7 @@ The avatar component provides a default SVG icon. If an image is used it should
88
88
  | -- | -- | -- |
89
89
  | `.pf-v6-c-avatar` | `<img>` | Initiates an avatar image. **Required** |
90
90
  | `.pf-m-bordered` | `.pf-v6-c-avatar` | Modifies an avatar to have a border. |
91
- | `.pf-m-sm{-on-[breakpoint]}` | `.pf-v6-c-avatar` | Modifies an avatar to be small on an optional [breakpoint](/tokens/all-patternfly-tokens). |
92
- | `.pf-m-md{-on-[breakpoint]}` | `.pf-v6-c-avatar` | Modifies an avatar to be medium on an optional [breakpoint](/tokens/all-patternfly-tokens). **Note:** This is the default size. |
93
- | `.pf-m-lg{-on-[breakpoint]}` | `.pf-v6-c-avatar` | Modifies an avatar to be large on an optional [breakpoint](/tokens/all-patternfly-tokens). |
94
- | `.pf-m-xl{-on-[breakpoint]}` | `.pf-v6-c-avatar` | Modifies an avatar to be extra large on an optional [breakpoint](/tokens/all-patternfly-tokens). |
91
+ | `.pf-m-sm{-on-[breakpoint]}` | `.pf-v6-c-avatar` | Modifies an avatar to be small on an optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
92
+ | `.pf-m-md{-on-[breakpoint]}` | `.pf-v6-c-avatar` | Modifies an avatar to be medium on an optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). **Note:** This is the default size. |
93
+ | `.pf-m-lg{-on-[breakpoint]}` | `.pf-v6-c-avatar` | Modifies an avatar to be large on an optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
94
+ | `.pf-m-xl{-on-[breakpoint]}` | `.pf-v6-c-avatar` | Modifies an avatar to be extra large on an optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
package/docs/components/Brand/examples/Brand.md CHANGED
@@ -83,5 +83,5 @@ Simple brand component.
83
83
  | -- | -- | -- |
84
84
  | `.pf-v6-c-brand` | `<img>, <picture>` | Initiates a brand image. **Required** |
85
85
  | `.pf-m-picture` | `.pf-v6-c-brand` | Modifies a brand image to a picture. |
86
- | `--pf-v6-c-brand--Width{-on-[breakpoint]}: {width}` | `.pf-v6-c-brand` | Modifies the width value of a picture on optional [breakpoint](/tokens/all-patternfly-tokens). |
87
- | `--pf-v6-c-brand--Height{-on-[breakpoint]}: {height}` | `.pf-v6-c-brand` | Modifies the height value of a picture on optional [breakpoint](/tokens/all-patternfly-tokens). |
86
+ | `--pf-v6-c-brand--Width{-on-[breakpoint]}: {width}` | `.pf-v6-c-brand` | Modifies the width value of a picture on optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
87
+ | `--pf-v6-c-brand--Height{-on-[breakpoint]}: {height}` | `.pf-v6-c-brand` | Modifies the height value of a picture on optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
package/docs/components/Compass/examples/Compass.md CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  id: 'Compass'
3
3
  beta: true
4
- section: PatternFly-AI
4
+ section: AI
5
5
  subsection: Generative UIs
6
6
  cssPrefix: pf-v6-c-compass
7
7
  ---import './Compass.css';
package/docs/components/DataList/examples/DataList.md CHANGED
@@ -305,8 +305,8 @@ When a list item includes more than one block of content, it can be difficult fo
305
305
  | `.pf-v6-c-data-list__item-action` | `<div>` | Initiates a container for the data list actions. For example, add `.pf-v6-c-data-list__action` here. **Required** |
306
306
  | `.pf-v6-c-data-list__check` | `<div>` | Initiates a data list check cell. **Required** |
307
307
  | `.pf-v6-c-data-list__action` | `<div>` | Initiates a data list action button cell. **Required** |
308
- | `.pf-m-hidden{-on-[breakpoint]}` | `.pf-v6-c-data-list__item-action` | Hides an actions container at optional [breakpoint](/tokens/all-patternfly-tokens), or hides it at all breakpoints with `.pf-m-hidden`. |
309
- | `.pf-m-visible{-on-[breakpoint]}` | `.pf-v6-c-data-list__item-action` | Shows an actions container at optional [breakpoint](/tokens/all-patternfly-tokens). |
308
+ | `.pf-m-hidden{-on-[breakpoint]}` | `.pf-v6-c-data-list__item-action` | Hides an actions container at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens), or hides it at all breakpoints with `.pf-m-hidden`. |
309
+ | `.pf-m-visible{-on-[breakpoint]}` | `.pf-v6-c-data-list__item-action` | Shows an actions container at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
310
310
 
311
311
  ## Exandable data list
312
312
 
@@ -2116,7 +2116,7 @@ When a list item includes more than one block of content, it can be difficult fo
2116
2116
 
2117
2117
  | Class | Applied to | Outcome |
2118
2118
  | -- | -- | -- |
2119
- | `.pf-m-grid{-[none, sm, md, lg, xl, 2xl]}` | `.pf-v6-c-data-list` | Modifies the data list to switch to a grid layout at a specified [breakpoint](/tokens/all-patternfly-tokens). `.pf-m-grid` will display the grid layout at all breakpoints. `.pf-m-grid-none` will display the desktop layout at all breakpoints. **Note:** Without a grid modifier, the data list will display the grid layout by default and switch to the desktop layout at a medium breakpoint. |
2119
+ | `.pf-m-grid{-[none, sm, md, lg, xl, 2xl]}` | `.pf-v6-c-data-list` | Modifies the data list to switch to a grid layout at a specified [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). `.pf-m-grid` will display the grid layout at all breakpoints. `.pf-m-grid-none` will display the desktop layout at all breakpoints. **Note:** Without a grid modifier, the data list will display the grid layout by default and switch to the desktop layout at a medium breakpoint. |
2120
2120
 
2121
2121
  ## Documentation
2122
2122
 
package/docs/components/DescriptionList/examples/DescriptionList.md CHANGED
@@ -1669,8 +1669,8 @@ description-list--aria-label="Horizontal 2 column auto term width example" descr
1669
1669
  | `.pf-m-auto-column-widths` | `.pf-v6-c-description-list` | Modifies the description list to format automatically. |
1670
1670
  | `.pf-m-inline-grid` | `.pf-v6-c-description-list` | Modifies the description list display to inline-grid. |
1671
1671
  | `.pf-m-{1,2,3}-col{-on-[sm, md, lg, xl, 2xl]}` | `.pf-v6-c-description-list` | Modifies the description list number of columns. |
1672
- | `--pf-v6-c-description-list--GridTemplateColumns--min{-on-[breakpoint]}: {width}` | `.pf-v6-c-description-list` | Modifies the min value of the `grid-template-columns` declaration at optional [breakpoint](/tokens/all-patternfly-tokens). |
1673
- | `--pf-v6-c-description-list--m-horizontal__term--width{-on-[breakpoint]}: {width}` | `.pf-v6-c-description-list.pf-m-horizontal` | Modifies the description list term width at optional [breakpoint](/tokens/all-patternfly-tokens). |
1672
+ | `--pf-v6-c-description-list--GridTemplateColumns--min{-on-[breakpoint]}: {width}` | `.pf-v6-c-description-list` | Modifies the min value of the `grid-template-columns` declaration at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
1673
+ | `--pf-v6-c-description-list--m-horizontal__term--width{-on-[breakpoint]}: {width}` | `.pf-v6-c-description-list.pf-m-horizontal` | Modifies the description list term width at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
1674
1674
 
1675
1675
  <!-- | `.pf-m-order[0-12]{-on-[breakpoint]}` | `.pf-v6-c-description-list__group` | Modifies the order of the flex layout element. |
1676
1676
  | `.pf-m-order-first{-on-[breakpoint]}` | `.pf-v6-c-description-list__group` | Modifies the order of the flex layout element to -1. |
package/docs/components/Divider/examples/Divider.md CHANGED
@@ -134,5 +134,5 @@ The divider renders as an `<hr>` by default. It is possible to make the divider
134
134
  | `.pf-v6-c-divider` | `<hr>`, `<li>`, `<div>` | Defines the divider component. |
135
135
  | `.pf-m-vertical` | `.pf-v6-c-divider` | Modifies the divider component from horizontal to vertical. This modifier requires that the parent has an explicit or implicit height, or has a flex or grid based layout parent. |
136
136
  | `.pf-m-inset-{none, sm, md, lg, xl, 2xl, 3xl}{-on-[sm, md, lg, xl, 2xl]}` | `.pf-v6-c-divider` | Modifies divider padding/inset to visually match padding of other adjacent components. |
137
- | `.pf-m-hidden{-on-[breakpoint]}` | `.pf-v6-c-divider` | Modifies a divider to be hidden, at optional [breakpoint](/tokens/all-patternfly-tokens). |
138
- | `.pf-m-visible{-on-[breakpoint]}` | `.pf-v6-c-divider` | Modifies a divider to be shown, at optional [breakpoint](/tokens/all-patternfly-tokens). |
137
+ | `.pf-m-hidden{-on-[breakpoint]}` | `.pf-v6-c-divider` | Modifies a divider to be hidden, at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
138
+ | `.pf-m-visible{-on-[breakpoint]}` | `.pf-v6-c-divider` | Modifies a divider to be shown, at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
package/docs/components/Drawer/examples/Drawer.md CHANGED
@@ -875,8 +875,8 @@ cssPrefix: pf-v6-c-drawer
875
875
  | `.pf-m-panel-left` | `.pf-v6-c-drawer` | Modifies the drawer panel to expand from the left. |
876
876
  | `.pf-m-panel-bottom` | `.pf-v6-c-drawer` | Modifies the drawer panel to expand from the bottom. **Note:** percentage based panel sizes require the drawer component's parent element have an implicit or explicit height. |
877
877
  | `.pf-m-expanded` | `.pf-v6-c-drawer` | Modifies the drawer panel for the expanded state. |
878
- | `.pf-m-static{-on-[lg, xl, 2xl]}` | `.pf-v6-c-drawer` | Modifies the drawer panel state to always show both content and panel at optional [breakpoint](/tokens/all-patternfly-tokens). |
879
- | `.pf-m-inline{-on-[lg, xl, 2xl]}` | `.pf-v6-c-drawer` | Modifies the drawer so the content element and panel element are displayed side by side. `.pf-m-inline` used without a [breakpoint](/tokens/all-patternfly-tokens) will default to the `md` breakpoint. |
878
+ | `.pf-m-static{-on-[lg, xl, 2xl]}` | `.pf-v6-c-drawer` | Modifies the drawer panel state to always show both content and panel at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
879
+ | `.pf-m-inline{-on-[lg, xl, 2xl]}` | `.pf-v6-c-drawer` | Modifies the drawer so the content element and panel element are displayed side by side. `.pf-m-inline` used without a [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens) will default to the `md` breakpoint. |
880
880
  | `.pf-m-pill` | `.pf-v6-c-drawer` | Modifies the drawer for pill styles. |
881
881
  | `.pf-m-no-glass` | `.pf-v6-c-drawer__panel.pf-m-pill` | Modifies the drawer panel to remove glass styling when using glass theme. |
882
882
  | `.pf-m-no-border` | `.pf-v6-c-drawer__panel` | Modifies the drawer panel border treatment to disable all border treatment. |
@@ -885,7 +885,7 @@ cssPrefix: pf-v6-c-drawer
885
885
  | `.pf-m-no-background` | `.pf-v6-c-drawer__section`, `.pf-v6-c-drawer__panel` | Modifies the drawer element background color to transparent. |
886
886
  | `.pf-m-primary` | `.pf-v6-c-drawer__content` | Modifies the drawer content to use the primary background color. |
887
887
  | `.pf-m-secondary` | `.pf-v6-c-drawer__section`, `.pf-v6-c-drawer__content`, `.pf-v6-c-drawer__panel` | Modifies the drawer element to use the secondary background color. |
888
- | `.pf-m-width-{25, 33, 50, 66, 75, 100}{-on-[breakpoint]}` | `.pf-v6-c-drawer__panel` | Modifies the drawer panel width at optional [breakpoint](/tokens/all-patternfly-tokens). |
888
+ | `.pf-m-width-{25, 33, 50, 66, 75, 100}{-on-[breakpoint]}` | `.pf-v6-c-drawer__panel` | Modifies the drawer panel width at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
889
889
  | `.pf-m-resizable` | `.pf-v6-c-drawer__panel` | Modifies the drawer panel to be resizable. Intended for use with the `.pf-v6-c-drawer__splitter` element. |
890
890
  | `.pf-m-vertical` | `.pf-v6-c-drawer__splitter` | Modifies the splitter to be vertical. |
891
891
  | `--pf-v6-c-drawer__panel--md--FlexBasis--min` | `.pf-v6-c-drawer__panel` | Defines the drawer panel minimum size. |
package/docs/components/Icon/examples/Icon.md CHANGED
@@ -295,7 +295,7 @@ extra large
295
295
 
296
296
  The icon element is a container used to maintain a stable space for an icon or spinner, regardless of size or aspect ratio of the contents.
297
297
 
298
- Refer to the [icons](/design-foundations/icons) page for information about the PatternFly icon set and guidelines for use.
298
+ Refer to the [icons](/foundations-and-styles/icons) page for information about the PatternFly icon set and guidelines for use.
299
299
 
300
300
  ### Usage
301
301
 
package/docs/components/JumpLinks/examples/JumpLinks.md CHANGED
@@ -855,7 +855,7 @@ cssPrefix: pf-v6-c-jump-links
855
855
  | `.pf-v6-c-jump-links__link-text` | `<div>` | Initiates the jump links link text. |
856
856
  | `.pf-m-vertical` | `.pf-v6-c-jump-links` | Modifies the jump links component to be vertical. |
857
857
  | `.pf-m-center` | `.pf-v6-c-jump-links` | Modifies the jump links component to center its list and label. |
858
- | `.pf-m-expandable{-on-[breakpoint]}` | `.pf-v6-c-jump-links` | Modifies the jump links component to be expandable via a toggle at optional [breakpoint](/tokens/all-patternfly-tokens). **Note:** works with vertical jump links only. |
859
- | `.pf-m-non-expandable{-on-[breakpoint]}` | `.pf-v6-c-jump-links` | Modifies the jump links component to be non-expandable at optional [breakpoint](/tokens/all-patternfly-tokens). |
858
+ | `.pf-m-expandable{-on-[breakpoint]}` | `.pf-v6-c-jump-links` | Modifies the jump links component to be expandable via a toggle at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). **Note:** works with vertical jump links only. |
859
+ | `.pf-m-non-expandable{-on-[breakpoint]}` | `.pf-v6-c-jump-links` | Modifies the jump links component to be non-expandable at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
860
860
  | `.pf-m-expanded` | `.pf-v6-c-jump-links` | Modifies the expandable jump links component for the expanded state. |
861
861
  | `.pf-m-current` | `.pf-v6-c-jump-links__item`| Modifies the jump links item to be current. |
package/docs/components/Masthead/examples/masthead.md CHANGED
@@ -696,4 +696,4 @@ cssPrefix: pf-v6-c-masthead
696
696
  | `.pf-v6-c-masthead__brand` | `<div>` | Initiates the masthead content component. |
697
697
  | `.pf-v6-c-masthead__logo` | `<a>, <div>` | Initiates the masthead content component. |
698
698
  | `.pf-v6-c-masthead__content` | `<div>` | Initiates the masthead content component. |
699
- | `.pf-m-inset-{none, sm, md, lg, xl, 2xl}{-on-[breakpoint]}` | `.pf-v6-c-masthead` | Modifies masthead horizontal padding at optional [breakpoint](/tokens/all-patternfly-tokens). |
699
+ | `.pf-m-inset-{none, sm, md, lg, xl, 2xl}{-on-[breakpoint]}` | `.pf-v6-c-masthead` | Modifies masthead horizontal padding at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
package/docs/components/Menu/examples/Menu.md CHANGED
@@ -6450,8 +6450,8 @@ cssPrefix: pf-v6-c-menu
6450
6450
  | `.pf-v6-c-menu__item-action-icon` | `<span>` | Initiates the menu item action icon. |
6451
6451
  | `.pf-v6-c-menu__item-external-icon` | `<span>` | Initiates the menu item external icon. |
6452
6452
  | `.pf-v6-c-menu__footer` | `<div>` | Initiates the menu footer. |
6453
- | `.pf-m-hidden{-on-[breakpoint]}` | `.pf-v6-c-menu__list`, `.pf-v6-c-menu__list-item`, `.pf-v6-c-menu__group` | Modifies a menu element to be hidden, at optional [breakpoint](/tokens/all-patternfly-tokens). |
6454
- | `.pf-m-visible{-on-[breakpoint]}` | `.pf-v6-c-menu__list`, `.pf-v6-c-menu__list-item`, `.pf-v6-c-menu__group` | Modifies a menu element to be shown, at optional [breakpoint](/tokens/all-patternfly-tokens). |
6453
+ | `.pf-m-hidden{-on-[breakpoint]}` | `.pf-v6-c-menu__list`, `.pf-v6-c-menu__list-item`, `.pf-v6-c-menu__group` | Modifies a menu element to be hidden, at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
6454
+ | `.pf-m-visible{-on-[breakpoint]}` | `.pf-v6-c-menu__list`, `.pf-v6-c-menu__list-item`, `.pf-v6-c-menu__group` | Modifies a menu element to be shown, at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
6455
6455
  | `.pf-m-favorite` | `.pf-v6-c-menu__item-action` | Modifies the menu item action to handle the favorite icon. |
6456
6456
  | `.pf-m-favorited` | `.pf-v6-c-menu__item-action.pf-m-favorite` | Modifies the menu item action icon to be favorited. |
6457
6457
  | `.pf-m-selected` | `.pf-v6-c-menu__item` | Modifies the menu item to be selected. |
package/docs/components/Page/examples/Page.md CHANGED
@@ -551,8 +551,8 @@ This component provides the basic chrome for a page, including sidebar and main
551
551
  | `.pf-m-page-insets` | `.pf-v6-c-page__sidebar-body` | Modifies a sidebar body padding/inset to visually match padding of page elements. |
552
552
  | `.pf-m-context-selector` | `.pf-v6-c-page__sidebar-body` | Modifies a sidebar body to contain a context selector. |
553
553
  | `.pf-m-inset-none` | `.pf-v6-c-page__sidebar-body` | Removes a sidebar body left/right inset. |
554
- | `.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](/tokens/all-patternfly-tokens). Should be used with pf-m-no-padding. |
555
- | `.pf-m-no-padding{-on-[breakpoint]}` | `.pf-v6-c-page__main-section` | Removes padding from the main page section at an optional [breakpoint](/tokens/all-patternfly-tokens). |
554
+ | `.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](/foundations-and-styles/design-tokens/all-design-tokens). Should be used with pf-m-no-padding. |
555
+ | `.pf-m-no-padding{-on-[breakpoint]}` | `.pf-v6-c-page__main-section` | Removes padding from the main page section at an optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
556
556
  | `.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.|
557
557
  | `.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. |
558
558
  | `.pf-m-limit-width` | `.pf-v6-c-page__main-section` | Modifies a page section to limit the `max-width` of the content inside. |
package/docs/components/Pagination/examples/Pagination.md CHANGED
@@ -1224,13 +1224,13 @@ cssPrefix: pf-v6-c-pagination
1224
1224
  | `.pf-v6-c-pagination__nav` | `<nav>` | Initiates pagination nav. |
1225
1225
  | `.pf-v6-c-pagination__nav-control` | `<div>` | Initiates pagination nav control. |
1226
1226
  | `.pf-v6-c-pagination__nav-page-select` | `<div>` | Initiates pagination nav page select. |
1227
- | `.pf-m-display-summary{-on-[breakpoint]}` | `.pf-v6-c-pagination` | Modifies for summary display pagination component styles at optional [breakpoint](/tokens/all-patternfly-tokens). |
1228
- | `.pf-m-display-full{-on-[breakpoint]}` | `.pf-v6-c-pagination` | Modifies for full display pagination component styles at optional [breakpoint](/tokens/all-patternfly-tokens). |
1227
+ | `.pf-m-display-summary{-on-[breakpoint]}` | `.pf-v6-c-pagination` | Modifies for summary display pagination component styles at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
1228
+ | `.pf-m-display-full{-on-[breakpoint]}` | `.pf-v6-c-pagination` | Modifies for full display pagination component styles at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
1229
1229
  | `.pf-m-bottom` | `.pf-v6-c-pagination` | Modifies for bottom pagination component styles. |
1230
1230
  | `.pf-m-compact` | `.pf-v6-c-pagination` | Modifies for compact pagination component styles. |
1231
1231
  | `.pf-m-static` | `.pf-v6-c-pagination.pf-m-bottom` | Modifies bottom pagination to not be positioned sticky on summary. |
1232
1232
  | `.pf-m-sticky` | `.pf-v6-c-pagination` | Modifies the pagination to be sticky to its container. It will be sticky to the top of the container by default, and sticky to the bottom of the container when applied to `.pf-v6-c-pagination.pf-m-bottom`. |
1233
- | `.pf-m-inset-{none, sm, md, lg, xl, 2xl}{-on-[breakpoint]}` | `.pf-v6-c-pagination` | Modifies pagination horizontal padding at optional [breakpoint](/tokens/all-patternfly-tokens). |
1233
+ | `.pf-m-inset-{none, sm, md, lg, xl, 2xl}{-on-[breakpoint]}` | `.pf-v6-c-pagination` | Modifies pagination horizontal padding at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
1234
1234
  | `.pf-m-page-insets` | `.pf-v6-c-pagination` | Modifies the pagination component padding/inset to visually match padding of page elements. |
1235
1235
  | `.pf-m-first` | `.pf-v6-c-pagination__nav-control` | Indicates the control is for the first page button. |
1236
1236
  | `.pf-m-prev` | `.pf-v6-c-pagination__nav-control` | Indicates the control is for the previous page button. |
package/docs/components/ProgressStepper/examples/ProgressStepper.md CHANGED
@@ -959,8 +959,8 @@ Steps can be modified with `.pf-m-success`, `.pf-m-warning`, `.pf-m-danger`, `.p
959
959
  | `.progress-stepper__step-title` | `<div>`, `<button>` | Contains the title of the step. **Note:** the step title is a `<button>` when it has `.pf-m-help-text` and is used to trigger a popover with help text. |
960
960
  | `.progress-stepper__step-description` | `<div>` | Contains the description of the step. |
961
961
  | `.pf-m-center`| `.pf-v6-c-progress-stepper` | Modifies to center each step. |
962
- | `.pf-m-vertical{-on-[breakpoint]}`| `.pf-v6-c-progress-stepper` | Modifies progress stepper vertical layout at optional [breakpoint](/tokens/all-patternfly-tokens). |
963
- | `.pf-m-horizontal{-on-[breakpoint]}`| `.pf-v6-c-progress-stepper` | Modifies progress stepper horizontal layout at optional [breakpoint](/tokens/all-patternfly-tokens). |
962
+ | `.pf-m-vertical{-on-[breakpoint]}`| `.pf-v6-c-progress-stepper` | Modifies progress stepper vertical layout at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
963
+ | `.pf-m-horizontal{-on-[breakpoint]}`| `.pf-v6-c-progress-stepper` | Modifies progress stepper horizontal layout at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
964
964
  | `.pf-m-compact`| `.pf-v6-c-progress-stepper` | Modifies for compact styling. |
965
965
  | `.pf-m-success`| `.pf-v6-c-progress-stepper__step` | Modifies for success styling. |
966
966
  | `.pf-m-warning`| `.pf-v6-c-progress-stepper__step` | Modifies for warning styling. |
package/docs/components/Sidebar/examples/Sidebar.md CHANGED
@@ -265,6 +265,6 @@ cssPrefix: pf-v6-c-sidebar
265
265
  | `.pf-m-panel-right` | `.pf-v6-c-sidebar` | Modifies the sidebar to place the panel to the right of the content. |
266
266
  | `.pf-m-sticky` | `.pf-v6-c-sidebar__panel` | Modifies the panel to be sticky to the top of the layout. |
267
267
  | `.pf-m-static` | `.pf-v6-c-sidebar__panel` | Modifies the panel to be positioned statically. |
268
- | `.pf-m-width-{default, 25, 33, 50, 66, 75, 100}{-on-[breakpoint]}` | `.pf-v6-c-sidebar__panel` | Modifies the panel width at optional [breakpoint](/tokens/all-patternfly-tokens). **Note:** does not apply when the panel is stacked on top of the content. |
268
+ | `.pf-m-width-{default, 25, 33, 50, 66, 75, 100}{-on-[breakpoint]}` | `.pf-v6-c-sidebar__panel` | Modifies the panel width at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). **Note:** does not apply when the panel is stacked on top of the content. |
269
269
  | `.pf-m-no-background` | `.pf-v6-c-sidebar`, `.pf-v6-c-sidebar__panel, .pf-v6-c-sidebar__content` | Modifies the element to have a transparent background. |
270
270
  | `.pf-m-secondary` | `.pf-v6-c-sidebar__panel, .pf-v6-c-sidebar__content` | Modifies the element to have secondary styling. |
package/docs/components/Table/examples/Table.md CHANGED
@@ -136,7 +136,7 @@ These classes can be used to ensure that the table changes between the tabular a
136
136
 
137
137
  | Class | Applied to | Outcome |
138
138
  | -- | -- | -- |
139
- | `.pf-m-grid-md`, `.pf-m-grid-lg`, `.pf-m-grid-xl`, `.pf-m-grid-2xl` | `.pf-v6-c-table` | Changes tabular layout to responsive, grid based layout at optional [breakpoint](/tokens/all-patternfly-tokens). |
139
+ | `.pf-m-grid-md`, `.pf-m-grid-lg`, `.pf-m-grid-xl`, `.pf-m-grid-2xl` | `.pf-v6-c-table` | Changes tabular layout to responsive, grid based layout at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
140
140
  | `.pf-m-grid` | `.pf-v6-c-table` | Changes tabular layout to responsive, grid based layout. This approach requires JavaScript to set this class at some prescribed viewport width value. |
141
141
 
142
142
  ## Sortable
@@ -18188,8 +18188,8 @@ Width modifiers control the width of the columns. To control the responsive beha
18188
18188
 
18189
18189
  | Class | Applied to | Outcome |
18190
18190
  | -- | -- | -- |
18191
- | `.pf-m-hidden{-on-[breakpoint]}` | `.pf-v6-c-table tr > th`, `.pf-v6-c-table tr > td` | Hides a table cell at optional [breakpoint](/tokens/all-patternfly-tokens), or hides it at all breakpoints with `.pf-m-hidden`. **Note: Needs to apply to all cells in the column you want to hide.** |
18192
- | `.pf-m-visible{-on-[breakpoint]}` | `.pf-v6-c-table tr > th`, `.pf-v6-c-table tr > td` | Shows a table cell at optional [breakpoint](/tokens/all-patternfly-tokens). |
18191
+ | `.pf-m-hidden{-on-[breakpoint]}` | `.pf-v6-c-table tr > th`, `.pf-v6-c-table tr > td` | Hides a table cell at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens), or hides it at all breakpoints with `.pf-m-hidden`. **Note: Needs to apply to all cells in the column you want to hide.** |
18192
+ | `.pf-m-visible{-on-[breakpoint]}` | `.pf-v6-c-table tr > th`, `.pf-v6-c-table tr > td` | Shows a table cell at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
18193
18193
 
18194
18194
  ## Text control modifiers
18195
18195
 
package/docs/components/Tabs/examples/Tabs.md CHANGED
@@ -11379,11 +11379,11 @@ Whenever a list of tabs is unique on the current page, it can be used in a `<nav
11379
11379
  | `.pf-m-box` | `.pf-v6-c-tabs` | Applies box styling to the tab component. |
11380
11380
  | `.pf-m-vertical` | `.pf-v6-c-tabs` | Applies vertical styling to the tab component. |
11381
11381
  | `.pf-m-fill` | `.pf-v6-c-tabs` | Modifies the tabs to fill the available space. |
11382
- | `.pf-m-inset-{none, sm, md, lg, xl, 2xl}{-on-[md, lg, xl, 2xl]}` | `.pf-v6-c-tabs` | Modifies tabs horizontal padding at optional [breakpoint](/tokens/all-patternfly-tokens). |
11382
+ | `.pf-m-inset-{none, sm, md, lg, xl, 2xl}{-on-[md, lg, xl, 2xl]}` | `.pf-v6-c-tabs` | Modifies tabs horizontal padding at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
11383
11383
  | `.pf-m-page-insets` | `.pf-v6-c-tabs` | Modifies the tabs component padding/inset to visually match padding of page elements. |
11384
11384
  | `.pf-m-secondary` | `.pf-v6-c-tabs.pf-m-box` | Modifies the tabs component tab background colors for the box variant. |
11385
- | `.pf-m-expandable{-on-[breakpoint]}` | `.pf-v6-c-tabs` | Modifies the tabs component to be expandable via a toggle at optional [breakpoint](/tokens/all-patternfly-tokens). **Note:** works with vertical tabs only. |
11386
- | `.pf-m-non-expandable{-on-[breakpoint]}` | `.pf-v6-c-tabs` | Modifies the tabs component to be non-expandable at optional [breakpoint](/tokens/all-patternfly-tokens). |
11385
+ | `.pf-m-expandable{-on-[breakpoint]}` | `.pf-v6-c-tabs` | Modifies the tabs component to be expandable via a toggle at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). **Note:** works with vertical tabs only. |
11386
+ | `.pf-m-non-expandable{-on-[breakpoint]}` | `.pf-v6-c-tabs` | Modifies the tabs component to be non-expandable at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
11387
11387
  | `.pf-m-expanded` | `.pf-v6-c-tabs` | Modifies the expandable tabs component for the expanded state. |
11388
11388
  | `.pf-m-animate-current` | `.pf-v6-c-tabs` | Modifies tabs to animate movement of the current tab accent line. |
11389
11389
  | `.pf-m-initializing-accent` | `.pf-v6-c-tabs.pf-m-animate-current` | Modifies tabs styles while initializing the "current" tab's accent styles. |
package/docs/components/Toolbar/examples/Toolbar.md CHANGED
@@ -14,8 +14,8 @@ Toolbar relies on groups (`.pf-v6-c-toolbar__group`) and items (`.pf-v6-c-toolba
14
14
  | -- | -- | -- |
15
15
  | `.pf-v6-c-toolbar__group` | `--pf-v6-c-toolbar__group--ColumnGap` | `16px` |
16
16
  | `.pf-v6-c-toolbar__item` | `--pf-v6-c-toolbar__item--ColumnGap` | `16px` |
17
- | `.pf-m-[column/row]-gap-[none/sm/md/lg/xl/2xl]{-on-[breakpoint]}` | `.pf-v6-c-toolbar__content-section`, `.pf-v6-c-toolbar__group`, `.pf-v6-c-toolbar__item` | Modifies toolbar group or item spacing at optional [breakpoint](/tokens/all-patternfly-tokens). |
18
- | `.pf-m-gap-[none/sm/md/lg/xl/2xl]{-on-[breakpoint]}` | `.pf-v6-c-toolbar__content-section`, `.pf-v6-c-toolbar__group`, `.pf-v6-c-toolbar__item` | Modifies both column gap and row gap for toolbar group or item spacing at optional [breakpoint](/tokens/all-patternfly-tokens). |
17
+ | `.pf-m-[column/row]-gap-[none/sm/md/lg/xl/2xl]{-on-[breakpoint]}` | `.pf-v6-c-toolbar__content-section`, `.pf-v6-c-toolbar__group`, `.pf-v6-c-toolbar__item` | Modifies toolbar group or item spacing at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
18
+ | `.pf-m-gap-[none/sm/md/lg/xl/2xl]{-on-[breakpoint]}` | `.pf-v6-c-toolbar__content-section`, `.pf-v6-c-toolbar__group`, `.pf-v6-c-toolbar__item` | Modifies both column gap and row gap for toolbar group or item spacing at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
19
19
 
20
20
  ### Toolbar item types
21
21
 
@@ -37,7 +37,7 @@ Toolbar relies on groups (`.pf-v6-c-toolbar__group`) and items (`.pf-v6-c-toolba
37
37
 
38
38
  Several components in the following examples do not include functional and/or accessibility specifications (for example `.pf-v6-c-select`, `.pf-v6-c-options-menu`). Rather, `.pf-v6-c-toolbar` focuses on functionality and accessibility specifications that apply to it only.
39
39
 
40
- **Available [breakpoints](/tokens/all-patternfly-tokens) are: `-on-sm`, `-on-md`, `-on-lg`, `-on-xl`, and `-on-2xl`.**
40
+ **Available [breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are: `-on-sm`, `-on-md`, `-on-lg`, `-on-xl`, and `-on-2xl`.**
41
41
 
42
42
  ## Examples
43
43
 
@@ -181,8 +181,8 @@ Several components in the following examples do not include functional and/or ac
181
181
 
182
182
  | Class | Applied to | Outcome |
183
183
  | -- | -- | -- |
184
- | `--pf-v6-c-toolbar__item--Width: {width}` | `.pf-v6-c-toolbar__item` | Modifies the width value of a toolbar item at optional [breakpoint](/tokens/all-patternfly-tokens). |
185
- | `--pf-v6-c-toolbar__item--MinWidth: {width}` | `.pf-v6-c-toolbar__item` | Modifies the min width value of a toolbar item at optional [breakpoint](/tokens/all-patternfly-tokens). |
184
+ | `--pf-v6-c-toolbar__item--Width: {width}` | `.pf-v6-c-toolbar__item` | Modifies the width value of a toolbar item at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
185
+ | `--pf-v6-c-toolbar__item--MinWidth: {width}` | `.pf-v6-c-toolbar__item` | Modifies the min width value of a toolbar item at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
186
186
 
187
187
  ## Group types
188
188
 
@@ -2674,5 +2674,5 @@ As the toolbar component is a hybrid layout and component, some of its elements
2674
2674
 
2675
2675
  | Class | Applied to | Outcome |
2676
2676
  | -- | -- | -- |
2677
- | `.pf-m-[column/row]-gap-[none/sm/md/lg/xl/2xl]` | `.pf-v6-c-toolbar__group`, `.pf-v6-c-toolbar__item` | Modifies toolbar group or item spacing at optional [breakpoint](/tokens/all-patternfly-tokens). |
2678
- | `.pf-m-gap-[none/sm/md/lg/xl/2xl]` | `.pf-v6-c-toolbar__group`, `.pf-v6-c-toolbar__item` | Modifies both column and row gap for toolbar group or item spacing at optional [breakpoint](/tokens/all-patternfly-tokens). |
2677
+ | `.pf-m-[column/row]-gap-[none/sm/md/lg/xl/2xl]` | `.pf-v6-c-toolbar__group`, `.pf-v6-c-toolbar__item` | Modifies toolbar group or item spacing at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
2678
+ | `.pf-m-gap-[none/sm/md/lg/xl/2xl]` | `.pf-v6-c-toolbar__group`, `.pf-v6-c-toolbar__item` | Modifies both column and row gap for toolbar group or item spacing at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
package/docs/demos/Compass/examples/Compass.md CHANGED
@@ -1,6 +1,6 @@
1
1
  ---
2
2
  id: Compass
3
- section: PatternFly-AI
3
+ section: AI
4
4
  subsection: Generative UIs
5
5
  wrapperTag: div
6
6
  ---## Examples
package/docs/layouts/Bullseye/examples/Bullseye.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Bullseye
3
- section: layouts
3
+ section: foundations-and-styles
4
+ subsection: layouts
4
5
  cssPrefix: pf-v6-l-bullseye
5
6
  ---import './Bullseye.css'
6
7
 
package/docs/layouts/Flex/examples/Flex.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Flex
3
- section: layouts
3
+ section: foundations-and-styles
4
+ subsection: layouts
4
5
  cssPrefix: pf-v6-l-flex
5
6
  ---import './Flex.css'
6
7
 
@@ -20,7 +21,7 @@ The flex layout provides two ways of spacing its direct children.
20
21
 
21
22
  ### Breakpoints
22
23
 
23
- [Breakpoints](/tokens/all-patternfly-tokens) `-on-sm`, `-on-md`, `-on-lg`, `-on-xl`, and `-on-2xl` are provided.
24
+ [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) `-on-sm`, `-on-md`, `-on-lg`, `-on-xl`, and `-on-2xl` are provided.
24
25
 
25
26
  ### Usefulness
26
27
 
package/docs/layouts/Gallery/examples/Gallery.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Gallery
3
- section: layouts
3
+ section: foundations-and-styles
4
+ subsection: layouts
4
5
  cssPrefix: pf-v6-l-gallery
5
6
  ---import './Gallery.css'
6
7
 
@@ -174,5 +175,5 @@ The gallery layout is designed so that all of its children are of uniform size,
174
175
  | `.pf-v6-l-gallery` | `<div>` | Initializes a Gallery layout |
175
176
  | `.pf-v6-l-gallery__item` | `<div>` | Explicitly sets the child for the gallery. This class isn't necessary, but it is included to keep inline with BEM convention, and to provide an entity that will later be used for applying modifiers. |
176
177
  | `.pf-m-gutter` | `.pf-v6-l-gallery` | Adds space between children by using the globally defined gutter value. |
177
- | `--pf-v6-l-gallery--GridTemplateColumns--min{-on-[breakpoint]}: {width}` | `.pf-v6-l-gallery` | Modifies the min value of `grid-template-columns` declaration at the optional [breakpoint](/tokens/all-patternfly-tokens). |
178
- | `--pf-v6-l-gallery--GridTemplateColumns--max{-on-[breakpoint]}: {width}` | `.pf-v6-l-gallery` | Modifies the max value of `grid-template-columns` declaration at the optional [breakpoint](/tokens/all-patternfly-tokens). |
178
+ | `--pf-v6-l-gallery--GridTemplateColumns--min{-on-[breakpoint]}: {width}` | `.pf-v6-l-gallery` | Modifies the min value of `grid-template-columns` declaration at the optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
179
+ | `--pf-v6-l-gallery--GridTemplateColumns--max{-on-[breakpoint]}: {width}` | `.pf-v6-l-gallery` | Modifies the max value of `grid-template-columns` declaration at the optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
package/docs/layouts/Grid/examples/Grid.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Grid
3
- section: layouts
3
+ section: foundations-and-styles
4
+ subsection: layouts
4
5
  cssPrefix: pf-v6-l-grid
5
6
  ---import './Grid.css'
6
7
 
@@ -318,7 +319,7 @@ The grid layout is based on CSS Grid’s two-dimensional system of columns and r
318
319
  | `.pf-v6-l-grid` | `<div>` | Initializes the grid layout. |
319
320
  | `.pf-v6-l-grid__item` | `<div>` | Explicitly sets a child of the grid. This class isn't necessary, but it is included to keep inline with BEM convention, and to provide an entity that will later be used for applying modifiers. |
320
321
  | `.pf-m-gutter` | `.pf-v6-l-grid` | Adds space between children by using the globally defined gutter value. |
321
- | `.pf-m-all-{1-12}-col{-on-[breakpoint]}` | `.pf-v6-l-grid` | Defines grid item size on grid container at optional [breakpoint](/tokens/all-patternfly-tokens). |
322
- | `.pf-m-{1-12}-col{-on-[breakpoint]}` | `.pf-v6-l-grid__item` | Defines grid item size at optional [breakpoint](/tokens/all-patternfly-tokens). Although not required, they are strongly suggested. If not used, grid item will default to 12 col. |
323
- | `.pf-m-{2-x}-row{-on-[breakpoint]}` | `.pf-v6-l-grid__item` | Defines grid item row span at optional [breakpoint](/tokens/all-patternfly-tokens). For row spans to function correctly, the value of of the current row plus the grid items to span must be equal to or less than 12. Example: `.pf-m-8-col.pf-m-2-row` + `.pf-m-4-col` + `.pf-m-4-col`. There is no limit to number of spanned rows. |
324
- | `--pf-v6-l-grid--item--Order{-on-[breakpoint]}: {order}` | `.pf-v6-l-grid > .pf-v6-l-grid`, `.pf-v6-l-grid__item` | Modifies the order of the grid layout element at optional [breakpoint](/tokens/all-patternfly-tokens). |
322
+ | `.pf-m-all-{1-12}-col{-on-[breakpoint]}` | `.pf-v6-l-grid` | Defines grid item size on grid container at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
323
+ | `.pf-m-{1-12}-col{-on-[breakpoint]}` | `.pf-v6-l-grid__item` | Defines grid item size at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). Although not required, they are strongly suggested. If not used, grid item will default to 12 col. |
324
+ | `.pf-m-{2-x}-row{-on-[breakpoint]}` | `.pf-v6-l-grid__item` | Defines grid item row span at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). For row spans to function correctly, the value of of the current row plus the grid items to span must be equal to or less than 12. Example: `.pf-m-8-col.pf-m-2-row` + `.pf-m-4-col` + `.pf-m-4-col`. There is no limit to number of spanned rows. |
325
+ | `--pf-v6-l-grid--item--Order{-on-[breakpoint]}: {order}` | `.pf-v6-l-grid > .pf-v6-l-grid`, `.pf-v6-l-grid__item` | Modifies the order of the grid layout element at optional [breakpoint](/foundations-and-styles/design-tokens/all-design-tokens). |
package/docs/layouts/Level/examples/Level.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Level
3
- section: layouts
3
+ section: foundations-and-styles
4
+ subsection: layouts
4
5
  cssPrefix: pf-v6-l-level
5
6
  ---import './Level.css'
6
7
 
package/docs/layouts/Split/examples/Split.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Split
3
- section: layouts
3
+ section: foundations-and-styles
4
+ subsection: layouts
4
5
  cssPrefix: pf-v6-l-split
5
6
  ---import './Split.css'
6
7
 
package/docs/layouts/Stack/examples/Stack.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Stack
3
- section: layouts
3
+ section: foundations-and-styles
4
+ subsection: layouts
4
5
  cssPrefix: pf-v6-l-stack
5
6
  ---import './Stack.css'
6
7
 
package/docs/utilities/Accessibility/examples/Accessibility.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Accessibility
3
- section: utility-classes
3
+ section: foundations-and-styles
4
+ subsection: utility-classes
4
5
  ---## Examples
5
6
 
6
7
  ### Screen reader only
@@ -34,7 +35,7 @@ The text underneath is hidden.
34
35
 
35
36
  ### Overview
36
37
 
37
- [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-screen-reader-on-lg`
38
+ [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-screen-reader-on-lg`
38
39
 
39
40
  ### Usage
40
41
 
package/docs/utilities/Alignment/examples/Alignment.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Alignment
3
- section: utility-classes
3
+ section: foundations-and-styles
4
+ subsection: utility-classes
4
5
  ---import './Alignment.css'
5
6
 
6
7
  ## Examples
@@ -23,7 +24,7 @@ section: utility-classes
23
24
 
24
25
  ### Overview
25
26
 
26
- [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-text-align-start-on-lg`
27
+ [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-text-align-start-on-lg`
27
28
 
28
29
  ### Usage
29
30
 
package/docs/utilities/BackgroundColor/examples/BackgroundColor.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Background color
3
- section: utility-classes
3
+ section: foundations-and-styles
4
+ subsection: utility-classes
4
5
  ---## Examples
5
6
 
6
7
  ### Standard background colors
@@ -24,11 +25,11 @@ section: utility-classes
24
25
 
25
26
  These background color utilities can be used to modify the background color of an element. In most cases, using the components with available modifiers should be sufficient to implement most designs, and should be preferred over customizations using these utilities.
26
27
 
27
- Care should be taken especially when applying background colors, as this can have a negative effect on the readability and accessibility of text. Refer to [contrast ratios](/design-foundations/colors#contrast-ratios) for more information.
28
+ Care should be taken especially when applying background colors, as this can have a negative effect on the readability and accessibility of text. Refer to [contrast ratios](/foundations-and-styles/colors#contrast-ratios) for more information.
28
29
 
29
- Note that "inverse" background colors are labeled as such to indicate that they are best used with the ["inverse" text colors](/utility-classes/text#inverse-colors).
30
+ Note that "inverse" background colors are labeled as such to indicate that they are best used with the ["inverse" text colors](/foundations-and-styles/utility-classes/text#inverse-colors).
30
31
 
31
- [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-background-color-disabled-on-lg`
32
+ [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-background-color-disabled-on-lg`
32
33
 
33
34
  ### Usage
34
35
 
package/docs/utilities/BoxShadow/examples/box-shadow.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Box shadow
3
- section: utility-classes
3
+ section: foundations-and-styles
4
+ subsection: utility-classes
4
5
  ---import './box-shadow.css'
5
6
 
6
7
  ## Examples
package/docs/utilities/Display/examples/Display.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Display
3
- section: utility-classes
3
+ section: foundations-and-styles
4
+ subsection: utility-classes
4
5
  ---import './Display.css'
5
6
 
6
7
  ## Examples
@@ -83,7 +84,7 @@ section: utility-classes
83
84
 
84
85
  ### Overview
85
86
 
86
- [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-display-inline-block-on-lg`
87
+ [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-display-inline-block-on-lg`
87
88
 
88
89
  ### Usage
89
90
 
package/docs/utilities/Flex/examples/Flex.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Flex
3
- section: utility-classes
3
+ section: foundations-and-styles
4
+ subsection: utility-classes
4
5
  ---import './Flex.css'
5
6
 
6
7
  ## Examples
@@ -370,7 +371,7 @@ section: utility-classes
370
371
 
371
372
  ### Overview
372
373
 
373
- For these utilities to have effect, the parent element must be set to `display: flex` or `display: inline-flex`. [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-flex-row-on-lg`
374
+ For these utilities to have effect, the parent element must be set to `display: flex` or `display: inline-flex`. [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-flex-row-on-lg`
374
375
 
375
376
  <!-- ## Accessibility
376
377
 
package/docs/utilities/Float/examples/Float.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Float
3
- section: utility-classes
3
+ section: foundations-and-styles
4
+ subsection: utility-classes
4
5
  ---import './Float.css'
5
6
 
6
7
  ## Examples
@@ -18,7 +19,7 @@ section: utility-classes
18
19
 
19
20
  ### Overview
20
21
 
21
- [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-float-inline-start-on-lg`
22
+ [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-float-inline-start-on-lg`
22
23
 
23
24
  ### Usage
24
25
 
package/docs/utilities/Sizing/examples/Sizing.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Sizing
3
- section: utility-classes
3
+ section: foundations-and-styles
4
+ subsection: utility-classes
4
5
  ---import './Sizing.css'
5
6
 
6
7
  ## Examples
@@ -22,7 +23,7 @@ section: utility-classes
22
23
 
23
24
  ### Usage
24
25
 
25
- [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-w-initial-on-lg`
26
+ [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-w-initial-on-lg`
26
27
 
27
28
  | Class | Applied to | Outcome |
28
29
  | -- | -- | -- |
@@ -50,7 +51,7 @@ section: utility-classes
50
51
 
51
52
  ### Usage
52
53
 
53
- [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-w-25vw-on-lg`
54
+ [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-w-25vw-on-lg`
54
55
 
55
56
  | Class | Applied to | Outcome |
56
57
  | -- | -- | -- |
@@ -90,7 +91,7 @@ section: utility-classes
90
91
 
91
92
  ### Usage
92
93
 
93
- [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-h-initial-on-lg`
94
+ [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-h-initial-on-lg`
94
95
 
95
96
  | Class | Applied to | Outcome |
96
97
  | -- | -- | -- |
@@ -130,7 +131,7 @@ section: utility-classes
130
131
 
131
132
  ### Usage
132
133
 
133
- [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-h-25vh-on-lg`
134
+ [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-h-25vh-on-lg`
134
135
 
135
136
  | Class | Applied to | Outcome |
136
137
  | -- | -- | -- |
@@ -188,7 +189,7 @@ section: utility-classes
188
189
  | `.pf-v6-u-min-width` | `*` | Sets min-width: `var(--pf-v6-u-min-width--MinWidth{-on-[breakpoint]})`. |
189
190
  | `.pf-v6-u-max-width` | `*` | Sets min-width: `var(--pf-v6-u-max-width--MaxWidth{-on-[breakpoint]})`. |
190
191
 
191
- [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.--pf-v6-u-min-width--MinWidth-on-lg`
192
+ [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.--pf-v6-u-min-width--MinWidth-on-lg`
192
193
 
193
194
  | Custom property | Applied to | Outcome |
194
195
  | -- | -- | -- |
@@ -242,7 +243,7 @@ section: utility-classes
242
243
  | `.pf-v6-u-min-height` | `*` | Sets min-height: `var(--pf-v6-u-min-height--MinHeight{-on-[breakpoint]})`. |
243
244
  | `.pf-v6-u-max-height` | `*` | Sets max-height: `var(--pf-v6-u-max-height--MaxHeight{-on-[breakpoint]})`. |
244
245
 
245
- [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.--pf-v6-u-min-height--MinHeight-on-lg`
246
+ [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.--pf-v6-u-min-height--MinHeight-on-lg`
246
247
 
247
248
  | Custom property | Applied to | Outcome |
248
249
  | -- | -- | -- |
package/docs/utilities/Spacing/examples/Spacing.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Spacing
3
- section: utility-classes
3
+ section: foundations-and-styles
4
+ subsection: utility-classes
4
5
  pf: 'test'
5
6
  ---import './Spacing.css'
6
7
 
@@ -118,7 +119,7 @@ pf: 'test'
118
119
 
119
120
  ### Overview
120
121
 
121
- [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-m-sm-on-lg`
122
+ [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-m-sm-on-lg`
122
123
 
123
124
  ### Margin properties
124
125
 
package/docs/utilities/Text/examples/Text.md CHANGED
@@ -1,6 +1,7 @@
1
1
  ---
2
2
  id: Text
3
- section: utility-classes
3
+ section: foundations-and-styles
4
+ subsection: utility-classes
4
5
  ---## Examples
5
6
 
6
7
  ### Font family
@@ -47,7 +48,7 @@ section: utility-classes
47
48
 
48
49
  ### Inverse colors
49
50
 
50
- These colors are best used with the ["inverse" background colors](/utility-classes/background-color#inverse-background-colors).
51
+ These colors are best used with the ["inverse" background colors](/foundations-and-styles/utility-classes/background-color#inverse-background-colors).
51
52
 
52
53
  ```html
53
54
  <div class="pf-v6-u-background-color-inverse">
@@ -171,7 +172,7 @@ These text utilities can be used to modify text within the PatternFly framework.
171
172
 
172
173
  Care should be taken especially when applying text colors, as this can have a negative effect on the readability and accessibility of text. Refer to the information on [contrast ratios](/guidelines/colors/#contrast-ratios) for more information.
173
174
 
174
- [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-font-size-xl-on-lg`
175
+ [Breakpoints](/foundations-and-styles/design-tokens/all-design-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-font-size-xl-on-lg`
175
176
 
176
177
  ### Usage
177
178
 
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.5.0-prerelease.26",
4
+ "version": "6.5.0-prerelease.27",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {