@patternfly/patternfly 6.0.0-alpha.97 → 6.0.0-alpha.98

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 (34) hide show
  1. package/components/MenuToggle/menu-toggle.css +20 -6
  2. package/components/MenuToggle/menu-toggle.scss +32 -6
  3. package/docs/components/LogViewer/examples/LogViewer.md +130 -10
  4. package/docs/components/MenuToggle/examples/MenuToggle.md +162 -6
  5. package/docs/components/Toolbar/examples/Toolbar.md +143 -11
  6. package/docs/demos/AboutModal/examples/AboutModal.md +52 -4
  7. package/docs/demos/Alert/examples/Alert.md +156 -12
  8. package/docs/demos/BackToTop/examples/BackToTop.md +52 -4
  9. package/docs/demos/Banner/examples/Banner.md +104 -8
  10. package/docs/demos/CardView/examples/CardView.md +65 -5
  11. package/docs/demos/ContextSelector/examples/ContextSelector.md +156 -12
  12. package/docs/demos/Dashboard/examples/Dashboard.md +52 -4
  13. package/docs/demos/DataList/examples/DataList.md +273 -21
  14. package/docs/demos/DescriptionList/examples/DescriptionList.md +156 -12
  15. package/docs/demos/Drawer/examples/Drawer.md +260 -20
  16. package/docs/demos/JumpLinks/examples/JumpLinks.md +312 -24
  17. package/docs/demos/Masthead/examples/Masthead.md +247 -19
  18. package/docs/demos/Modal/examples/Modal.md +312 -24
  19. package/docs/demos/Nav/examples/Nav.md +312 -24
  20. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +260 -20
  21. package/docs/demos/Page/examples/Page.md +468 -36
  22. package/docs/demos/Page/examples/Penta.md +13 -1
  23. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +455 -35
  24. package/docs/demos/Skeleton/examples/Skeleton.md +52 -4
  25. package/docs/demos/Table/examples/Table.md +1094 -86
  26. package/docs/demos/Tabs/examples/Tabs.md +325 -25
  27. package/docs/demos/Toolbar/examples/Toolbar.md +325 -25
  28. package/docs/demos/Wizard/examples/Wizard.md +468 -36
  29. package/package.json +1 -1
  30. package/patternfly-no-globals.css +20 -6
  31. package/patternfly-theme-dark-unversioned.css +20 -6
  32. package/patternfly.css +20 -6
  33. package/patternfly.min.css +1 -1
  34. 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.97",
4
+ "version": "6.0.0-alpha.98",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
@@ -20332,6 +20332,8 @@ ul.pf-v6-c-list {
20332
20332
  --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
20333
20333
  --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
20334
20334
  --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
20335
+ --pf-v6-c-menu-toggle__icon--Height: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
20336
+ --pf-v6-c-menu-toggle__toggle-icon--Height: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
20335
20337
  --pf-v6-c-menu-toggle--m-button--PaddingLeft: var(--pf-t--global--spacer--md);
20336
20338
  --pf-v6-c-menu-toggle--m-button--PaddingRight: var(--pf-t--global--spacer--md);
20337
20339
  --pf-v6-c-menu-toggle--m-button--BorderRadius: var(--pf-t--global--border--radius--pill);
@@ -20406,6 +20408,8 @@ ul.pf-v6-c-list {
20406
20408
  --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
20407
20409
  --pf-v6-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-t--global--spacer--sm);
20408
20410
  --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
20411
+ --pf-v6-c-menu-toggle--m-small--PaddingTop: var(--pf-t--global--spacer--xs);
20412
+ --pf-v6-c-menu-toggle--m-small--PaddingBottom: var(--pf-t--global--spacer--xs);
20409
20413
  }
20410
20414
 
