@patternfly/patternfly 5.4.0-prerelease.2 → 5.4.0-prerelease.4

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.
@@ -5,10 +5,10 @@ section: utility-classes
5
5
 
6
6
  ## Examples
7
7
 
8
- ### Inline block
8
+ ### Inline
9
9
 
10
10
  ```html
11
- <div class="pf-v5-u-display-inline-block">.pf-v5-u-display-inline-block</div>
11
+ <div class="pf-v5-u-display-inline">.pf-v5-u-display-inline</div>
12
12
 
13
13
  ```
14
14
 
@@ -19,6 +19,13 @@ section: utility-classes
19
19
 
20
20
  ```
21
21
 
22
+ ### Inline block
23
+
24
+ ```html
25
+ <div class="pf-v5-u-display-inline-block">.pf-v5-u-display-inline-block</div>
26
+
27
+ ```
28
+
22
29
  ### Flex
23
30
 
24
31
  ```html
@@ -40,14 +47,14 @@ section: utility-classes
40
47
 
41
48
  ```
42
49
 
43
- ### Inline
50
+ ### Inline grid
44
51
 
45
52
  ```html
46
- <div class="pf-v5-u-display-inline">.pf-v5-u-display-inline</div>
53
+ <div class="pf-v5-u-display-inline-grid">.pf-v5-u-display-inline-grid</div>
47
54
 
48
55
  ```
49
56
 
50
- ### Table
57
+ ### Table, table row, table cell
51
58
 
52
59
  ```html
53
60
  <div class="pf-v5-u-display-table">
@@ -82,11 +89,13 @@ section: utility-classes
82
89
 
83
90
  | Class | Applied to | Outcome |
84
91
  | -- | -- | -- |
85
- | `.pf-v5-u-display-inline-block{-on-[breakpoint]}` | `*` | Sets display: inline-block |
86
- | `.pf-v5-u-display-block{-on-[breakpoint]}` | `*` | Sets display: block |
87
92
  | `.pf-v5-u-display-inline{-on-[breakpoint]}` | `*` | Sets display: inline |
93
+ | `.pf-v5-u-display-block{-on-[breakpoint]}` | `*` | Sets display: block |
94
+ | `.pf-v5-u-display-inline-block{-on-[breakpoint]}` | `*` | Sets display: inline-block |
88
95
  | `.pf-v5-u-display-flex{-on-[breakpoint]}` | `*` | Sets display: flex |
89
96
  | `.pf-v5-u-display-inline-flex{-on-[breakpoint]}` | `*` | Sets display: inline-flex |
97
+ | `.pf-v5-u-display-grid{-on-[breakpoint]}` | `*` | Sets display: grid |
98
+ | `.pf-v5-u-display-inline-grid{-on-[breakpoint]}` | `*` | Sets display: inline-grid |
90
99
  | `.pf-v5-u-display-table{-on-[breakpoint]}` | `*` | Sets display: table |
91
100
  | `.pf-v5-u-display-table-row{-on-[breakpoint]}` | `*` | Sets display: table-row |
92
101
  | `.pf-v5-u-display-table-cell{-on-[breakpoint]}` | `*` | Sets display: table-cell |
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": "5.4.0-prerelease.2",
4
+ "version": "5.4.0-prerelease.4",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
@@ -46,11 +46,11 @@
46
46
  "@commitlint/config-conventional": "^18.4.3",
47
47
  "@fortawesome/fontawesome": "^1.1.8",
48
48
  "@octokit/rest": "^20.0.2",
49
- "@patternfly/documentation-framework": "5.13.3",
49
+ "@patternfly/documentation-framework": "5.16.7",
50
50
  "@patternfly/patternfly-a11y": "4.3.1",
51
- "@patternfly/react-code-editor": "5.3.1",
52
- "@patternfly/react-core": "5.3.1",
53
- "@patternfly/react-table": "5.3.1",
51
+ "@patternfly/react-code-editor": "5.3.3",
52
+ "@patternfly/react-core": "5.3.3",
53
+ "@patternfly/react-table": "5.3.3",
54
54
  "@starptech/prettyhtml": "^0.10.0",
