@patternfly/patternfly 6.0.0-alpha.161 → 6.0.0-alpha.162

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (22) hide show
  1. package/components/Page/page.css +38 -54
  2. package/components/Page/page.scss +19 -32
  3. package/components/Toolbar/toolbar.css +1 -0
  4. package/components/Toolbar/toolbar.scss +1 -0
  5. package/components/_index.css +39 -54
  6. package/docs/components/Page/examples/Page.css +5 -9
  7. package/docs/components/Page/examples/Page.md +71 -32
  8. package/docs/demos/Alert/examples/Alert.md +393 -374
  9. package/docs/demos/CardView/examples/CardView.md +717 -708
  10. package/docs/demos/DataList/examples/DataList.md +2574 -2500
  11. package/docs/demos/Drawer/examples/Drawer.md +190 -182
  12. package/docs/demos/JumpLinks/examples/JumpLinks.md +642 -612
  13. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +3608 -3490
  14. package/docs/demos/Skeleton/examples/Skeleton.md +128 -126
  15. package/docs/demos/Table/examples/Table.md +9458 -9105
  16. package/docs/demos/Tabs/examples/Tabs.md +889 -885
  17. package/docs/demos/Toolbar/examples/Toolbar.md +1254 -1147
  18. package/package.json +1 -1
  19. package/patternfly-no-globals.css +39 -54
  20. package/patternfly.css +39 -54
  21. package/patternfly.min.css +1 -1
  22. package/patternfly.min.css.map +1 -1
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@patternfly/patternfly",
3
3
  "description": "Assets, source, tooling, and content for PatternFly 4",
