diff --git a/.github/workflows/pr-preview.yml b/.github/workflows/pr-preview.yml
index 80255d0e70..07bcb3ecad 100644
--- a/.github/workflows/pr-preview.yml
+++ b/.github/workflows/pr-preview.yml
@@ -25,10 +25,10 @@ jobs:
git checkout tmp
- run: |
- git rev-parse origin/main
+ git rev-parse origin/6.6.x
git rev-parse HEAD
- git rev-parse origin/main..HEAD
- git log origin/main..HEAD --format="%b"
+ git rev-parse origin/6.6.x..HEAD
+ git log origin/6.6.x..HEAD --format="%b"
# Yes, we really want to checkout the PR
# Injected by generate-workflows.js
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
index 63cf57fc59..d251a73ba0 100644
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -3,7 +3,7 @@ name: release
on:
push:
branches:
- - main
+ - 6.6.x
jobs:
build-deploy:
if: "!contains(github.event.head_commit.message, 'ci skip')"
diff --git a/README.md b/README.md
index 5c81dbd219..636e908b58 100644
--- a/README.md
+++ b/README.md
@@ -1,5 +1,5 @@
# PatternFly
-
+
## Contributing
We welcome contributions to PatternFly! Please read our [Contributing Guide](https://pf-core-staging.patternfly.org/contribution) to learn how to get started, submit issues, and contribute code to the project.
diff --git a/patternfly-a11y.config.js b/patternfly-a11y.config.js
index f5a1af1901..a8b26fdeef 100644
--- a/patternfly-a11y.config.js
+++ b/patternfly-a11y.config.js
@@ -75,7 +75,8 @@ module.exports = {
'landmark-no-duplicate-main',
'landmark-main-is-top-level',
'scrollable-region-focusable',
- 'aria-required-children' // Remove once https://github.com/patternfly/patternfly-react/issues/9968 is resolved
+ 'aria-required-children', // Remove once https://github.com/patternfly/patternfly-react/issues/9968 is resolved
+ 'target-size' // See if we can remove once https://github.com/patternfly/patternfly/issues/8492 is resolved
].join(','),
ignoreIncomplete: true,
skip: '(mailto)|(/(developer-resources)/.+)'
diff --git a/release.config.js b/release.config.js
index 7b7b50fbe3..d583ef9587 100644
--- a/release.config.js
+++ b/release.config.js
@@ -2,7 +2,8 @@ module.exports = {
branches: [
'do-not-delete',
{ name: 'v5', channel: 'prerelease-v5', range: '5.x' },
- { name: 'main', channel: 'prerelease', prerelease: 'prerelease' }
+ { name: 'main', channel: 'prerelease', prerelease: 'prerelease' },
+ { name: '6.6.x', channel: 'prerelease-bugfix', range: '6.6.x' }
],
analyzeCommits: {
preset: 'angular'
@@ -12,15 +13,16 @@ module.exports = {
'@semantic-release/commit-analyzer',
{
preset: 'angular',
- parserOpts: {
- noteKeywords: ['BREAKING-CHANGE']
- }
+ releaseRules: [
+ { type: 'feat', release: 'patch' },
+ { type: 'fix', release: 'patch' }
+ ]
}
],
'@semantic-release/release-notes-generator',
'@semantic-release/github',
['@semantic-release/npm', { pkgRoot: 'dist' }]
],
- tagFormat: 'prerelease-v${version}',
+ tagFormat: 'patch-v${version}',
dryRun: false
};
diff --git a/src/patternfly/components/AboutModalBox/about-modal-box.scss b/src/patternfly/components/AboutModalBox/about-modal-box.scss
index aff9ab0961..11981bd970 100644
--- a/src/patternfly/components/AboutModalBox/about-modal-box.scss
+++ b/src/patternfly/components/AboutModalBox/about-modal-box.scss
@@ -176,7 +176,7 @@
overflow-x: hidden;
overflow-y: auto;
overscroll-behavior: contain;
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
-webkit-overflow-scrolling: touch;
@media screen and (min-width: $pf-v6-global--breakpoint--sm) {
diff --git a/src/patternfly/components/Accordion/accordion.scss b/src/patternfly/components/Accordion/accordion.scss
index 699b5ec5f1..f44fd759de 100644
--- a/src/patternfly/components/Accordion/accordion.scss
+++ b/src/patternfly/components/Accordion/accordion.scss
@@ -11,10 +11,10 @@
// accordion toggle
--#{$accordion}__toggle--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
- --#{$accordion}__toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
+ --#{$accordion}__toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
--#{$accordion}__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
- --#{$accordion}__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
- --#{$accordion}__toggle--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
+ --#{$accordion}__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
+ --#{$accordion}__toggle--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
--#{$accordion}__toggle--PaddingInlineStart: var(--pf-t--global--spacer--md);
--#{$accordion}__toggle--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
--#{$accordion}__toggle--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
diff --git a/src/patternfly/components/Alert/alert.scss b/src/patternfly/components/Alert/alert.scss
index f8e4d5cd41..4e9fe0b0e8 100644
--- a/src/patternfly/components/Alert/alert.scss
+++ b/src/patternfly/components/Alert/alert.scss
@@ -19,9 +19,9 @@
--#{$alert}--FontSize: var(--pf-t--global--font--size--body--default);
// Toggle
- --#{$alert}__toggle--MarginBlockStart: calc(-1 * var(--pf-t--global--spacer--control--vertical--default));
- --#{$alert}__toggle--MarginBlockEnd: calc(-1 * var(--pf-t--global--spacer--control--vertical--default));
- --#{$alert}__toggle--MarginInlineStart: calc(-1 * var(--pf-t--global--spacer--action--horizontal--plain--default));
+ --#{$alert}__toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
+ --#{$alert}__toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
+ --#{$alert}__toggle--MarginInlineStart: calc(var(--pf-t--global--spacer--action--horizontal--plain--default) * -1);
--#{$alert}__toggle--MarginInlineEnd: var(--pf-t--global--spacer--sm);
// Toggle icon
@@ -41,8 +41,8 @@
--#{$alert}__title--max-lines: 1;
// Action
- --#{$alert}__action--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
- --#{$alert}__action--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+ --#{$alert}__action--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
+ --#{$alert}__action--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
--#{$alert}__action--TranslateY: #{pf-size-prem(2px)};
--#{$alert}__action--MarginInlineEnd: calc(var(--pf-t--global--spacer--sm) * -1);
@@ -205,7 +205,7 @@
grid-area: title;
font-weight: var(--#{$alert}__title--FontWeight);
color: var(--#{$alert}__title--Color);
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
&.pf-m-truncate {
@include pf-v6-line-clamp("var(--#{$alert}__title--max-lines)");
@@ -215,7 +215,7 @@
.#{$alert}__description {
grid-area: description;
padding-block-start: var(--#{$alert}__description--PaddingBlockStart);
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
+ .#{$alert}__action-group {
--#{$alert}__action-group--PaddingBlockStart: var(--#{$alert}__description--action-group--PaddingBlockStart);
diff --git a/src/patternfly/components/Breadcrumb/breadcrumb.scss b/src/patternfly/components/Breadcrumb/breadcrumb.scss
index 3c77034a1d..7318f1e301 100644
--- a/src/patternfly/components/Breadcrumb/breadcrumb.scss
+++ b/src/patternfly/components/Breadcrumb/breadcrumb.scss
@@ -29,9 +29,9 @@
--#{$breadcrumb}__heading--FontSize: var(--#{$breadcrumb}__item--FontSize);
// breadcrumb dropdown
- --#{$breadcrumb}__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+ --#{$breadcrumb}__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
--#{$breadcrumb}__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
- --#{$breadcrumb}__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+ --#{$breadcrumb}__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
--#{$breadcrumb}__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
}
@@ -83,7 +83,7 @@
font-weight: var(--#{$breadcrumb}__link--FontWeight);
line-height: inherit;
color: var(--#{$breadcrumb}__link--Color);
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
text-decoration-line: var(--#{$breadcrumb}__link--TextDecorationLine);
text-decoration-style: var(--#{$breadcrumb}__link--TextDecorationStyle);
text-decoration-color: var(--#{$breadcrumb}__link--TextDecorationColor);
diff --git a/src/patternfly/components/Card/card.scss b/src/patternfly/components/Card/card.scss
index f8fc3fe252..22808d86dd 100644
--- a/src/patternfly/components/Card/card.scss
+++ b/src/patternfly/components/Card/card.scss
@@ -24,15 +24,15 @@
--#{$card}__footer--Color: var(--pf-t--global--text--color--subtle);
--#{$card}__actions--PaddingInlineStart: var(--pf-t--global--spacer--md);
--#{$card}__actions--Gap: var(--pf-t--global--spacer--gap--action-to-action--default);
- --#{$card}__actions--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
- --#{$card}__actions--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+ --#{$card}__actions--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
+ --#{$card}__actions--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
--#{$card}__header--m-wrap--RowGap: var(--pf-t--global--spacer--sm);
--#{$card}__header--m-wrap--ColumnGap: var(--pf-t--global--spacer--md);
// Expandable
- --#{$card}__header-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+ --#{$card}__header-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
--#{$card}__header-toggle--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
- --#{$card}__header-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+ --#{$card}__header-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
--#{$card}__header-toggle--MarginInlineStart: calc(var(--pf-t--global--spacer--action--horizontal--plain--default) * -1);
--#{$card}__header-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
--#{$card}__header-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
diff --git a/src/patternfly/components/ClipboardCopy/clipboard-copy.scss b/src/patternfly/components/ClipboardCopy/clipboard-copy.scss
index 797d4766d3..5e57894d3b 100644
--- a/src/patternfly/components/ClipboardCopy/clipboard-copy.scss
+++ b/src/patternfly/components/ClipboardCopy/clipboard-copy.scss
@@ -108,7 +108,7 @@
}
.#{$clipboard-copy}__text {
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
white-space: normal;
&.pf-m-code {
diff --git a/src/patternfly/components/DataList/data-list.scss b/src/patternfly/components/DataList/data-list.scss
index be83964273..a4b92f80ed 100644
--- a/src/patternfly/components/DataList/data-list.scss
+++ b/src/patternfly/components/DataList/data-list.scss
@@ -20,7 +20,7 @@
--#{$data-list}--pf-m-plain__item--BackgroundColor: transparent;
--#{$data-list}__item--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
--#{$data-list}__item--m-selected--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
- --#{$data-list}__item--m-clickable--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
+ --#{$data-list}__item--m-clickable--OutlineOffset: calc(var(--pf-t--global--spacer--xs) * -1);
--#{$data-list}__item--BorderBlockEndColor: var(--pf-t--global--border--color--default);
--#{$data-list}__item--BorderBlockEndWidth: var(--pf-t--global--border--width--strong);
--#{$data-list}__item--sm--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
@@ -58,8 +58,8 @@
// toggle
--#{$data-list}__toggle--MarginInlineStart: calc(var(--pf-t--global--spacer--action--horizontal--plain--default) * -1); // offset toggle to align left
- --#{$data-list}__toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
- --#{$data-list}__toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+ --#{$data-list}__toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
+ --#{$data-list}__toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
--#{$data-list}__toggle-icon--Height: calc(var(--#{$data-list}--FontSize) * var(--#{$data-list}--LineHeight));
--#{$data-list}__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
--#{$data-list}__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
@@ -98,8 +98,8 @@
--#{$data-list}__item-action--Display: flex;
--#{$data-list}__item-action--PaddingBlockStart: var(--pf-t--global--spacer--lg);
--#{$data-list}__item-action--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
- --#{$data-list}__item-action--PaddingBlockStart--offset: var(--pf-t--global--spacer--control--vertical--default);
- --#{$data-list}__item-action--PaddingBlockEnd--offset: var(--pf-t--global--spacer--control--vertical--default);
+ --#{$data-list}__item-action--PaddingBlockStart--offset: var(--pf-t--global--spacer--control--vertical--plain);
+ --#{$data-list}__item-action--PaddingBlockEnd--offset: var(--pf-t--global--spacer--control--vertical--plain);
--#{$data-list}__item-action--MarginInlineStart: var(--pf-t--global--spacer--md);
--#{$data-list}__item-action--md--MarginInlineStart: var(--pf-t--global--spacer--xl);
--#{$data-list}__item-action--Gap: var(--pf-t--global--spacer--gap--action-to-action--default);
diff --git a/src/patternfly/components/DualListSelector/dual-list-selector-item-toggle-icon.hbs b/src/patternfly/components/DualListSelector/dual-list-selector-item-toggle-icon.hbs
index b3072cdb38..a40263520b 100644
--- a/src/patternfly/components/DualListSelector/dual-list-selector-item-toggle-icon.hbs
+++ b/src/patternfly/components/DualListSelector/dual-list-selector-item-toggle-icon.hbs
@@ -2,5 +2,5 @@
{{#if dual-list-selector-item-toggle-icon--attribute}}
{{{dual-list-selector-item-toggle-icon--attribute}}}
{{/if}}>
- {{pfIcon "rh-microns-caret-down"}}
+ {{pfIcon "rh-microns-caret-right"}}
diff --git a/src/patternfly/components/DualListSelector/dual-list-selector.scss b/src/patternfly/components/DualListSelector/dual-list-selector.scss
index 58c7a1d159..eae6435609 100644
--- a/src/patternfly/components/DualListSelector/dual-list-selector.scss
+++ b/src/patternfly/components/DualListSelector/dual-list-selector.scss
@@ -106,7 +106,7 @@ $pf-v6-c-dual-list-selector__item--MaxNesting: 10;
// Icon
--#{$dual-list-selector}__item-toggle-icon--Rotate: 0;
- --#{$dual-list-selector}__list-item--m-expanded__item-toggle-icon--Rotate: -180deg;
+ --#{$dual-list-selector}__list-item--m-expanded__item-toggle-icon--Rotate: 90deg;
--#{$dual-list-selector}__item-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
--#{$dual-list-selector}__item-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
--#{$dual-list-selector}__item-toggle-icon--MinWidth: var(--#{$dual-list-selector}__list-item-row--FontSize);
diff --git a/src/patternfly/components/Hint/hint.scss b/src/patternfly/components/Hint/hint.scss
index 917d228c3d..84f0a3a613 100644
--- a/src/patternfly/components/Hint/hint.scss
+++ b/src/patternfly/components/Hint/hint.scss
@@ -24,8 +24,8 @@
// Hint Actions
--#{$hint}__actions--MarginInlineStart: var(--pf-t--global--spacer--2xl);
- --#{$hint}__actions--c-menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
- --#{$hint}__actions--c-menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+ --#{$hint}__actions--c-menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
+ --#{$hint}__actions--c-menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
}
.#{$hint} {
diff --git a/src/patternfly/components/InputGroup/examples/InputGroup.md b/src/patternfly/components/InputGroup/examples/InputGroup.md
index fa78c25b0c..a1a39e0a9c 100644
--- a/src/patternfly/components/InputGroup/examples/InputGroup.md
+++ b/src/patternfly/components/InputGroup/examples/InputGroup.md
@@ -59,7 +59,7 @@ Use the input group to extend form controls by adding text, buttons, selects, et
{{#> input-group}}
{{#> input-group-item}}
- {{> menu-toggle menu-toggle--id="select-example-collapsed1" select--attribute='style="width: 100px;"' menu-toggle--text="Select"}}
+ {{> menu-toggle menu-toggle--id="select-example-collapsed1" select--attribute='style="width: 100px;"' menu-toggle--text="Select" menu-toggle--IsForm=true}}
{{/input-group-item}}
{{#> input-group-item input-group-item--IsFill=true}}
{{> form-control controlType="input" input=true form-control--attribute='type="text" id="textInput4" name="textInput4" aria-label="Input with select and button" aria-describedby="inputSelectButton1"'}}
diff --git a/src/patternfly/components/Menu/menu.scss b/src/patternfly/components/Menu/menu.scss
index 4347e2fbce..2e3025d1aa 100644
--- a/src/patternfly/components/Menu/menu.scss
+++ b/src/patternfly/components/Menu/menu.scss
@@ -17,7 +17,7 @@
--#{$menu}--BorderRadius: calc(var(--#{$menu}__item--BorderRadius) + var(--#{$menu}--PaddingBlockStart));
--#{$menu}--OutlineOffset: calc(var(--pf-t--global--border--width--control--default) * -3);
--#{$menu}--ZIndex: var(--pf-t--global--z-index--sm);
- --#{$menu}--button--disabled--Color: var(--pf-t--global--text--color--disabled);
+ --#{$menu}--button--disabled--Color: var(--pf-t--global--text--color--disabled); // TODO: remove in breaking change
--#{$menu}--icon--disabled--Color: var(--pf-t--global--icon--color--disabled);
--#{$menu}--TransitionDuration: 0s;
--#{$menu}--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
@@ -205,7 +205,7 @@
--#{$menu}__item-toggle-icon--Color: var(--#{$menu}--icon--disabled--Color);
--#{$menu}__item-external--Color: transparent;
--#{$menu}__item-select-icon--Color: transparent;
- --#{$menu}__item-description--Color: var(--#{$menu}--icon--disabled--Color);
+ --#{$menu}__item-description--Color: var(--#{$menu}__item--m-disabled--Color);
--#{$menu}__list-item--BackgroundColor: transparent;
--#{$menu}__list-item--hover--BackgroundColor: transparent;
--#{$menu}__list-item--hover--BorderColor: transparent;
@@ -627,7 +627,7 @@
.#{$menu}__item-description {
font-size: var(--#{$menu}__item-description--FontSize);
color: var(--#{$menu}__item-description--Color);
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
}
// - Menu check
diff --git a/src/patternfly/components/ModalBox/modal-box.scss b/src/patternfly/components/ModalBox/modal-box.scss
index b12a8081c0..4bd96b0681 100644
--- a/src/patternfly/components/ModalBox/modal-box.scss
+++ b/src/patternfly/components/ModalBox/modal-box.scss
@@ -39,7 +39,7 @@
// Header main
--#{$modal-box}__header-main--Gap: var(--pf-t--global--spacer--md);
- --#{$modal-box}__header-main--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
+ --#{$modal-box}__header-main--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
// Title
--#{$modal-box}__title--LineHeight: var(--pf-t--global--font--line-height--heading);
@@ -75,8 +75,8 @@
--#{$modal-box}__footer--PaddingInlineStart: var(--pf-t--global--spacer--lg);
// Footer buttons
- --#{$modal-box}__footer--c-button--MarginInlineEnd: var(--pf-t--global--spacer--md); // Button spacer is used to manipulate margin-inline-start and/or margin-right values at various breakpoints, with a single value.
- --#{$modal-box}__footer--c-button--sm--MarginInlineEnd: calc(var(--#{$modal-box}__footer--c-button--MarginInlineEnd) / 2);
+ --#{$modal-box}__footer--c-button--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--default);
+ --#{$modal-box}__footer--c-button--sm--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--default);
}
.#{$modal-box} {
@@ -226,7 +226,7 @@
overflow-x: hidden;
overflow-y: auto;
overscroll-behavior: contain;
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
-webkit-overflow-scrolling: touch;
&:last-child {
@@ -249,7 +249,7 @@
margin-inline-end: var(--#{$modal-box}__footer--c-button--MarginInlineEnd);
@media screen and (min-width: $pf-v6-global--breakpoint--sm) {
- --#{$modal-box}__footer--c-button--MarginInlineEnd: var(--#{$modal-box}__footer--c-button--sm--MarginInlineEnd);
+ --#{$modal-box}__footer--c-button--MarginInlineEnd: var(--#{$modal-box}__footer--c-button--sm--MarginInlineEnd); // remove in breaking change
}
}
}
diff --git a/src/patternfly/components/Nav/nav.scss b/src/patternfly/components/Nav/nav.scss
index 0979681f23..6e1a27d3d5 100644
--- a/src/patternfly/components/Nav/nav.scss
+++ b/src/patternfly/components/Nav/nav.scss
@@ -2,8 +2,8 @@
@include pf-root($nav) {
// * Nav shared values
- --#{$nav}__link--PaddingBlockStart: var(--pf-t--global--spacer--sm);
- --#{$nav}__link--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
+ --#{$nav}__link--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
+ --#{$nav}__link--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
--#{$nav}__link--PaddingInlineStart: var(--pf-t--global--spacer--md);
--#{$nav}__link--PaddingInlineEnd: var(--pf-t--global--spacer--md);
--#{$nav}__list--RowGap: var(--pf-t--global--spacer--sm);
diff --git a/src/patternfly/components/NotificationDrawer/notification-drawer.scss b/src/patternfly/components/NotificationDrawer/notification-drawer.scss
index 9bbe784de3..0e478d7192 100644
--- a/src/patternfly/components/NotificationDrawer/notification-drawer.scss
+++ b/src/patternfly/components/NotificationDrawer/notification-drawer.scss
@@ -242,7 +242,7 @@
.#{$notification-drawer}__list-item-header-title {
font-weight: var(--#{$notification-drawer}__list-item-header-title--FontWeight);
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
&.pf-m-truncate {
@include pf-v6-line-clamp("var(--#{$notification-drawer}__list-item-header-title--max-lines)");
@@ -263,7 +263,7 @@
grid-row: 2 / 3;
grid-column: 1 / 2;
margin-block-end: var(--#{$notification-drawer}__list-item-description--MarginBlockEnd);
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
}
.#{$notification-drawer}__list-item-timestamp {
@@ -307,7 +307,7 @@
margin-inline-end: var(--#{$notification-drawer}__group-toggle-title--MarginInlineEnd);
font-size: var(--#{$notification-drawer}__group-toggle-title--FontSize);
text-align: start;
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
}
.#{$notification-drawer}__group-toggle-count {
diff --git a/src/patternfly/components/Pagination/examples/Pagination.md b/src/patternfly/components/Pagination/examples/Pagination.md
index bd958c4fb6..fd5921d1b7 100644
--- a/src/patternfly/components/Pagination/examples/Pagination.md
+++ b/src/patternfly/components/Pagination/examples/Pagination.md
@@ -54,21 +54,6 @@ cssPrefix: pf-v6-c-pagination
{{/pagination}}
```
-### Bottom plain
-```hbs
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pretium est a porttitor vehicula. Quisque vel commodo urna. Morbi mattis rutrum ante, id vehicula ex accumsan ut. Morbi viverra, eros vel porttitor facilisis, eros purus aliquet erat, nec lobortis felis elit pulvinar sem. Vivamus vulputate, risus eget commodo eleifend, eros nibh porta quam, vitae lacinia leo libero at magna. Maecenas aliquam sagittis orci, et posuere nisi ultrices sit amet. Aliquam ex odio, malesuada sed posuere quis, pellentesque at mauris. Phasellus venenatis massa ex, eget pulvinar libero auctor pretium. Aliquam erat volutpat. Duis euismod justo in quam ullamcorper, in commodo massa vulputate.
-
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pretium est a porttitor vehicula. Quisque vel commodo urna. Morbi mattis rutrum ante, id vehicula ex accumsan ut. Morbi viverra, eros vel porttitor facilisis, eros purus aliquet erat, nec lobortis felis elit pulvinar sem. Vivamus vulputate, risus eget commodo eleifend, eros nibh porta quam, vitae lacinia leo libero at magna. Maecenas aliquam sagittis orci, et posuere nisi ultrices sit amet. Aliquam ex odio, malesuada sed posuere quis, pellentesque at mauris. Phasellus venenatis massa ex, eget pulvinar libero auctor pretium. Aliquam erat volutpat. Duis euismod justo in quam ullamcorper, in commodo massa vulputate.
-
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pretium est a porttitor vehicula. Quisque vel commodo urna. Morbi mattis rutrum ante, id vehicula ex accumsan ut. Morbi viverra, eros vel porttitor facilisis, eros purus aliquet erat, nec lobortis felis elit pulvinar sem. Vivamus vulputate, risus eget commodo eleifend, eros nibh porta quam, vitae lacinia leo libero at magna. Maecenas aliquam sagittis orci, et posuere nisi ultrices sit amet. Aliquam ex odio, malesuada sed posuere quis, pellentesque at mauris. Phasellus venenatis massa ex, eget pulvinar libero auctor pretium. Aliquam erat volutpat. Duis euismod justo in quam ullamcorper, in commodo massa vulputate.
-
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pretium est a porttitor vehicula. Quisque vel commodo urna. Morbi mattis rutrum ante, id vehicula ex accumsan ut. Morbi viverra, eros vel porttitor facilisis, eros purus aliquet erat, nec lobortis felis elit pulvinar sem. Vivamus vulputate, risus eget commodo eleifend, eros nibh porta quam, vitae lacinia leo libero at magna. Maecenas aliquam sagittis orci, et posuere nisi ultrices sit amet. Aliquam ex odio, malesuada sed posuere quis, pellentesque at mauris. Phasellus venenatis massa ex, eget pulvinar libero auctor pretium. Aliquam erat volutpat. Duis euismod justo in quam ullamcorper, in commodo massa vulputate.
-{{#> pagination pagination--id="pagination-plain-bottom" pagination--IsBottom=true pagination--IsPlain=true}}
- {{> pagination-menu-toggle pagination-menu-toggle--id=(concat pagination--id '-menu-toggle') pagination-menu-toggle--modifier="pf-m-top"}}
- {{> pagination-nav-content pagination-nav--aria-label="Pagination nav - plain bottom example"}}
-{{/pagination}}
-```
-
### Bottom sticky
```hbs
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pretium est a porttitor vehicula. Quisque vel commodo urna. Morbi mattis rutrum ante, id vehicula ex accumsan ut. Morbi viverra, eros vel porttitor facilisis, eros purus aliquet erat, nec lobortis felis elit pulvinar sem. Vivamus vulputate, risus eget commodo eleifend, eros nibh porta quam, vitae lacinia leo libero at magna. Maecenas aliquam sagittis orci, et posuere nisi ultrices sit amet. Aliquam ex odio, malesuada sed posuere quis, pellentesque at mauris. Phasellus venenatis massa ex, eget pulvinar libero auctor pretium. Aliquam erat volutpat. Duis euismod justo in quam ullamcorper, in commodo massa vulputate.
@@ -228,8 +213,6 @@ This example shows the use of `.pf-m-sticky-base` and `.pf-m-sticky-stuck` on bo
| `.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`. |
| `.pf-m-sticky-base` | `.pf-v6-c-pagination` | Makes the pagination sticky on scroll, but does not apply sticky styling. `.pf-m-sticky-stuck` must be used to apply sticky styling. |
| `.pf-m-sticky-stuck` | `.pf-v6-c-pagination.pf-m-sticky-base` | Applies sticky styling to a pagination with `.pf-m-sticky-base`. |
-| `.pf-m-plain` | `.pf-v6-c-pagination.pf-m-bottom` | Modifies the pagination to have a transparent background. Only applies outside of glass theme. |
-| `.pf-m-no-plain-on-glass` | `.pf-v6-c-pagination.pf-m-bottom` | Prevents the pagination from being transparent on glass theme. |
| `.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). |
| `.pf-m-page-insets` | `.pf-v6-c-pagination` | Modifies the pagination component padding/inset to visually match padding of page elements. |
| `.pf-m-first` | `.pf-v6-c-pagination__nav-control` | Indicates the control is for the first page button. |
diff --git a/src/patternfly/components/Pagination/pagination.hbs b/src/patternfly/components/Pagination/pagination.hbs
index dda8b780bf..26f6d8db9a 100644
--- a/src/patternfly/components/Pagination/pagination.hbs
+++ b/src/patternfly/components/Pagination/pagination.hbs
@@ -3,9 +3,7 @@
pagination--IsCompact='pf-m-compact'
pagination--IsBottom='pf-m-bottom'
pagination--IsSticky='pf-m-sticky'
- pagination--IsPlain='pf-m-plain'
pagination--IsStatic='pf-m-static'
- pagination--IsNoPlainOnGlass='pf-m-no-plain-on-glass'
pagination--IsStickyBase='pf-m-sticky-base'
pagination--IsStickyStuck='pf-m-sticky-stuck'
pagination--modifier=pagination--modifier
diff --git a/src/patternfly/components/Pagination/pagination.scss b/src/patternfly/components/Pagination/pagination.scss
index e9941ed42e..13ee70e568 100644
--- a/src/patternfly/components/Pagination/pagination.scss
+++ b/src/patternfly/components/Pagination/pagination.scss
@@ -50,7 +50,8 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
--#{$pagination}--m-sticky--BorderRadius--glass: var(--pf-t--global--border--radius--medium);
// bottom
- --#{$pagination}--m-bottom--BackgroundColor: var(--pf-t--global--background--color--primary--default);
+ --#{$pagination}--m-bottom--BackgroundColor: var(--pf-t--global--background--color--sticky--default);
+ --#{$pagination}--m-bottom--BorderRadius: 0;
--#{$pagination}--m-bottom--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
--#{$pagination}--m-bottom--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
--#{$pagination}--m-bottom--InsetBlockEnd: 0;
@@ -64,6 +65,8 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
--#{$pagination}--m-bottom--m-static--PaddingBlockEnd: 0;
--#{$pagination}--m-bottom--m-static--PaddingInlineStart: var(--pf-t--global--spacer--sm);
--#{$pagination}--m-bottom--m-static--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
+ --#{$pagination}--m-bottom--m-static--BorderRadius: 0;
+ --#{$pagination}--m-bottom--m-static--BackgroundColor: transparent;
--#{$pagination}--m-bottom--m-sticky-base--InsetBlockEnd: 0;
:where(:root.pf-v6-theme-glass) & {
@@ -71,6 +74,9 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
--#{$pagination}--m-sticky-stuck--BoxShadow: var(--pf-t--global--box-shadow--sm);
--#{$pagination}--m-sticky--BorderRadius: var(--#{$pagination}--m-sticky--BorderRadius--glass);
--#{$pagination}--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--sm);
+ --#{$pagination}--m-bottom--BoxShadow: var(--pf-t--global--box-shadow--sm);
+ --#{$pagination}--m-bottom--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--sm);
+ --#{$pagination}--m-bottom--BorderRadius: var(--#{$pagination}--m-sticky--BorderRadius--glass);
}
// page menu
@@ -82,6 +88,7 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
--#{$pagination}__page-menu--md--Display: var(--#{$pagination}__page-menu--Display--base);
@media screen and (min-width: $pf-v6-global--breakpoint--md) {
+ --#{$pagination}--m-bottom--BackgroundColor: transparent;
--#{$pagination}--m-bottom--BoxShadow: none;
--#{$pagination}--m-bottom--BorderBlockStartWidth: 0;
--#{$pagination}__page-menu--Display: var(--#{$pagination}__page-menu--md--Display);
@@ -106,11 +113,6 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
border-block-start-width: var(--#{$pagination}--BorderBlockStartWidth);
border-block-end-width: var(--#{$pagination}--BorderBlockEndWidth);
- :where(:root:not(.pf-v6-theme-glass)) &.pf-m-plain,
- :where(:root.pf-v6-theme-glass) &:not(.pf-m-no-plain-on-glass) {
- --#{$pagination}--m-bottom--BackgroundColor: transparent;
- }
-
.#{$pagination}__page-menu {
display: var(--#{$pagination}__page-menu--Display);
}
@@ -128,12 +130,9 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
padding-inline-start: var(--#{$pagination}--m-bottom--m-sticky--PaddingInlineStart);
padding-inline-end: var(--#{$pagination}--m-bottom--m-sticky--PaddingInlineEnd);
background-color: var(--#{$pagination}--m-bottom--BackgroundColor);
+ border-radius: var(--#{$pagination}--m-bottom--BorderRadius);
box-shadow: var(--#{$pagination}--m-bottom--BoxShadow);
- :where(:root.pf-v6-theme-glass) &.pf-m-sticky-base:not(.pf-m-sticky-stuck) {
- --#{$pagination}--m-bottom--BackgroundColor: transparent;
- }
-
.#{$pagination}__nav-control.pf-m-first,
.#{$pagination}__nav-control.pf-m-last,
.#{$pagination}__nav-page-select {
@@ -154,6 +153,7 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
@media screen and (min-width: $pf-v6-global--breakpoint--md) {
--#{$pagination}--m-bottom--MarginBlockStart: 0;
--#{$pagination}--m-bottom--InsetBlockEnd: auto;
+ --#{$pagination}--m-bottom--BorderRadius: var(--#{$pagination}--m-bottom--m-static--BorderRadius);
position: relative;
justify-content: flex-end;
@@ -161,7 +161,7 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
padding-block-end: var(--#{$pagination}--m-bottom--m-static--PaddingBlockEnd);
padding-inline-start: var(--#{$pagination}--m-bottom--m-static--PaddingInlineStart);
padding-inline-end: var(--#{$pagination}--m-bottom--m-static--PaddingInlineEnd);
-
+
.#{$pagination}__nav-control.pf-m-first,
.#{$pagination}__nav-control.pf-m-last,
.#{$pagination}__nav-page-select {
@@ -184,15 +184,18 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
}
&.pf-m-static {
+ --#{$pagination}--m-bottom--BackgroundColor: var(--#{$pagination}--m-bottom--m-static--BackgroundColor);
+
position: relative;
padding-block-start: var(--#{$pagination}--m-bottom--m-static--PaddingBlockStart);
padding-block-end: var(--#{$pagination}--m-bottom--m-static--PaddingBlockEnd);
padding-inline-start: var(--#{$pagination}--m-bottom--m-static--PaddingInlineStart);
padding-inline-end: var(--#{$pagination}--m-bottom--m-static--PaddingInlineEnd);
border: 0;
+ border-radius: var(--#{$pagination}--m-bottom--m-static--BorderRadius);
box-shadow: none;
}
-
+
&.pf-m-sticky {
--#{$pagination}--m-bottom--InsetBlockEnd: 0;
--#{$pagination}--BorderBlockEndWidth: var(--#{$pagination}--m-sticky--BorderBlockEndWidth);
diff --git a/src/patternfly/components/Popover/popover.scss b/src/patternfly/components/Popover/popover.scss
index e08dbc5a49..a4c0574128 100644
--- a/src/patternfly/components/Popover/popover.scss
+++ b/src/patternfly/components/Popover/popover.scss
@@ -49,7 +49,7 @@
--#{$popover}__arrow--m-block-right--InsetInlineEnd: var(--pf-t--global--border--radius--medium);
// Close
- --#{$popover}__close--InsetBlockStart: calc(var(--#{$popover}__content--PaddingBlockStart) - var(--pf-t--global--spacer--control--vertical--default)); // align top of button with top of text
+ --#{$popover}__close--InsetBlockStart: calc(var(--#{$popover}__content--PaddingBlockStart) - var(--pf-t--global--spacer--control--vertical--plain)); // align top of button with top of text
--#{$popover}__close--InsetInlineEnd: var(--#{$popover}__content--PaddingInlineEnd); // align right of content
--#{$popover}__close--sibling--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
diff --git a/src/patternfly/components/Progress/progress.scss b/src/patternfly/components/Progress/progress.scss
index e18db9b1d3..12d43aa4ee 100644
--- a/src/patternfly/components/Progress/progress.scss
+++ b/src/patternfly/components/Progress/progress.scss
@@ -163,7 +163,7 @@
// the progress__description is displayed above the progress bar on the left
.#{$progress}__description {
grid-column: 1 / 2;
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
&.pf-m-truncate {
@include pf-v6-text-overflow;
@@ -179,7 +179,7 @@
align-items: flex-start;
justify-content: flex-end;
text-align: end;
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
}
// the progress__status-icon is an icon displayed always in the upper right
diff --git a/src/patternfly/components/Table/table-toggle-icon.hbs b/src/patternfly/components/Table/table-toggle-icon.hbs
index 0164580036..2a820bf6f3 100644
--- a/src/patternfly/components/Table/table-toggle-icon.hbs
+++ b/src/patternfly/components/Table/table-toggle-icon.hbs
@@ -2,5 +2,9 @@
{{#if table-toggle-icon--attribute}}
{{{table-toggle-icon--attribute}}}
{{/if}}>
- {{pfIcon "rh-microns-caret-down"}}
+ {{#if table--IsTree-view}}
+ {{pfIcon "rh-microns-caret-right"}}
+ {{else}}
+ {{pfIcon "rh-microns-caret-down"}}
+ {{/if}}
diff --git a/src/patternfly/components/Table/table-tree-view.scss b/src/patternfly/components/Table/table-tree-view.scss
index 73e6abfe28..7b302e6eb8 100644
--- a/src/patternfly/components/Table/table-tree-view.scss
+++ b/src/patternfly/components/Table/table-tree-view.scss
@@ -37,6 +37,8 @@ $pf-v6-c-tree-view--MaxDepth: 10;
// - Table tree view
.#{$table}.pf-m-tree-view {
+ --#{$table}__toggle--c-button--m-expanded__toggle-icon--Rotate: 90deg;
+
> tbody > tr {
--#{$table}--m-tree-view__toggle--InsetInlineStart: var(--#{$table}__tree-view-main--PaddingInlineStart);
diff --git a/src/patternfly/components/Table/table.scss b/src/patternfly/components/Table/table.scss
index abb07249f1..790149dc3d 100644
--- a/src/patternfly/components/Table/table.scss
+++ b/src/patternfly/components/Table/table.scss
@@ -89,8 +89,8 @@
--#{$table}__toggle--c-button--m-expanded__toggle-icon--Rotate: -180deg;
// * Table button
- --#{$table}__button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
- --#{$table}__button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
+ --#{$table}__button--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
+ --#{$table}__button--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
--#{$table}__button--PaddingInlineStart: var(--pf-t--global--spacer--md);
--#{$table}__button--PaddingInlineEnd: var(--pf-t--global--spacer--md);
--#{$table}__button--Color: var(--pf-t--global--text--color--regular);
@@ -1304,7 +1304,6 @@
.#{$table}__tr:last-child:not(.pf-m-border-row) {
z-index: var(--#{$table}__thead--m-nested-column-header--after--ZIndex);
- pointer-events: none;
border-block-end: var(--#{$table}__thead--m-nested-column-header--BorderBlockEndWidth) solid var(--#{$table}__thead--m-nested-column-header--BorderBlockEndColor);
}
diff --git a/src/patternfly/components/Title/title.scss b/src/patternfly/components/Title/title.scss
index 0dbbb2ea97..08c2026869 100644
--- a/src/patternfly/components/Title/title.scss
+++ b/src/patternfly/components/Title/title.scss
@@ -71,7 +71,7 @@
.#{$title} {
font-family: var(--#{$title}--FontFamily);
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
&.pf-m-4xl {
font-size: var(--#{$title}--m-4xl--FontSize);
diff --git a/src/patternfly/components/Tooltip/tooltip.scss b/src/patternfly/components/Tooltip/tooltip.scss
index ce32d370dc..a7776d21a6 100644
--- a/src/patternfly/components/Tooltip/tooltip.scss
+++ b/src/patternfly/components/Tooltip/tooltip.scss
@@ -129,7 +129,7 @@
font-size: var(--#{$tooltip}__content--FontSize);
color: var(--#{$tooltip}__content--Color);
text-align: center;
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
background-color: var(--#{$tooltip}__content--BackgroundColor);
border-radius: var(--#{$tooltip}__content--BorderRadius);
diff --git a/src/patternfly/components/TreeView/tree-view-node-toggle-icon.hbs b/src/patternfly/components/TreeView/tree-view-node-toggle-icon.hbs
index e490d0d0c7..3802dc8f58 100644
--- a/src/patternfly/components/TreeView/tree-view-node-toggle-icon.hbs
+++ b/src/patternfly/components/TreeView/tree-view-node-toggle-icon.hbs
@@ -2,5 +2,5 @@
{{#if tree-view-node-toggle-icon--attribute}}
{{{tree-view-node-toggle-icon--attribute}}}
{{/if}}>
- {{pfIcon "rh-microns-caret-down"}}
+ {{pfIcon "rh-microns-caret-right"}}
diff --git a/src/patternfly/components/TreeView/tree-view.scss b/src/patternfly/components/TreeView/tree-view.scss
index a2ca993e32..d214072de0 100644
--- a/src/patternfly/components/TreeView/tree-view.scss
+++ b/src/patternfly/components/TreeView/tree-view.scss
@@ -4,16 +4,16 @@ $pf-v6-c-tree-view--MaxNesting: 10 !default;
@include pf-root($tree-view) {
// Node base
- --#{$tree-view}__node--indent--base: calc(var(--pf-t--global--spacer--md) * 2 + var(--#{$tree-view}__node-toggle-icon--MinWidth)); // based off of the expected width of the toggle button
+ --#{$tree-view}__node--indent--base: calc(var(--#{$tree-view}__node-toggle--PaddingInlineStart) + var(--#{$tree-view}__node-toggle--PaddingInlineEnd) + var(--#{$tree-view}__node-toggle-icon--MinWidth)); // based off of the expected width of the toggle button
--#{$tree-view}__node--nested-indent--base: calc(var(--#{$tree-view}__node--indent--base) - var(--pf-t--global--spacer--md)); // nested spacing that removes the toggle button's left padding, so the icon aligns with text on the node above it
// Content
--#{$tree-view}__content--BorderRadius: var(--pf-t--global--border--radius--small);
// Node
- --#{$tree-view}__node--PaddingBlockStart: var(--pf-t--global--spacer--sm);
- --#{$tree-view}__node--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
- --#{$tree-view}__node--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
+ --#{$tree-view}__node--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
+ --#{$tree-view}__node--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
+ --#{$tree-view}__node--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
--#{$tree-view}__node--PaddingInlineStart: var(--#{$tree-view}__node--indent--base);
--#{$tree-view}__node--Color: var(--pf-t--global--text--color--subtle);
--#{$tree-view}__node--BackgroundColor: transparent;
@@ -66,9 +66,9 @@ $pf-v6-c-tree-view--MaxNesting: 10 !default;
// Toggle icon
--#{$tree-view}__node-toggle-icon--MinWidth: var(--pf-t--global--icon--size--font--body--default);
- --#{$tree-view}__node-toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
+ --#{$tree-view}__node-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
--#{$tree-view}__node-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
- --#{$tree-view}__node-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
+ --#{$tree-view}__node-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
--#{$tree-view}__node-toggle--PaddingInlineStart: var(--pf-t--global--spacer--md);
--#{$tree-view}__node-toggle--MarginBlockStart: calc(var(--#{$tree-view}__node-toggle--PaddingBlockStart) * -1);
--#{$tree-view}__node-toggle--MarginBlockEnd: calc(var(--#{$tree-view}__node-toggle--PaddingBlockStart) * -1);
@@ -92,7 +92,7 @@ $pf-v6-c-tree-view--MaxNesting: 10 !default;
--#{$tree-view}__node-icon--Color: var(--pf-t--global--icon--color--subtle);
--#{$tree-view}__node-toggle-icon--base--Rotate: 0;
--#{$tree-view}__node-toggle-icon--Rotate: var(--#{$tree-view}__node-toggle-icon--base--Rotate);
- --#{$tree-view}__list-item--m-expanded__node-toggle-icon--Rotate: -180deg;
+ --#{$tree-view}__list-item--m-expanded__node-toggle-icon--Rotate: 90deg;
// Disabled
--#{$tree-view}__node--m-disabled--Color: var(--pf-t--global--text--color--disabled);
diff --git a/src/patternfly/components/Wizard/wizard.scss b/src/patternfly/components/Wizard/wizard.scss
index a61f8f9f2d..d81c9a8c86 100644
--- a/src/patternfly/components/Wizard/wizard.scss
+++ b/src/patternfly/components/Wizard/wizard.scss
@@ -325,7 +325,7 @@
align-items: baseline;
margin-block-end: var(--#{$wizard}__toggle-list-item--MarginBlockEnd);
text-align: start;
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
&:not(:last-child) {
margin-inline-end: var(--#{$wizard}__toggle-list-item--not-last-child--MarginInlineEnd);
@@ -478,7 +478,7 @@
padding-inline: 0;
color: var(--#{$wizard}__nav-link--Color);
text-align: start; // needed for when the item is a button
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
text-decoration-line: var(--#{$wizard}__nav-link--TextDecoration);
counter-increment: wizard-nav-count;
background-color: transparent;
@@ -614,7 +614,7 @@
flex-direction: column;
overflow-x: hidden;
overflow-y: auto;
- overflow-wrap: break-word;
+ overflow-wrap: anywhere;
}
.#{$wizard}__main-body {
diff --git a/src/patternfly/demos/PrimaryDetail/examples/PrimaryDetail.md b/src/patternfly/demos/PrimaryDetail/examples/PrimaryDetail.md
index 4fa4eac46a..01fc57c089 100644
--- a/src/patternfly/demos/PrimaryDetail/examples/PrimaryDetail.md
+++ b/src/patternfly/demos/PrimaryDetail/examples/PrimaryDetail.md
@@ -14,20 +14,24 @@ wrapperTag: div
{{#> page-main-section}}
- {{#> primary-detail-template primary-detail-template--id=(concat page-template--id "-drawer") primary-detail-template--modifier="pf-m-inline-on-2xl" drawer-panel--IsOpen="true"}}
+ {{#> primary-detail-template primary-detail-template--id=(concat page-template--id "-drawer") drawer-panel--IsOpen="true"}}
+
+ {{#> drawer-section}}
+ {{> toolbar-template
+ toolbar-template--id=(concat drawer--id '-toolbar')
+ toolbar-template--HasFilterGroup=true
+ toolbar-template--HasOverflowMenu=true
+ toolbar-template--HasSearchFilter=true
+ toolbar-template--HasSortButton=true
+ toolbar-template--HasToggleGroup=true
+ }}
+ {{> divider divider--type="div"}}
+ {{/drawer-section}}
{{#> drawer-main}}
{{#> drawer-content}}
- {{> toolbar-template
- toolbar-template--id=(concat drawer--id '-toolbar')
- toolbar-template--HasFilterGroup=true
- toolbar-template--HasOverflowMenu=true
- toolbar-template--HasSearchFilter=true
- toolbar-template--HasSortButton=true
- toolbar-template--HasToggleGroup=true
- }}
{{> data-list-simple-data-list}}
{{/drawer-content}}
@@ -58,67 +62,27 @@ wrapperTag: div
{{> page-template page-template--id="primary-detail-collapsed-example" masthead-template--modifier="pf-m-display-stack pf-m-display-inline-on-lg"}}
{{#* inline "page-template-section"}}
- {{> divider divider--type="div"}}
{{#> page-main-section}}
- {{#> primary-detail-template primary-detail-template--id=(concat page-template--id "-drawer") primary-detail-template--modifier="pf-m-inline-on-2xl"}}
+ {{#> primary-detail-template primary-detail-template--id=(concat page-template--id "-drawer")}}
- {{#> drawer-main}}
-
-
- {{#> drawer-content}}
- {{> toolbar-template
- toolbar-template--id=(concat drawer--id '-toolbar')
- toolbar-template--HasFilterGroup=true
- toolbar-template--HasOverflowMenu=true
- toolbar-template--HasSearchFilter=true
- toolbar-template--HasSortButton=true
- toolbar-template--HasToggleGroup=true
- }}
- {{> data-list-simple-data-list}}
- {{/drawer-content}}
-
-
- {{#> drawer-panel progress--modifier="pf-m-sm"}}
-
-
- {{> primary-detail-template-panel-header primary-detail-template-panel-header--title="Patternfly-elements" primary-detail-template-panel-header--sub-title="PatternFly elements"}}
-
-
- {{#> drawer-body}}
- {{> primary-detail-template-panel-body}}
- {{/drawer-body}}
- {{/drawer-panel}}
-
- {{/drawer-main}}
- {{/primary-detail-template}}
- {{/page-main-section}}
-{{/inline}}
-```
-
-### Primary-detail content body padding
-```hbs isFullscreen
-{{> page-template page-template--id="primary-detail-content-body-padding-example" masthead-template--modifier="pf-m-display-stack pf-m-display-inline-on-lg"}}
-
-{{#* inline "page-template-section"}}
- {{> divider divider--type="div"}}
- {{#> page-main-section page-main-section--modifier="pf-m-no-padding"}}
-
-
- {{#> primary-detail-template primary-detail-template--id=(concat page-template--id "-drawer") primary-detail-template--modifier="pf-m-inline-on-2xl" drawer-panel--IsOpen="true"}}
+ {{#> drawer-section}}
+ {{> toolbar-template
+ toolbar-template--id=(concat drawer--id '-toolbar')
+ toolbar-template--HasFilterGroup=true
+ toolbar-template--HasOverflowMenu=true
+ toolbar-template--HasSearchFilter=true
+ toolbar-template--HasSortButton=true
+ toolbar-template--HasToggleGroup=true
+ }}
+ {{> divider divider--type="div"}}
+ {{/drawer-section}}
{{#> drawer-main}}
- {{#> drawer-content drawer-content--modifier="pf-m-no-background" drawer-body--modifier="pf-m-padding"}}
- {{> toolbar-template
- toolbar-template--id=(concat drawer--id '-toolbar')
- toolbar-template--HasFilterGroup=true
- toolbar-template--HasOverflowMenu=true
- toolbar-template--HasSortButton=true
- toolbar-template--HasToggleGroup=true
- }}
+ {{#> drawer-content}}
{{> data-list-simple-data-list}}
{{/drawer-content}}
@@ -148,11 +112,12 @@ wrapperTag: div
{{#> page-main-section page-main-section--modifier="pf-m-no-padding"}}
- {{#> primary-detail-template primary-detail-template--id=(concat page-template--id "-drawer") primary-detail-template--modifier="pf-m-inline-on-2xl" drawer-panel--IsOpen="true"}}
+ {{#> primary-detail-template primary-detail-template--id=(concat page-template--id "-drawer") primary-detail-template--modifier="pf-m-inline" drawer-panel--IsOpen="true"}}
{{#> drawer-section}}
{{> toolbar-template
toolbar-template--id=(concat drawer--id '-toolbar')
+ toolbar-template--modifier="pf-m-inset-lg"
toolbar-template--HasBulkSelect=true
toolbar-template--HasSearchFilter=true
toolbar-template--HasSortButton=true
@@ -190,122 +155,55 @@ wrapperTag: div
{{/inline}}
```
-### Primary-detail card simple list expanded on mobile
+### Inline modifier
```hbs isFullscreen
-{{> page-template page-template--id="primary-detail-card-simple-list-on-mobile-example"}}
+{{> page-template page-template--id="primary-detail-inline-modifier-example" masthead-template--modifier="pf-m-display-stack pf-m-display-inline-on-lg"}}
{{#* inline "page-template-section"}}
- {{> divider divider--type="div"}}
{{#> page-main-section}}
- {{#> card}}
-
-
- {{#> primary-detail-template primary-detail-template--id=(concat page-template--id "-drawer") drawer--IsStatic="true" drawer-panel--IsOpen="true"}}
-
- {{#> drawer-main}}
-
- {{#> drawer-content drawer-content--NoBody="true"}}
- {{#> drawer-content-body drawer-content-body--modifier="pf-m-no-padding"}}
- {{> primary-detail-template-simple-list}}
- {{/drawer-content-body}}
- {{/drawer-content}}
-
-
- {{#> drawer-panel drawer-panel--type="div" drawer-panel--attribute=(concat 'id="' drawer--id '-panel" aria-label="Panel"') drawer-panel--modifier="pf-m-width-75-on-xl"}}
-
-
- {{> primary-detail-template-panel-header primary-detail-template-panel-header--title="Patternfly-elements"}}
-
- {{#> drawer-body}}
- {{> primary-detail-template-panel-body}}
- {{/drawer-body}}
- {{/drawer-panel}}
- {{/drawer-main}}
- {{/primary-detail-template}}
- {{/card}}
- {{/page-main-section}}
-{{/inline}}
-```
-
-### Primary-detail card data list expanded on mobile
-```hbs isFullscreen
-{{> page-template page-template--id="primary-detail-card-data-list-example"}}
+ {{#> primary-detail-template primary-detail-template--id=(concat page-template--id "-drawer") primary-detail-template--modifier="pf-m-inline" drawer-panel--IsOpen="true"}}
-{{#* inline "page-template-section"}}
- {{> divider divider--type="div"}}
- {{#> page-main-section}}
+ {{#> drawer-section}}
+ {{> toolbar-template
+ toolbar-template--id=(concat drawer--id '-toolbar')
+ toolbar-template--HasFilterGroup=true
+ toolbar-template--HasOverflowMenu=true
+ toolbar-template--HasSearchFilter=true
+ toolbar-template--HasSortButton=true
+ toolbar-template--HasToggleGroup=true
+ }}
+ {{> divider divider--type="div"}}
+ {{/drawer-section}}
- {{#> card}}
+ {{#> drawer-main}}
-
- {{#> primary-detail-template primary-detail-template--id=(concat page-template--id "-drawer") drawer--IsStatic="true" drawer-panel--IsOpen="true"}}
- {{#> drawer-main}}
+
+ {{#> drawer-content}}
+ {{> data-list-simple-data-list}}
+ {{/drawer-content}}
-
- {{#> drawer-content}}
- {{> primary-detail-template-card-toolbar primary-detail-template-card-toolbar--id=(concat drawer--id '-toolbar')}}
- {{> primary-detail-template-card-data-list primary-detail-template-card-data-list--id=(concat drawer--id '-simple-list')}}
- {{/drawer-content}}
+
+ {{#> drawer-panel drawer-panel--type="div" progress--modifier="pf-m-sm"}}
-
- {{#> drawer-panel drawer-panel--type="div" drawer-panel--attribute=(concat 'id="' drawer--id '-panel" aria-label="Panel"') drawer-panel--modifier="pf-m-width-75-on-2xl"}}
+
+ {{> primary-detail-template-panel-header primary-detail-template-panel-header--title="Node 2" primary-detail-template-panel-header--sub-title='siemur/test-space'}}
-
- {{> primary-detail-template-panel-header primary-detail-template-panel-header--title="Patternfly-elements"}}
- {{#> drawer-body}}
- {{> primary-detail-template-panel-body}}
- {{/drawer-body}}
- {{/drawer-panel}}
- {{/drawer-main}}
- {{/primary-detail-template}}
- {{/card}}
+
+ {{#> drawer-body drawer-body--modifier="pf-m-no-padding"}}
+ {{> primary-detail-template-panel-tabs primary-detail-template-panel-tabs--aria-label="Node 2" primary-detail-template-panel-tabs--modifier="pf-m-box pf-m-fill"}}
+ {{/drawer-body}}
+
+ {{#> drawer-body}}
+ {{> primary-detail-template-panel-tab-content}}
+ {{/drawer-body}}
+ {{/drawer-panel}}
+ {{/drawer-main}}
+ {{/primary-detail-template}}
{{/page-main-section}}
{{/inline}}
```
-### Inline modifier
-```hbs isFullscreen
-{{> page-template page-template--id="primary-detail-inline-modifier-example"}}
-
-{{#* inline "page-template-section"}}
- {{> divider divider--type="div"}}
- {{#> primary-detail-template primary-detail-template--id=(concat page-template--id "-drawer") primary-detail-template--modifier="pf-m-inline-on-2xl" drawer-panel--IsOpen="true"}}
-
- {{#> drawer-main}}
-
-
- {{#> drawer-content}}
- {{> toolbar-template
- toolbar-template--id=(concat drawer--id '-toolbar')
- toolbar-template--HasMenu=true
- toolbar-template--HasOverflowMenu=true
- toolbar-template--HasOverflowMenuSecondButton=true
- }}
- {{> data-list-simple-data-list}}
- {{/drawer-content}}
-
-
- {{#> drawer-panel drawer-panel--type="div" progress--modifier="pf-m-sm"}}
-
-
- {{> primary-detail-template-panel-header primary-detail-template-panel-header--title="Node 2" primary-detail-template-panel-header--sub-title='siemur/test-space'}}
-
-
- {{#> drawer-body drawer-body--modifier="pf-m-no-padding"}}
- {{> primary-detail-template-panel-tabs primary-detail-template-panel-tabs--aria-label="Node 2" primary-detail-template-panel-tabs--modifier="pf-m-box pf-m-fill"}}
- {{/drawer-body}}
-
-
- {{#> drawer-body}}
- {{> primary-detail-template-panel-tab-content}}
- {{/drawer-body}}
- {{/drawer-panel}}
- {{/drawer-main}}
- {{/primary-detail-template}}
-{{/inline}}
-```
-
## Documentation
This demo implements the drawer in context of the page component.
diff --git a/src/patternfly/demos/PrimaryDetail/primary-detail-template-card-data-list.hbs b/src/patternfly/demos/PrimaryDetail/primary-detail-template-card-data-list.hbs
deleted file mode 100644
index 0bdc11a30f..0000000000
--- a/src/patternfly/demos/PrimaryDetail/primary-detail-template-card-data-list.hbs
+++ /dev/null
@@ -1,111 +0,0 @@
-{{#> data-list data-list--id=(concat primary-detail-template--id '-card-data-list') data-list--attribute='aria-label="Selectable rows data list example"' data-list-item--IsSelectable="true"}}
- {{#> data-list-item data-list-item--id="item-1"}}
- {{#> data-list-item-row}}
- {{#> data-list-item-content}}
- {{#> data-list-cell}}
- Node 1
- siemur/test-space
- {{/data-list-cell}}
- {{/data-list-item-content}}
- {{/data-list-item-row}}
- {{/data-list-item}}
-
- {{#> data-list-item data-list-item--id="item-2" data-list-item--IsSelected="true"}}
- {{#> data-list-item-row}}
- {{#> data-list-item-content}}
- {{#> data-list-cell}}
- Node 2
- siemur/test-space
- {{/data-list-cell}}
- {{/data-list-item-content}}
- {{/data-list-item-row}}
- {{/data-list-item}}
-
- {{#> data-list-item data-list-item--id="item-3"}}
- {{#> data-list-item-row}}
- {{#> data-list-item-content}}
- {{#> data-list-cell}}
- Node 3
- siemur/test-space
- {{/data-list-cell}}
- {{/data-list-item-content}}
- {{/data-list-item-row}}
- {{/data-list-item}}
-
- {{#> data-list-item data-list-item--id="item-4"}}
- {{#> data-list-item-row}}
- {{#> data-list-item-content}}
- {{#> data-list-cell}}
- Node 4
- siemur/test-space
- {{/data-list-cell}}
- {{/data-list-item-content}}
- {{/data-list-item-row}}
- {{/data-list-item}}
-
- {{#> data-list-item data-list-item--id="item-5"}}
- {{#> data-list-item-row}}
- {{#> data-list-item-content}}
- {{#> data-list-cell}}
- Node 5
- siemur/test-space
- {{/data-list-cell}}
- {{/data-list-item-content}}
- {{/data-list-item-row}}
- {{/data-list-item}}
-
- {{#> data-list-item data-list-item--id="item-6"}}
- {{#> data-list-item-row}}
- {{#> data-list-item-content}}
- {{#> data-list-cell}}
- Node 6
- siemur/test-space
- {{/data-list-cell}}
- {{/data-list-item-content}}
- {{/data-list-item-row}}
- {{/data-list-item}}
-
- {{#> data-list-item data-list-item--id="item-7"}}
- {{#> data-list-item-row}}
- {{#> data-list-item-content}}
- {{#> data-list-cell}}
- Node 7
- siemur/test-space
- {{/data-list-cell}}
- {{/data-list-item-content}}
- {{/data-list-item-row}}
- {{/data-list-item}}
-
- {{#> data-list-item data-list-item--id="item-8"}}
- {{#> data-list-item-row}}
- {{#> data-list-item-content}}
- {{#> data-list-cell}}
- Node 8
- siemur/test-space
- {{/data-list-cell}}
- {{/data-list-item-content}}
- {{/data-list-item-row}}
- {{/data-list-item}}
-
- {{#> data-list-item data-list-item--id="item-9"}}
- {{#> data-list-item-row}}
- {{#> data-list-item-content}}
- {{#> data-list-cell}}
- Node 9
- siemur/test-space
- {{/data-list-cell}}
- {{/data-list-item-content}}
- {{/data-list-item-row}}
- {{/data-list-item}}
-
- {{#> data-list-item data-list-item--id="item-10"}}
- {{#> data-list-item-row}}
- {{#> data-list-item-content}}
- {{#> data-list-cell}}
- Node 10
- siemur/test-space
- {{/data-list-cell}}
- {{/data-list-item-content}}
- {{/data-list-item-row}}
- {{/data-list-item}}
-{{/data-list}}
diff --git a/src/patternfly/demos/PrimaryDetail/primary-detail-template-card-toolbar.hbs b/src/patternfly/demos/PrimaryDetail/primary-detail-template-card-toolbar.hbs
deleted file mode 100644
index 8f50ac27c1..0000000000
--- a/src/patternfly/demos/PrimaryDetail/primary-detail-template-card-toolbar.hbs
+++ /dev/null
@@ -1,18 +0,0 @@
-{{#> toolbar toolbar--id=(concat primary-detail-template-card-toolbar--id "-card-toolbar")}}
- {{#> toolbar-content}}
- {{#> toolbar-content-section}}
- {{#> toolbar-item}}
- {{> menu-toggle menu-toggle--text="Dropdown" menu-toggle--attribute="style='width: 150px'" menu-toggle--id=(concat toolbar--id '-select-dropdown')}}
- {{/toolbar-item}}
- {{#> toolbar-item toolbar-item--modifier=(concat 'pf-m-pagination ' toolbar-item-pagination--modifier)}}
- {{#> pagination}}
- {{#> pagination-total-items}}
- 1 - 10 of 37
- {{/pagination-total-items}}
- {{> pagination-menu-toggle pagination-menu-toggle--id=(concat toolbar--id '-pagination-menu-toggle')}}
- {{/pagination}}
- {{/toolbar-item}}
- {{/toolbar-content-section}}
- {{> toolbar-expandable-content}}
- {{/toolbar-content}}
-{{/toolbar}}
diff --git a/src/patternfly/demos/PrimaryDetail/primary-detail-template-simple-list.hbs b/src/patternfly/demos/PrimaryDetail/primary-detail-template-simple-list.hbs
deleted file mode 100644
index bbf458085f..0000000000
--- a/src/patternfly/demos/PrimaryDetail/primary-detail-template-simple-list.hbs
+++ /dev/null
@@ -1,66 +0,0 @@
-{{#> simple-list}}
- {{#> simple-list-section}}
- {{#> simple-list-title}}
- Section title
- {{/simple-list-title}}
- {{#> simple-list-list}}
- {{#> simple-list-item}}
- {{#> simple-list-item-link simple-list-item-link--modifier="pf-m-current"}}
- List item 1
- {{/simple-list-item-link}}
- {{/simple-list-item}}
- {{#> simple-list-item}}
- {{#> simple-list-item-link}}
- List item 2
- {{/simple-list-item-link}}
- {{/simple-list-item}}
- {{#> simple-list-item}}
- {{#> simple-list-item-link}}
- List item 3
- {{/simple-list-item-link}}
- {{/simple-list-item}}
- {{#> simple-list-item}}
- {{#> simple-list-item-link}}
- List item 4
- {{/simple-list-item-link}}
- {{/simple-list-item}}
- {{/simple-list-list}}
- {{/simple-list-section}}
- {{#> simple-list-section}}
- {{#> simple-list-title}}
- Section title
- {{/simple-list-title}}
- {{#> simple-list-list}}
- {{#> simple-list-item}}
- {{#> simple-list-item-link}}
- List item 5
- {{/simple-list-item-link}}
- {{/simple-list-item}}
- {{#> simple-list-item}}
- {{#> simple-list-item-link}}
- List item 6
- {{/simple-list-item-link}}
- {{/simple-list-item}}
- {{#> simple-list-item}}
- {{#> simple-list-item-link}}
- List item 7
- {{/simple-list-item-link}}
- {{/simple-list-item}}
- {{#> simple-list-item}}
- {{#> simple-list-item-link}}
- List item 8
- {{/simple-list-item-link}}
- {{/simple-list-item}}
- {{#> simple-list-item}}
- {{#> simple-list-item-link}}
- List item 9
- {{/simple-list-item-link}}
- {{/simple-list-item}}
- {{#> simple-list-item}}
- {{#> simple-list-item-link}}
- List item 10
- {{/simple-list-item-link}}
- {{/simple-list-item}}
- {{/simple-list-list}}
- {{/simple-list-section}}
-{{/simple-list}}
diff --git a/src/patternfly/demos/Toolbar/toolbar-template.hbs b/src/patternfly/demos/Toolbar/toolbar-template.hbs
index 1673f3a12a..5b28d99216 100644
--- a/src/patternfly/demos/Toolbar/toolbar-template.hbs
+++ b/src/patternfly/demos/Toolbar/toolbar-template.hbs
@@ -14,7 +14,7 @@ Options: [
toolbar-template--HasNoPagination
] --}}
-{{#> toolbar toolbar--id=toolbar-template--id toolbar--modifier=toolbar-template--modifier}}
+{{#> toolbar toolbar--id=toolbar-template--id toolbar--modifier=toolbar-template--modifier toolbar--attribute=toolbar-template--attribute}}
{{#> toolbar-content}}
{{#> toolbar-content-section toolbar-content-section--modifier="pf-m-nowrap"}}
{{!-- partial --}}