@patternfly/patternfly 6.0.0-prerelease.13 → 6.0.0-prerelease.16

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 (106) hide show
  1. package/README.md +1 -1
  2. package/base/normalize.scss +16 -0
  3. package/base/patternfly-variables.css +84 -59
  4. package/base/tokens/tokens-charts-dark.scss +1 -1
  5. package/base/tokens/tokens-charts.scss +1 -1
  6. package/base/tokens/tokens-dark.scss +12 -4
  7. package/base/tokens/tokens-default.scss +44 -27
  8. package/base/tokens/tokens-local.scss +30 -30
  9. package/base/tokens/tokens-palette.scss +1 -1
  10. package/components/Alert/alert.css +2 -6
  11. package/components/Alert/alert.scss +2 -7
  12. package/components/Button/button.css +8 -0
  13. package/components/Button/button.scss +8 -0
  14. package/components/DataList/data-list.css +4 -13
  15. package/components/DataList/data-list.scss +4 -14
  16. package/components/Drawer/drawer.css +0 -4
  17. package/components/Drawer/drawer.scss +0 -5
  18. package/components/FormControl/form-control.css +22 -3
  19. package/components/FormControl/form-control.scss +27 -4
  20. package/components/MenuToggle/menu-toggle.css +66 -55
  21. package/components/MenuToggle/menu-toggle.scss +76 -65
  22. package/components/Page/page.css +10 -8
  23. package/components/Page/page.scss +11 -8
  24. package/components/Pagination/pagination.css +31 -17
  25. package/components/Pagination/pagination.scss +35 -23
  26. package/components/Table/table-grid.css +9 -4
  27. package/components/Table/table-grid.scss +5 -4
  28. package/components/Table/table.css +6 -5
  29. package/components/Table/table.scss +6 -5
  30. package/components/_index.css +158 -115
  31. package/docs/components/Brand/examples/Brand.md +2 -2
  32. package/docs/components/Breadcrumb/examples/Breadcrumb.md +1 -1
  33. package/docs/components/CalendarMonth/examples/CalendarMonth.md +4 -4
  34. package/docs/components/DataList/examples/DataList.md +187 -221
  35. package/docs/components/DragDrop/examples/DragDrop.md +0 -1
  36. package/docs/components/FileUpload/examples/FileUpload.md +11 -7
  37. package/docs/components/Form/examples/Form.md +4 -2
  38. package/docs/components/FormControl/examples/FormControl.md +10 -10
  39. package/docs/components/InputGroup/examples/InputGroup.md +4 -4
  40. package/docs/components/Login/examples/Login.md +6 -6
  41. package/docs/components/MenuToggle/examples/MenuToggle.md +140 -139
  42. package/docs/components/Pagination/examples/Pagination.md +12 -12
  43. package/docs/components/Table/examples/Table.md +1 -1
  44. package/docs/components/Toolbar/examples/Toolbar.md +37 -37
  45. package/docs/demos/Card/examples/Card.md +4 -4
  46. package/docs/demos/CardView/examples/CardView.md +10 -4
  47. package/docs/demos/Dashboard/examples/Dashboard.md +8 -2
  48. package/docs/demos/DataList/examples/DataList.md +37 -13
  49. package/docs/demos/Masthead/examples/Masthead.md +5 -5
  50. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +425 -435
  51. package/docs/demos/Page/examples/Page.md +2 -2
  52. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +30 -18
  53. package/docs/demos/Table/examples/Table.md +214 -70
  54. package/docs/demos/Tabs/examples/Tabs.md +1 -1
  55. package/docs/demos/Toolbar/examples/Toolbar.md +42 -30
  56. package/docs/utilities/BoxShadow/examples/box-shadow.css +6 -17
  57. package/package.json +5 -5
  58. package/patternfly-base-no-globals.css +84 -59
  59. package/patternfly-base.css +99 -59
  60. package/patternfly-charts.css +2 -2
  61. package/patternfly-charts.scss +2 -2
  62. package/patternfly-no-globals.css +242 -174
  63. package/patternfly.css +257 -174
  64. package/patternfly.min.css +1 -1
  65. package/patternfly.min.css.map +1 -1
  66. package/assets/images/PF-Masthead-Logo.svg +0 -1
  67. package/assets/images/background-filter.svg +0 -17
  68. package/assets/images/g_sizing.png +0 -0
  69. package/assets/images/img_avatar-dark.svg +0 -22
  70. package/assets/images/img_avatar.svg +0 -21
  71. package/assets/images/l_pf-reverse-164x11.png +0 -0
  72. package/assets/images/l_pf-reverse.svg +0 -1
  73. package/assets/images/logo-dropbox-old.svg +0 -1
  74. package/assets/images/logo-dropbox.svg +0 -6
  75. package/assets/images/logo-facebook.svg +0 -4
  76. package/assets/images/logo-github.svg +0 -4
  77. package/assets/images/logo-gitlab.svg +0 -4
  78. package/assets/images/logo-google.svg +0 -4
  79. package/assets/images/logo-google2.svg +0 -10
  80. package/assets/images/logo__pf--reverse--base.png +0 -0
  81. package/assets/images/logo__pf--reverse--base.svg +0 -40
  82. package/assets/images/logo__pf--reverse-on-md.svg +0 -40
  83. package/assets/images/pf-c-brand__logo-base.jpg +0 -0
  84. package/assets/images/pf-c-brand__logo-on-lg-white.svg +0 -32
  85. package/assets/images/pf-c-brand__logo-on-lg.svg +0 -32
  86. package/assets/images/pf-c-brand__logo-on-md-white.svg +0 -42
  87. package/assets/images/pf-c-brand__logo-on-md.svg +0 -42
  88. package/assets/images/pf-c-brand__logo-on-sm-white.svg +0 -17
  89. package/assets/images/pf-c-brand__logo-on-sm.svg +0 -17
  90. package/assets/images/pf-c-brand__logo-on-xl-white.svg +0 -39
  91. package/assets/images/pf-c-brand__logo-on-xl.svg +0 -39
  92. package/assets/images/pf-c-brand__logo.svg +0 -10
  93. package/assets/images/pf-logo.svg +0 -28
  94. package/assets/images/pf_logo.svg +0 -37
  95. package/assets/images/pf_logo_color.svg +0 -22
  96. package/assets/images/pf_logo_white.svg +0 -37
  97. package/assets/images/pf_mini_logo_white.svg +0 -1
  98. package/assets/images/pfbg_1200.jpg +0 -0
  99. package/assets/images/pfbg_2000.jpg +0 -0
  100. package/assets/images/pfbg_576.jpg +0 -0
  101. package/assets/images/pfbg_576@2x.jpg +0 -0
  102. package/assets/images/pfbg_768.jpg +0 -0
  103. package/assets/images/pfbg_768@2x.jpg +0 -0
  104. package/assets/images/pfbg_992.jpg +0 -0
  105. package/assets/images/pfbg_992@2x.jpg +0 -0
  106. package/assets/images/status-icon-sprite.svg +0 -38