4
- "version": "6.0.0-alpha.161",
4
+ "version": "6.0.0-alpha.162",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
package/patternfly-no-globals.css CHANGED
@@ -17564,11 +17564,11 @@ ul.pf-v6-c-list {
17564
17564
  --pf-v6-c-page__main-container--BorderRadius: var(--pf-t--global--border--radius--large);
17565
17565
  --pf-v6-c-page__main-container--BorderWidth: var(--pf-t--global--spacer--sm);
17566
17566
  --pf-v6-c-page__main-container--BorderColor: var(--pf-v6-c-page__main-container--BackgroundColor);
17567
- --pf-v6-c-page__main-section--MarginBlockStart: var(--pf-t--global--spacer--md);
17568
- --pf-v6-c-page__main-section--PaddingBlockStart: var(--pf-t--global--spacer--lg);
17569
- --pf-v6-c-page__main-section--PaddingInlineEnd: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
17570
- --pf-v6-c-page__main-section--PaddingBlockEnd: 0;
17571
- --pf-v6-c-page__main-section--PaddingInlineStart: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
17567
+ --pf-v6-c-page__main-section--PaddingBlockStart: var(--pf-t--global--spacer--md);
17568
+ --pf-v6-c-page__main-section--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
17569
+ --pf-v6-c-page__main-section--PaddingBlockEnd: var(--pf-t--global--spacer--md);
17570
+ --pf-v6-c-page__main-section--PaddingInlineStart: var(--pf-t--global--spacer--lg);
17571
+ --pf-v6-c-page__main-section--RowGap: var(--pf-t--global--spacer--lg);
17572
17572
  --pf-v6-c-page__main-breadcrumb--main-section--PaddingBlockStart: var(--pf-t--global--spacer--md);
17573
17573
  --pf-v6-c-page__main-section--BackgroundColor: var(--pf-t--global--background--color--primary--default);
17574
17574
  --pf-v6-c-page__main-section--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
@@ -17603,6 +17603,7 @@ ul.pf-v6-c-list {
17603
17603
  --pf-v6-c-page__main-tabs--PaddingBlockStart: 0;
17604
17604
  --pf-v6-c-page__main-tabs--PaddingInlineEnd: 0;
17605
17605
  --pf-v6-c-page__main-tabs--PaddingBlockEnd: 0;
17606
+ --pf-v6-c-page__main-tabs--PaddingInlineStart: 0;
17606
17607
  --pf-v6-c-page__main-tabs--BackgroundColor: var(--pf-t--global--background--color--primary--default);
17607
17608
  --pf-v6-c-page__main-wizard--BackgroundColor: var(--pf-t--global--background--color--primary--default);
17608
17609
  --pf-v6-c-page__main-wizard--BorderBlockStartColor: var(--pf-t--global--border--color--default);
@@ -17714,21 +17715,11 @@ ul.pf-v6-c-list {
17714
17715
  flex-grow: 0;
17715
17716
  }
17716
17717
 
17717
- .pf-v6-c-page__main-nav.pf-m-limit-width,
17718
- .pf-v6-c-page__main-breadcrumb.pf-m-limit-width,
17719
- .pf-v6-c-page__main-tabs.pf-m-limit-width,
17720
- .pf-v6-c-page__main-section.pf-m-limit-width,
17721
- .pf-v6-c-page__main-wizard.pf-m-limit-width {
17722
- display: flex;
17723
- flex-direction: column;
17724
- padding: 0;
17725
- }
17726
17718
  .pf-v6-c-page__main-nav.pf-m-limit-width > .pf-v6-c-page__main-body,
17727
17719
  .pf-v6-c-page__main-breadcrumb.pf-m-limit-width > .pf-v6-c-page__main-body,
17728
17720
  .pf-v6-c-page__main-tabs.pf-m-limit-width > .pf-v6-c-page__main-body,
17729
17721
  .pf-v6-c-page__main-section.pf-m-limit-width > .pf-v6-c-page__main-body,
17730
17722
  .pf-v6-c-page__main-wizard.pf-m-limit-width > .pf-v6-c-page__main-body {
17731
- flex: 1;
17732
17723
  max-width: var(--pf-v6-c-page--section--m-limit-width--MaxWidth);
17733
17724
  }
17734
17725
  .pf-v6-c-page__main-nav.pf-m-limit-width.pf-m-align-center,
@@ -17753,6 +17744,8 @@ ul.pf-v6-c-list {
17753
17744
  .pf-v6-c-page__main-wizard,
17754
17745
  .pf-v6-c-page__main-group,
17755
17746
  .pf-v6-c-page__main-subnav {
17747
+ display: flex;
17748
+ flex-direction: column;
17756
17749
  flex-shrink: 0;
17757
17750
  }
17758
17751
  .pf-v6-c-page__main-nav.pf-m-overflow-scroll,
@@ -17973,6 +17966,7 @@ ul.pf-v6-c-list {
17973
17966
  .pf-v6-c-page__main-list {
17974
17967
  display: flex;
17975
17968
  flex-direction: column;
17969
+ flex-grow: 1;
17976
17970
  }
17977
17971
 
17978
17972
  .pf-v6-c-page__main-nav {
@@ -18087,10 +18081,11 @@ ul.pf-v6-c-list {
18087
18081
  }
18088
18082
 
18089
18083
  .pf-v6-c-page__main-section {
18084
+ gap: var(--pf-v6-c-page__main-section--RowGap);
18090
18085
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18091
18086
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18092
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18093
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18087
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18088
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18094
18089
  background-color: var(--pf-v6-c-page__main-section--BackgroundColor);
18095
18090
  }
18096
18091
  .pf-v6-c-page__main-section.pf-m-secondary {
@@ -18099,8 +18094,8 @@ ul.pf-v6-c-list {
18099
18094
  .pf-v6-c-page__main-section.pf-m-padding {
18100
18095
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18101
18096
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18102
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18103
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18097
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18098
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18104
18099
  }
18105
18100
  .pf-v6-c-page__main-section.pf-m-padding.pf-m-limit-width {
18106
18101
  padding: 0;
@@ -18108,8 +18103,8 @@ ul.pf-v6-c-list {
18108
18103
  .pf-v6-c-page__main-section.pf-m-padding.pf-m-limit-width .pf-v6-c-page__main-body {
18109
18104
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18110
18105
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18111
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18112
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18106
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18107
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18113
18108
  }
18114
18109
  .pf-v6-c-page__main-section.pf-m-no-padding, .pf-v6-c-page__main-section.pf-m-no-padding.pf-m-limit-width .pf-v6-c-page__main-body {
18115
18110
  padding: 0;
@@ -18118,8 +18113,8 @@ ul.pf-v6-c-list {
18118
18113
  .pf-v6-c-page__main-section.pf-m-padding-on-sm {
18119
18114
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18120
18115
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18121
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18122
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18116
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18117
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18123
18118
  }
18124
18119
  .pf-v6-c-page__main-section.pf-m-padding-on-sm.pf-m-limit-width {
18125
18120
  padding: 0;
@@ -18127,8 +18122,8 @@ ul.pf-v6-c-list {
18127
18122
  .pf-v6-c-page__main-section.pf-m-padding-on-sm.pf-m-limit-width .pf-v6-c-page__main-body {
18128
18123
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18129
18124
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18130
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18131
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18125
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18126
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18132
18127
  }
18133
18128
  .pf-v6-c-page__main-section.pf-m-no-padding-on-sm, .pf-v6-c-page__main-section.pf-m-no-padding-on-sm.pf-m-limit-width .pf-v6-c-page__main-body {
18134
18129
  padding: 0;
@@ -18138,8 +18133,8 @@ ul.pf-v6-c-list {
18138
18133
  .pf-v6-c-page__main-section.pf-m-padding-on-md {
18139
18134
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18140
18135
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18141
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18142
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18136
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18137
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18143
18138
  }
18144
18139
  .pf-v6-c-page__main-section.pf-m-padding-on-md.pf-m-limit-width {
18145
18140
  padding: 0;
@@ -18147,8 +18142,8 @@ ul.pf-v6-c-list {
18147
18142
  .pf-v6-c-page__main-section.pf-m-padding-on-md.pf-m-limit-width .pf-v6-c-page__main-body {
18148
18143
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18149
18144
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18150
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18151
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18145
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18146
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18152
18147
  }
18153
18148
  .pf-v6-c-page__main-section.pf-m-no-padding-on-md, .pf-v6-c-page__main-section.pf-m-no-padding-on-md.pf-m-limit-width .pf-v6-c-page__main-body {
18154
18149
  padding: 0;
@@ -18158,8 +18153,8 @@ ul.pf-v6-c-list {
18158
18153
  .pf-v6-c-page__main-section.pf-m-padding-on-lg {
18159
18154
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18160
18155
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18161
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18162
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18156
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18157
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18163
18158
  }
18164
18159
  .pf-v6-c-page__main-section.pf-m-padding-on-lg.pf-m-limit-width {
18165
18160
  padding: 0;
@@ -18167,8 +18162,8 @@ ul.pf-v6-c-list {
18167
18162
  .pf-v6-c-page__main-section.pf-m-padding-on-lg.pf-m-limit-width .pf-v6-c-page__main-body {
18168
18163
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18169
18164
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18170
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18171
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18165
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18166
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18172
18167
  }
18173
18168
  .pf-v6-c-page__main-section.pf-m-no-padding-on-lg, .pf-v6-c-page__main-section.pf-m-no-padding-on-lg.pf-m-limit-width .pf-v6-c-page__main-body {
18174
18169
  padding: 0;
@@ -18178,8 +18173,8 @@ ul.pf-v6-c-list {
18178
18173
  .pf-v6-c-page__main-section.pf-m-padding-on-xl {
18179
18174
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18180
18175
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18181
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18182
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18176
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18177
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18183
18178
  }
18184
18179
  .pf-v6-c-page__main-section.pf-m-padding-on-xl.pf-m-limit-width {
18185
18180
  padding: 0;
@@ -18187,8 +18182,8 @@ ul.pf-v6-c-list {
18187
18182
  .pf-v6-c-page__main-section.pf-m-padding-on-xl.pf-m-limit-width .pf-v6-c-page__main-body {
18188
18183
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18189
18184
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18190
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18191
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18185
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18186
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18192
18187
  }
18193
18188
  .pf-v6-c-page__main-section.pf-m-no-padding-on-xl, .pf-v6-c-page__main-section.pf-m-no-padding-on-xl.pf-m-limit-width .pf-v6-c-page__main-body {
18194
18189
  padding: 0;
@@ -18198,8 +18193,8 @@ ul.pf-v6-c-list {
18198
18193
  .pf-v6-c-page__main-section.pf-m-padding-on-2xl {
18199
18194
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18200
18195
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18201
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18202
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18196
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18197
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18203
18198
  }
18204
18199
  .pf-v6-c-page__main-section.pf-m-padding-on-2xl.pf-m-limit-width {
18205
18200
  padding: 0;
@@ -18207,8 +18202,8 @@ ul.pf-v6-c-list {
18207
18202
  .pf-v6-c-page__main-section.pf-m-padding-on-2xl.pf-m-limit-width .pf-v6-c-page__main-body {
18208
18203
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18209
18204
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18210
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18211
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18205
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18206
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18212
18207
  }
18213
18208
  .pf-v6-c-page__main-section.pf-m-no-padding-on-2xl, .pf-v6-c-page__main-section.pf-m-no-padding-on-2xl.pf-m-limit-width .pf-v6-c-page__main-body {
18214
18209
  padding: 0;
@@ -18234,25 +18229,14 @@ ul.pf-v6-c-list {
18234
18229
  }
18235
18230
 
18236
18231
  .pf-v6-c-page__main-nav .pf-v6-c-page__main-body {
18237
- padding-block-start: var(--pf-v6-c-page__main-nav--PaddingBlockStart);
18238
18232
  padding-inline-start: var(--pf-v6-c-page__main-nav--PaddingInlineStart);
18239
18233
  padding-inline-end: var(--pf-v6-c-page__main-nav--PaddingInlineEnd);
18240
18234
  }
18241
18235
  .pf-v6-c-page__main-breadcrumb .pf-v6-c-page__main-body {
18242
- padding-block-start: var(--pf-v6-c-page__main-breadcrumb--PaddingBlockStart);
18243
- padding-block-end: var(--pf-v6-c-page__main-breadcrumb--PaddingBlockEnd);
18244
- padding-inline-start: var(--pf-v6-c-page__main-breadcrumb--PaddingInlineStart);
18245
- padding-inline-end: var(--pf-v6-c-page__main-breadcrumb--PaddingInlineEnd);
18246
- }
18247
- .pf-v6-c-page__main-section .pf-v6-c-page__main-body {
18248
- padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18249
- padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18250
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18251
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18236
+ padding-inline-start: 0;
18237
+ padding-inline-end: 0;
18252
18238
  }
18253
18239
  .pf-v6-c-page__main-tabs .pf-v6-c-page__main-body {
18254
- padding-block-start: var(--pf-v6-c-page__main-tabs--PaddingBlockStart);
18255
- padding-block-end: var(--pf-v6-c-page__main-tabs--PaddingBlockEnd);
18256
18240
  padding-inline-start: var(--pf-v6-c-page__main-tabs--PaddingInlineStart);
18257
18241
  padding-inline-end: var(--pf-v6-c-page__main-tabs--PaddingInlineEnd);
18258
18242
  }
@@ -25586,6 +25570,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
25586
25570
  --pf-v6-c-toolbar__content--RowGap: var(--pf-t--global--spacer--sm);
25587
25571
  --pf-v6-c-toolbar__content--PaddingBlock: var(--pf-t--global--spacer--md);
25588
25572
  --pf-v6-c-toolbar__content--PaddingInline: var(--pf-v6-c-toolbar--PaddingInline);
25573
+ --pf-v6-c-toolbar__content--PaddingBlockStart: 0;
25589
25574
  --pf-v6-c-toolbar__expandable-content--ZIndex: var(--pf-t--global--z-index--sm);
25590
25575
  --pf-v6-c-toolbar__expandable-content--BoxShadow: var(--pf-t--global--box-shadow--md--bottom);
25591
25576
  --pf-v6-c-toolbar__expandable-content--BackgroundColor: var(--pf-t--global--background--color--floating--default);
package/patternfly.css CHANGED
@@ -17685,11 +17685,11 @@ ul.pf-v6-c-list {
17685
17685
  --pf-v6-c-page__main-container--BorderRadius: var(--pf-t--global--border--radius--large);
17686
17686
  --pf-v6-c-page__main-container--BorderWidth: var(--pf-t--global--spacer--sm);
17687
17687
  --pf-v6-c-page__main-container--BorderColor: var(--pf-v6-c-page__main-container--BackgroundColor);
17688
- --pf-v6-c-page__main-section--MarginBlockStart: var(--pf-t--global--spacer--md);
17689
- --pf-v6-c-page__main-section--PaddingBlockStart: var(--pf-t--global--spacer--lg);
17690
- --pf-v6-c-page__main-section--PaddingInlineEnd: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
17691
- --pf-v6-c-page__main-section--PaddingBlockEnd: 0;
17692
- --pf-v6-c-page__main-section--PaddingInlineStart: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
17688
+ --pf-v6-c-page__main-section--PaddingBlockStart: var(--pf-t--global--spacer--md);
17689
+ --pf-v6-c-page__main-section--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
17690
+ --pf-v6-c-page__main-section--PaddingBlockEnd: var(--pf-t--global--spacer--md);
17691
+ --pf-v6-c-page__main-section--PaddingInlineStart: var(--pf-t--global--spacer--lg);
17692
+ --pf-v6-c-page__main-section--RowGap: var(--pf-t--global--spacer--lg);
17693
17693
  --pf-v6-c-page__main-breadcrumb--main-section--PaddingBlockStart: var(--pf-t--global--spacer--md);
17694
17694
  --pf-v6-c-page__main-section--BackgroundColor: var(--pf-t--global--background--color--primary--default);
17695
17695
  --pf-v6-c-page__main-section--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
@@ -17724,6 +17724,7 @@ ul.pf-v6-c-list {
17724
17724
  --pf-v6-c-page__main-tabs--PaddingBlockStart: 0;
17725
17725
  --pf-v6-c-page__main-tabs--PaddingInlineEnd: 0;
17726
17726
  --pf-v6-c-page__main-tabs--PaddingBlockEnd: 0;
17727
+ --pf-v6-c-page__main-tabs--PaddingInlineStart: 0;
17727
17728
  --pf-v6-c-page__main-tabs--BackgroundColor: var(--pf-t--global--background--color--primary--default);
17728
17729
  --pf-v6-c-page__main-wizard--BackgroundColor: var(--pf-t--global--background--color--primary--default);
17729
17730
  --pf-v6-c-page__main-wizard--BorderBlockStartColor: var(--pf-t--global--border--color--default);
@@ -17835,21 +17836,11 @@ ul.pf-v6-c-list {
17835
17836
  flex-grow: 0;
17836
17837
  }
17837
17838
 
17838
- .pf-v6-c-page__main-nav.pf-m-limit-width,
17839
- .pf-v6-c-page__main-breadcrumb.pf-m-limit-width,
17840
- .pf-v6-c-page__main-tabs.pf-m-limit-width,
17841
- .pf-v6-c-page__main-section.pf-m-limit-width,
17842
- .pf-v6-c-page__main-wizard.pf-m-limit-width {
17843
- display: flex;
17844
- flex-direction: column;
17845
- padding: 0;
17846
- }
17847
17839
  .pf-v6-c-page__main-nav.pf-m-limit-width > .pf-v6-c-page__main-body,
17848
17840
  .pf-v6-c-page__main-breadcrumb.pf-m-limit-width > .pf-v6-c-page__main-body,
17849
17841
  .pf-v6-c-page__main-tabs.pf-m-limit-width > .pf-v6-c-page__main-body,
17850
17842
  .pf-v6-c-page__main-section.pf-m-limit-width > .pf-v6-c-page__main-body,
17851
17843
  .pf-v6-c-page__main-wizard.pf-m-limit-width > .pf-v6-c-page__main-body {
17852
- flex: 1;
17853
17844
  max-width: var(--pf-v6-c-page--section--m-limit-width--MaxWidth);
17854
17845
  }
17855
17846
  .pf-v6-c-page__main-nav.pf-m-limit-width.pf-m-align-center,
@@ -17874,6 +17865,8 @@ ul.pf-v6-c-list {
17874
17865
  .pf-v6-c-page__main-wizard,
17875
17866
  .pf-v6-c-page__main-group,
17876
17867
  .pf-v6-c-page__main-subnav {
17868
+ display: flex;
17869
+ flex-direction: column;
17877
17870
  flex-shrink: 0;
17878
17871
  }
17879
17872
  .pf-v6-c-page__main-nav.pf-m-overflow-scroll,
@@ -18094,6 +18087,7 @@ ul.pf-v6-c-list {
18094
18087
  .pf-v6-c-page__main-list {
18095
18088
  display: flex;
18096
18089
  flex-direction: column;
18090
+ flex-grow: 1;
18097
18091
  }
18098
18092
 
18099
18093
  .pf-v6-c-page__main-nav {
@@ -18208,10 +18202,11 @@ ul.pf-v6-c-list {
18208
18202
  }
18209
18203
 
18210
18204
  .pf-v6-c-page__main-section {
18205
+ gap: var(--pf-v6-c-page__main-section--RowGap);
18211
18206
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18212
18207
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18213
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18214
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18208
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18209
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18215
18210
  background-color: var(--pf-v6-c-page__main-section--BackgroundColor);
18216
18211
  }
18217
18212
  .pf-v6-c-page__main-section.pf-m-secondary {
@@ -18220,8 +18215,8 @@ ul.pf-v6-c-list {
18220
18215
  .pf-v6-c-page__main-section.pf-m-padding {
18221
18216
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18222
18217
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18223
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18224
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18218
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18219
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18225
18220
  }
18226
18221
  .pf-v6-c-page__main-section.pf-m-padding.pf-m-limit-width {
18227
18222
  padding: 0;
@@ -18229,8 +18224,8 @@ ul.pf-v6-c-list {
18229
18224
  .pf-v6-c-page__main-section.pf-m-padding.pf-m-limit-width .pf-v6-c-page__main-body {
18230
18225
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18231
18226
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18232
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18233
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18227
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18228
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18234
18229
  }
18235
18230
  .pf-v6-c-page__main-section.pf-m-no-padding, .pf-v6-c-page__main-section.pf-m-no-padding.pf-m-limit-width .pf-v6-c-page__main-body {
18236
18231
  padding: 0;
@@ -18239,8 +18234,8 @@ ul.pf-v6-c-list {
18239
18234
  .pf-v6-c-page__main-section.pf-m-padding-on-sm {
18240
18235
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18241
18236
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18242
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18243
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18237
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18238
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18244
18239
  }
18245
18240
  .pf-v6-c-page__main-section.pf-m-padding-on-sm.pf-m-limit-width {
18246
18241
  padding: 0;
@@ -18248,8 +18243,8 @@ ul.pf-v6-c-list {
18248
18243
  .pf-v6-c-page__main-section.pf-m-padding-on-sm.pf-m-limit-width .pf-v6-c-page__main-body {
18249
18244
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18250
18245
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18251
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18252
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18246
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18247
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18253
18248
  }
18254
18249
  .pf-v6-c-page__main-section.pf-m-no-padding-on-sm, .pf-v6-c-page__main-section.pf-m-no-padding-on-sm.pf-m-limit-width .pf-v6-c-page__main-body {
18255
18250
  padding: 0;
@@ -18259,8 +18254,8 @@ ul.pf-v6-c-list {
18259
18254
  .pf-v6-c-page__main-section.pf-m-padding-on-md {
18260
18255
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18261
18256
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18262
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18263
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18257
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18258
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18264
18259
  }
18265
18260
  .pf-v6-c-page__main-section.pf-m-padding-on-md.pf-m-limit-width {
18266
18261
  padding: 0;
@@ -18268,8 +18263,8 @@ ul.pf-v6-c-list {
18268
18263
  .pf-v6-c-page__main-section.pf-m-padding-on-md.pf-m-limit-width .pf-v6-c-page__main-body {
18269
18264
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18270
18265
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18271
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18272
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18266
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18267
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18273
18268
  }
18274
18269
  .pf-v6-c-page__main-section.pf-m-no-padding-on-md, .pf-v6-c-page__main-section.pf-m-no-padding-on-md.pf-m-limit-width .pf-v6-c-page__main-body {
18275
18270
  padding: 0;
@@ -18279,8 +18274,8 @@ ul.pf-v6-c-list {
18279
18274
  .pf-v6-c-page__main-section.pf-m-padding-on-lg {
18280
18275
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18281
18276
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18282
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18283
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18277
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18278
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18284
18279
  }
18285
18280
  .pf-v6-c-page__main-section.pf-m-padding-on-lg.pf-m-limit-width {
18286
18281
  padding: 0;
@@ -18288,8 +18283,8 @@ ul.pf-v6-c-list {
18288
18283
  .pf-v6-c-page__main-section.pf-m-padding-on-lg.pf-m-limit-width .pf-v6-c-page__main-body {
18289
18284
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18290
18285
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18291
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18292
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18286
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18287
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18293
18288
  }
18294
18289
  .pf-v6-c-page__main-section.pf-m-no-padding-on-lg, .pf-v6-c-page__main-section.pf-m-no-padding-on-lg.pf-m-limit-width .pf-v6-c-page__main-body {
18295
18290
  padding: 0;
@@ -18299,8 +18294,8 @@ ul.pf-v6-c-list {
18299
18294
  .pf-v6-c-page__main-section.pf-m-padding-on-xl {
18300
18295
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18301
18296
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18302
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18303
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18297
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18298
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18304
18299
  }
18305
18300
  .pf-v6-c-page__main-section.pf-m-padding-on-xl.pf-m-limit-width {
18306
18301
  padding: 0;
@@ -18308,8 +18303,8 @@ ul.pf-v6-c-list {
18308
18303
  .pf-v6-c-page__main-section.pf-m-padding-on-xl.pf-m-limit-width .pf-v6-c-page__main-body {
18309
18304
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18310
18305
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18311
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18312
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18306
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18307
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18313
18308
  }
18314
18309
  .pf-v6-c-page__main-section.pf-m-no-padding-on-xl, .pf-v6-c-page__main-section.pf-m-no-padding-on-xl.pf-m-limit-width .pf-v6-c-page__main-body {
18315
18310
  padding: 0;
@@ -18319,8 +18314,8 @@ ul.pf-v6-c-list {
18319
18314
  .pf-v6-c-page__main-section.pf-m-padding-on-2xl {
18320
18315
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18321
18316
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18322
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18323
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18317
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18318
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18324
18319
  }
18325
18320
  .pf-v6-c-page__main-section.pf-m-padding-on-2xl.pf-m-limit-width {
18326
18321
  padding: 0;
@@ -18328,8 +18323,8 @@ ul.pf-v6-c-list {
18328
18323
  .pf-v6-c-page__main-section.pf-m-padding-on-2xl.pf-m-limit-width .pf-v6-c-page__main-body {
18329
18324
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18330
18325
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18331
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18332
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18326
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
18327
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
18333
18328
  }
18334
18329
  .pf-v6-c-page__main-section.pf-m-no-padding-on-2xl, .pf-v6-c-page__main-section.pf-m-no-padding-on-2xl.pf-m-limit-width .pf-v6-c-page__main-body {
18335
18330
  padding: 0;
@@ -18355,25 +18350,14 @@ ul.pf-v6-c-list {
18355
18350
  }
18356
18351
 
18357
18352
  .pf-v6-c-page__main-nav .pf-v6-c-page__main-body {
18358
- padding-block-start: var(--pf-v6-c-page__main-nav--PaddingBlockStart);
18359
18353
  padding-inline-start: var(--pf-v6-c-page__main-nav--PaddingInlineStart);
18360
18354
  padding-inline-end: var(--pf-v6-c-page__main-nav--PaddingInlineEnd);
18361
18355
  }
18362
18356
  .pf-v6-c-page__main-breadcrumb .pf-v6-c-page__main-body {
18363
- padding-block-start: var(--pf-v6-c-page__main-breadcrumb--PaddingBlockStart);
18364
- padding-block-end: var(--pf-v6-c-page__main-breadcrumb--PaddingBlockEnd);
18365
- padding-inline-start: var(--pf-v6-c-page__main-breadcrumb--PaddingInlineStart);
18366
- padding-inline-end: var(--pf-v6-c-page__main-breadcrumb--PaddingInlineEnd);
18367
- }
18368
- .pf-v6-c-page__main-section .pf-v6-c-page__main-body {
18369
- padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
18370
- padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
18371
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
18372
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
18357
+ padding-inline-start: 0;
18358
+ padding-inline-end: 0;
18373
18359
  }
18374
18360
  .pf-v6-c-page__main-tabs .pf-v6-c-page__main-body {
18375
- padding-block-start: var(--pf-v6-c-page__main-tabs--PaddingBlockStart);
18376
- padding-block-end: var(--pf-v6-c-page__main-tabs--PaddingBlockEnd);
18377
18361
  padding-inline-start: var(--pf-v6-c-page__main-tabs--PaddingInlineStart);
18378
18362
  padding-inline-end: var(--pf-v6-c-page__main-tabs--PaddingInlineEnd);
18379
18363
  }
@@ -25707,6 +25691,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
25707
25691
  --pf-v6-c-toolbar__content--RowGap: var(--pf-t--global--spacer--sm);
25708
25692
  --pf-v6-c-toolbar__content--PaddingBlock: var(--pf-t--global--spacer--md);
25709
25693
  --pf-v6-c-toolbar__content--PaddingInline: var(--pf-v6-c-toolbar--PaddingInline);
25694
+ --pf-v6-c-toolbar__content--PaddingBlockStart: 0;
25710
25695
  --pf-v6-c-toolbar__expandable-content--ZIndex: var(--pf-t--global--z-index--sm);
25711
25696
  --pf-v6-c-toolbar__expandable-content--BoxShadow: var(--pf-t--global--box-shadow--md--bottom);
25712
25697
  --pf-v6-c-toolbar__expandable-content--BackgroundColor: var(--pf-t--global--background--color--floating--default);