55
55
  "backstopjs": "^6.2.2",
56
56
  "cheerio": "^1.0.0-rc.12",
@@ -781,6 +781,14 @@
781
781
  display: inline-flex !important;
782
782
  }
783
783
 
784
+ .pf-v5-u-display-grid {
785
+ display: grid !important;
786
+ }
787
+
788
+ .pf-v5-u-display-inline-grid {
789
+ display: inline-grid !important;
790
+ }
791
+
784
792
  @media screen and (min-width: 576px) {
785
793
  .pf-v5-u-display-none-on-sm {
786
794
  display: none !important;
@@ -809,6 +817,12 @@
809
817
  .pf-v5-u-display-inline-flex-on-sm {
810
818
  display: inline-flex !important;
811
819
  }
820
+ .pf-v5-u-display-grid-on-sm {
821
+ display: grid !important;
822
+ }
823
+ .pf-v5-u-display-inline-grid-on-sm {
824
+ display: inline-grid !important;
825
+ }
812
826
  }
813
827
  @media screen and (min-width: 768px) {
814
828
  .pf-v5-u-display-none-on-md {
@@ -838,6 +852,12 @@
838
852
  .pf-v5-u-display-inline-flex-on-md {
839
853
  display: inline-flex !important;
840
854
  }
855
+ .pf-v5-u-display-grid-on-md {
856
+ display: grid !important;
857
+ }
858
+ .pf-v5-u-display-inline-grid-on-md {
859
+ display: inline-grid !important;
860
+ }
841
861
  }
842
862
  @media screen and (min-width: 992px) {
843
863
  .pf-v5-u-display-none-on-lg {
@@ -867,6 +887,12 @@
867
887
  .pf-v5-u-display-inline-flex-on-lg {
868
888
  display: inline-flex !important;
869
889
  }
890
+ .pf-v5-u-display-grid-on-lg {
891
+ display: grid !important;
892
+ }
893
+ .pf-v5-u-display-inline-grid-on-lg {
894
+ display: inline-grid !important;
895
+ }
870
896
  }
871
897
  @media screen and (min-width: 1200px) {
872
898
  .pf-v5-u-display-none-on-xl {
@@ -896,6 +922,12 @@
896
922
  .pf-v5-u-display-inline-flex-on-xl {
897
923
  display: inline-flex !important;
898
924
  }
925
+ .pf-v5-u-display-grid-on-xl {
926
+ display: grid !important;
927
+ }
928
+ .pf-v5-u-display-inline-grid-on-xl {
929
+ display: inline-grid !important;
930
+ }
899
931
  }
900
932
  @media screen and (min-width: 1450px) {
901
933
  .pf-v5-u-display-none-on-2xl {
@@ -925,6 +957,12 @@
925
957
  .pf-v5-u-display-inline-flex-on-2xl {
926
958
  display: inline-flex !important;
927
959
  }
960
+ .pf-v5-u-display-grid-on-2xl {
961
+ display: grid !important;
962
+ }
963
+ .pf-v5-u-display-inline-grid-on-2xl {
964
+ display: inline-grid !important;
965
+ }
928
966
  }
929
967
  .pf-v5-u-flex-direction-column {
930
968
  flex-direction: column !important;
@@ -18485,6 +18485,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
18485
18485
  --pf-v5-c-menu-toggle__button--PaddingRight: var(--pf-v5-global--spacer--sm);
18486
18486
  --pf-v5-c-menu-toggle__button__controls--MarginRight: var(--pf-v5-global--spacer--sm);
18487
18487
  --pf-v5-c-menu-toggle__button__controls--MarginLeft: var(--pf-v5-global--spacer--sm);
18488
+ --pf-v5-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-v5-global--spacer--xs);
18488
18489
  --pf-v5-c-menu-toggle--m-typeahead__controls--MarginRight: var(--pf-v5-global--spacer--sm);
18489
18490
  --pf-v5-c-menu-toggle--m-typeahead__controls--MarginLeft: var(--pf-v5-global--spacer--sm);
18490
18491
  --pf-v5-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
@@ -18787,6 +18788,12 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
18787
18788
  background-color: var(--pf-v5-c-menu-toggle__button--BackgroundColor);
18788
18789
  border: 0;
18789
18790
  }
18791
+ .pf-v5-c-menu-toggle__button.pf-m-text {
18792
+ --pf-v5-c-menu-toggle--m-split-button--last-child--PaddingLeft: var(--pf-v5-c-menu-toggle__button--m-text--PaddingInlineStart);
18793
+ display: inline-flex;
18794
+ align-items: baseline;
18795
+ padding-inline-start: var(--pf-v5-c-menu-toggle__button--m-text--PaddingInlineStart);
18796
+ }
18790
18797
 
18791
18798
  .pf-v5-c-menu-toggle__icon {
18792
18799
  flex-shrink: 0;
@@ -18602,6 +18602,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
18602
18602
  --pf-v5-c-menu-toggle__button--PaddingRight: var(--pf-v5-global--spacer--sm);
18603
18603
  --pf-v5-c-menu-toggle__button__controls--MarginRight: var(--pf-v5-global--spacer--sm);
18604
18604
  --pf-v5-c-menu-toggle__button__controls--MarginLeft: var(--pf-v5-global--spacer--sm);
18605
+ --pf-v5-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-v5-global--spacer--xs);
18605
18606
  --pf-v5-c-menu-toggle--m-typeahead__controls--MarginRight: var(--pf-v5-global--spacer--sm);
18606
18607
  --pf-v5-c-menu-toggle--m-typeahead__controls--MarginLeft: var(--pf-v5-global--spacer--sm);
18607
18608
  --pf-v5-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
@@ -18904,6 +18905,12 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
18904
18905
  background-color: var(--pf-v5-c-menu-toggle__button--BackgroundColor);
18905
18906
  border: 0;
18906
18907
  }
18908
+ .pf-v5-c-menu-toggle__button.pf-m-text {
18909
+ --pf-v5-c-menu-toggle--m-split-button--last-child--PaddingLeft: var(--pf-v5-c-menu-toggle__button--m-text--PaddingInlineStart);
18910
+ display: inline-flex;
18911
+ align-items: baseline;
18912
+ padding-inline-start: var(--pf-v5-c-menu-toggle__button--m-text--PaddingInlineStart);
18913
+ }
18907
18914
 
18908
18915
  .pf-v5-c-menu-toggle__icon {
18909
18916
  flex-shrink: 0;
package/patternfly.css CHANGED
@@ -18602,6 +18602,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
18602
18602
  --pf-v5-c-menu-toggle__button--PaddingRight: var(--pf-v5-global--spacer--sm);
18603
18603
  --pf-v5-c-menu-toggle__button__controls--MarginRight: var(--pf-v5-global--spacer--sm);
18604
18604
  --pf-v5-c-menu-toggle__button__controls--MarginLeft: var(--pf-v5-global--spacer--sm);
18605
+ --pf-v5-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-v5-global--spacer--xs);
18605
18606
  --pf-v5-c-menu-toggle--m-typeahead__controls--MarginRight: var(--pf-v5-global--spacer--sm);
18606
18607
  --pf-v5-c-menu-toggle--m-typeahead__controls--MarginLeft: var(--pf-v5-global--spacer--sm);
18607
18608
  --pf-v5-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
@@ -18904,6 +18905,12 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
18904
18905
  background-color: var(--pf-v5-c-menu-toggle__button--BackgroundColor);
18905
18906
  border: 0;
18906
18907
  }
18908
+ .pf-v5-c-menu-toggle__button.pf-m-text {
18909
+ --pf-v5-c-menu-toggle--m-split-button--last-child--PaddingLeft: var(--pf-v5-c-menu-toggle__button--m-text--PaddingInlineStart);
18910
+ display: inline-flex;
18911
+ align-items: baseline;
18912
+ padding-inline-start: var(--pf-v5-c-menu-toggle__button--m-text--PaddingInlineStart);
18913
+ }
18907
18914
 
18908
18915
  .pf-v5-c-menu-toggle__icon {
18909
18916
  flex-shrink: 0;