@patternfly/patternfly 6.0.0-alpha.34 → 6.0.0-alpha.39
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/CODE_OF_CONDUCT.md +1 -2
- package/assets/images/PF-HorizontalLogo-Color.svg +29 -0
- package/assets/images/PF-HorizontalLogo-Reverse.svg +28 -0
- package/assets/images/PF-IconLogo-color.svg +17 -0
- package/components/Backdrop/backdrop.css +6 -2
- package/components/Backdrop/backdrop.scss +5 -2
- package/components/Banner/banner.css +4 -0
- package/components/Banner/banner.scss +5 -0
- package/components/Card/card.css +3 -0
- package/components/Card/card.scss +8 -0
- package/components/Divider/divider.css +97 -177
- package/components/Divider/divider.scss +60 -79
- package/components/Form/form.css +6 -0
- package/components/Form/form.scss +4 -1
- package/components/Masthead/masthead.css +267 -435
- package/components/Masthead/masthead.scss +118 -233
- package/components/MenuToggle/menu-toggle.css +1 -0
- package/components/MenuToggle/menu-toggle.scss +2 -0
- package/components/Popover/popover.css +0 -2
- package/components/Popover/popover.scss +2 -2
- package/components/SimpleList/simple-list.css +35 -52
- package/components/SimpleList/simple-list.scss +41 -51
- package/components/Table/table.scss +1 -0
- package/components/Tooltip/tooltip.css +0 -2
- package/components/Tooltip/tooltip.scss +3 -3
- package/components/Truncate/truncate.css +4 -0
- package/components/Truncate/truncate.scss +3 -0
- package/docs/components/Accordion/examples/Accordion.md +6 -6
- package/docs/components/Alert/examples/Alert.md +2 -2
- package/docs/components/Brand/examples/Brand.md +9 -33
- package/docs/components/Breadcrumb/examples/Breadcrumb.md +1 -1
- package/docs/components/Card/examples/Card.md +18 -20
- package/docs/components/Check/examples/Check.md +1 -0
- package/docs/components/Content/examples/Content.md +5 -5
- package/docs/components/Divider/examples/Divider.css +3 -1
- package/docs/components/Divider/examples/Divider.md +4 -5
- package/docs/components/InlineEdit/examples/InlineEdit.md +3 -1
- package/docs/components/Label/examples/Label.md +11 -11
- package/docs/components/Masthead/examples/masthead.md +441 -16
- package/docs/components/Nav/examples/Navigation.css +18 -2
- package/docs/components/Nav/examples/Navigation.md +1 -1
- package/docs/components/Radio/examples/Radio.md +1 -1
- package/docs/components/SimpleList/examples/SimpleList.md +3 -3
- package/docs/components/Table/examples/Table.md +8 -8
- package/docs/components/Truncate/examples/Truncate.css +2 -2
- package/docs/demos/AboutModal/examples/AboutModal.md +40 -42
- package/docs/demos/Alert/examples/Alert.md +120 -126
- package/docs/demos/BackToTop/examples/BackToTop.md +40 -42
- package/docs/demos/Banner/examples/Banner.md +79 -80
- package/docs/demos/CardView/examples/CardView.md +40 -42
- package/docs/demos/ContextSelector/examples/ContextSelector.md +129 -146
- package/docs/demos/Dashboard/examples/Dashboard.md +40 -42
- package/docs/demos/DataList/examples/DataList.md +160 -279
- package/docs/demos/DescriptionList/examples/DescriptionList.md +120 -126
- package/docs/demos/Drawer/examples/Drawer.md +200 -210
- package/docs/demos/JumpLinks/examples/JumpLinks.md +240 -252
- package/docs/demos/Masthead/examples/Masthead.md +143 -224
- package/docs/demos/Modal/examples/Modal.md +240 -252
- package/docs/demos/Nav/examples/Nav.md +320 -336
- package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +200 -210
- package/docs/demos/Page/examples/Page.md +360 -378
- package/docs/demos/Page/examples/Penta.md +8 -15
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +280 -294
- package/docs/demos/Skeleton/examples/Skeleton.md +40 -42
- package/docs/demos/Table/examples/Table.md +617 -647
- package/docs/demos/Tabs/examples/Tabs.md +240 -252
- package/docs/demos/Toolbar/examples/Toolbar.md +80 -84
- package/docs/demos/Wizard/examples/Wizard.md +360 -378
- package/docs/layouts/Flex/examples/Flex.md +11 -11
- package/package.json +32 -32
- package/patternfly-no-globals.css +422 -673
- package/patternfly-theme-dark-unversioned.css +422 -673
- package/patternfly.css +422 -673
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
- package/components/SimpleList/themes/dark/simple-list.scss +0 -14
|
@@ -12,11 +12,11 @@ The flex layout is based on the CSS Flex properties where the layout determines
|
|
|
12
12
|
|
|
13
13
|
The flex layout provides two ways of spacing its direct children.
|
|
14
14
|
|
|
15
|
-
*
|
|
16
|
-
|
|
17
|
-
*
|
|
18
|
-
|
|
19
|
-
|
|
15
|
+
* [Spacing system](#spacing-system)
|
|
16
|
+
* The spacing system applies a margin between the flex layout's direct children to create space between items along the main axis only. The benefit of the spacing system is that it allows for variable spacing between direct children. Use the spacing system when individual flex items along the main axis require a different spacer than sibling items.
|
|
17
|
+
* [Gap spacing](#gap-spacing)
|
|
18
|
+
* Gap spacing uses flex `gap` to space the flex layout's direct children, and can be applied to space rows (`row-gap`), columns (`column-gap`), or both (`gap`). The benefit of gap spacing is that item wrapping is improved and improved item spacing that works better with CSS flex's logical layout properties. E.g., spacing in RTL layouts that rely on logical properties is improved. Use the gap system when all direct children should use the same spacer for rows, columns, or both.
|
|
19
|
+
* **Note** using `gap` along the main axis will override any other spacing applied using the spacing system.
|
|
20
20
|
|
|
21
21
|
### Breakpoints
|
|
22
22
|
|
|
@@ -24,15 +24,15 @@ The flex layout provides two ways of spacing its direct children.
|
|
|
24
24
|
|
|
25
25
|
### Usefulness
|
|
26
26
|
|
|
27
|
-
*
|
|
28
|
-
*
|
|
27
|
+
* Use when content dictates layout and elements wrap when necessary.
|
|
28
|
+
* Use when a rigid grid is not necessary/wanted.
|
|
29
29
|
|
|
30
30
|
### Differences from utility class
|
|
31
31
|
|
|
32
|
-
*
|
|
33
|
-
*
|
|
34
|
-
*
|
|
35
|
-
*
|
|
32
|
+
* It contains multiple css declarations and does not use the `!important` tag.
|
|
33
|
+
* It does not require wrapping elements in columns or rows.
|
|
34
|
+
* It breaks the dependency upon adding utility classes to each child.
|
|
35
|
+
* It can be applied to container elements or components.
|
|
36
36
|
|
|
37
37
|
# Examples
|
|
38
38
|
|
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.
|
|
4
|
+
"version": "6.0.0-alpha.39",
|
|
5
5
|
"keywords": [],
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"scripts": {
|
|
@@ -32,40 +32,40 @@
|
|
|
32
32
|
"prepare": "husky install"
|
|
33
33
|
},
|
|
34
34
|
"devDependencies": {
|
|
35
|
-
"@babel/core": "^7.
|
|
36
|
-
"@babel/eslint-parser": "^7.
|
|
35
|
+
"@babel/core": "^7.23.5",
|
|
36
|
+
"@babel/eslint-parser": "^7.23.3",
|
|
37
37
|
"@babel/plugin-proposal-class-properties": "^7.18.6",
|
|
38
38
|
"@babel/plugin-proposal-optional-chaining": "^7.21.0",
|
|
39
39
|
"@babel/plugin-proposal-private-methods": "^7.18.6",
|
|
40
40
|
"@babel/plugin-proposal-private-property-in-object": "^7.21.11",
|
|
41
|
-
"@babel/plugin-transform-react-jsx": "^7.
|
|
42
|
-
"@babel/preset-env": "^7.
|
|
43
|
-
"@babel/preset-react": "^7.
|
|
44
|
-
"@commitlint/cli": "^
|
|
45
|
-
"@commitlint/config-conventional": "^
|
|
41
|
+
"@babel/plugin-transform-react-jsx": "^7.23.4",
|
|
42
|
+
"@babel/preset-env": "^7.23.5",
|
|
43
|
+
"@babel/preset-react": "^7.23.3",
|
|
44
|
+
"@commitlint/cli": "^18.4.3",
|
|
45
|
+
"@commitlint/config-conventional": "^18.4.3",
|
|
46
46
|
"@fortawesome/fontawesome": "^1.1.8",
|
|
47
|
-
"@octokit/rest": "^20.0.
|
|
48
|
-
"@patternfly/documentation-framework": "5.3.
|
|
47
|
+
"@octokit/rest": "^20.0.2",
|
|
48
|
+
"@patternfly/documentation-framework": "5.3.9",
|
|
49
49
|
"@patternfly/patternfly-a11y": "4.3.1",
|
|
50
|
-
"@patternfly/react-code-editor": "5.1.
|
|
51
|
-
"@patternfly/react-core": "5.1.
|
|
52
|
-
"@patternfly/react-table": "5.1.
|
|
50
|
+
"@patternfly/react-code-editor": "5.1.2",
|
|
51
|
+
"@patternfly/react-core": "5.1.2",
|
|
52
|
+
"@patternfly/react-table": "5.1.2",
|
|
53
53
|
"@starptech/prettyhtml": "^0.10.0",
|
|
54
54
|
"backstopjs": "^6.2.2",
|
|
55
55
|
"cheerio": "^1.0.0-rc.12",
|
|
56
|
-
"commander": "^11.
|
|
56
|
+
"commander": "^11.1.0",
|
|
57
57
|
"cssnano": "^6.0.1",
|
|
58
|
-
"eslint": "^8.
|
|
58
|
+
"eslint": "^8.54.0",
|
|
59
59
|
"eslint-config-standard": "^17.1.0",
|
|
60
60
|
"eslint-config-standard-jsx": "^11.0.0",
|
|
61
61
|
"eslint-config-standard-react": "^13.0.0",
|
|
62
|
-
"eslint-plugin-import": "^2.
|
|
63
|
-
"eslint-plugin-n": "^16.
|
|
62
|
+
"eslint-plugin-import": "^2.29.0",
|
|
63
|
+
"eslint-plugin-n": "^16.3.1",
|
|
64
64
|
"eslint-plugin-node": "^11.1.0",
|
|
65
65
|
"eslint-plugin-promise": "^6.1.1",
|
|
66
|
-
"eslint-plugin-react": "^7.33.
|
|
66
|
+
"eslint-plugin-react": "^7.33.2",
|
|
67
67
|
"eslint-plugin-react-hooks": "^4.6.0",
|
|
68
|
-
"glob": "^10.3.
|
|
68
|
+
"glob": "^10.3.10",
|
|
69
69
|
"gulp": "^4.0.2",
|
|
70
70
|
"gulp-cli": "^2.3.0",
|
|
71
71
|
"gulp-iconfont": "^11.0.1",
|
|
@@ -74,27 +74,27 @@
|
|
|
74
74
|
"gulp-rename": "^2.0.0",
|
|
75
75
|
"gulp-sourcemaps": "^3.0.0",
|
|
76
76
|
"husky": "^8.0.3",
|
|
77
|
-
"lint-staged": "^
|
|
78
|
-
"node-plop": "^0.
|
|
79
|
-
"postcss": "^8.4.
|
|
77
|
+
"lint-staged": "^15.1.0",
|
|
78
|
+
"node-plop": "^0.32.0",
|
|
79
|
+
"postcss": "^8.4.31",
|
|
80
80
|
"postcss-css-variables": "^0.19.0",
|
|
81
|
-
"postcss-preset-env": "^9.
|
|
82
|
-
"prettier": "^3.
|
|
81
|
+
"postcss-preset-env": "^9.3.0",
|
|
82
|
+
"prettier": "^3.1.0",
|
|
83
83
|
"react": "^18.2.0",
|
|
84
84
|
"react-dom": "^18.2.0",
|
|
85
|
-
"remark-parse": "^
|
|
86
|
-
"remark-stringify": "^
|
|
85
|
+
"remark-parse": "^11.0.0",
|
|
86
|
+
"remark-stringify": "^11.0.0",
|
|
87
87
|
"rimraf": "*",
|
|
88
|
-
"sass": "^1.
|
|
88
|
+
"sass": "^1.69.5",
|
|
89
89
|
"sass-graph": "^4.0.1",
|
|
90
|
-
"stylelint": "^15.
|
|
91
|
-
"stylelint-config-recess-order": "^4.
|
|
90
|
+
"stylelint": "^15.11.0",
|
|
91
|
+
"stylelint-config-recess-order": "^4.4.0",
|
|
92
92
|
"stylelint-config-standard": "^34.0.0",
|
|
93
|
-
"stylelint-config-standard-scss": "^
|
|
93
|
+
"stylelint-config-standard-scss": "^11.1.0",
|
|
94
94
|
"stylelint-use-logical-spec": "^5.0.0",
|
|
95
95
|
"surge": "^0.23.1",
|
|
96
|
-
"unified": "^
|
|
97
|
-
"webpack": "^5.
|
|
96
|
+
"unified": "^11.0.4",
|
|
97
|
+
"webpack": "^5.89.0"
|
|
98
98
|
},
|
|
99
99
|
"resolutions": {
|
|
100
100
|
"@babel/preset-env": "7.18.2",
|