package/patternfly-base.css CHANGED
@@ -29,6 +29,21 @@ h6) {
29
29
  *::before,
30
30
  *::after {
31
31
  box-sizing: border-box;
32
+ scrollbar-color: var(--pf-t--global--border--color--default) transparent;
33
+ }
34
+
35
+ *::-webkit-scrollbar-thumb {
36
+ background-color: var(--pf-t--global--border--color--default);
37
+ border-radius: var(--pf-t--global--spacer--xs);
38
+ }
39
+
40
+ *::-webkit-scrollbar-track {
41
+ background-color: transparent;
42
+ }
43
+
44
+ *::-webkit-scrollbar {
45
+ max-width: var(--pf-t--global--spacer--sm);
46
+ max-height: var(--pf-t--global--spacer--sm);
32
47
  }
33
48
 
34
49
  :where(html,
@@ -6422,26 +6437,33 @@ button) {
6422
6437
  --pf-t--global--border--width--100: 1px;
6423
6438
  --pf-t--global--border--width--200: 2px;
6424
6439
  --pf-t--global--border--width--300: 3px;
6425
- --pf-t--global--box-shadow--X--100: -8px;
6440
+ --pf-t--global--box-shadow--X--100: -10px;
6426
6441
  --pf-t--global--box-shadow--X--200: -4px;
6427
6442
  --pf-t--global--box-shadow--X--300: -1px;
6428
6443
  --pf-t--global--box-shadow--X--400: 0px;
6444
+ --pf-t--global--box-shadow--X--50: -20px;
6429
6445
  --pf-t--global--box-shadow--X--500: 1px;
6430
6446
  --pf-t--global--box-shadow--X--600: 4px;
6431
- --pf-t--global--box-shadow--X--700: 8px;
6432
- --pf-t--global--box-shadow--Y--100: -8px;
6447
+ --pf-t--global--box-shadow--X--700: 10px;
6448
+ --pf-t--global--box-shadow--X--800: 20px;
6449
+ --pf-t--global--box-shadow--Y--100: -10px;
6433
6450
  --pf-t--global--box-shadow--Y--200: -4px;
6434
6451
  --pf-t--global--box-shadow--Y--300: -1px;
6435
6452
  --pf-t--global--box-shadow--Y--400: 0px;
6453
+ --pf-t--global--box-shadow--Y--50: -20px;
6436
6454
  --pf-t--global--box-shadow--Y--500: 1px;
6437
6455
  --pf-t--global--box-shadow--Y--600: 4px;
6438
- --pf-t--global--box-shadow--Y--700: 8px;
6456
+ --pf-t--global--box-shadow--Y--700: 10px;
6457
+ --pf-t--global--box-shadow--Y--800: 20px;
6439
6458
  --pf-t--global--box-shadow--blur--100: 4px;
6440
- --pf-t--global--box-shadow--blur--200: 8px;
6441
- --pf-t--global--box-shadow--blur--300: 24px;
6442
- --pf-t--global--box-shadow--color--100: rgba(0, 0, 0, 0.1600);
6443
- --pf-t--global--box-shadow--color--200: rgba(0, 0, 0, 0.1200);
6459
+ --pf-t--global--box-shadow--blur--200: 9px;
6460
+ --pf-t--global--box-shadow--blur--300: 20px;
6461
+ --pf-t--global--box-shadow--color--100: rgba(41, 41, 41, 0.1500);
6462
+ --pf-t--global--box-shadow--color--200: rgba(41, 41, 41, 0.2000);
6444
6463
  --pf-t--global--box-shadow--spread--100: 0px;
6464
+ --pf-t--global--box-shadow--spread--200: -4px;
6465
+ --pf-t--global--box-shadow--spread--300: -8px;
6466
+ --pf-t--global--box-shadow--spread--400: -20px;
6445
6467
  --pf-t--global--breakpoint--100: 0rem;
6446
6468
  --pf-t--global--breakpoint--200: 36rem;
6447
6469
  --pf-t--global--breakpoint--250: 40rem;
@@ -6510,11 +6532,13 @@ button) {
6510
6532
  --pf-t--global--background--color--200: var(--pf-t--color--gray--10);
6511
6533
  --pf-t--global--background--color--300: var(--pf-t--color--gray--20);
6512
6534
  --pf-t--global--background--color--400: var(--pf-t--color--gray--80);
6535
+ --pf-t--global--background--color--450: var(--pf-t--color--gray--70);
6513
6536
  --pf-t--global--background--color--action--plain--clicked: var(--pf-t--global--background--color--600);
6514
6537
  --pf-t--global--background--color--action--plain--hover: var(--pf-t--global--background--color--600);
6515
6538
  --pf-t--global--background--color--backdrop--default: var(--pf-t--global--background--color--500);
6516
6539
  --pf-t--global--background--color--highlight--100: var(--pf-t--color--yellow--30);
6517
6540
  --pf-t--global--background--color--highlight--200: var(--pf-t--color--yellow--40);
6541
+ --pf-t--global--background--color--tertiary--default: var(--pf-t--global--background--color--600);
6518
6542
  --pf-t--global--border--color--100: var(--pf-t--color--gray--30);
6519
6543
  --pf-t--global--border--color--200: var(--pf-t--color--gray--40);
6520
6544
  --pf-t--global--border--color--300: var(--pf-t--color--gray--50);
@@ -6544,43 +6568,49 @@ button) {
6544
6568
  --pf-t--global--border--width--strong: var(--pf-t--global--border--width--200);
6545
6569
  --pf-t--global--box-shadow--X--lg--bottom: var(--pf-t--global--box-shadow--X--400);
6546
6570
  --pf-t--global--box-shadow--X--lg--default: var(--pf-t--global--box-shadow--X--400);
6547
- --pf-t--global--box-shadow--X--lg--left: var(--pf-t--global--box-shadow--X--100);
6548
- --pf-t--global--box-shadow--X--lg--right: var(--pf-t--global--box-shadow--X--700);
6571
+ --pf-t--global--box-shadow--X--lg--left: var(--pf-t--global--box-shadow--X--50);
6572
+ --pf-t--global--box-shadow--X--lg--right: var(--pf-t--global--box-shadow--X--800);
6549
6573
  --pf-t--global--box-shadow--X--lg--top: var(--pf-t--global--box-shadow--X--400);
6550
6574
  --pf-t--global--box-shadow--X--md--bottom: var(--pf-t--global--box-shadow--X--400);
6551
6575
  --pf-t--global--box-shadow--X--md--default: var(--pf-t--global--box-shadow--X--400);
6552
- --pf-t--global--box-shadow--X--md--left: var(--pf-t--global--box-shadow--X--200);
6553
- --pf-t--global--box-shadow--X--md--right: var(--pf-t--global--box-shadow--X--600);
6576
+ --pf-t--global--box-shadow--X--md--left: var(--pf-t--global--box-shadow--X--100);
6577
+ --pf-t--global--box-shadow--X--md--right: var(--pf-t--global--box-shadow--X--700);
6554
6578
  --pf-t--global--box-shadow--X--md--top: var(--pf-t--global--box-shadow--X--400);
6555
6579
  --pf-t--global--box-shadow--X--sm--bottom: var(--pf-t--global--box-shadow--X--400);
6556
6580
  --pf-t--global--box-shadow--X--sm--default: var(--pf-t--global--box-shadow--X--400);
6557
- --pf-t--global--box-shadow--X--sm--left: var(--pf-t--global--box-shadow--X--300);
6558
- --pf-t--global--box-shadow--X--sm--right: var(--pf-t--global--box-shadow--X--500);
6581
+ --pf-t--global--box-shadow--X--sm--left: var(--pf-t--global--box-shadow--X--200);
6582
+ --pf-t--global--box-shadow--X--sm--right: var(--pf-t--global--box-shadow--X--600);
6559
6583
  --pf-t--global--box-shadow--X--sm--top: var(--pf-t--global--box-shadow--X--400);
6560
- --pf-t--global--box-shadow--Y--lg--bottom: var(--pf-t--global--box-shadow--Y--700);
6584
+ --pf-t--global--box-shadow--Y--lg--bottom: var(--pf-t--global--box-shadow--Y--800);
6561
6585
  --pf-t--global--box-shadow--Y--lg--default: var(--pf-t--global--box-shadow--Y--700);
6562
6586
  --pf-t--global--box-shadow--Y--lg--left: var(--pf-t--global--box-shadow--Y--400);
6563
6587
  --pf-t--global--box-shadow--Y--lg--right: var(--pf-t--global--box-shadow--Y--400);
6564
- --pf-t--global--box-shadow--Y--lg--top: var(--pf-t--global--box-shadow--Y--100);
6565
- --pf-t--global--box-shadow--Y--md--bottom: var(--pf-t--global--box-shadow--Y--600);
6588
+ --pf-t--global--box-shadow--Y--lg--top: var(--pf-t--global--box-shadow--Y--50);
6589
+ --pf-t--global--box-shadow--Y--md--bottom: var(--pf-t--global--box-shadow--Y--700);
6566
6590
  --pf-t--global--box-shadow--Y--md--default: var(--pf-t--global--box-shadow--Y--600);
6567
6591
  --pf-t--global--box-shadow--Y--md--left: var(--pf-t--global--box-shadow--Y--400);
6568
6592
  --pf-t--global--box-shadow--Y--md--right: var(--pf-t--global--box-shadow--Y--400);
6569
- --pf-t--global--box-shadow--Y--md--top: var(--pf-t--global--box-shadow--Y--200);
6570
- --pf-t--global--box-shadow--Y--sm--bottom: var(--pf-t--global--box-shadow--Y--500);
6593
+ --pf-t--global--box-shadow--Y--md--top: var(--pf-t--global--box-shadow--Y--100);
6594
+ --pf-t--global--box-shadow--Y--sm--bottom: var(--pf-t--global--box-shadow--Y--600);
6571
6595
  --pf-t--global--box-shadow--Y--sm--default: var(--pf-t--global--box-shadow--Y--500);
6572
6596
  --pf-t--global--box-shadow--Y--sm--left: var(--pf-t--global--box-shadow--Y--400);
6573
6597
  --pf-t--global--box-shadow--Y--sm--right: var(--pf-t--global--box-shadow--Y--400);
6574
- --pf-t--global--box-shadow--Y--sm--top: var(--pf-t--global--box-shadow--Y--300);
6598
+ --pf-t--global--box-shadow--Y--sm--top: var(--pf-t--global--box-shadow--Y--200);
6575
6599
  --pf-t--global--box-shadow--blur--lg: var(--pf-t--global--box-shadow--blur--300);
6576
6600
  --pf-t--global--box-shadow--blur--md: var(--pf-t--global--box-shadow--blur--200);
6577
6601
  --pf-t--global--box-shadow--blur--sm: var(--pf-t--global--box-shadow--blur--100);
6578
- --pf-t--global--box-shadow--color--lg: var(--pf-t--global--box-shadow--color--200);
6579
- --pf-t--global--box-shadow--color--md: var(--pf-t--global--box-shadow--color--200);
6580
- --pf-t--global--box-shadow--color--sm: var(--pf-t--global--box-shadow--color--100);
6581
- --pf-t--global--box-shadow--spread--lg: var(--pf-t--global--box-shadow--spread--100);
6582
- --pf-t--global--box-shadow--spread--md: var(--pf-t--global--box-shadow--spread--100);
6583
- --pf-t--global--box-shadow--spread--sm: var(--pf-t--global--box-shadow--spread--100);
6602
+ --pf-t--global--box-shadow--color--lg--default: var(--pf-t--global--box-shadow--color--100);
6603
+ --pf-t--global--box-shadow--color--lg--directional: var(--pf-t--global--box-shadow--color--200);
6604
+ --pf-t--global--box-shadow--color--md--default: var(--pf-t--global--box-shadow--color--100);
6605
+ --pf-t--global--box-shadow--color--md--directional: var(--pf-t--global--box-shadow--color--100);
6606
+ --pf-t--global--box-shadow--color--sm--default: var(--pf-t--global--box-shadow--color--100);
6607
+ --pf-t--global--box-shadow--color--sm--directional: var(--pf-t--global--box-shadow--color--200);
6608
+ --pf-t--global--box-shadow--spread--lg--default: var(--pf-t--global--box-shadow--spread--100);
6609
+ --pf-t--global--box-shadow--spread--lg--directional: var(--pf-t--global--box-shadow--spread--400);
6610
+ --pf-t--global--box-shadow--spread--md--default: var(--pf-t--global--box-shadow--spread--100);
6611
+ --pf-t--global--box-shadow--spread--md--directional: var(--pf-t--global--box-shadow--spread--300);
6612
+ --pf-t--global--box-shadow--spread--sm--default: var(--pf-t--global--box-shadow--spread--100);
6613
+ --pf-t--global--box-shadow--spread--sm--directional: var(--pf-t--global--box-shadow--spread--200);
6584
6614
  --pf-t--global--breakpoint--2xl: var(--pf-t--global--breakpoint--600);
6585
6615
  --pf-t--global--breakpoint--height--2xl: var(--pf-t--global--breakpoint--550);
6586
6616
  --pf-t--global--breakpoint--height--lg: var(--pf-t--global--breakpoint--300);
@@ -6727,7 +6757,9 @@ button) {
6727
6757
  --pf-t--global--background--color--floating--hover: var(--pf-t--global--background--color--200);
6728
6758
  --pf-t--global--background--color--highlight--clicked: var(--pf-t--global--background--color--highlight--200);
6729
6759
  --pf-t--global--background--color--highlight--default: var(--pf-t--global--background--color--highlight--100);
6760
+ --pf-t--global--background--color--inverse--clicked: var(--pf-t--global--background--color--450);
6730
6761
  --pf-t--global--background--color--inverse--default: var(--pf-t--global--background--color--400);
6762
+ --pf-t--global--background--color--inverse--hover: var(--pf-t--global--background--color--450);
6731
6763
  --pf-t--global--background--color--primary--clicked: var(--pf-t--global--background--color--200);
6732
6764
  --pf-t--global--background--color--primary--default: var(--pf-t--global--background--color--100);
6733
6765
  --pf-t--global--background--color--primary--hover: var(--pf-t--global--background--color--200);
@@ -7089,92 +7121,92 @@ button) {
7089
7121
  var(--pf-t--global--box-shadow--X--sm--default)
7090
7122
  var(--pf-t--global--box-shadow--Y--sm--default)
7091
7123
  var(--pf-t--global--box-shadow--blur--sm)
7092
- var(--pf-t--global--box-shadow--spread--sm)
7093
- var(--pf-t--global--box-shadow--color--sm);
7124
+ var(--pf-t--global--box-shadow--spread--sm--default)
7125
+ var(--pf-t--global--box-shadow--color--sm--default);
7094
7126
  --pf-t--global--box-shadow--sm--top:
7095
7127
  var(--pf-t--global--box-shadow--X--sm--top)
7096
7128
  var(--pf-t--global--box-shadow--Y--sm--top)
7097
7129
  var(--pf-t--global--box-shadow--blur--sm)
7098
- var(--pf-t--global--box-shadow--spread--sm)
7099
- var(--pf-t--global--box-shadow--color--sm);
7130
+ var(--pf-t--global--box-shadow--spread--sm--directional)
7131
+ var(--pf-t--global--box-shadow--color--sm--directional);
7100
7132
  --pf-t--global--box-shadow--sm--bottom:
7101
7133
  var(--pf-t--global--box-shadow--X--sm--bottom)
7102
7134
  var(--pf-t--global--box-shadow--Y--sm--bottom)
7103
7135
  var(--pf-t--global--box-shadow--blur--sm)
7104
- var(--pf-t--global--box-shadow--spread--sm)
7105
- var(--pf-t--global--box-shadow--color--sm);
7136
+ var(--pf-t--global--box-shadow--spread--sm--directional)
7137
+ var(--pf-t--global--box-shadow--color--sm--directional);
7106
7138
  --pf-t--global--box-shadow--sm--left:
7107
7139
  var(--pf-t--global--box-shadow--X--sm--left)
7108
7140
  var(--pf-t--global--box-shadow--Y--sm--left)
7109
7141
  var(--pf-t--global--box-shadow--blur--sm)
7110
- var(--pf-t--global--box-shadow--spread--sm)
7111
- var(--pf-t--global--box-shadow--color--sm);
7142
+ var(--pf-t--global--box-shadow--spread--sm--directional)
7143
+ var(--pf-t--global--box-shadow--color--sm--directional);
7112
7144
  --pf-t--global--box-shadow--sm--right:
7113
7145
  var(--pf-t--global--box-shadow--X--sm--right)
7114
7146
  var(--pf-t--global--box-shadow--Y--sm--right)
7115
7147
  var(--pf-t--global--box-shadow--blur--sm)
7116
- var(--pf-t--global--box-shadow--spread--sm)
7117
- var(--pf-t--global--box-shadow--color--sm);
7148
+ var(--pf-t--global--box-shadow--spread--sm--directional)
7149
+ var(--pf-t--global--box-shadow--color--sm--directional);
7118
7150
  --pf-t--global--box-shadow--md:
7119
7151
  var(--pf-t--global--box-shadow--X--md--default)
7120
7152
  var(--pf-t--global--box-shadow--Y--md--default)
7121
7153
  var(--pf-t--global--box-shadow--blur--md)
7122
- var(--pf-t--global--box-shadow--spread--md)
7123
- var(--pf-t--global--box-shadow--color--md);
7154
+ var(--pf-t--global--box-shadow--spread--md--default)
7155
+ var(--pf-t--global--box-shadow--color--md--default);
7124
7156
  --pf-t--global--box-shadow--md--top:
7125
7157
  var(--pf-t--global--box-shadow--X--md--top)
7126
7158
  var(--pf-t--global--box-shadow--Y--md--top)
7127
7159
  var(--pf-t--global--box-shadow--blur--md)
7128
- var(--pf-t--global--box-shadow--spread--md)
7129
- var(--pf-t--global--box-shadow--color--md);
7160
+ var(--pf-t--global--box-shadow--spread--md--directional)
7161
+ var(--pf-t--global--box-shadow--color--md--directional);
7130
7162
  --pf-t--global--box-shadow--md--bottom:
7131
7163
  var(--pf-t--global--box-shadow--X--md--bottom)
7132
7164
  var(--pf-t--global--box-shadow--Y--md--bottom)
7133
7165
  var(--pf-t--global--box-shadow--blur--md)
7134
- var(--pf-t--global--box-shadow--spread--md)
7135
- var(--pf-t--global--box-shadow--color--md);
7166
+ var(--pf-t--global--box-shadow--spread--md--directional)
7167
+ var(--pf-t--global--box-shadow--color--md--directional);
7136
7168
  --pf-t--global--box-shadow--md--left:
7137
7169
  var(--pf-t--global--box-shadow--X--md--left)
7138
7170
  var(--pf-t--global--box-shadow--Y--md--left)
7139
7171
  var(--pf-t--global--box-shadow--blur--md)
7140
- var(--pf-t--global--box-shadow--spread--md)
7141
- var(--pf-t--global--box-shadow--color--md);
7172
+ var(--pf-t--global--box-shadow--spread--md--directional)
7173
+ var(--pf-t--global--box-shadow--color--md--directional);
7142
7174
  --pf-t--global--box-shadow--md--right:
7143
7175
  var(--pf-t--global--box-shadow--X--md--right)
7144
7176
  var(--pf-t--global--box-shadow--Y--md--right)
7145
7177
  var(--pf-t--global--box-shadow--blur--md)
7146
- var(--pf-t--global--box-shadow--spread--md)
7147
- var(--pf-t--global--box-shadow--color--md);
7178
+ var(--pf-t--global--box-shadow--spread--md--directional)
7179
+ var(--pf-t--global--box-shadow--color--md--directional);
7148
7180
  --pf-t--global--box-shadow--lg:
7149
7181
  var(--pf-t--global--box-shadow--X--lg--default)
7150
7182
  var(--pf-t--global--box-shadow--Y--lg--default)
7151
7183
  var(--pf-t--global--box-shadow--blur--lg)
7152
- var(--pf-t--global--box-shadow--spread--lg)
7153
- var(--pf-t--global--box-shadow--color--lg);
7184
+ var(--pf-t--global--box-shadow--spread--lg--default)
7185
+ var(--pf-t--global--box-shadow--color--lg--default);
7154
7186
  --pf-t--global--box-shadow--lg--top:
7155
7187
  var(--pf-t--global--box-shadow--X--lg--top)
7156
7188
  var(--pf-t--global--box-shadow--Y--lg--top)
7157
7189
  var(--pf-t--global--box-shadow--blur--lg)
7158
- var(--pf-t--global--box-shadow--spread--lg)
7159
- var(--pf-t--global--box-shadow--color--lg);
7190
+ var(--pf-t--global--box-shadow--spread--lg--directional)
7191
+ var(--pf-t--global--box-shadow--color--lg--directional);
7160
7192
  --pf-t--global--box-shadow--lg--bottom:
7161
7193
  var(--pf-t--global--box-shadow--X--lg--bottom)
7162
7194
  var(--pf-t--global--box-shadow--Y--lg--bottom)
7163
7195
  var(--pf-t--global--box-shadow--blur--lg)
7164
- var(--pf-t--global--box-shadow--spread--lg)
7165
- var(--pf-t--global--box-shadow--color--lg);
7196
+ var(--pf-t--global--box-shadow--spread--lg--directional)
7197
+ var(--pf-t--global--box-shadow--color--lg--directional);
7166
7198
  --pf-t--global--box-shadow--lg--left:
7167
7199
  var(--pf-t--global--box-shadow--X--lg--left)
7168
7200
  var(--pf-t--global--box-shadow--Y--lg--left)
7169
7201
  var(--pf-t--global--box-shadow--blur--lg)
7170
- var(--pf-t--global--box-shadow--spread--lg)
7171
- var(--pf-t--global--box-shadow--color--lg);
7202
+ var(--pf-t--global--box-shadow--spread--lg--directional)
7203
+ var(--pf-t--global--box-shadow--color--lg--directional);
7172
7204
  --pf-t--global--box-shadow--lg--right:
7173
7205
  var(--pf-t--global--box-shadow--X--lg--right)
7174
7206
  var(--pf-t--global--box-shadow--Y--lg--right)
7175
7207
  var(--pf-t--global--box-shadow--blur--lg)
7176
- var(--pf-t--global--box-shadow--spread--lg)
7177
- var(--pf-t--global--box-shadow--color--lg);
7208
+ var(--pf-t--global--box-shadow--spread--lg--directional)
7209
+ var(--pf-t--global--box-shadow--color--lg--directional);
7178
7210
  --pf-t--global--list-style: disc outside;
7179
7211
  --pf-t--temp--dev--tbd: #BC11E0;
7180
7212
  }
@@ -7184,16 +7216,22 @@ button) {
7184
7216
  --pf-t--global--dark--background--color--500: rgba(21, 21, 21, 0.8000);
7185
7217
  --pf-t--global--dark--background--color--600: rgba(199, 199, 199, 0.1500);
7186
7218
  --pf-t--global--dark--box-shadow--color--100: rgba(0, 0, 0, 0.5000);
7219
+ --pf-t--global--dark--box-shadow--color--200: rgba(0, 0, 0, 0.7000);
7187
7220
  --pf-t--global--background--color--action--plain--clicked: var(--pf-t--global--dark--background--color--600);
7188
7221
  --pf-t--global--background--color--action--plain--hover: var(--pf-t--global--dark--background--color--600);
7189
7222
  --pf-t--global--background--color--backdrop--default: var(--pf-t--global--dark--background--color--500);
7190
- --pf-t--global--box-shadow--color--lg: var(--pf-t--global--dark--box-shadow--color--100);
7191
- --pf-t--global--box-shadow--color--md: var(--pf-t--global--dark--box-shadow--color--100);
7192
- --pf-t--global--box-shadow--color--sm: var(--pf-t--global--dark--box-shadow--color--100);
7223
+ --pf-t--global--background--color--tertiary--default: var(--pf-t--global--dark--background--color--600);
7224
+ --pf-t--global--box-shadow--color--lg--default: var(--pf-t--global--dark--box-shadow--color--100);
7225
+ --pf-t--global--box-shadow--color--lg--directional: var(--pf-t--global--dark--box-shadow--color--200);
7226
+ --pf-t--global--box-shadow--color--md--default: var(--pf-t--global--dark--box-shadow--color--100);
7227
+ --pf-t--global--box-shadow--color--md--directional: var(--pf-t--global--dark--box-shadow--color--200);
7228
+ --pf-t--global--box-shadow--color--sm--default: var(--pf-t--global--dark--box-shadow--color--100);
7229
+ --pf-t--global--box-shadow--color--sm--directional: var(--pf-t--global--dark--box-shadow--color--200);
7193
7230
  --pf-t--global--dark--background--color--100: var(--pf-t--color--gray--95);
7194
7231
  --pf-t--global--dark--background--color--200: var(--pf-t--color--gray--80);
7195
7232
  --pf-t--global--dark--background--color--300: var(--pf-t--color--gray--70);
7196
7233
  --pf-t--global--dark--background--color--400: var(--pf-t--color--gray--10);
7234
+ --pf-t--global--dark--background--color--450: var(--pf-t--color--gray--20);
7197
7235
  --pf-t--global--dark--background--color--highlight--100: var(--pf-t--color--yellow--20);
7198
7236
  --pf-t--global--dark--background--color--highlight--200: var(--pf-t--color--yellow--30);
7199
7237
  --pf-t--global--dark--border--color--100: var(--pf-t--color--gray--50);
@@ -7272,7 +7310,9 @@ button) {
7272
7310
  --pf-t--global--background--color--floating--hover: var(--pf-t--global--dark--background--color--200);
7273
7311
  --pf-t--global--background--color--highlight--clicked: var(--pf-t--global--dark--background--color--highlight--200);
7274
7312
  --pf-t--global--background--color--highlight--default: var(--pf-t--global--dark--background--color--highlight--100);
7313
+ --pf-t--global--background--color--inverse--clicked: var(--pf-t--global--dark--background--color--450);
7275
7314
  --pf-t--global--background--color--inverse--default: var(--pf-t--global--dark--background--color--400);
7315
+ --pf-t--global--background--color--inverse--hover: var(--pf-t--global--dark--background--color--450);
7276
7316
  --pf-t--global--background--color--primary--clicked: var(--pf-t--global--dark--background--color--300);
7277
7317
  --pf-t--global--background--color--primary--default: var(--pf-t--global--dark--background--color--200);
7278
7318
  --pf-t--global--background--color--primary--hover: var(--pf-t--global--dark--background--color--300);
package/patternfly-charts.css CHANGED
@@ -545,10 +545,10 @@
545
545
  --pf-v6-chart-stack--data--stroke--Width: var(--pf-v6-chart-global--stroke--Width--xs);
546
546
  --pf-v6-chart-threshold--stroke-dash-array: 4,2;
547
547
  --pf-v6-chart-threshold--stroke--Width: 1.5;
548
- --pf-v6-chart-tooltip--corner-radius: 0;
548
+ --pf-v6-chart-tooltip--corner-radius: 6;
549
549
  --pf-v6-chart-tooltip--pointer-length: 10;
550
550
  --pf-v6-chart-tooltip--Fill: var(--pf-v6-chart-global--Fill--Color--200);
551
- --pf-v6-chart-tooltip--flyoutStyle--corner-radius: 0;
551
+ --pf-v6-chart-tooltip--flyoutStyle--corner-radius: 6;
552
552
  --pf-v6-chart-tooltip--flyoutStyle--stroke--Width: 0;
553
553
  --pf-v6-chart-tooltip--flyoutStyle--PointerEvents: none;
554
554
  --pf-v6-chart-tooltip--flyoutStyle--stroke--Color: var(--pf-v6-chart-global--Fill--Color--900);
package/patternfly-charts.scss CHANGED
@@ -293,10 +293,10 @@ $chart: #{$pf-prefix} + 'chart';
293
293
  --#{$chart}-threshold--stroke--Width: 1.5;
294
294
 
295
295
  // Tooltip
296
- --#{$chart}-tooltip--corner-radius: 0;
296
+ --#{$chart}-tooltip--corner-radius: 6;
297
297
  --#{$chart}-tooltip--pointer-length: 10;
298
298
  --#{$chart}-tooltip--Fill: var(--#{$chart}-global--Fill--Color--200);
299
- --#{$chart}-tooltip--flyoutStyle--corner-radius: 0;
299
+ --#{$chart}-tooltip--flyoutStyle--corner-radius: 6;
300
300
  --#{$chart}-tooltip--flyoutStyle--stroke--Width: 0;
301
301
  --#{$chart}-tooltip--flyoutStyle--PointerEvents: none;
302
302
  --#{$chart}-tooltip--flyoutStyle--stroke--Color: var(--#{$chart}-global--Fill--Color--900);