@patternfly/patternfly 6.5.0-prerelease.64 → 6.5.0-prerelease.65

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 (17) hide show
  1. package/base/patternfly-svg-icons.css +6 -0
  2. package/base/patternfly-svg-icons.scss +6 -0
  3. package/components/Page/page.css +83 -34
  4. package/components/Page/page.scss +94 -39
  5. package/components/Table/table.css +2 -2
  6. package/components/Table/table.scss +2 -2
  7. package/components/_index.css +85 -36
  8. package/docs/components/Table/examples/Table.md +1879 -151
  9. package/docs/demos/Table/examples/Table.md +368 -32
  10. package/package.json +21 -1
  11. package/patternfly-base-no-globals.css +6 -0
  12. package/patternfly-base.css +6 -0
  13. package/patternfly-no-globals.css +92 -37
  14. package/patternfly.css +92 -37
  15. package/patternfly.min.css +1 -1
  16. package/patternfly.min.css.map +1 -1
  17. package/patternfly.scss +3 -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.5.0-prerelease.64",
4
+ "version": "6.5.0-prerelease.65",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
@@ -9,8 +9,28 @@
9
9
  "backstop:clean": "rimraf -- backstop_data/bitmaps_test backstop_data/html_report",
10
10
  "backstop:test": "backstop test --config='backstop.js'",
11
11
  "backstop:test:dark": "backstop test --config='backstop.js' --dark",
12
+ "backstop:test:glass": "backstop test --config='backstop.js' --glass",
13
+ "backstop:test:hc": "backstop test --config='backstop.js' --high-contrast",
14
+ "backstop:test:dark-hc": "backstop test --config='backstop.js' --dark --high-contrast",
15
+ "backstop:test:dark-glass": "backstop test --config='backstop.js' --dark --glass",
16
+ "backstop:test:felt": "backstop test --config='backstop.js' --felt",
17
+ "backstop:test:felt-dark": "backstop test --config='backstop.js' --felt --dark",
18
+ "backstop:test:felt-glass": "backstop test --config='backstop.js' --felt --glass",
19
+ "backstop:test:felt-hc": "backstop test --config='backstop.js' --felt --high-contrast",
20
+ "backstop:test:felt-dark-hc": "backstop test --config='backstop.js' --felt --dark --high-contrast",
21
+ "backstop:test:felt-dark-glass": "backstop test --config='backstop.js' --felt --dark --glass",
12
22
  "backstop:approve": "backstop approve --config='backstop.js'",
13
23
  "backstop:approve:dark": "backstop approve --config='backstop.js' --dark",
24
+ "backstop:approve:glass": "backstop approve --config='backstop.js' --glass",
25
+ "backstop:approve:hc": "backstop approve --config='backstop.js' --high-contrast",
26
+ "backstop:approve:dark-hc": "backstop approve --config='backstop.js' --dark --high-contrast",
27
+ "backstop:approve:dark-glass": "backstop approve --config='backstop.js' --dark --glass",
28
+ "backstop:approve:felt": "backstop approve --config='backstop.js' --felt",
29
+ "backstop:approve:felt-dark": "backstop approve --config='backstop.js' --felt --dark",
30
+ "backstop:approve:felt-glass": "backstop approve --config='backstop.js' --felt --glass",
31
+ "backstop:approve:felt-hc": "backstop approve --config='backstop.js' --felt --high-contrast",
32
+ "backstop:approve:felt-dark-hc": "backstop approve --config='backstop.js' --felt --dark --high-contrast",
33
+ "backstop:approve:felt-dark-glass": "backstop approve --config='backstop.js' --felt --dark --glass",
14
34
  "backstop:chrome": "node backstop_data/engine_scripts/puppet/chrome.js",
15
35
  "playwright": "node ./node_modules/playwright/cli.js",
16
36
  "build-patternfly": "gulp buildPatternfly",
package/patternfly-base-no-globals.css CHANGED
@@ -6314,6 +6314,12 @@
6314
6314
  display: revert;
6315
6315
  }
6316
6316
 
6317
+ .pf-v6-icon-rh-standard {
6318
+ width: 3rem;
6319
+ height: 3rem;
6320
+ color: var(--pf-t--global--icon--color--brand--accent--default);
6321
+ }
6322
+
6317
6323
  :root {
6318
6324
  --pf-v6-global--inverse--multiplier: 1;
6319
6325
  --pf-t--color--black: #000000;
package/patternfly-base.css CHANGED
@@ -6461,6 +6461,12 @@ button) {
6461
6461
  display: revert;
6462
6462
  }
6463
6463
 
6464
+ .pf-v6-icon-rh-standard {
6465
+ width: 3rem;
6466
+ height: 3rem;
6467
+ color: var(--pf-t--global--icon--color--brand--accent--default);
6468
+ }
6469
+
6464
6470
  :root {
6465
6471
  --pf-v6-global--inverse--multiplier: 1;
6466
6472
  --pf-t--color--black: #000000;
package/patternfly-no-globals.css CHANGED
@@ -6314,6 +6314,12 @@
6314
6314
  display: revert;
6315
6315
  }
6316
6316
 
