@patternfly/react-core 4.251.3 → 4.252.0

package/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [4.252.0](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-core@4.251.4...@patternfly/react-core@4.252.0) (2022-10-17)
+
+
+### Features
+
+* **DataList:** pass button props to toggle ([#8222](https://github.com/patternfly/patternfly-react/issues/8222)) ([2328018](https://github.com/patternfly/patternfly-react/commit/2328018d049fed835fa9837294967e5c8f007cab))
+
+
+
+
+
+## [4.251.4](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-core@4.251.3...@patternfly/react-core@4.251.4) (2022-10-14)
+
+**Note:** Version bump only for package @patternfly/react-core
+
+
+
+
+
 ## [4.251.3](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-core@4.251.2...@patternfly/react-core@4.251.3) (2022-10-14)
 
 **Note:** Version bump only for package @patternfly/react-core

package/dist/esm/components/DataList/DataListToggle.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { ButtonProps } from '../Button';
 export interface DataListToggleProps extends React.HTMLProps<HTMLDivElement> {
     /** Additional classes added to the DataList cell */
     className?: string;
@@ -14,6 +15,8 @@ export interface DataListToggleProps extends React.HTMLProps<HTMLDivElement> {
     'aria-label'?: string;
     /** Allows users of some screen readers to shift focus to the controlled element. Should be used when the controlled contents are not adjacent to the toggle that controls them. */
     'aria-controls'?: string;
+    /** Additional properties spread to the toggle button */
+    buttonProps?: ButtonProps;
 }
 export declare const DataListToggle: React.FunctionComponent<DataListToggleProps>;
 //# sourceMappingURL=DataListToggle.d.ts.map

package/dist/esm/components/DataList/DataListToggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataListToggle.d.ts","sourceRoot":"","sources":["../../../../src/components/DataList/DataListToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC;IAC1E,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2EAA2E;IAC3E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,0CAA0C;IAC1C,EAAE,EAAE,MAAM,CAAC;IACX,qBAAqB;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kDAAkD;IAClD,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,kDAAkD;IAClD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mLAAmL;IACnL,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,iBAAiB,CAAC,mBAAmB,CAyBvE,CAAC"}
+{"version":3,"file":"DataListToggle.d.ts","sourceRoot":"","sources":["../../../../src/components/DataList/DataListToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAU,WAAW,EAAiB,MAAM,WAAW,CAAC;AAE/D,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC;IAC1E,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2EAA2E;IAC3E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,0CAA0C;IAC1C,EAAE,EAAE,MAAM,CAAC;IACX,qBAAqB;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kDAAkD;IAClD,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,kDAAkD;IAClD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mLAAmL;IACnL,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,wDAAwD;IACxD,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,iBAAiB,CAAC,mBAAmB,CA2BvE,CAAC"}

package/dist/esm/components/DataList/DataListToggle.js

@@ -5,10 +5,10 @@ import AngleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-right-i
 import styles from '@patternfly/react-styles/css/components/DataList/data-list';
 import { Button, ButtonVariant } from '../Button';
 export const DataListToggle = (_a) => {
-    var { className = '', isExpanded = false, 'aria-controls': ariaControls = '', 'aria-label': ariaLabel = 'Details', rowid = '', id } = _a, props = __rest(_a, ["className", "isExpanded", 'aria-controls', 'aria-label', "rowid", "id"]);
+    var { className = '', isExpanded = false, 'aria-controls': ariaControls = '', 'aria-label': ariaLabel = 'Details', rowid = '', id, buttonProps } = _a, props = __rest(_a, ["className", "isExpanded", 'aria-controls', 'aria-label', "rowid", "id", "buttonProps"]);
     return (React.createElement("div", Object.assign({ className: css(styles.dataListItemControl, className) }, props),
         React.createElement("div", { className: css(styles.dataListToggle) },
-            React.createElement(Button, { id: id, variant: ButtonVariant.plain, "aria-controls": ariaControls !== '' && ariaControls, "aria-label": ariaLabel, "aria-labelledby": ariaLabel !== 'Details' ? null : `${rowid} ${id}`, "aria-expanded": isExpanded },
+            React.createElement(Button, Object.assign({ id: id, variant: ButtonVariant.plain, "aria-controls": ariaControls !== '' && ariaControls, "aria-label": ariaLabel, "aria-labelledby": ariaLabel !== 'Details' ? null : `${rowid} ${id}`, "aria-expanded": isExpanded }, buttonProps),
                 React.createElement("div", { className: css(styles.dataListToggleIcon) },
                     React.createElement(AngleRightIcon, null))))));
 };

package/dist/esm/components/DataList/DataListToggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataListToggle.js","sourceRoot":"","sources":["../../../../src/components/DataList/DataListToggle.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,cAAc,MAAM,yDAAyD,CAAC;AACrF,OAAO,MAAM,MAAM,4DAA4D,CAAC;AAChF,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAmBlD,MAAM,CAAC,MAAM,cAAc,GAAiD,CAAC,EAQvD,EAAE,EAAE;QARmD,EAC3E,SAAS,GAAG,EAAE,EACd,UAAU,GAAG,KAAK,EAClB,eAAe,EAAE,YAAY,GAAG,EAAE,EAClC,YAAY,EAAE,SAAS,GAAG,SAAS,EACnC,KAAK,GAAG,EAAE,EACV,EAAE,OAEkB,EADjB,KAAK,cAPmE,yEAQ5E,CADS;IACiB,OAAA,CACzB,2CAAK,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,mBAAmB,EAAE,SAAS,CAAC,IAAM,KAAK;QACnE,6BAAK,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,cAAc,CAAC;YACxC,oBAAC,MAAM,IACL,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,aAAa,CAAC,KAAK,mBACb,YAAY,KAAK,EAAE,IAAI,YAAY,gBACtC,SAAS,qBACJ,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,EAAE,EAAE,mBACnD,UAAU;gBAEzB,6BAAK,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,kBAAkB,CAAC;oBAC5C,oBAAC,cAAc,OAAG,CACd,CACC,CACL,CACF,CACP,CAAA;CAAA,CAAC;AACF,cAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC"}
+{"version":3,"file":"DataListToggle.js","sourceRoot":"","sources":["../../../../src/components/DataList/DataListToggle.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,cAAc,MAAM,yDAAyD,CAAC;AACrF,OAAO,MAAM,MAAM,4DAA4D,CAAC;AAChF,OAAO,EAAE,MAAM,EAAe,aAAa,EAAE,MAAM,WAAW,CAAC;AAqB/D,MAAM,CAAC,MAAM,cAAc,GAAiD,CAAC,EASvD,EAAE,EAAE;QATmD,EAC3E,SAAS,GAAG,EAAE,EACd,UAAU,GAAG,KAAK,EAClB,eAAe,EAAE,YAAY,GAAG,EAAE,EAClC,YAAY,EAAE,SAAS,GAAG,SAAS,EACnC,KAAK,GAAG,EAAE,EACV,EAAE,EACF,WAAW,OAES,EADjB,KAAK,cARmE,wFAS5E,CADS;IACiB,OAAA,CACzB,2CAAK,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,mBAAmB,EAAE,SAAS,CAAC,IAAM,KAAK;QACnE,6BAAK,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,cAAc,CAAC;YACxC,oBAAC,MAAM,kBACL,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,aAAa,CAAC,KAAK,mBACb,YAAY,KAAK,EAAE,IAAI,YAAY,gBACtC,SAAS,qBACJ,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,EAAE,EAAE,mBACnD,UAAU,IACrB,WAAW;gBAEf,6BAAK,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,kBAAkB,CAAC;oBAC5C,oBAAC,cAAc,OAAG,CACd,CACC,CACL,CACF,CACP,CAAA;CAAA,CAAC;AACF,cAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC"}

package/dist/js/components/DataList/DataListToggle.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { ButtonProps } from '../Button';
 export interface DataListToggleProps extends React.HTMLProps<HTMLDivElement> {
     /** Additional classes added to the DataList cell */
     className?: string;
@@ -14,6 +15,8 @@ export interface DataListToggleProps extends React.HTMLProps<HTMLDivElement> {
     'aria-label'?: string;
     /** Allows users of some screen readers to shift focus to the controlled element. Should be used when the controlled contents are not adjacent to the toggle that controls them. */
     'aria-controls'?: string;
+    /** Additional properties spread to the toggle button */
+    buttonProps?: ButtonProps;
 }
 export declare const DataListToggle: React.FunctionComponent<DataListToggleProps>;
 //# sourceMappingURL=DataListToggle.d.ts.map

package/dist/js/components/DataList/DataListToggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataListToggle.d.ts","sourceRoot":"","sources":["../../../../src/components/DataList/DataListToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC;IAC1E,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2EAA2E;IAC3E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,0CAA0C;IAC1C,EAAE,EAAE,MAAM,CAAC;IACX,qBAAqB;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kDAAkD;IAClD,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,kDAAkD;IAClD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mLAAmL;IACnL,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,iBAAiB,CAAC,mBAAmB,CAyBvE,CAAC"}
+{"version":3,"file":"DataListToggle.d.ts","sourceRoot":"","sources":["../../../../src/components/DataList/DataListToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAU,WAAW,EAAiB,MAAM,WAAW,CAAC;AAE/D,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC;IAC1E,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2EAA2E;IAC3E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,0CAA0C;IAC1C,EAAE,EAAE,MAAM,CAAC;IACX,qBAAqB;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kDAAkD;IAClD,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,kDAAkD;IAClD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mLAAmL;IACnL,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,wDAAwD;IACxD,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,iBAAiB,CAAC,mBAAmB,CA2BvE,CAAC"}

package/dist/js/components/DataList/DataListToggle.js

@@ -8,10 +8,10 @@ const angle_right_icon_1 = tslib_1.__importDefault(require('@patternfly/react-ic
 const data_list_1 = tslib_1.__importDefault(require("@patternfly/react-styles/css/components/DataList/data-list"));
 const Button_1 = require("../Button");
 const DataListToggle = (_a) => {
-    var { className = '', isExpanded = false, 'aria-controls': ariaControls = '', 'aria-label': ariaLabel = 'Details', rowid = '', id } = _a, props = tslib_1.__rest(_a, ["className", "isExpanded", 'aria-controls', 'aria-label', "rowid", "id"]);
+    var { className = '', isExpanded = false, 'aria-controls': ariaControls = '', 'aria-label': ariaLabel = 'Details', rowid = '', id, buttonProps } = _a, props = tslib_1.__rest(_a, ["className", "isExpanded", 'aria-controls', 'aria-label', "rowid", "id", "buttonProps"]);
     return (React.createElement("div", Object.assign({ className: react_styles_1.css(data_list_1.default.dataListItemControl, className) }, props),
         React.createElement("div", { className: react_styles_1.css(data_list_1.default.dataListToggle) },
-            React.createElement(Button_1.Button, { id: id, variant: Button_1.ButtonVariant.plain, "aria-controls": ariaControls !== '' && ariaControls, "aria-label": ariaLabel, "aria-labelledby": ariaLabel !== 'Details' ? null : `${rowid} ${id}`, "aria-expanded": isExpanded },
+            React.createElement(Button_1.Button, Object.assign({ id: id, variant: Button_1.ButtonVariant.plain, "aria-controls": ariaControls !== '' && ariaControls, "aria-label": ariaLabel, "aria-labelledby": ariaLabel !== 'Details' ? null : `${rowid} ${id}`, "aria-expanded": isExpanded }, buttonProps),
                 React.createElement("div", { className: react_styles_1.css(data_list_1.default.dataListToggleIcon) },
                     React.createElement(angle_right_icon_1.default, null))))));
 };

package/dist/js/components/DataList/DataListToggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataListToggle.js","sourceRoot":"","sources":["../../../../src/components/DataList/DataListToggle.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAC/B,2DAA+C;AAC/C,sHAAqF;AACrF,mHAAgF;AAChF,sCAAkD;AAmB3C,MAAM,cAAc,GAAiD,CAAC,EAQvD,EAAE,EAAE;QARmD,EAC3E,SAAS,GAAG,EAAE,EACd,UAAU,GAAG,KAAK,EAClB,eAAe,EAAE,YAAY,GAAG,EAAE,EAClC,YAAY,EAAE,SAAS,GAAG,SAAS,EACnC,KAAK,GAAG,EAAE,EACV,EAAE,OAEkB,EADjB,KAAK,sBAPmE,yEAQ5E,CADS;IACiB,OAAA,CACzB,2CAAK,SAAS,EAAE,kBAAG,CAAC,mBAAM,CAAC,mBAAmB,EAAE,SAAS,CAAC,IAAM,KAAK;QACnE,6BAAK,SAAS,EAAE,kBAAG,CAAC,mBAAM,CAAC,cAAc,CAAC;YACxC,oBAAC,eAAM,IACL,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,sBAAa,CAAC,KAAK,mBACb,YAAY,KAAK,EAAE,IAAI,YAAY,gBACtC,SAAS,qBACJ,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,EAAE,EAAE,mBACnD,UAAU;gBAEzB,6BAAK,SAAS,EAAE,kBAAG,CAAC,mBAAM,CAAC,kBAAkB,CAAC;oBAC5C,oBAAC,0BAAc,OAAG,CACd,CACC,CACL,CACF,CACP,CAAA;CAAA,CAAC;AAzBW,QAAA,cAAc,kBAyBzB;AACF,sBAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC"}
+{"version":3,"file":"DataListToggle.js","sourceRoot":"","sources":["../../../../src/components/DataList/DataListToggle.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAC/B,2DAA+C;AAC/C,sHAAqF;AACrF,mHAAgF;AAChF,sCAA+D;AAqBxD,MAAM,cAAc,GAAiD,CAAC,EASvD,EAAE,EAAE;QATmD,EAC3E,SAAS,GAAG,EAAE,EACd,UAAU,GAAG,KAAK,EAClB,eAAe,EAAE,YAAY,GAAG,EAAE,EAClC,YAAY,EAAE,SAAS,GAAG,SAAS,EACnC,KAAK,GAAG,EAAE,EACV,EAAE,EACF,WAAW,OAES,EADjB,KAAK,sBARmE,wFAS5E,CADS;IACiB,OAAA,CACzB,2CAAK,SAAS,EAAE,kBAAG,CAAC,mBAAM,CAAC,mBAAmB,EAAE,SAAS,CAAC,IAAM,KAAK;QACnE,6BAAK,SAAS,EAAE,kBAAG,CAAC,mBAAM,CAAC,cAAc,CAAC;YACxC,oBAAC,eAAM,kBACL,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,sBAAa,CAAC,KAAK,mBACb,YAAY,KAAK,EAAE,IAAI,YAAY,gBACtC,SAAS,qBACJ,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,EAAE,EAAE,mBACnD,UAAU,IACrB,WAAW;gBAEf,6BAAK,SAAS,EAAE,kBAAG,CAAC,mBAAM,CAAC,kBAAkB,CAAC;oBAC5C,oBAAC,0BAAc,OAAG,CACd,CACC,CACL,CACF,CACP,CAAA;CAAA,CAAC;AA3BW,QAAA,cAAc,kBA2BzB;AACF,sBAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC"}

package/dist/styles/assets/pficon/pficon.scss

@@ -206,6 +206,9 @@
 	@if $filename == on {
 		$char: '\E92C';
 	}
+	@if $filename == open-drawer-right {
+		$char: '\E977';
+	}
 	@if $filename == openshift {
 		$char: '\E95E';
 	}
@@ -593,6 +596,9 @@
 .pf-icon-on {
 	@include pf-icon(on);
 }
+.pf-icon-open-drawer-right {
+	@include pf-icon(open-drawer-right);
+}
 .pf-icon-openshift {
 	@include pf-icon(openshift);
 }

package/dist/styles/base-no-reset.css

@@ -808,6 +808,7 @@ html {
 .pf-icon-optimize:before,
 .pf-icon-openstack:before,
 .pf-icon-openshift:before,
+.pf-icon-open-drawer-right:before,
 .pf-icon-on:before,
 .pf-icon-on-running:before,
 .pf-icon-ok:before,
@@ -1123,6 +1124,10 @@ html {
   content: "\e92c";
 }
 
+.pf-icon-open-drawer-right:before {
+  content: "\e977";
+}
+
 .pf-icon-openshift:before {
   content: "\e95e";
 }

package/dist/styles/base.css

@@ -936,6 +936,7 @@ a {
 .pf-icon-optimize:before,
 .pf-icon-openstack:before,
 .pf-icon-openshift:before,
+.pf-icon-open-drawer-right:before,
 .pf-icon-on:before,
 .pf-icon-on-running:before,
 .pf-icon-ok:before,
@@ -1251,6 +1252,10 @@ a {
   content: "\e92c";
 }
 
+.pf-icon-open-drawer-right:before {
+  content: "\e977";
+}
+
 .pf-icon-openshift:before {
   content: "\e95e";
 }

package/dist/umd/react-core.min.css

@@ -1634,45 +1634,6 @@ textarea.pf-c-form-control {
   display: block;
 }
 
-.pf-c-badge {
-  --pf-c-badge--BorderRadius: var(--pf-global--BorderRadius--lg);
-  --pf-c-badge--FontSize: var(--pf-global--FontSize--xs);
-  --pf-c-badge--FontWeight: var(--pf-global--FontWeight--bold);
-  --pf-c-badge--PaddingRight: var(--pf-global--spacer--sm);
-  --pf-c-badge--PaddingLeft: var(--pf-global--spacer--sm);
-  --pf-c-badge--Color: var(--pf-global--Color--dark-100);
-  --pf-c-badge--MinWidth: var(--pf-global--spacer--xl);
-  --pf-c-badge--m-read--BackgroundColor: var(--pf-global--BackgroundColor--200);
-  --pf-c-badge--m-read--Color: var(--pf-global--Color--dark-100);
-  --pf-c-badge--m-unread--BackgroundColor: var(--pf-global--primary-color--100);
-  --pf-c-badge--m-unread--Color: var(--pf-global--Color--light-100);
-  display: inline-block;
-  min-width: var(--pf-c-badge--MinWidth);
-  padding-right: var(--pf-c-badge--PaddingRight);
-  padding-left: var(--pf-c-badge--PaddingLeft);
-  font-size: var(--pf-c-badge--FontSize);
-  font-weight: var(--pf-c-badge--FontWeight);
-  color: var(--pf-c-badge--Color);
-  text-align: center;
-  background-color: var(--pf-c-badge--BackgroundColor);
-  border-radius: var(--pf-c-badge--BorderRadius);
-}
-
-.pf-c-badge.pf-m-read {
-  --pf-c-badge--Color: var(--pf-c-badge--m-read--Color);
-  --pf-c-badge--BackgroundColor: var(--pf-c-badge--m-read--BackgroundColor);
-}
-
-.pf-c-badge.pf-m-unread {
-  --pf-c-badge--Color: var(--pf-c-badge--m-unread--Color);
-  --pf-c-badge--BackgroundColor: var(--pf-c-badge--m-unread--BackgroundColor);
-}
-
-:where(.pf-theme-dark) .pf-c-badge {
-  --pf-c-badge--m-read--BackgroundColor: var(--pf-global--palette--black-500);
-  --pf-c-badge--m-unread--BackgroundColor: var(--pf-global--primary-color--300);
-}
-
 .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-gold, .pf-c-banner.pf-m-info, .pf-c-banner.pf-m-blue {
   --pf-global--Color--100: var(--pf-global--Color--dark-100);
   --pf-global--Color--200: var(--pf-global--Color--dark-200);
@@ -1851,6 +1812,45 @@ textarea.pf-c-form-control {
   color: var(--pf-global--palette--black-900);
 }
 
+.pf-c-badge {
+  --pf-c-badge--BorderRadius: var(--pf-global--BorderRadius--lg);
+  --pf-c-badge--FontSize: var(--pf-global--FontSize--xs);
+  --pf-c-badge--FontWeight: var(--pf-global--FontWeight--bold);
+  --pf-c-badge--PaddingRight: var(--pf-global--spacer--sm);
+  --pf-c-badge--PaddingLeft: var(--pf-global--spacer--sm);
+  --pf-c-badge--Color: var(--pf-global--Color--dark-100);
+  --pf-c-badge--MinWidth: var(--pf-global--spacer--xl);
+  --pf-c-badge--m-read--BackgroundColor: var(--pf-global--BackgroundColor--200);
+  --pf-c-badge--m-read--Color: var(--pf-global--Color--dark-100);
+  --pf-c-badge--m-unread--BackgroundColor: var(--pf-global--primary-color--100);
+  --pf-c-badge--m-unread--Color: var(--pf-global--Color--light-100);
+  display: inline-block;
+  min-width: var(--pf-c-badge--MinWidth);
+  padding-right: var(--pf-c-badge--PaddingRight);
+  padding-left: var(--pf-c-badge--PaddingLeft);
+  font-size: var(--pf-c-badge--FontSize);
+  font-weight: var(--pf-c-badge--FontWeight);
+  color: var(--pf-c-badge--Color);
+  text-align: center;
+  background-color: var(--pf-c-badge--BackgroundColor);
+  border-radius: var(--pf-c-badge--BorderRadius);
+}
+
+.pf-c-badge.pf-m-read {
+  --pf-c-badge--Color: var(--pf-c-badge--m-read--Color);
+  --pf-c-badge--BackgroundColor: var(--pf-c-badge--m-read--BackgroundColor);
+}
+
+.pf-c-badge.pf-m-unread {
+  --pf-c-badge--Color: var(--pf-c-badge--m-unread--Color);
+  --pf-c-badge--BackgroundColor: var(--pf-c-badge--m-unread--BackgroundColor);
+}
+
+:where(.pf-theme-dark) .pf-c-badge {
+  --pf-c-badge--m-read--BackgroundColor: var(--pf-global--palette--black-500);
+  --pf-c-badge--m-unread--BackgroundColor: var(--pf-global--primary-color--300);
+}
+
 .pf-c-brand {
   --pf-c-brand--Width: auto;
   --pf-c-brand--Height: auto;
@@ -5474,6 +5474,67 @@ label.pf-c-check, .pf-c-check__label,
     overflow-y: visible;
   }
 }
+.pf-c-date-picker {
+  --pf-c-date-picker--m-top__calendar--Top: 0;
+  --pf-c-date-picker--m-top__calendar--TranslateY: calc(-100% - var(--pf-global--spacer--xs));
+  --pf-c-date-picker__helper-text--MarginTop: var(--pf-global--spacer--xs);
+  --pf-c-date-picker__helper-text--FontSize: var(--pf-global--FontSize--sm);
+  --pf-c-date-picker__helper-text--Color: var(--pf-global--Color--100);
+  --pf-c-date-picker__helper-text--m-error--Color: var(--pf-global--danger-color--100);
+  --pf-c-date-picker__input--c-form-control--Width: calc(var(--pf-c-date-picker__input--c-form-control--width-chars) * 1ch + var(--pf-c-date-picker__input--c-form-control--width-base));
+  --pf-c-date-picker__input--c-form-control--width-base: calc(var(--pf-global--spacer--xl) + var(--pf-global--spacer--sm));
+  --pf-c-date-picker__input--c-form-control--width-chars: 10;
+  --pf-c-date-picker__calendar--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
+  --pf-c-date-picker__calendar--BoxShadow: var(--pf-global--BoxShadow--md);
+  --pf-c-date-picker__calendar--ZIndex: var(--pf-global--ZIndex--sm);
+  --pf-c-date-picker__calendar--Top: calc(100% + var(--pf-global--spacer--xs));
+  --pf-c-date-picker__calendar--Right: auto;
+  --pf-c-date-picker__calendar--Left: 0;
+  --pf-c-date-picker__calendar--m-align-right--Right: 0;
+  --pf-c-date-picker__calendar--m-align-right--Left: auto;
+  position: relative;
+  display: inline-block;
+}
+
+.pf-c-date-picker__helper-text {
+  margin-top: var(--pf-c-date-picker__helper-text--MarginTop);
+  font-size: var(--pf-c-date-picker__helper-text--FontSize);
+  color: var(--pf-c-date-picker__helper-text--Color);
+}
+
+.pf-c-date-picker__helper-text.pf-m-error {
+  --pf-c-date-picker__helper-text--Color: var(--pf-c-date-picker__helper-text--m-error--Color);
+}
+
+.pf-c-date-picker__input .pf-c-form-control {
+  width: var(--pf-c-date-picker__input--c-form-control--Width);
+}
+
+.pf-c-date-picker__calendar {
+  position: absolute;
+  top: var(--pf-c-date-picker__calendar--Top);
+  right: var(--pf-c-date-picker__calendar--Right);
+  left: var(--pf-c-date-picker__calendar--Left);
+  z-index: var(--pf-c-date-picker__calendar--ZIndex);
+  background-color: var(--pf-c-date-picker__calendar--BackgroundColor);
+  box-shadow: var(--pf-c-date-picker__calendar--BoxShadow);
+}
+
+.pf-c-date-picker__calendar.pf-m-align-right {
+  --pf-c-date-picker__calendar--Right: var(--pf-c-date-picker__calendar--m-align-right--Right);
+  --pf-c-date-picker__calendar--Left: var(--pf-c-date-picker__calendar--m-align-right--Left);
+}
+
+.pf-c-date-picker.pf-m-top .pf-c-date-picker__calendar {
+  --pf-c-date-picker__calendar--Top: var(--pf-c-date-picker--m-top__calendar--Top);
+  transform: translateY(var(--pf-c-date-picker--m-top__calendar--TranslateY));
+}
+
+:where(.pf-theme-dark) .pf-c-date-picker {
+  --pf-c-date-picker__calendar--BackgroundColor: var(--pf-global--BackgroundColor--300);
+  --pf-c-date-picker__calendar--Top: 100%;
+}
+
 .pf-c-description-list {
   --pf-c-description-list--RowGap: var(--pf-global--gutter--md);
   --pf-c-description-list--ColumnGap: var(--pf-global--spacer--lg);
@@ -7224,67 +7285,6 @@ label.pf-c-check, .pf-c-check__label,
   --pf-c-drawer__panel--BackgroundColor: var(--pf-global--BackgroundColor--100);
 }
 
-.pf-c-date-picker {
-  --pf-c-date-picker--m-top__calendar--Top: 0;
-  --pf-c-date-picker--m-top__calendar--TranslateY: calc(-100% - var(--pf-global--spacer--xs));
-  --pf-c-date-picker__helper-text--MarginTop: var(--pf-global--spacer--xs);
-  --pf-c-date-picker__helper-text--FontSize: var(--pf-global--FontSize--sm);
-  --pf-c-date-picker__helper-text--Color: var(--pf-global--Color--100);
-  --pf-c-date-picker__helper-text--m-error--Color: var(--pf-global--danger-color--100);
-  --pf-c-date-picker__input--c-form-control--Width: calc(var(--pf-c-date-picker__input--c-form-control--width-chars) * 1ch + var(--pf-c-date-picker__input--c-form-control--width-base));
-  --pf-c-date-picker__input--c-form-control--width-base: calc(var(--pf-global--spacer--xl) + var(--pf-global--spacer--sm));
-  --pf-c-date-picker__input--c-form-control--width-chars: 10;
-  --pf-c-date-picker__calendar--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
-  --pf-c-date-picker__calendar--BoxShadow: var(--pf-global--BoxShadow--md);
-  --pf-c-date-picker__calendar--ZIndex: var(--pf-global--ZIndex--sm);
-  --pf-c-date-picker__calendar--Top: calc(100% + var(--pf-global--spacer--xs));
-  --pf-c-date-picker__calendar--Right: auto;
-  --pf-c-date-picker__calendar--Left: 0;
-  --pf-c-date-picker__calendar--m-align-right--Right: 0;
-  --pf-c-date-picker__calendar--m-align-right--Left: auto;
-  position: relative;
-  display: inline-block;
-}
-
-.pf-c-date-picker__helper-text {
-  margin-top: var(--pf-c-date-picker__helper-text--MarginTop);
-  font-size: var(--pf-c-date-picker__helper-text--FontSize);
-  color: var(--pf-c-date-picker__helper-text--Color);
-}
-
-.pf-c-date-picker__helper-text.pf-m-error {
-  --pf-c-date-picker__helper-text--Color: var(--pf-c-date-picker__helper-text--m-error--Color);
-}
-
-.pf-c-date-picker__input .pf-c-form-control {
-  width: var(--pf-c-date-picker__input--c-form-control--Width);
-}
-
-.pf-c-date-picker__calendar {
-  position: absolute;
-  top: var(--pf-c-date-picker__calendar--Top);
-  right: var(--pf-c-date-picker__calendar--Right);
-  left: var(--pf-c-date-picker__calendar--Left);
-  z-index: var(--pf-c-date-picker__calendar--ZIndex);
-  background-color: var(--pf-c-date-picker__calendar--BackgroundColor);
-  box-shadow: var(--pf-c-date-picker__calendar--BoxShadow);
-}
-
-.pf-c-date-picker__calendar.pf-m-align-right {
-  --pf-c-date-picker__calendar--Right: var(--pf-c-date-picker__calendar--m-align-right--Right);
-  --pf-c-date-picker__calendar--Left: var(--pf-c-date-picker__calendar--m-align-right--Left);
-}
-
-.pf-c-date-picker.pf-m-top .pf-c-date-picker__calendar {
-  --pf-c-date-picker__calendar--Top: var(--pf-c-date-picker--m-top__calendar--Top);
-  transform: translateY(var(--pf-c-date-picker--m-top__calendar--TranslateY));
-}
-
-:where(.pf-theme-dark) .pf-c-date-picker {
-  --pf-c-date-picker__calendar--BackgroundColor: var(--pf-global--BackgroundColor--300);
-  --pf-c-date-picker__calendar--Top: 100%;
-}
-
 .pf-c-dropdown {
   --pf-c-dropdown__toggle--PaddingTop: var(--pf-global--spacer--form-element);
   --pf-c-dropdown__toggle--PaddingRight: var(--pf-global--spacer--sm);
@@ -17198,6 +17198,7 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
   --pf-c-progress__bar--before--Opacity: .2;
   --pf-c-progress__indicator--Height: var(--pf-c-progress__bar--Height);
   --pf-c-progress__indicator--BackgroundColor: var(--pf-c-progress__bar--before--BackgroundColor);
+  --pf-c-progress__helper-text--MarginTop: calc(var(--pf-global--spacer--xs) - var(--pf-c-progress--GridGap));
   --pf-c-progress--m-success__bar--BackgroundColor: var(--pf-global--success-color--100);
   --pf-c-progress--m-warning__bar--BackgroundColor: var(--pf-global--warning-color--100);
   --pf-c-progress--m-danger__bar--BackgroundColor: var(--pf-global--danger-color--100);
@@ -17366,6 +17367,12 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
   background-color: var(--pf-c-progress__indicator--BackgroundColor);
 }
 
+.pf-c-progress__helper-text {
+  grid-column: 1/3;
+  grid-row: 3/4;
+  margin-top: var(--pf-c-progress__helper-text--MarginTop);
+}
+
 :where(.pf-theme-dark) .pf-c-progress {
   --pf-c-progress--m-inside__measure--Color: var(--pf-global--palette--black-900);
   --pf-c-progress--m-success--m-inside__measure--Color: var(--pf-global--palette--black-900);
@@ -26353,6 +26360,75 @@ label.pf-c-tree-view__node-text {
     --pf-l-flex--spacer: var(--pf-l-flex--spacer--4xl);
   }
 }
+.pf-l-gallery {
+  --pf-l-gallery--m-gutter--GridGap: var(--pf-global--gutter);
+  --pf-l-gallery--GridTemplateColumns--min: 250px;
+  --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
+  --pf-l-gallery--GridTemplateColumns--max: 1fr;
+  --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
+  --pf-l-gallery--GridTemplateColumns: repeat(auto-fill, minmax(var(--pf-l-gallery--GridTemplateColumns--minmax--min), var(--pf-l-gallery--GridTemplateColumns--minmax--max)));
+  --pf-l-gallery--GridTemplateRows: auto;
+  display: grid;
+  grid-template-columns: var(--pf-l-gallery--GridTemplateColumns);
+  grid-template-rows: var(--pf-l-gallery--GridTemplateRows);
+  --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
+  --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
+}
+
+.pf-l-gallery.pf-m-gutter {
+  grid-gap: var(--pf-l-gallery--m-gutter--GridGap);
+}
+
+@media (min-width: 576px) {
+  .pf-l-gallery {
+    --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min));
+  }
+}
+@media (min-width: 768px) {
+  .pf-l-gallery {
+    --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min)));
+  }
+}
+@media (min-width: 992px) {
+  .pf-l-gallery {
+    --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min))));
+  }
+}
+@media (min-width: 1200px) {
+  .pf-l-gallery {
+    --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min)))));
+  }
+}
+@media (min-width: 1450px) {
+  .pf-l-gallery {
+    --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-2xl, var(--pf-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min))))));
+  }
+}
+@media (min-width: 576px) {
+  .pf-l-gallery {
+    --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max));
+  }
+}
+@media (min-width: 768px) {
+  .pf-l-gallery {
+    --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max)));
+  }
+}
+@media (min-width: 992px) {
+  .pf-l-gallery {
+    --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max))));
+  }
+}
+@media (min-width: 1200px) {
+  .pf-l-gallery {
+    --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max)))));
+  }
+}
+@media (min-width: 1450px) {
+  .pf-l-gallery {
+    --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-2xl, var(--pf-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max))))));
+  }
+}
 .pf-l-grid {
   --pf-l-grid--m-gutter--GridGap: var(--pf-global--gutter);
   --pf-l-grid__item--GridColumnStart: auto;
@@ -27567,75 +27643,6 @@ label.pf-c-tree-view__node-text {
   grid-gap: var(--pf-l-grid--m-gutter--GridGap);
 }
 
-.pf-l-gallery {
-  --pf-l-gallery--m-gutter--GridGap: var(--pf-global--gutter);
-  --pf-l-gallery--GridTemplateColumns--min: 250px;
-  --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
-  --pf-l-gallery--GridTemplateColumns--max: 1fr;
-  --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
-  --pf-l-gallery--GridTemplateColumns: repeat(auto-fill, minmax(var(--pf-l-gallery--GridTemplateColumns--minmax--min), var(--pf-l-gallery--GridTemplateColumns--minmax--max)));
-  --pf-l-gallery--GridTemplateRows: auto;
-  display: grid;
-  grid-template-columns: var(--pf-l-gallery--GridTemplateColumns);
-  grid-template-rows: var(--pf-l-gallery--GridTemplateRows);
-  --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min);
-  --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max);
-}
-
-.pf-l-gallery.pf-m-gutter {
-  grid-gap: var(--pf-l-gallery--m-gutter--GridGap);
-}
-
-@media (min-width: 576px) {
-  .pf-l-gallery {
-    --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min));
-  }
-}
-@media (min-width: 768px) {
-  .pf-l-gallery {
-    --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min)));
-  }
-}
-@media (min-width: 992px) {
-  .pf-l-gallery {
-    --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min))));
-  }
-}
-@media (min-width: 1200px) {
-  .pf-l-gallery {
-    --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min)))));
-  }
-}
-@media (min-width: 1450px) {
-  .pf-l-gallery {
-    --pf-l-gallery--GridTemplateColumns--minmax--min: var(--pf-l-gallery--GridTemplateColumns--min-on-2xl, var(--pf-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-l-gallery--GridTemplateColumns--min-on-md, var(--pf-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-l-gallery--GridTemplateColumns--min))))));
-  }
-}
-@media (min-width: 576px) {
-  .pf-l-gallery {
-    --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max));
-  }
-}
-@media (min-width: 768px) {
-  .pf-l-gallery {
-    --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max)));
-  }
-}
-@media (min-width: 992px) {
-  .pf-l-gallery {
-    --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max))));
-  }
-}
-@media (min-width: 1200px) {
-  .pf-l-gallery {
-    --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max)))));
-  }
-}
-@media (min-width: 1450px) {
-  .pf-l-gallery {
-    --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-2xl, var(--pf-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max))))));
-  }
-}
 .pf-l-level {
   --pf-l-level--m-gutter--MarginRight: var(--pf-global--gutter);
   display: flex;