@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.
- package/components/MenuToggle/menu-toggle.css +7 -0
- package/components/MenuToggle/menu-toggle.scss +9 -0
- package/docs/components/MenuToggle/examples/MenuToggle.md +96 -1
- package/docs/components/Panel/examples/Panel.md +2 -2
- package/docs/components/Sidebar/examples/Sidebar.css +4 -2
- package/docs/components/Sidebar/examples/Sidebar.md +3 -3
- package/docs/components/Table/examples/Table.md +471 -44
- package/docs/demos/PasswordStrength/examples/PasswordStrength.md +4 -32
- package/docs/utilities/Display/examples/Display.css +1 -8
- package/docs/utilities/Display/examples/Display.md +16 -7
- package/package.json +5 -5
- package/patternfly-addons.css +38 -0
- package/patternfly-no-globals.css +7 -0
- package/patternfly-theme-dark-unversioned.css +7 -0
- package/patternfly.css +7 -0
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
- package/utilities/Display/display.css +38 -0
- package/utilities/Display/display.scss +3 -1
|
@@ -5,10 +5,10 @@ section: utility-classes
|
|
|
5
5
|
|
|
6
6
|
## Examples
|
|
7
7
|
|
|
8
|
-
### Inline
|
|
8
|
+
### Inline
|
|
9
9
|
|
|
10
10
|
```html
|
|
11
|
-
<div class="pf-v5-u-display-inline
|
|
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.
|
|
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.
|
|
49
|
+
"@patternfly/documentation-framework": "5.16.7",
|
|
50
50
|
"@patternfly/patternfly-a11y": "4.3.1",
|
|
51
|
-
"@patternfly/react-code-editor": "5.3.
|
|
52
|
-
"@patternfly/react-core": "5.3.
|
|
53
|
-
"@patternfly/react-table": "5.3.
|
|
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",
|
package/patternfly-addons.css
CHANGED
|
@@ -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;
|