6317
+ .pf-v6-icon-rh-standard {
6318
+ width: 3rem;
6319
+ height: 3rem;
6320
+ color: var(--pf-t--global--icon--color--brand--accent--default);
6321
+ }
6322
+
6317
6323
  :root {
6318
6324
  --pf-v6-global--inverse--multiplier: 1;
6319
6325
  --pf-t--color--black: #000000;
@@ -22724,6 +22730,7 @@ ul.pf-v6-c-list {
22724
22730
  --pf-v6-c-page__sidebar--TranslateZ: 0;
22725
22731
  --pf-v6-c-page__sidebar--m-expanded--TranslateX: 0;
22726
22732
  --pf-v6-c-page__sidebar--xl--TranslateX: 0;
22733
+ --pf-v6-c-page__sidebar--MarginBlockStart: 0;
22727
22734
  --pf-v6-c-page__sidebar--MarginInlineEnd: calc(var(--pf-t--global--spacer--inset--page-chrome) / 2);
22728
22735
  --pf-v6-c-page__sidebar--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
22729
22736
  --pf-v6-c-page__sidebar--PaddingInlineStart: 0;
@@ -22741,6 +22748,20 @@ ul.pf-v6-c-list {
22741
22748
  }
22742
22749
  }
22743
22750
  .pf-v6-c-page {
22751
+ --pf-v6-c-page__sidebar-main--PaddingBlockStart: 0;
22752
+ --pf-v6-c-page__sidebar-main--PaddingBlockEnd: 0;
22753
+ --pf-v6-c-page__sidebar-main--PaddingInlineStart: 0;
22754
+ --pf-v6-c-page__sidebar-main--PaddingInlineEnd: 0;
22755
+ --pf-v6-c-page__sidebar-main--MarginBlockStart: 0;
22756
+ --pf-v6-c-page__sidebar-main--MarginBlockEnd: 0;
22757
+ --pf-v6-c-page__sidebar-main--MarginInlineStart: 0;
22758
+ --pf-v6-c-page__sidebar-main--MarginInlineEnd: 0;
22759
+ --pf-v6-c-page__sidebar-main--BackgroundColor: transparent;
22760
+ --pf-v6-c-page__sidebar-main--BackdropFilter: none;
22761
+ --pf-v6-c-page__sidebar-main--BorderWidth: 0;
22762
+ --pf-v6-c-page__sidebar-main--BorderColor: transparent;
22763
+ --pf-v6-c-page__sidebar-main--BorderRadius: 0;
22764
+ --pf-v6-c-page__sidebar-main--BoxShadow: none;
22744
22765
  --pf-v6-c-page__sidebar-header--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
22745
22766
  --pf-v6-c-page__sidebar-header--BorderBlockEndColor: var(--pf-t--global--border--color--default);
22746
22767
  --pf-v6-c-page__sidebar-header--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -22811,6 +22832,10 @@ ul.pf-v6-c-list {
22811
22832
  --pf-v6-c-page__main-section--BackgroundColor: var(--pf-t--global--background--color--primary--default);
22812
22833
  --pf-v6-c-page__main-section--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
22813
22834
  --pf-v6-c-page__main-breadcrumb--page__main-tabs--PaddingBlockStart: var(--pf-t--global--spacer--md);
22835
+ --pf-v6-c-page__main-section--m-secondary--BorderBlockStartWidth: var(--pf-t--global--border--width--glass--default, var(--pf-t--global--border--width--high-contrast--regular));
22836
+ --pf-v6-c-page__main-section--m-secondary--BorderBlockStartColor: var(--pf-t--global--border--color--subtle);
22837
+ --pf-v6-c-page__main-section--m-secondary--BorderBlockEndWidth: var(--pf-t--global--border--width--glass--default, var(--pf-t--global--border--width--high-contrast--regular));
22838
+ --pf-v6-c-page__main-section--m-secondary--BorderBlockEndColor: var(--pf-t--global--border--color--subtle);
22814
22839
  --pf-v6-c-page--section--m-limit-width--MaxWidth: calc(125rem - var(--pf-v6-c-page__sidebar--Width));
22815
22840
  --pf-v6-c-page--section--m-sticky-top--ZIndex: var(--pf-t--global--z-index--md);
22816
22841
  --pf-v6-c-page--section--m-sticky-top--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom);
@@ -22853,11 +22878,54 @@ ul.pf-v6-c-list {
22853
22878
  --pf-v6-c-page--m-dock__main-container--MaxHeight: calc(100% - var(--pf-t--global--spacer--lg) * 2);
22854
22879
  --pf-v6-c-page--m-dock__main-container--MarginBlockStart: var(--pf-t--global--spacer--lg);
22855
22880
  --pf-v6-c-page--m-dock--ColumnGap: var(--pf-t--global--spacer--inset--page-chrome);
22881
+ --pf-v6-c-page--BackgroundColor--glass: transparent;
22882
+ --pf-v6-c-page__sidebar--Width--base--glass: calc(18.125rem + var(--pf-t--global--spacer--inset--page-chrome) * 2);
22883
+ --pf-v6-c-page__sidebar-body--PaddingInlineStart--glass: var(--pf-t--global--spacer--lg);
22884
+ --pf-v6-c-page__sidebar-body--PaddingInlineEnd--glass: var(--pf-t--global--spacer--lg);
22885
+ --pf-v6-c-page__sidebar-main--PaddingBlockEnd--glass: var(--pf-v6-c-page__sidebar--PaddingBlockEnd);
22886
+ --pf-v6-c-page__sidebar-main--PaddingInlineStart--glass: var(--pf-v6-c-page__sidebar--PaddingInlineStart);
22887
+ --pf-v6-c-page__sidebar-main--PaddingInlineEnd--glass: var(--pf-v6-c-page__sidebar--PaddingInlineEnd);
22888
+ --pf-v6-c-page__sidebar-main--MarginBlockStart--glass: calc(var(--pf-t--global--spacer--sm) * -1);
22889
+ --pf-v6-c-page__sidebar-main--MarginBlockEnd--glass: var(--pf-t--global--spacer--md);
22890
+ --pf-v6-c-page__sidebar-main--MarginInlineStart--glass: var(--pf-t--global--spacer--md);
22891
+ --pf-v6-c-page__sidebar-main--MarginInlineEnd--glass: var(--pf-t--global--spacer--md);
22892
+ --pf-v6-c-page__sidebar-main--BackgroundColor--glass: var(--pf-v6-c-page__sidebar--BackgroundColor);
22893
+ --pf-v6-c-page__sidebar-main--BackdropFilter--glass: var(--pf-v6-c-page__sidebar--BackdropFilter);
22894
+ --pf-v6-c-page__sidebar-main--BorderWidth--glass: var(--pf-t--global--border--width--glass--default);
22895
+ --pf-v6-c-page__sidebar-main--BorderColor--glass: var(--pf-t--global--border--color--glass--default);
22896
+ --pf-v6-c-page__sidebar-main--BorderRadius--glass: var(--pf-t--global--border--radius--glass--default);
22897
+ --pf-v6-c-page__sidebar-main--BoxShadow--glass: var(--pf-t--global--box-shadow--glass--default);
22898
+ --pf-v6-c-page__sidebar-main--xl--MarginBlockStart--glass: 0;
22899
+ --pf-v6-c-page__sidebar-main--xl--MarginBlockEnd--glass: var(--pf-t--global--spacer--inset--page-chrome);
22900
+ --pf-v6-c-page__sidebar-main--xl--MarginInlineStart--glass: var(--pf-t--global--spacer--inset--page-chrome);
22901
+ --pf-v6-c-page__sidebar-main--xl--MarginInlineEnd--glass: var(--pf-t--global--spacer--inset--page-chrome);
22856
22902
  }
22857
22903
  :where(.pf-v6-theme-glass) .pf-v6-c-page {
22858
- --pf-v6-c-page__sidebar--Width--base: calc(18.125rem + var(--pf-t--global--spacer--inset--page-chrome) * 2);
22859
- --pf-v6-c-page__sidebar-body--PaddingInlineStart: var(--pf-t--global--spacer--lg);
22860
- --pf-v6-c-page__sidebar-body--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
22904
+ --pf-v6-c-page--BackgroundColor: var(--pf-v6-c-page--BackgroundColor--glass);
22905
+ --pf-v6-c-page__sidebar--Width--base: var(--pf-v6-c-page__sidebar--Width--base--glass);
22906
+ --pf-v6-c-page__sidebar-body--PaddingInlineStart: var(--pf-v6-c-page__sidebar-body--PaddingInlineStart--glass);
22907
+ --pf-v6-c-page__sidebar-body--PaddingInlineEnd: var(--pf-v6-c-page__sidebar-body--PaddingInlineEnd--glass);
22908
+ --pf-v6-c-page__sidebar-main--PaddingBlockEnd: var(--pf-v6-c-page__sidebar-main--PaddingBlockEnd--glass);
22909
+ --pf-v6-c-page__sidebar-main--PaddingInlineStart: var(--pf-v6-c-page__sidebar-main--PaddingInlineStart--glass);
22910
+ --pf-v6-c-page__sidebar-main--PaddingInlineEnd: var(--pf-v6-c-page__sidebar-main--PaddingInlineEnd--glass);
22911
+ --pf-v6-c-page__sidebar-main--MarginBlockStart: var(--pf-v6-c-page__sidebar-main--MarginBlockStart--glass);
22912
+ --pf-v6-c-page__sidebar-main--MarginBlockEnd: var(--pf-v6-c-page__sidebar-main--MarginBlockEnd--glass);
22913
+ --pf-v6-c-page__sidebar-main--MarginInlineStart: var(--pf-v6-c-page__sidebar-main--MarginInlineStart--glass);
22914
+ --pf-v6-c-page__sidebar-main--MarginInlineEnd: var(--pf-v6-c-page__sidebar-main--MarginInlineEnd--glass);
22915
+ --pf-v6-c-page__sidebar-main--BackgroundColor: var(--pf-v6-c-page__sidebar-main--BackgroundColor--glass);
22916
+ --pf-v6-c-page__sidebar-main--BackdropFilter: var(--pf-v6-c-page__sidebar-main--BackdropFilter--glass);
22917
+ --pf-v6-c-page__sidebar-main--BorderWidth: var(--pf-v6-c-page__sidebar-main--BorderWidth--glass);
22918
+ --pf-v6-c-page__sidebar-main--BorderColor: var(--pf-v6-c-page__sidebar-main--BorderColor--glass);
22919
+ --pf-v6-c-page__sidebar-main--BorderRadius: var(--pf-v6-c-page__sidebar-main--BorderRadius--glass);
22920
+ --pf-v6-c-page__sidebar-main--BoxShadow: var(--pf-v6-c-page__sidebar-main--BoxShadow--glass);
22921
+ }
22922
+ @media (min-width: 75rem) {
22923
+ .pf-v6-c-page {
22924
+ --pf-v6-c-page__sidebar-main--MarginBlockStart--glass: var(--pf-v6-c-page__sidebar-main--xl--MarginBlockStart--glass);
22925
+ --pf-v6-c-page__sidebar-main--MarginBlockEnd--glass: var(--pf-v6-c-page__sidebar-main--xl--MarginBlockEnd--glass);
22926
+ --pf-v6-c-page__sidebar-main--MarginInlineStart--glass: var(--pf-v6-c-page__sidebar-main--xl--MarginInlineStart--glass);
22927
+ --pf-v6-c-page__sidebar-main--MarginInlineEnd--glass: var(--pf-v6-c-page__sidebar-main--xl--MarginInlineEnd--glass);
22928
+ }
22861
22929
  }
22862
22930
 
22863
22931
  .pf-v6-c-page {
@@ -22870,9 +22938,6 @@ ul.pf-v6-c-list {
22870
22938
  max-height: 100%;
22871
22939
  background-color: var(--pf-v6-c-page--BackgroundColor);
22872
22940
  }
22873
- :where(:root.pf-v6-theme-glass) .pf-v6-c-page {
22874
- background-color: transparent;
22875
- }
22876
22941
  @media (min-width: 75rem) {
22877
22942
  .pf-v6-c-page {
22878
22943
  --pf-v6-c-page__sidebar--Width: var(--pf-v6-c-page__sidebar--xl--Width);
@@ -23022,6 +23087,7 @@ ul.pf-v6-c-list {
23022
23087
  padding-block-end: var(--pf-v6-c-page__sidebar--PaddingBlockEnd);
23023
23088
  padding-inline-start: var(--pf-v6-c-page__sidebar--PaddingInlineStart);
23024
23089
  padding-inline-end: var(--pf-v6-c-page__sidebar--PaddingInlineEnd);
23090
+ margin-block-start: var(--pf-v6-c-page__sidebar--MarginBlockStart);
23025
23091
  margin-inline-end: var(--pf-v6-c-page__sidebar--MarginInlineEnd);
23026
23092
  overflow-x: hidden;
23027
23093
  overflow-y: auto;
@@ -23053,44 +23119,33 @@ ul.pf-v6-c-list {
23053
23119
  :where(.pf-v6-theme-glass) .pf-v6-c-page__sidebar {
23054
23120
  min-height: 0;
23055
23121
  padding: 0;
23056
- overflow: visible;
23122
+ overflow: revert;
23057
23123
  background: transparent;
23058
23124
  }
23059
23125
  :where(.pf-v6-theme-glass) .pf-v6-c-page__sidebar.pf-m-expanded {
23060
23126
  box-shadow: none;
23061
23127
  }
23062
- :where(.pf-v6-theme-glass) .pf-v6-c-page__sidebar .pf-v6-c-page__sidebar-main {
23063
- padding-block-end: var(--pf-v6-c-page__sidebar--PaddingBlockEnd);
23064
- padding-inline-start: var(--pf-v6-c-page__sidebar--PaddingInlineStart);
23065
- padding-inline-end: var(--pf-v6-c-page__sidebar--PaddingInlineEnd);
23066
- margin-block-start: calc(var(--pf-t--global--spacer--sm) * -1);
23067
- margin-block-end: var(--pf-t--global--spacer--md);
23068
- margin-inline-start: var(--pf-t--global--spacer--md);
23069
- margin-inline-end: var(--pf-t--global--spacer--md);
23128
+ :where(.pf-v6-theme-glass) .pf-v6-c-page__sidebar-main {
23070
23129
  overflow: auto;
23071
- background-color: var(--pf-v6-c-page__sidebar--BackgroundColor);
23072
- backdrop-filter: var(--pf-v6-c-page__sidebar--BackdropFilter);
23073
- border: var(--pf-t--global--border--width--glass--default) solid var(--pf-t--global--border--color--glass--default);
23074
- border-radius: var(--pf-t--global--border--radius--glass--default);
23075
- box-shadow: var(--pf-t--global--box-shadow--glass--default);
23076
- }
23077
- @media (min-width: 75rem) {
23078
- :where(.pf-v6-theme-glass) .pf-v6-c-page__sidebar .pf-v6-c-page__sidebar-main {
23079
- margin-block-start: 0;
23080
- margin-block-end: var(--pf-t--global--spacer--inset--page-chrome);
23081
- margin-inline-start: var(--pf-t--global--spacer--inset--page-chrome);
23082
- margin-inline-end: var(--pf-t--global--spacer--inset--page-chrome);
23083
- }
23084
- }
23085
-
23086
- .pf-v6-c-page__sidebar:has(> .pf-v6-c-page__sidebar-main) {
23087
- overflow: revert;
23088
23130
  }
23089
23131
 
23090
23132
  .pf-v6-c-page__sidebar-main {
23091
23133
  display: flex;
23092
23134
  flex-grow: 1;
23093
23135
  flex-direction: column;
23136
+ padding-block-start: var(--pf-v6-c-page__sidebar-main--PaddingBlockStart);
23137
+ padding-block-end: var(--pf-v6-c-page__sidebar-main--PaddingBlockEnd);
23138
+ padding-inline-start: var(--pf-v6-c-page__sidebar-main--PaddingInlineStart);
23139
+ padding-inline-end: var(--pf-v6-c-page__sidebar-main--PaddingInlineEnd);
23140
+ margin-block-start: var(--pf-v6-c-page__sidebar-main--MarginBlockStart);
23141
+ margin-block-end: var(--pf-v6-c-page__sidebar-main--MarginBlockEnd);
23142
+ margin-inline-start: var(--pf-v6-c-page__sidebar-main--MarginInlineStart);
23143
+ margin-inline-end: var(--pf-v6-c-page__sidebar-main--MarginInlineEnd);
23144
+ background-color: var(--pf-v6-c-page__sidebar-main--BackgroundColor);
23145
+ backdrop-filter: var(--pf-v6-c-page__sidebar-main--BackdropFilter);
23146
+ border: var(--pf-v6-c-page__sidebar-main--BorderWidth) solid var(--pf-v6-c-page__sidebar-main--BorderColor);
23147
+ border-radius: var(--pf-v6-c-page__sidebar-main--BorderRadius);
23148
+ box-shadow: var(--pf-v6-c-page__sidebar-main--BoxShadow);
23094
23149
  }
23095
23150
 
23096
23151
  .pf-v6-c-page__sidebar-header {
@@ -23518,8 +23573,8 @@ ul.pf-v6-c-list {
23518
23573
  }
23519
23574
  .pf-v6-c-page__main-section.pf-m-secondary {
23520
23575
  --pf-v6-c-page__main-section--BackgroundColor: var(--pf-v6-c-page__main-section--m-secondary--BackgroundColor);
23521
- border-block-start: var(--pf-t--global--border--width--glass--default, var(--pf-t--global--border--width--high-contrast--regular)) solid var(--pf-t--global--border--color--subtle, var(--pf-t--global--border--color--high-contrast));
23522
- border-block-end: var(--pf-t--global--border--width--glass--default, var(--pf-t--global--border--width--high-contrast--regular)) solid var(--pf-t--global--border--color--subtle, var(--pf-t--global--border--color--high-contrast));
23576
+ border-block-start: var(--pf-v6-c-page__main-section--m-secondary--BorderBlockStartWidth) solid var(--pf-v6-c-page__main-section--m-secondary--BorderBlockStartColor);
23577
+ border-block-end: var(--pf-v6-c-page__main-section--m-secondary--BorderBlockEndWidth) solid var(--pf-v6-c-page__main-section--m-secondary--BorderBlockEndColor);
23523
23578
  }
23524
23579
  .pf-v6-c-page__main-section.pf-m-padding {
23525
23580
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
@@ -28061,7 +28116,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
28061
28116
  --pf-v6-c-table__button--BorderColor: var(--pf-t--global--border--color--high-contrast);
28062
28117
  --pf-v6-c-table__button--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
28063
28118
  --pf-v6-c-table__button--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
28064
- --pf-v6-c-table__button--BorderRadius: var(--pf-t--global--border--radius--small);
28119
+ --pf-v6-c-table__button--BorderRadius: var(--pf-t--global--border--radius--action--plain--default);
28065
28120
  --pf-v6-c-table__button--hover--Color: var(--pf-t--global--text--color--regular);
28066
28121
  --pf-v6-c-table__button--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
28067
28122
  --pf-v6-c-table__check--PaddingInlineStart: var(--pf-t--global--spacer--sm);
@@ -28156,7 +28211,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
28156
28211
  --pf-v6-c-table__subhead--Color: var(--pf-t--global--text--color--subtle);
28157
28212
  --pf-v6-c-table__nested-column-header__button--PaddingInlineStart: calc(var(--pf-v6-c-table__button--PaddingInlineStart) - var(--pf-t--global--spacer--control--horizontal--plain));
28158
28213
  --pf-v6-c-table__nested-column-header__button--PaddingInlineEnd: calc(var(--pf-v6-c-table__button--PaddingInlineEnd) - (var(--pf-t--global--spacer--control--horizontal--plain) / 2));
28159
- --pf-v6-c-table--m-striped__tr--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
28214
+ --pf-v6-c-table--m-striped__tr--BackgroundColor: var(--pf-t--global--background--color--striped--row--default);
28160
28215
  --pf-v6-c-table--m-sticky-header--cell--ZIndex: var(--pf-t--global--z-index--xs);
28161
28216
  --pf-v6-c-table--m-sticky-header--ZIndex: calc(var(--pf-t--global--z-index--xs) + 1);
28162
28217
  --pf-v6-c-table--m-sticky-header--border--ZIndex: calc(var(--pf-t--global--z-index--xs) + 2);
@@ -38140,6 +38195,6 @@ label.pf-v6-c-tree-view__node-text {
38140
38195
  :where(.pf-v6-theme-glass) body {
38141
38196
  overflow: auto;
38142
38197
  }
38143
- :where(.pf-v6-theme-glass) .pf-v6-c-page__sidebar {
38198
+ :where(.pf-v6-theme-glass) #page-sidebar {
38144
38199
  overflow: auto;
38145
38200
  }
package/patternfly.css CHANGED
@@ -6461,6 +6461,12 @@ button) {
6461
6461
  display: revert;
6462
6462
  }
6463
6463
 
6464
+ .pf-v6-icon-rh-standard {
6465
+ width: 3rem;
6466
+ height: 3rem;
6467
+ color: var(--pf-t--global--icon--color--brand--accent--default);
6468
+ }
6469
+
6464
6470
  :root {
6465
6471
  --pf-v6-global--inverse--multiplier: 1;
6466
6472
  --pf-t--color--black: #000000;
@@ -22871,6 +22877,7 @@ ul.pf-v6-c-list {
22871
22877
  --pf-v6-c-page__sidebar--TranslateZ: 0;
22872
22878
  --pf-v6-c-page__sidebar--m-expanded--TranslateX: 0;
22873
22879
  --pf-v6-c-page__sidebar--xl--TranslateX: 0;
22880
+ --pf-v6-c-page__sidebar--MarginBlockStart: 0;
22874
22881
  --pf-v6-c-page__sidebar--MarginInlineEnd: calc(var(--pf-t--global--spacer--inset--page-chrome) / 2);
22875
22882
  --pf-v6-c-page__sidebar--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
22876
22883
  --pf-v6-c-page__sidebar--PaddingInlineStart: 0;
@@ -22888,6 +22895,20 @@ ul.pf-v6-c-list {
22888
22895
  }
22889
22896
  }
22890
22897
  .pf-v6-c-page {
22898
+ --pf-v6-c-page__sidebar-main--PaddingBlockStart: 0;
22899
+ --pf-v6-c-page__sidebar-main--PaddingBlockEnd: 0;
22900
+ --pf-v6-c-page__sidebar-main--PaddingInlineStart: 0;
22901
+ --pf-v6-c-page__sidebar-main--PaddingInlineEnd: 0;
22902
+ --pf-v6-c-page__sidebar-main--MarginBlockStart: 0;
22903
+ --pf-v6-c-page__sidebar-main--MarginBlockEnd: 0;
22904
+ --pf-v6-c-page__sidebar-main--MarginInlineStart: 0;
22905
+ --pf-v6-c-page__sidebar-main--MarginInlineEnd: 0;
22906
+ --pf-v6-c-page__sidebar-main--BackgroundColor: transparent;
22907
+ --pf-v6-c-page__sidebar-main--BackdropFilter: none;
22908
+ --pf-v6-c-page__sidebar-main--BorderWidth: 0;
22909
+ --pf-v6-c-page__sidebar-main--BorderColor: transparent;
22910
+ --pf-v6-c-page__sidebar-main--BorderRadius: 0;
22911
+ --pf-v6-c-page__sidebar-main--BoxShadow: none;
22891
22912
  --pf-v6-c-page__sidebar-header--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
22892
22913
  --pf-v6-c-page__sidebar-header--BorderBlockEndColor: var(--pf-t--global--border--color--default);
22893
22914
  --pf-v6-c-page__sidebar-header--PaddingBlockStart: var(--pf-t--global--spacer--sm);
@@ -22958,6 +22979,10 @@ ul.pf-v6-c-list {
22958
22979
  --pf-v6-c-page__main-section--BackgroundColor: var(--pf-t--global--background--color--primary--default);
22959
22980
  --pf-v6-c-page__main-section--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
22960
22981
  --pf-v6-c-page__main-breadcrumb--page__main-tabs--PaddingBlockStart: var(--pf-t--global--spacer--md);
22982
+ --pf-v6-c-page__main-section--m-secondary--BorderBlockStartWidth: var(--pf-t--global--border--width--glass--default, var(--pf-t--global--border--width--high-contrast--regular));
22983
+ --pf-v6-c-page__main-section--m-secondary--BorderBlockStartColor: var(--pf-t--global--border--color--subtle);
22984
+ --pf-v6-c-page__main-section--m-secondary--BorderBlockEndWidth: var(--pf-t--global--border--width--glass--default, var(--pf-t--global--border--width--high-contrast--regular));
22985
+ --pf-v6-c-page__main-section--m-secondary--BorderBlockEndColor: var(--pf-t--global--border--color--subtle);
22961
22986
  --pf-v6-c-page--section--m-limit-width--MaxWidth: calc(125rem - var(--pf-v6-c-page__sidebar--Width));
22962
22987
  --pf-v6-c-page--section--m-sticky-top--ZIndex: var(--pf-t--global--z-index--md);
22963
22988
  --pf-v6-c-page--section--m-sticky-top--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom);
@@ -23000,11 +23025,54 @@ ul.pf-v6-c-list {
23000
23025
  --pf-v6-c-page--m-dock__main-container--MaxHeight: calc(100% - var(--pf-t--global--spacer--lg) * 2);
23001
23026
  --pf-v6-c-page--m-dock__main-container--MarginBlockStart: var(--pf-t--global--spacer--lg);
23002
23027
  --pf-v6-c-page--m-dock--ColumnGap: var(--pf-t--global--spacer--inset--page-chrome);
23028
+ --pf-v6-c-page--BackgroundColor--glass: transparent;
23029
+ --pf-v6-c-page__sidebar--Width--base--glass: calc(18.125rem + var(--pf-t--global--spacer--inset--page-chrome) * 2);
23030
+ --pf-v6-c-page__sidebar-body--PaddingInlineStart--glass: var(--pf-t--global--spacer--lg);
23031
+ --pf-v6-c-page__sidebar-body--PaddingInlineEnd--glass: var(--pf-t--global--spacer--lg);
23032
+ --pf-v6-c-page__sidebar-main--PaddingBlockEnd--glass: var(--pf-v6-c-page__sidebar--PaddingBlockEnd);
23033
+ --pf-v6-c-page__sidebar-main--PaddingInlineStart--glass: var(--pf-v6-c-page__sidebar--PaddingInlineStart);
23034
+ --pf-v6-c-page__sidebar-main--PaddingInlineEnd--glass: var(--pf-v6-c-page__sidebar--PaddingInlineEnd);
23035
+ --pf-v6-c-page__sidebar-main--MarginBlockStart--glass: calc(var(--pf-t--global--spacer--sm) * -1);
23036
+ --pf-v6-c-page__sidebar-main--MarginBlockEnd--glass: var(--pf-t--global--spacer--md);
23037
+ --pf-v6-c-page__sidebar-main--MarginInlineStart--glass: var(--pf-t--global--spacer--md);
23038
+ --pf-v6-c-page__sidebar-main--MarginInlineEnd--glass: var(--pf-t--global--spacer--md);
23039
+ --pf-v6-c-page__sidebar-main--BackgroundColor--glass: var(--pf-v6-c-page__sidebar--BackgroundColor);
23040
+ --pf-v6-c-page__sidebar-main--BackdropFilter--glass: var(--pf-v6-c-page__sidebar--BackdropFilter);
23041
+ --pf-v6-c-page__sidebar-main--BorderWidth--glass: var(--pf-t--global--border--width--glass--default);
23042
+ --pf-v6-c-page__sidebar-main--BorderColor--glass: var(--pf-t--global--border--color--glass--default);
23043
+ --pf-v6-c-page__sidebar-main--BorderRadius--glass: var(--pf-t--global--border--radius--glass--default);
23044
+ --pf-v6-c-page__sidebar-main--BoxShadow--glass: var(--pf-t--global--box-shadow--glass--default);
23045
+ --pf-v6-c-page__sidebar-main--xl--MarginBlockStart--glass: 0;
23046
+ --pf-v6-c-page__sidebar-main--xl--MarginBlockEnd--glass: var(--pf-t--global--spacer--inset--page-chrome);
23047
+ --pf-v6-c-page__sidebar-main--xl--MarginInlineStart--glass: var(--pf-t--global--spacer--inset--page-chrome);
23048
+ --pf-v6-c-page__sidebar-main--xl--MarginInlineEnd--glass: var(--pf-t--global--spacer--inset--page-chrome);
23003
23049
  }
23004
23050
  :where(.pf-v6-theme-glass) .pf-v6-c-page {
23005
- --pf-v6-c-page__sidebar--Width--base: calc(18.125rem + var(--pf-t--global--spacer--inset--page-chrome) * 2);
23006
- --pf-v6-c-page__sidebar-body--PaddingInlineStart: var(--pf-t--global--spacer--lg);
23007
- --pf-v6-c-page__sidebar-body--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
23051
+ --pf-v6-c-page--BackgroundColor: var(--pf-v6-c-page--BackgroundColor--glass);
23052
+ --pf-v6-c-page__sidebar--Width--base: var(--pf-v6-c-page__sidebar--Width--base--glass);
23053
+ --pf-v6-c-page__sidebar-body--PaddingInlineStart: var(--pf-v6-c-page__sidebar-body--PaddingInlineStart--glass);
23054
+ --pf-v6-c-page__sidebar-body--PaddingInlineEnd: var(--pf-v6-c-page__sidebar-body--PaddingInlineEnd--glass);
23055
+ --pf-v6-c-page__sidebar-main--PaddingBlockEnd: var(--pf-v6-c-page__sidebar-main--PaddingBlockEnd--glass);
23056
+ --pf-v6-c-page__sidebar-main--PaddingInlineStart: var(--pf-v6-c-page__sidebar-main--PaddingInlineStart--glass);
23057
+ --pf-v6-c-page__sidebar-main--PaddingInlineEnd: var(--pf-v6-c-page__sidebar-main--PaddingInlineEnd--glass);
23058
+ --pf-v6-c-page__sidebar-main--MarginBlockStart: var(--pf-v6-c-page__sidebar-main--MarginBlockStart--glass);
23059
+ --pf-v6-c-page__sidebar-main--MarginBlockEnd: var(--pf-v6-c-page__sidebar-main--MarginBlockEnd--glass);
23060
+ --pf-v6-c-page__sidebar-main--MarginInlineStart: var(--pf-v6-c-page__sidebar-main--MarginInlineStart--glass);
23061
+ --pf-v6-c-page__sidebar-main--MarginInlineEnd: var(--pf-v6-c-page__sidebar-main--MarginInlineEnd--glass);
23062
+ --pf-v6-c-page__sidebar-main--BackgroundColor: var(--pf-v6-c-page__sidebar-main--BackgroundColor--glass);
23063
+ --pf-v6-c-page__sidebar-main--BackdropFilter: var(--pf-v6-c-page__sidebar-main--BackdropFilter--glass);
23064
+ --pf-v6-c-page__sidebar-main--BorderWidth: var(--pf-v6-c-page__sidebar-main--BorderWidth--glass);
23065
+ --pf-v6-c-page__sidebar-main--BorderColor: var(--pf-v6-c-page__sidebar-main--BorderColor--glass);
23066
+ --pf-v6-c-page__sidebar-main--BorderRadius: var(--pf-v6-c-page__sidebar-main--BorderRadius--glass);
23067
+ --pf-v6-c-page__sidebar-main--BoxShadow: var(--pf-v6-c-page__sidebar-main--BoxShadow--glass);
23068
+ }
23069
+ @media (min-width: 75rem) {
23070
+ .pf-v6-c-page {
23071
+ --pf-v6-c-page__sidebar-main--MarginBlockStart--glass: var(--pf-v6-c-page__sidebar-main--xl--MarginBlockStart--glass);
23072
+ --pf-v6-c-page__sidebar-main--MarginBlockEnd--glass: var(--pf-v6-c-page__sidebar-main--xl--MarginBlockEnd--glass);
23073
+ --pf-v6-c-page__sidebar-main--MarginInlineStart--glass: var(--pf-v6-c-page__sidebar-main--xl--MarginInlineStart--glass);
23074
+ --pf-v6-c-page__sidebar-main--MarginInlineEnd--glass: var(--pf-v6-c-page__sidebar-main--xl--MarginInlineEnd--glass);
23075
+ }
23008
23076
  }
23009
23077
 
23010
23078
  .pf-v6-c-page {
@@ -23017,9 +23085,6 @@ ul.pf-v6-c-list {
23017
23085
  max-height: 100%;
23018
23086
  background-color: var(--pf-v6-c-page--BackgroundColor);
23019
23087
  }
23020
- :where(:root.pf-v6-theme-glass) .pf-v6-c-page {
23021
- background-color: transparent;
23022
- }
23023
23088
  @media (min-width: 75rem) {
23024
23089
  .pf-v6-c-page {
23025
23090
  --pf-v6-c-page__sidebar--Width: var(--pf-v6-c-page__sidebar--xl--Width);
@@ -23169,6 +23234,7 @@ ul.pf-v6-c-list {
23169
23234
  padding-block-end: var(--pf-v6-c-page__sidebar--PaddingBlockEnd);
23170
23235
  padding-inline-start: var(--pf-v6-c-page__sidebar--PaddingInlineStart);
23171
23236
  padding-inline-end: var(--pf-v6-c-page__sidebar--PaddingInlineEnd);
23237
+ margin-block-start: var(--pf-v6-c-page__sidebar--MarginBlockStart);
23172
23238
  margin-inline-end: var(--pf-v6-c-page__sidebar--MarginInlineEnd);
23173
23239
  overflow-x: hidden;
23174
23240
  overflow-y: auto;
@@ -23200,44 +23266,33 @@ ul.pf-v6-c-list {
23200
23266
  :where(.pf-v6-theme-glass) .pf-v6-c-page__sidebar {
23201
23267
  min-height: 0;
23202
23268
  padding: 0;
23203
- overflow: visible;
23269
+ overflow: revert;
23204
23270
  background: transparent;
23205
23271
  }
23206
23272
  :where(.pf-v6-theme-glass) .pf-v6-c-page__sidebar.pf-m-expanded {
23207
23273
  box-shadow: none;
23208
23274
  }
23209
- :where(.pf-v6-theme-glass) .pf-v6-c-page__sidebar .pf-v6-c-page__sidebar-main {
23210
- padding-block-end: var(--pf-v6-c-page__sidebar--PaddingBlockEnd);
23211
- padding-inline-start: var(--pf-v6-c-page__sidebar--PaddingInlineStart);
23212
- padding-inline-end: var(--pf-v6-c-page__sidebar--PaddingInlineEnd);
23213
- margin-block-start: calc(var(--pf-t--global--spacer--sm) * -1);
23214
- margin-block-end: var(--pf-t--global--spacer--md);
23215
- margin-inline-start: var(--pf-t--global--spacer--md);
23216
- margin-inline-end: var(--pf-t--global--spacer--md);
23275
+ :where(.pf-v6-theme-glass) .pf-v6-c-page__sidebar-main {
23217
23276
  overflow: auto;
23218
- background-color: var(--pf-v6-c-page__sidebar--BackgroundColor);
23219
- backdrop-filter: var(--pf-v6-c-page__sidebar--BackdropFilter);
23220
- border: var(--pf-t--global--border--width--glass--default) solid var(--pf-t--global--border--color--glass--default);
23221
- border-radius: var(--pf-t--global--border--radius--glass--default);
23222
- box-shadow: var(--pf-t--global--box-shadow--glass--default);
23223
- }
23224
- @media (min-width: 75rem) {
23225
- :where(.pf-v6-theme-glass) .pf-v6-c-page__sidebar .pf-v6-c-page__sidebar-main {
23226
- margin-block-start: 0;
23227
- margin-block-end: var(--pf-t--global--spacer--inset--page-chrome);
23228
- margin-inline-start: var(--pf-t--global--spacer--inset--page-chrome);
23229
- margin-inline-end: var(--pf-t--global--spacer--inset--page-chrome);
23230
- }
23231
- }
23232
-
23233
- .pf-v6-c-page__sidebar:has(> .pf-v6-c-page__sidebar-main) {
23234
- overflow: revert;
23235
23277
  }
23236
23278
 
23237
23279
  .pf-v6-c-page__sidebar-main {
23238
23280
  display: flex;
23239
23281
  flex-grow: 1;
23240
23282
  flex-direction: column;
23283
+ padding-block-start: var(--pf-v6-c-page__sidebar-main--PaddingBlockStart);
23284
+ padding-block-end: var(--pf-v6-c-page__sidebar-main--PaddingBlockEnd);
23285
+ padding-inline-start: var(--pf-v6-c-page__sidebar-main--PaddingInlineStart);
23286
+ padding-inline-end: var(--pf-v6-c-page__sidebar-main--PaddingInlineEnd);
23287
+ margin-block-start: var(--pf-v6-c-page__sidebar-main--MarginBlockStart);
23288
+ margin-block-end: var(--pf-v6-c-page__sidebar-main--MarginBlockEnd);
23289
+ margin-inline-start: var(--pf-v6-c-page__sidebar-main--MarginInlineStart);
23290
+ margin-inline-end: var(--pf-v6-c-page__sidebar-main--MarginInlineEnd);
23291
+ background-color: var(--pf-v6-c-page__sidebar-main--BackgroundColor);
23292
+ backdrop-filter: var(--pf-v6-c-page__sidebar-main--BackdropFilter);
23293
+ border: var(--pf-v6-c-page__sidebar-main--BorderWidth) solid var(--pf-v6-c-page__sidebar-main--BorderColor);
23294
+ border-radius: var(--pf-v6-c-page__sidebar-main--BorderRadius);
23295
+ box-shadow: var(--pf-v6-c-page__sidebar-main--BoxShadow);
23241
23296
  }
23242
23297
 
23243
23298
  .pf-v6-c-page__sidebar-header {
@@ -23665,8 +23720,8 @@ ul.pf-v6-c-list {
23665
23720
  }
23666
23721
  .pf-v6-c-page__main-section.pf-m-secondary {
23667
23722
  --pf-v6-c-page__main-section--BackgroundColor: var(--pf-v6-c-page__main-section--m-secondary--BackgroundColor);
23668
- border-block-start: var(--pf-t--global--border--width--glass--default, var(--pf-t--global--border--width--high-contrast--regular)) solid var(--pf-t--global--border--color--subtle, var(--pf-t--global--border--color--high-contrast));
23669
- border-block-end: var(--pf-t--global--border--width--glass--default, var(--pf-t--global--border--width--high-contrast--regular)) solid var(--pf-t--global--border--color--subtle, var(--pf-t--global--border--color--high-contrast));
23723
+ border-block-start: var(--pf-v6-c-page__main-section--m-secondary--BorderBlockStartWidth) solid var(--pf-v6-c-page__main-section--m-secondary--BorderBlockStartColor);
23724
+ border-block-end: var(--pf-v6-c-page__main-section--m-secondary--BorderBlockEndWidth) solid var(--pf-v6-c-page__main-section--m-secondary--BorderBlockEndColor);
23670
23725
  }
23671
23726
  .pf-v6-c-page__main-section.pf-m-padding {
23672
23727
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
@@ -28208,7 +28263,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
28208
28263
  --pf-v6-c-table__button--BorderColor: var(--pf-t--global--border--color--high-contrast);
28209
28264
  --pf-v6-c-table__button--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
28210
28265
  --pf-v6-c-table__button--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
28211
- --pf-v6-c-table__button--BorderRadius: var(--pf-t--global--border--radius--small);
28266
+ --pf-v6-c-table__button--BorderRadius: var(--pf-t--global--border--radius--action--plain--default);
28212
28267
  --pf-v6-c-table__button--hover--Color: var(--pf-t--global--text--color--regular);
28213
28268
  --pf-v6-c-table__button--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
28214
28269
  --pf-v6-c-table__check--PaddingInlineStart: var(--pf-t--global--spacer--sm);
@@ -28303,7 +28358,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
28303
28358
  --pf-v6-c-table__subhead--Color: var(--pf-t--global--text--color--subtle);
28304
28359
  --pf-v6-c-table__nested-column-header__button--PaddingInlineStart: calc(var(--pf-v6-c-table__button--PaddingInlineStart) - var(--pf-t--global--spacer--control--horizontal--plain));
28305
28360
  --pf-v6-c-table__nested-column-header__button--PaddingInlineEnd: calc(var(--pf-v6-c-table__button--PaddingInlineEnd) - (var(--pf-t--global--spacer--control--horizontal--plain) / 2));
28306
- --pf-v6-c-table--m-striped__tr--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
28361
+ --pf-v6-c-table--m-striped__tr--BackgroundColor: var(--pf-t--global--background--color--striped--row--default);
28307
28362
  --pf-v6-c-table--m-sticky-header--cell--ZIndex: var(--pf-t--global--z-index--xs);
28308
28363
  --pf-v6-c-table--m-sticky-header--ZIndex: calc(var(--pf-t--global--z-index--xs) + 1);
28309
28364
  --pf-v6-c-table--m-sticky-header--border--ZIndex: calc(var(--pf-t--global--z-index--xs) + 2);
@@ -38287,6 +38342,6 @@ label.pf-v6-c-tree-view__node-text {
38287
38342
  :where(.pf-v6-theme-glass) body {
38288
38343
  overflow: auto;
38289
38344
  }
38290
- :where(.pf-v6-theme-glass) .pf-v6-c-page__sidebar {
38345
+ :where(.pf-v6-theme-glass) #page-sidebar {
38291
38346
  overflow: auto;
38292
38347
  }