20411
20415
  .pf-v6-c-menu-toggle {
@@ -20533,6 +20537,10 @@ ul.pf-v6-c-list {
20533
20537
  .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
20534
20538
  border: 0;
20535
20539
  }
20540
+ .pf-v6-c-menu-toggle.pf-m-small {
20541
+ --pf-v6-c-menu-toggle--PaddingTop: var(--pf-v6-c-menu-toggle--m-small--PaddingTop);
20542
+ --pf-v6-c-menu-toggle--PaddingBottom: var(--pf-v6-c-menu-toggle--m-small--PaddingBottom);
20543
+ }
20536
20544
  .pf-v6-c-menu-toggle:has(.pf-v6-c-button) {
20537
20545
  background-color: transparent;
20538
20546
  }
@@ -20643,11 +20651,6 @@ ul.pf-v6-c-list {
20643
20651
  padding-inline-start: 0;
20644
20652
  }
20645
20653
 
20646
- .pf-v6-c-menu-toggle__icon {
20647
- flex-shrink: 0;
20648
- align-self: center;
20649
- }
20650
-
20651
20654
  .pf-v6-c-menu-toggle__text {
20652
20655
  overflow: hidden;
20653
20656
  text-overflow: ellipsis;
@@ -20660,15 +20663,26 @@ ul.pf-v6-c-list {
20660
20663
  flex-wrap: nowrap;
20661
20664
  }
20662
20665
 
20663
- .pf-v6-c-menu-toggle__controls {
20666
+ .pf-v6-c-menu-toggle__icon,
20667
+ .pf-v6-c-menu-toggle__controls,
20668
+ .pf-v6-c-menu-toggle__toggle-icon {
20664
20669
  display: flex;
20665
20670
  align-items: center;
20666
20671
  justify-content: center;
20672
+ }
20673
+
20674
+ .pf-v6-c-menu-toggle__icon {
20675
+ flex-shrink: 0;
20676
+ height: var(--pf-v6-c-menu-toggle__icon--Height);
20677
+ }
20678
+
20679
+ .pf-v6-c-menu-toggle__controls {
20667
20680
  min-width: var(--pf-v6-c-menu-toggle__controls--MinWidth);
20668
20681
  margin-inline-start: auto;
20669
20682
  }
20670
20683
 
20671
20684
  .pf-v6-c-menu-toggle__toggle-icon {
20685
+ height: var(--pf-v6-c-menu-toggle__toggle-icon--Height);
20672
20686
  color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
20673
20687
  }
20674
20688
 
@@ -20449,6 +20449,8 @@ ul.pf-v6-c-list {
20449
20449
  --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
20450
20450
  --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
20451
20451
  --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
20452
+ --pf-v6-c-menu-toggle__icon--Height: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
20453
+ --pf-v6-c-menu-toggle__toggle-icon--Height: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
20452
20454
  --pf-v6-c-menu-toggle--m-button--PaddingLeft: var(--pf-t--global--spacer--md);
20453
20455
  --pf-v6-c-menu-toggle--m-button--PaddingRight: var(--pf-t--global--spacer--md);
20454
20456
  --pf-v6-c-menu-toggle--m-button--BorderRadius: var(--pf-t--global--border--radius--pill);
@@ -20523,6 +20525,8 @@ ul.pf-v6-c-list {
20523
20525
  --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
20524
20526
  --pf-v6-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-t--global--spacer--sm);
20525
20527
  --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
20528
+ --pf-v6-c-menu-toggle--m-small--PaddingTop: var(--pf-t--global--spacer--xs);
20529
+ --pf-v6-c-menu-toggle--m-small--PaddingBottom: var(--pf-t--global--spacer--xs);
20526
20530
  }
20527
20531
 
20528
20532
  .pf-v6-c-menu-toggle {
@@ -20650,6 +20654,10 @@ ul.pf-v6-c-list {
20650
20654
  .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
20651
20655
  border: 0;
20652
20656
  }
20657
+ .pf-v6-c-menu-toggle.pf-m-small {
20658
+ --pf-v6-c-menu-toggle--PaddingTop: var(--pf-v6-c-menu-toggle--m-small--PaddingTop);
20659
+ --pf-v6-c-menu-toggle--PaddingBottom: var(--pf-v6-c-menu-toggle--m-small--PaddingBottom);
20660
+ }
20653
20661
  .pf-v6-c-menu-toggle:has(.pf-v6-c-button) {
20654
20662
  background-color: transparent;
20655
20663
  }
@@ -20760,11 +20768,6 @@ ul.pf-v6-c-list {
20760
20768
  padding-inline-start: 0;
20761
20769
  }
20762
20770
 
20763
- .pf-v6-c-menu-toggle__icon {
20764
- flex-shrink: 0;
20765
- align-self: center;
20766
- }
20767
-
20768
20771
  .pf-v6-c-menu-toggle__text {
20769
20772
  overflow: hidden;
20770
20773
  text-overflow: ellipsis;
@@ -20777,15 +20780,26 @@ ul.pf-v6-c-list {
20777
20780
  flex-wrap: nowrap;
20778
20781
  }
20779
20782
 
20780
- .pf-v6-c-menu-toggle__controls {
20783
+ .pf-v6-c-menu-toggle__icon,
20784
+ .pf-v6-c-menu-toggle__controls,
20785
+ .pf-v6-c-menu-toggle__toggle-icon {
20781
20786
  display: flex;
20782
20787
  align-items: center;
20783
20788
  justify-content: center;
20789
+ }
20790
+
20791
+ .pf-v6-c-menu-toggle__icon {
20792
+ flex-shrink: 0;
20793
+ height: var(--pf-v6-c-menu-toggle__icon--Height);
20794
+ }
20795
+
20796
+ .pf-v6-c-menu-toggle__controls {
20784
20797
  min-width: var(--pf-v6-c-menu-toggle__controls--MinWidth);
20785
20798
  margin-inline-start: auto;
20786
20799
  }
20787
20800
 
20788
20801
  .pf-v6-c-menu-toggle__toggle-icon {
20802
+ height: var(--pf-v6-c-menu-toggle__toggle-icon--Height);
20789
20803
  color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
20790
20804
  }
20791
20805
 
package/patternfly.css CHANGED
@@ -20449,6 +20449,8 @@ ul.pf-v6-c-list {
20449
20449
  --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
20450
20450
  --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
20451
20451
  --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
20452
+ --pf-v6-c-menu-toggle__icon--Height: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
20453
+ --pf-v6-c-menu-toggle__toggle-icon--Height: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
20452
20454
  --pf-v6-c-menu-toggle--m-button--PaddingLeft: var(--pf-t--global--spacer--md);
20453
20455
  --pf-v6-c-menu-toggle--m-button--PaddingRight: var(--pf-t--global--spacer--md);
20454
20456
  --pf-v6-c-menu-toggle--m-button--BorderRadius: var(--pf-t--global--border--radius--pill);
@@ -20523,6 +20525,8 @@ ul.pf-v6-c-list {
20523
20525
  --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
20524
20526
  --pf-v6-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-t--global--spacer--sm);
20525
20527
  --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
20528
+ --pf-v6-c-menu-toggle--m-small--PaddingTop: var(--pf-t--global--spacer--xs);
20529
+ --pf-v6-c-menu-toggle--m-small--PaddingBottom: var(--pf-t--global--spacer--xs);
20526
20530
  }
20527
20531
 
20528
20532
  .pf-v6-c-menu-toggle {
@@ -20650,6 +20654,10 @@ ul.pf-v6-c-list {
20650
20654
  .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
20651
20655
  border: 0;
20652
20656
  }
20657
+ .pf-v6-c-menu-toggle.pf-m-small {
20658
+ --pf-v6-c-menu-toggle--PaddingTop: var(--pf-v6-c-menu-toggle--m-small--PaddingTop);
20659
+ --pf-v6-c-menu-toggle--PaddingBottom: var(--pf-v6-c-menu-toggle--m-small--PaddingBottom);
20660
+ }
20653
20661
  .pf-v6-c-menu-toggle:has(.pf-v6-c-button) {
20654
20662
  background-color: transparent;
20655
20663
  }
@@ -20760,11 +20768,6 @@ ul.pf-v6-c-list {
20760
20768
  padding-inline-start: 0;
20761
20769
  }
20762
20770
 
20763
- .pf-v6-c-menu-toggle__icon {
20764
- flex-shrink: 0;
20765
- align-self: center;
20766
- }
20767
-
20768
20771
  .pf-v6-c-menu-toggle__text {
20769
20772
  overflow: hidden;
20770
20773
  text-overflow: ellipsis;
@@ -20777,15 +20780,26 @@ ul.pf-v6-c-list {
20777
20780
  flex-wrap: nowrap;
20778
20781
  }
20779
20782
 
20780
- .pf-v6-c-menu-toggle__controls {
20783
+ .pf-v6-c-menu-toggle__icon,
20784
+ .pf-v6-c-menu-toggle__controls,
20785
+ .pf-v6-c-menu-toggle__toggle-icon {
20781
20786
  display: flex;
20782
20787
  align-items: center;
20783
20788
  justify-content: center;
20789
+ }
20790
+
20791
+ .pf-v6-c-menu-toggle__icon {
20792
+ flex-shrink: 0;
20793
+ height: var(--pf-v6-c-menu-toggle__icon--Height);
20794
+ }
20795
+
20796
+ .pf-v6-c-menu-toggle__controls {
20784
20797
  min-width: var(--pf-v6-c-menu-toggle__controls--MinWidth);
20785
20798
  margin-inline-start: auto;
20786
20799
  }
20787
20800
 
20788
20801
  .pf-v6-c-menu-toggle__toggle-icon {
20802
+ height: var(--pf-v6-c-menu-toggle__toggle-icon--Height);
20789
20803
  color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
20790
20804
  }
20791
20805