@patternfly/patternfly 6.0.0-alpha.82 → 6.0.0-alpha.84

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 (59) hide show
  1. package/components/Breadcrumb/breadcrumb.css +9 -1
  2. package/components/Breadcrumb/breadcrumb.scss +10 -3
  3. package/components/Button/button.css +1 -1
  4. package/components/Button/button.scss +1 -1
  5. package/components/Menu/menu.css +388 -419
  6. package/components/Menu/menu.scss +369 -529
  7. package/components/MenuToggle/menu-toggle.css +229 -265
  8. package/components/MenuToggle/menu-toggle.scss +330 -370
  9. package/components/TextInputGroup/text-input-group.css +0 -14
  10. package/components/TextInputGroup/text-input-group.scss +3 -16
  11. package/docs/components/Button/examples/Button.md +134 -134
  12. package/docs/components/CalendarMonth/examples/CalendarMonth.md +4 -4
  13. package/docs/components/Card/examples/Card.md +8 -8
  14. package/docs/components/DualListSelector/examples/DualListSelector.md +2 -2
  15. package/docs/components/Form/examples/Form.md +11 -11
  16. package/docs/components/Label/examples/Label.md +157 -157
  17. package/docs/components/LogViewer/examples/LogViewer.md +110 -110
  18. package/docs/components/Menu/examples/Menu.css +7 -11
  19. package/docs/components/Menu/examples/Menu.md +637 -944
  20. package/docs/components/MenuToggle/examples/MenuToggle.md +88 -51
  21. package/docs/components/Nav/examples/Navigation.md +113 -140
  22. package/docs/components/Tabs/examples/Tabs.md +24 -24
  23. package/docs/components/TextInputGroup/examples/TextInputGroup.md +9 -9
  24. package/docs/components/Toolbar/examples/Toolbar.md +28 -28
  25. package/docs/demos/AboutModal/examples/AboutModal.md +2 -2
  26. package/docs/demos/Alert/examples/Alert.md +6 -6
  27. package/docs/demos/BackToTop/examples/BackToTop.md +2 -2
  28. package/docs/demos/Banner/examples/Banner.md +4 -4
  29. package/docs/demos/Button/examples/Button.md +1 -1
  30. package/docs/demos/CardView/examples/CardView.md +3 -3
  31. package/docs/demos/ContextSelector/examples/ContextSelector.md +7 -7
  32. package/docs/demos/Dashboard/examples/Dashboard.md +2 -2
  33. package/docs/demos/DataList/examples/DataList.md +13 -13
  34. package/docs/demos/DescriptionList/examples/DescriptionList.md +6 -6
  35. package/docs/demos/Drawer/examples/Drawer.md +10 -10
  36. package/docs/demos/Form/examples/BasicForms.md +12 -12
  37. package/docs/demos/JumpLinks/examples/JumpLinks.md +12 -12
  38. package/docs/demos/Masthead/examples/Masthead.md +9 -9
  39. package/docs/demos/Modal/examples/Modal.md +15 -15
  40. package/docs/demos/Nav/examples/Nav.md +12 -12
  41. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +10 -10
  42. package/docs/demos/Page/examples/Page.md +18 -18
  43. package/docs/demos/Page/examples/Penta.md +4 -4
  44. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +11 -11
  45. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +4 -4
  46. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +18 -18
  47. package/docs/demos/Skeleton/examples/Skeleton.md +2 -2
  48. package/docs/demos/Table/examples/Table.md +54 -54
  49. package/docs/demos/Tabs/examples/Tabs.md +12 -12
  50. package/docs/demos/Toolbar/examples/Toolbar.md +27 -27
  51. package/docs/demos/Wizard/examples/Wizard.md +18 -18
  52. package/package.json +1 -1
  53. package/patternfly-no-globals.css +746 -711
  54. package/patternfly-theme-dark-unversioned.css +746 -711
  55. package/patternfly.css +746 -711
  56. package/patternfly.min.css +1 -1
  57. package/patternfly.min.css.map +1 -1
  58. package/components/MenuToggle/themes/dark/menu-toggle.scss +0 -27
  59. package/components/TextInputGroup/themes/dark/text-input-group.scss +0 -11
package/components/Breadcrumb/breadcrumb.css CHANGED
@@ -1,10 +1,13 @@
1
- :root, .pf-v5-c-breadcrumb {
1
+ :where(:root),
2
+ :where(.pf-v5-c-breadcrumb) {
2
3
  --pf-v5-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
3
4
  --pf-v5-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
4
5
  --pf-v5-c-breadcrumb__item--MarginRight: var(--pf-t--global--spacer--sm);
5
6
  --pf-v5-c-breadcrumb__item-divider--Color: var(--pf-t--global--icon--color--regular);
6
7
  --pf-v5-c-breadcrumb__item-divider--MarginRight: var(--pf-t--global--spacer--sm);
7
8
  --pf-v5-c-breadcrumb__item-divider--FontSize: var( --pf-t--global--font--size--body--sm);
9
+ --pf-v5-c-breadcrumb__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
10
+ --pf-v5-c-breadcrumb__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8
11
  --pf-v5-c-breadcrumb__link--Color: var(--pf-t--global--text--color--link--default);
9
12
  --pf-v5-c-breadcrumb__link--TextDecoration: var(--pf-t--global--link--text-decoration);
10
13
  --pf-v5-c-breadcrumb__link--hover--Color: var(--pf-t--global--text--color--link--hover);
@@ -38,6 +41,9 @@
38
41
  white-space: nowrap;
39
42
  list-style: none;
40
43
  }
44
+ .pf-v5-c-breadcrumb__item:first-child:has(.pf-v5-c-breadcrumb__link) {
45
+ --pf-v5-c-breadcrumb__link--PaddingInlineStart: 0;
46
+ }
41
47
  .pf-v5-c-breadcrumb__item:not(:last-child) {
42
48
  margin-inline-end: var(--pf-v5-c-breadcrumb__item--MarginRight);
43
49
  }
@@ -53,6 +59,8 @@
53
59
  }
54
60
 
55
61
  .pf-v5-c-breadcrumb__link {
62
+ padding-inline-start: var(--pf-v5-c-breadcrumb__link--PaddingInlineStart);
63
+ padding-inline-end: var(--pf-v5-c-breadcrumb__link--PaddingInlineEnd);
56
64
  font-size: inherit;
57
65
  font-weight: var(--pf-v5-c-breadcrumb__link--FontWeight);
58
66
  line-height: inherit;
package/components/Breadcrumb/breadcrumb.scss CHANGED
@@ -1,6 +1,5 @@
1
- // @debug $breadcrumb; // check your variable names located in src/patternfly/sass-utilities/component-namespaces.scss
2
-
3
- :root, .#{$breadcrumb} {
1
+ :where(:root),
2
+ :where(.#{$breadcrumb}) {
4
3
  // Breadcrumb item
5
4
  --#{$breadcrumb}__item--FontSize: var(--pf-t--global--font--size--body--sm);
6
5
  --#{$breadcrumb}__item--LineHeight: var(--pf-t--global--font--line-height--body);
@@ -12,6 +11,8 @@
12
11
  --#{$breadcrumb}__item-divider--FontSize: var( --pf-t--global--font--size--body--sm);
13
12
 
14
13
  // Breadcrumb link
14
+ --#{$breadcrumb}__link--PaddingInlineStart: var(--pf-t--global--spacer--sm); // use a mutable value for alignment control
15
+ --#{$breadcrumb}__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm); // use a mutable value for alignment control
15
16
  --#{$breadcrumb}__link--Color: var(--pf-t--global--text--color--link--default);
16
17
  --#{$breadcrumb}__link--TextDecoration: var(--pf-t--global--link--text-decoration);
17
18
  --#{$breadcrumb}__link--hover--Color: var(--pf-t--global--text--color--link--hover);
@@ -53,6 +54,10 @@
53
54
  white-space: nowrap; // Keeps the item-divider and __link text on the same line
54
55
  list-style: none;
55
56
 
57
+ &:first-child:has(.#{$breadcrumb}__link) {
58
+ --#{$breadcrumb}__link--PaddingInlineStart: 0; // remove padding from first child if link
59
+ }
60
+
56
61
  &:not(:last-child) {
57
62
  margin-inline-end: var(--#{$breadcrumb}__item--MarginRight);
58
63
  }
@@ -70,6 +75,8 @@
70
75
 
71
76
  // Breadcrumb link
72
77
  .#{$breadcrumb}__link {
78
+ padding-inline-start: var(--#{$breadcrumb}__link--PaddingInlineStart); // use a mutable value for alignment control
79
+ padding-inline-end: var(--#{$breadcrumb}__link--PaddingInlineEnd); // use a mutable value for alignment control
73
80
  font-size: inherit;
74
81
  font-weight: var(--#{$breadcrumb}__link--FontWeight);
75
82
  line-height: inherit;
package/components/Button/button.css CHANGED
@@ -90,7 +90,7 @@
90
90
  --pf-v5-c-button--m-link--m-inline--PaddingLeft: 0;
91
91
  --pf-v5-c-button--m-link--m-inline--hover--TextDecoration: var(--pf-t--global--link--text-decoration--hover);
92
92
  --pf-v5-c-button--m-link--m-inline--hover--MixBlendMode: normal;
93
- --pf-v5-c-button--m-link--m-inline--m-clicked--MixBlendMode: normal
93
+ --pf-v5-c-button--m-link--m-inline--m-clicked--MixBlendMode: normal;
94
94
  --pf-v5-c-button--m-link--m-inline__progress--Left: var(--pf-t--global--spacer--xs);
95
95
  --pf-v5-c-button--m-link--m-inline--m-in-progress--PaddingLeft: calc(var(--pf-v5-c-button--m-link--m-inline__progress--Left) + 1rem + var(--pf-t--global--spacer--sm));
96
96
  --pf-v5-c-button--m-link--m-inline--disabled--Color: var(--pf-t--global--text--color--disabled);
package/components/Button/button.scss CHANGED
@@ -106,7 +106,7 @@
106
106
  --#{$button}--m-link--m-inline--PaddingLeft: 0;
107
107
  --#{$button}--m-link--m-inline--hover--TextDecoration: var(--pf-t--global--link--text-decoration--hover);
108
108
  --#{$button}--m-link--m-inline--hover--MixBlendMode: normal;
109
- --#{$button}--m-link--m-inline--m-clicked--MixBlendMode: normal
109
+ --#{$button}--m-link--m-inline--m-clicked--MixBlendMode: normal;
110
110
  --#{$button}--m-link--m-inline__progress--Left: var(--pf-t--global--spacer--xs);
111
111
  --#{$button}--m-link--m-inline--m-in-progress--PaddingLeft: calc(var(--#{$button}--m-link--m-inline__progress--Left) + 1rem + var(--pf-t--global--spacer--sm));
112
112
  --#{$button}--m-link--m-inline--disabled--Color: var(--pf-t--global--text--color--disabled);