@patternfly/patternfly 6.0.0-alpha.165 → 6.0.0-alpha.167
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/Alert/alert-group.css +54 -3
- package/components/Alert/alert-group.scss +85 -0
- package/components/Alert/alert.scss +1 -1
- package/components/Button/button.css +33 -14
- package/components/Button/button.scss +36 -14
- package/components/_index.css +87 -17
- package/docs/components/AboutModalBox/examples/AboutModalBox.md +3 -1
- package/docs/components/ActionList/examples/ActionList.md +60 -20
- package/docs/components/Alert/examples/Alert.md +106 -62
- package/docs/components/BackToTop/examples/BackToTop.md +5 -3
- package/docs/components/Banner/examples/Banner.md +9 -3
- package/docs/components/Button/examples/Button.md +536 -367
- package/docs/components/CalendarMonth/examples/CalendarMonth.md +24 -8
- package/docs/components/Card/examples/Card.md +43 -29
- package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +75 -33
- package/docs/components/CodeBlock/examples/CodeBlock.md +18 -6
- package/docs/components/CodeEditor/examples/CodeEditor.md +44 -22
- package/docs/components/ContextSelector/deprecated/context-selector.md +6 -8
- package/docs/components/DataList/examples/DataList.md +121 -63
- package/docs/components/DatePicker/examples/DatePicker.md +18 -6
- package/docs/components/DescriptionList/examples/DescriptionList.md +125 -75
- package/docs/components/Drawer/examples/Drawer.md +57 -19
- package/docs/components/DualListSelector/examples/DualListSelector.md +204 -100
- package/docs/components/EmptyState/examples/EmptyState.md +123 -53
- package/docs/components/FileUpload/examples/FileUpload.md +42 -14
- package/docs/components/Form/examples/Form.md +53 -19
- package/docs/components/Hint/examples/Hint.md +9 -9
- package/docs/components/InlineEdit/examples/InlineEdit.md +78 -26
- package/docs/components/InputGroup/examples/InputGroup.md +27 -9
- package/docs/components/JumpLinks/examples/JumpLinks.md +188 -68
- package/docs/components/Label/examples/Label.md +651 -217
- package/docs/components/LogViewer/examples/LogViewer.md +218 -86
- package/docs/components/Login/examples/Login.md +346 -282
- package/docs/components/Masthead/examples/masthead.md +27 -9
- package/docs/components/Menu/examples/Menu.md +35 -25
- package/docs/components/MenuToggle/examples/MenuToggle.md +3 -1
- package/docs/components/ModalBox/examples/ModalBox.md +48 -16
- package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +48 -16
- package/docs/components/Nav/examples/Navigation.md +12 -4
- package/docs/components/NotificationBadge/examples/NotificationBadge.md +78 -42
- package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +6 -2
- package/docs/components/NumberInput/examples/NumberInput.md +96 -48
- package/docs/components/OverflowMenu/examples/overflow-menu.md +48 -16
- package/docs/components/Page/examples/Page.md +21 -7
- package/docs/components/Pagination/examples/Pagination.md +132 -44
- package/docs/components/Popover/examples/Popover.md +45 -15
- package/docs/components/Select/deprecated/Select.md +111 -55
- package/docs/components/SkipToContent/examples/SkipToContent.md +3 -1
- package/docs/components/Slider/examples/Slider.md +12 -4
- package/docs/components/Table/examples/Table.md +363 -208
- package/docs/components/Tabs/examples/Tabs.md +1230 -574
- package/docs/components/TextInputGroup/examples/TextInputGroup.md +132 -44
- package/docs/components/Toolbar/examples/Toolbar.md +120 -64
- package/docs/components/TreeView/examples/TreeView.md +12 -4
- package/docs/components/Wizard/examples/Wizard.md +105 -38
- package/docs/demos/AboutModal/examples/AboutModal.md +9 -3
- package/docs/demos/Alert/examples/Alert.md +39 -25
- package/docs/demos/BackToTop/examples/BackToTop.md +11 -5
- package/docs/demos/Banner/examples/Banner.md +12 -4
- package/docs/demos/Button/examples/Button.md +7 -7
- package/docs/demos/Card/examples/Card.md +106 -57
- package/docs/demos/CardView/examples/CardView.md +30 -13
- package/docs/demos/ContextSelector/examples/ContextSelector.md +24 -8
- package/docs/demos/Dashboard/examples/Dashboard.md +43 -28
- package/docs/demos/DataList/examples/DataList.md +255 -149
- package/docs/demos/DescriptionList/examples/DescriptionList.md +21 -7
- package/docs/demos/Drawer/examples/Drawer.md +89 -43
- package/docs/demos/Form/examples/BasicForms.md +141 -59
- package/docs/demos/JumpLinks/examples/JumpLinks.md +222 -109
- package/docs/demos/Masthead/examples/Masthead.md +63 -21
- package/docs/demos/Modal/examples/Modal.md +99 -37
- package/docs/demos/Nav/examples/Nav.md +45 -15
- package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +58 -43
- package/docs/demos/Page/examples/Page.md +54 -21
- package/docs/demos/Page/examples/Penta.md +9 -6
- package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +9 -3
- package/docs/demos/PasswordStrength/examples/PasswordStrength.md +12 -4
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +306 -133
- package/docs/demos/Skeleton/examples/Skeleton.md +6 -2
- package/docs/demos/Table/examples/Table.md +474 -210
- package/docs/demos/Tabs/examples/Tabs.md +60 -22
- package/docs/demos/Toolbar/examples/Toolbar.md +123 -72
- package/docs/demos/Wizard/examples/Wizard.md +179 -110
- package/package.json +1 -1
- package/patternfly-no-globals.css +87 -17
- package/patternfly.css +87 -17
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
|
@@ -24,15 +24,29 @@ cssPrefix: pf-v6-c-empty-state
|
|
|
24
24
|
|
|
25
25
|
<div class="pf-v6-c-empty-state__footer">
|
|
26
26
|
<div class="pf-v6-c-empty-state__actions">
|
|
27
|
-
<button class="pf-v6-c-button pf-m-primary" type="button">
|
|
27
|
+
<button class="pf-v6-c-button pf-m-primary" type="button">
|
|
28
|
+
<span class="pf-v6-c-button__text">Primary action</span>
|
|
29
|
+
</button>
|
|
28
30
|
</div>
|
|
29
31
|
<div class="pf-v6-c-empty-state__actions">
|
|
30
|
-
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
34
|
-
|
|
35
|
-
|
|
32
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
33
|
+
<span class="pf-v6-c-button__text">Multiple</span>
|
|
34
|
+
</button>
|
|
35
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
36
|
+
<span class="pf-v6-c-button__text">Action buttons</span>
|
|
37
|
+
</button>
|
|
38
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
39
|
+
<span class="pf-v6-c-button__text">Can</span>
|
|
40
|
+
</button>
|
|
41
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
42
|
+
<span class="pf-v6-c-button__text">Go here</span>
|
|
43
|
+
</button>
|
|
44
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
45
|
+
<span class="pf-v6-c-button__text">In the second</span>
|
|
46
|
+
</button>
|
|
47
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
48
|
+
<span class="pf-v6-c-button__text">Action area</span>
|
|
49
|
+
</button>
|
|
36
50
|
</div>
|
|
37
51
|
</div>
|
|
38
52
|
</div>
|
|
@@ -60,24 +74,24 @@ cssPrefix: pf-v6-c-empty-state
|
|
|
60
74
|
|
|
61
75
|
<div class="pf-v6-c-empty-state__footer">
|
|
62
76
|
<div class="pf-v6-c-empty-state__actions">
|
|
63
|
-
<button
|
|
64
|
-
class="pf-v6-c-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
<button
|
|
73
|
-
class="pf-v6-c-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
77
|
+
<button class="pf-v6-c-button pf-m-link pf-m-small" type="button">
|
|
78
|
+
<span class="pf-v6-c-button__text">Multiple</span>
|
|
79
|
+
</button>
|
|
80
|
+
<button class="pf-v6-c-button pf-m-link pf-m-small" type="button">
|
|
81
|
+
<span class="pf-v6-c-button__text">Action buttons</span>
|
|
82
|
+
</button>
|
|
83
|
+
<button class="pf-v6-c-button pf-m-link pf-m-small" type="button">
|
|
84
|
+
<span class="pf-v6-c-button__text">Can</span>
|
|
85
|
+
</button>
|
|
86
|
+
<button class="pf-v6-c-button pf-m-link pf-m-small" type="button">
|
|
87
|
+
<span class="pf-v6-c-button__text">Go here</span>
|
|
88
|
+
</button>
|
|
89
|
+
<button class="pf-v6-c-button pf-m-link pf-m-small" type="button">
|
|
90
|
+
<span class="pf-v6-c-button__text">In the</span>
|
|
91
|
+
</button>
|
|
92
|
+
<button class="pf-v6-c-button pf-m-link pf-m-small" type="button">
|
|
93
|
+
<span class="pf-v6-c-button__text">Action area</span>
|
|
94
|
+
</button>
|
|
81
95
|
</div>
|
|
82
96
|
</div>
|
|
83
97
|
</div>
|
|
@@ -105,16 +119,30 @@ cssPrefix: pf-v6-c-empty-state
|
|
|
105
119
|
|
|
106
120
|
<div class="pf-v6-c-empty-state__footer">
|
|
107
121
|
<div class="pf-v6-c-empty-state__actions">
|
|
108
|
-
<button class="pf-v6-c-button pf-m-primary" type="button">
|
|
122
|
+
<button class="pf-v6-c-button pf-m-primary" type="button">
|
|
123
|
+
<span class="pf-v6-c-button__text">Primary action</span>
|
|
124
|
+
</button>
|
|
109
125
|
</div>
|
|
110
126
|
|
|
111
127
|
<div class="pf-v6-c-empty-state__actions">
|
|
112
|
-
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
116
|
-
|
|
117
|
-
|
|
128
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
129
|
+
<span class="pf-v6-c-button__text">Multiple</span>
|
|
130
|
+
</button>
|
|
131
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
132
|
+
<span class="pf-v6-c-button__text">Action buttons</span>
|
|
133
|
+
</button>
|
|
134
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
135
|
+
<span class="pf-v6-c-button__text">Can</span>
|
|
136
|
+
</button>
|
|
137
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
138
|
+
<span class="pf-v6-c-button__text">Go here</span>
|
|
139
|
+
</button>
|
|
140
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
141
|
+
<span class="pf-v6-c-button__text">In the second</span>
|
|
142
|
+
</button>
|
|
143
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
144
|
+
<span class="pf-v6-c-button__text">Action area</span>
|
|
145
|
+
</button>
|
|
118
146
|
</div>
|
|
119
147
|
</div>
|
|
120
148
|
</div>
|
|
@@ -142,15 +170,29 @@ cssPrefix: pf-v6-c-empty-state
|
|
|
142
170
|
|
|
143
171
|
<div class="pf-v6-c-empty-state__footer">
|
|
144
172
|
<div class="pf-v6-c-empty-state__actions">
|
|
145
|
-
<button class="pf-v6-c-button pf-m-primary" type="button">
|
|
173
|
+
<button class="pf-v6-c-button pf-m-primary" type="button">
|
|
174
|
+
<span class="pf-v6-c-button__text">Primary action</span>
|
|
175
|
+
</button>
|
|
146
176
|
</div>
|
|
147
177
|
<div class="pf-v6-c-empty-state__actions">
|
|
148
|
-
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
152
|
-
|
|
153
|
-
|
|
178
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
179
|
+
<span class="pf-v6-c-button__text">Multiple</span>
|
|
180
|
+
</button>
|
|
181
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
182
|
+
<span class="pf-v6-c-button__text">Action buttons</span>
|
|
183
|
+
</button>
|
|
184
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
185
|
+
<span class="pf-v6-c-button__text">Can</span>
|
|
186
|
+
</button>
|
|
187
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
188
|
+
<span class="pf-v6-c-button__text">Go here</span>
|
|
189
|
+
</button>
|
|
190
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
191
|
+
<span class="pf-v6-c-button__text">In the second</span>
|
|
192
|
+
</button>
|
|
193
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
194
|
+
<span class="pf-v6-c-button__text">Action area</span>
|
|
195
|
+
</button>
|
|
154
196
|
</div>
|
|
155
197
|
</div>
|
|
156
198
|
</div>
|
|
@@ -177,15 +219,29 @@ cssPrefix: pf-v6-c-empty-state
|
|
|
177
219
|
>This represents an the empty state pattern in PatternFly. Hopefully it's simple enough to use but flexible enough to meet a variety of needs.</div>
|
|
178
220
|
<div class="pf-v6-c-empty-state__footer">
|
|
179
221
|
<div class="pf-v6-c-empty-state__actions">
|
|
180
|
-
<button class="pf-v6-c-button pf-m-primary" type="button">
|
|
222
|
+
<button class="pf-v6-c-button pf-m-primary" type="button">
|
|
223
|
+
<span class="pf-v6-c-button__text">Primary action</span>
|
|
224
|
+
</button>
|
|
181
225
|
</div>
|
|
182
226
|
<div class="pf-v6-c-empty-state__actions">
|
|
183
|
-
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
187
|
-
|
|
188
|
-
|
|
227
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
228
|
+
<span class="pf-v6-c-button__text">Multiple</span>
|
|
229
|
+
</button>
|
|
230
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
231
|
+
<span class="pf-v6-c-button__text">Action buttons</span>
|
|
232
|
+
</button>
|
|
233
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
234
|
+
<span class="pf-v6-c-button__text">Can</span>
|
|
235
|
+
</button>
|
|
236
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
237
|
+
<span class="pf-v6-c-button__text">Go here</span>
|
|
238
|
+
</button>
|
|
239
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
240
|
+
<span class="pf-v6-c-button__text">In the second</span>
|
|
241
|
+
</button>
|
|
242
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
243
|
+
<span class="pf-v6-c-button__text">Action area</span>
|
|
244
|
+
</button>
|
|
189
245
|
</div>
|
|
190
246
|
</div>
|
|
191
247
|
</div>
|
|
@@ -213,15 +269,29 @@ cssPrefix: pf-v6-c-empty-state
|
|
|
213
269
|
|
|
214
270
|
<div class="pf-v6-c-empty-state__footer">
|
|
215
271
|
<div class="pf-v6-c-empty-state__actions">
|
|
216
|
-
<button class="pf-v6-c-button pf-m-primary" type="button">
|
|
272
|
+
<button class="pf-v6-c-button pf-m-primary" type="button">
|
|
273
|
+
<span class="pf-v6-c-button__text">Primary action</span>
|
|
274
|
+
</button>
|
|
217
275
|
</div>
|
|
218
276
|
<div class="pf-v6-c-empty-state__actions">
|
|
219
|
-
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
223
|
-
|
|
224
|
-
|
|
277
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
278
|
+
<span class="pf-v6-c-button__text">Multiple</span>
|
|
279
|
+
</button>
|
|
280
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
281
|
+
<span class="pf-v6-c-button__text">Action buttons</span>
|
|
282
|
+
</button>
|
|
283
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
284
|
+
<span class="pf-v6-c-button__text">Can</span>
|
|
285
|
+
</button>
|
|
286
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
287
|
+
<span class="pf-v6-c-button__text">Go here</span>
|
|
288
|
+
</button>
|
|
289
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
290
|
+
<span class="pf-v6-c-button__text">In the second</span>
|
|
291
|
+
</button>
|
|
292
|
+
<button class="pf-v6-c-button pf-m-link" type="button">
|
|
293
|
+
<span class="pf-v6-c-button__text">Action area</span>
|
|
294
|
+
</button>
|
|
225
295
|
</div>
|
|
226
296
|
</div>
|
|
227
297
|
</div>
|
|
@@ -28,10 +28,14 @@ cssPrefix: pf-v6-c-file-upload
|
|
|
28
28
|
class="pf-v6-c-button pf-m-control"
|
|
29
29
|
type="button"
|
|
30
30
|
id="basic-file-upload-browse"
|
|
31
|
-
>
|
|
31
|
+
>
|
|
32
|
+
<span class="pf-v6-c-button__text">Upload</span>
|
|
33
|
+
</button>
|
|
32
34
|
</div>
|
|
33
35
|
<div class="pf-v6-c-input-group__item">
|
|
34
|
-
<button class="pf-v6-c-button pf-m-control" type="button" disabled>
|
|
36
|
+
<button class="pf-v6-c-button pf-m-control" type="button" disabled>
|
|
37
|
+
<span class="pf-v6-c-button__text">Clear</span>
|
|
38
|
+
</button>
|
|
35
39
|
</div>
|
|
36
40
|
</div>
|
|
37
41
|
</div>
|
|
@@ -72,10 +76,14 @@ cssPrefix: pf-v6-c-file-upload
|
|
|
72
76
|
type="button"
|
|
73
77
|
id="file-upload-helper-text-browse"
|
|
74
78
|
aria-describedby="helper-text-example"
|
|
75
|
-
>
|
|
79
|
+
>
|
|
80
|
+
<span class="pf-v6-c-button__text">Upload</span>
|
|
81
|
+
</button>
|
|
76
82
|
</div>
|
|
77
83
|
<div class="pf-v6-c-input-group__item">
|
|
78
|
-
<button class="pf-v6-c-button pf-m-control" type="button" disabled>
|
|
84
|
+
<button class="pf-v6-c-button pf-m-control" type="button" disabled>
|
|
85
|
+
<span class="pf-v6-c-button__text">Clear</span>
|
|
86
|
+
</button>
|
|
79
87
|
</div>
|
|
80
88
|
</div>
|
|
81
89
|
</div>
|
|
@@ -122,10 +130,14 @@ cssPrefix: pf-v6-c-file-upload
|
|
|
122
130
|
class="pf-v6-c-button pf-m-control"
|
|
123
131
|
type="button"
|
|
124
132
|
id="browsed-file-upload-complete-browse"
|
|
125
|
-
>
|
|
133
|
+
>
|
|
134
|
+
<span class="pf-v6-c-button__text">Upload</span>
|
|
135
|
+
</button>
|
|
126
136
|
</div>
|
|
127
137
|
<div class="pf-v6-c-input-group__item">
|
|
128
|
-
<button class="pf-v6-c-button pf-m-control" type="button">
|
|
138
|
+
<button class="pf-v6-c-button pf-m-control" type="button">
|
|
139
|
+
<span class="pf-v6-c-button__text">Clear</span>
|
|
140
|
+
</button>
|
|
129
141
|
</div>
|
|
130
142
|
</div>
|
|
131
143
|
</div>
|
|
@@ -168,10 +180,14 @@ cssPrefix: pf-v6-c-file-upload
|
|
|
168
180
|
class="pf-v6-c-button pf-m-control"
|
|
169
181
|
type="button"
|
|
170
182
|
id="drop-file-browse"
|
|
171
|
-
>
|
|
183
|
+
>
|
|
184
|
+
<span class="pf-v6-c-button__text">Upload</span>
|
|
185
|
+
</button>
|
|
172
186
|
</div>
|
|
173
187
|
<div class="pf-v6-c-input-group__item">
|
|
174
|
-
<button class="pf-v6-c-button pf-m-control" type="button">
|
|
188
|
+
<button class="pf-v6-c-button pf-m-control" type="button">
|
|
189
|
+
<span class="pf-v6-c-button__text">Clear</span>
|
|
190
|
+
</button>
|
|
175
191
|
</div>
|
|
176
192
|
</div>
|
|
177
193
|
</div>
|
|
@@ -213,10 +229,14 @@ cssPrefix: pf-v6-c-file-upload
|
|
|
213
229
|
class="pf-v6-c-button pf-m-control"
|
|
214
230
|
type="button"
|
|
215
231
|
id="drag-file-hover-component-browse"
|
|
216
|
-
>
|
|
232
|
+
>
|
|
233
|
+
<span class="pf-v6-c-button__text">Upload</span>
|
|
234
|
+
</button>
|
|
217
235
|
</div>
|
|
218
236
|
<div class="pf-v6-c-input-group__item">
|
|
219
|
-
<button class="pf-v6-c-button pf-m-control" type="button" disabled>
|
|
237
|
+
<button class="pf-v6-c-button pf-m-control" type="button" disabled>
|
|
238
|
+
<span class="pf-v6-c-button__text">Clear</span>
|
|
239
|
+
</button>
|
|
220
240
|
</div>
|
|
221
241
|
</div>
|
|
222
242
|
</div>
|
|
@@ -260,10 +280,14 @@ cssPrefix: pf-v6-c-file-upload
|
|
|
260
280
|
type="button"
|
|
261
281
|
id="file-upload-error-browse"
|
|
262
282
|
aria-describedby="with-error-example-helper-text"
|
|
263
|
-
>
|
|
283
|
+
>
|
|
284
|
+
<span class="pf-v6-c-button__text">Upload</span>
|
|
285
|
+
</button>
|
|
264
286
|
</div>
|
|
265
287
|
<div class="pf-v6-c-input-group__item">
|
|
266
|
-
<button class="pf-v6-c-button pf-m-control" type="button">
|
|
288
|
+
<button class="pf-v6-c-button pf-m-control" type="button">
|
|
289
|
+
<span class="pf-v6-c-button__text">Clear</span>
|
|
290
|
+
</button>
|
|
267
291
|
</div>
|
|
268
292
|
</div>
|
|
269
293
|
</div>
|
|
@@ -334,10 +358,14 @@ cssPrefix: pf-v6-c-file-upload
|
|
|
334
358
|
type="button"
|
|
335
359
|
disabled
|
|
336
360
|
id="file-upload-loading-browse"
|
|
337
|
-
>
|
|
361
|
+
>
|
|
362
|
+
<span class="pf-v6-c-button__text">Upload</span>
|
|
363
|
+
</button>
|
|
338
364
|
</div>
|
|
339
365
|
<div class="pf-v6-c-input-group__item">
|
|
340
|
-
<button class="pf-v6-c-button pf-m-control" type="button">
|
|
366
|
+
<button class="pf-v6-c-button pf-m-control" type="button">
|
|
367
|
+
<span class="pf-v6-c-button__text">Clear</span>
|
|
368
|
+
</button>
|
|
341
369
|
</div>
|
|
342
370
|
</div>
|
|
343
371
|
</div>
|
|
@@ -20,7 +20,9 @@ cssPrefix: pf-v6-c-form
|
|
|
20
20
|
aria-label="More information for name field"
|
|
21
21
|
aria-describedby="form-vertical-name"
|
|
22
22
|
>
|
|
23
|
-
<
|
|
23
|
+
<span class="pf-v6-c-button__text">
|
|
24
|
+
<i class="fas fa-question-circle" aria-hidden="true"></i>
|
|
25
|
+
</span>
|
|
24
26
|
</span></span>
|
|
25
27
|
</div>
|
|
26
28
|
<div class="pf-v6-c-form__group-control">
|
|
@@ -68,7 +70,9 @@ cssPrefix: pf-v6-c-form
|
|
|
68
70
|
aria-label="More information for information field"
|
|
69
71
|
aria-describedby="form-horizontal-info"
|
|
70
72
|
>
|
|
71
|
-
<
|
|
73
|
+
<span class="pf-v6-c-button__text">
|
|
74
|
+
<i class="fas fa-question-circle" aria-hidden="true"></i>
|
|
75
|
+
</span>
|
|
72
76
|
</span></span>
|
|
73
77
|
</div>
|
|
74
78
|
<div class="pf-v6-c-form__group-control">
|
|
@@ -100,7 +104,9 @@ cssPrefix: pf-v6-c-form
|
|
|
100
104
|
aria-label="More information for label field"
|
|
101
105
|
aria-describedby="form-horizontal-checkbox-legend"
|
|
102
106
|
>
|
|
103
|
-
<
|
|
107
|
+
<span class="pf-v6-c-button__text">
|
|
108
|
+
<i class="fas fa-question-circle" aria-hidden="true"></i>
|
|
109
|
+
</span>
|
|
104
110
|
</span></span>
|
|
105
111
|
</div>
|
|
106
112
|
<div class="pf-v6-c-form__group-control pf-m-stack">
|
|
@@ -154,7 +160,9 @@ cssPrefix: pf-v6-c-form
|
|
|
154
160
|
aria-label="More information for name field"
|
|
155
161
|
aria-describedby="form-horizontal-custom-breakpoint-name"
|
|
156
162
|
>
|
|
157
|
-
<
|
|
163
|
+
<span class="pf-v6-c-button__text">
|
|
164
|
+
<i class="fas fa-question-circle" aria-hidden="true"></i>
|
|
165
|
+
</span>
|
|
158
166
|
</span></span>
|
|
159
167
|
</div>
|
|
160
168
|
<div class="pf-v6-c-form__group-control">
|
|
@@ -462,7 +470,9 @@ cssPrefix: pf-v6-c-form
|
|
|
462
470
|
aria-label="More information for name field"
|
|
463
471
|
aria-describedby="form-additional-infoform-additional-info-name"
|
|
464
472
|
>
|
|
465
|
-
<
|
|
473
|
+
<span class="pf-v6-c-button__text">
|
|
474
|
+
<i class="fas fa-question-circle" aria-hidden="true"></i>
|
|
475
|
+
</span>
|
|
466
476
|
</span></span>
|
|
467
477
|
</div>
|
|
468
478
|
<div class="pf-v6-c-form__group-label-info">info</div>
|
|
@@ -488,8 +498,12 @@ cssPrefix: pf-v6-c-form
|
|
|
488
498
|
<form class="pf-v6-c-form" novalidate>
|
|
489
499
|
<div class="pf-v6-c-form__group pf-m-action">
|
|
490
500
|
<div class="pf-v6-c-form__actions">
|
|
491
|
-
<button class="pf-v6-c-button pf-m-primary" type="submit">
|
|
492
|
-
|
|
501
|
+
<button class="pf-v6-c-button pf-m-primary" type="submit">
|
|
502
|
+
<span class="pf-v6-c-button__text">Submit form</span>
|
|
503
|
+
</button>
|
|
504
|
+
<button class="pf-v6-c-button pf-m-link" type="reset">
|
|
505
|
+
<span class="pf-v6-c-button__text">Reset form</span>
|
|
506
|
+
</button>
|
|
493
507
|
</div>
|
|
494
508
|
</div>
|
|
495
509
|
</form>
|
|
@@ -518,7 +532,9 @@ cssPrefix: pf-v6-c-form
|
|
|
518
532
|
>Field group description text</div>
|
|
519
533
|
</div>
|
|
520
534
|
<div class="pf-v6-c-form__field-group-header-actions">
|
|
521
|
-
<button class="pf-v6-c-button pf-m-secondary" type="button">
|
|
535
|
+
<button class="pf-v6-c-button pf-m-secondary" type="button">
|
|
536
|
+
<span class="pf-v6-c-button__text">Action</span>
|
|
537
|
+
</button>
|
|
522
538
|
</div>
|
|
523
539
|
</div>
|
|
524
540
|
<div class="pf-v6-c-form__field-group-body" hidden>
|
|
@@ -536,7 +552,9 @@ cssPrefix: pf-v6-c-form
|
|
|
536
552
|
aria-label="More information for label 1 field"
|
|
537
553
|
aria-describedby="form-field-group-field-group-label1"
|
|
538
554
|
>
|
|
539
|
-
<
|
|
555
|
+
<span class="pf-v6-c-button__text">
|
|
556
|
+
<i class="fas fa-question-circle" aria-hidden="true"></i>
|
|
557
|
+
</span>
|
|
540
558
|
</span></span>
|
|
541
559
|
</div>
|
|
542
560
|
<div class="pf-v6-c-form__group-control">
|
|
@@ -564,7 +582,9 @@ cssPrefix: pf-v6-c-form
|
|
|
564
582
|
aria-label="More information for label 2 field"
|
|
565
583
|
aria-describedby="form-field-group-field-group-label2"
|
|
566
584
|
>
|
|
567
|
-
<
|
|
585
|
+
<span class="pf-v6-c-button__text">
|
|
586
|
+
<i class="fas fa-question-circle" aria-hidden="true"></i>
|
|
587
|
+
</span>
|
|
568
588
|
</span></span>
|
|
569
589
|
</div>
|
|
570
590
|
<div class="pf-v6-c-form__group-control">
|
|
@@ -603,8 +623,10 @@ cssPrefix: pf-v6-c-form
|
|
|
603
623
|
id="form-expandable-field-groups-field-group-1-toggle"
|
|
604
624
|
aria-labelledby="form-expandable-field-groups-field-group-1-title form-expandable-field-groups-field-group-1-toggle"
|
|
605
625
|
>
|
|
606
|
-
<span class="pf-v6-c-
|
|
607
|
-
<
|
|
626
|
+
<span class="pf-v6-c-button__text">
|
|
627
|
+
<span class="pf-v6-c-form__field-group-toggle-icon">
|
|
628
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
629
|
+
</span>
|
|
608
630
|
</span>
|
|
609
631
|
</button>
|
|
610
632
|
</div>
|
|
@@ -622,7 +644,9 @@ cssPrefix: pf-v6-c-form
|
|
|
622
644
|
>Field group 1 description text</div>
|
|
623
645
|
</div>
|
|
624
646
|
<div class="pf-v6-c-form__field-group-header-actions">
|
|
625
|
-
<button class="pf-v6-c-button pf-m-secondary" type="button">
|
|
647
|
+
<button class="pf-v6-c-button pf-m-secondary" type="button">
|
|
648
|
+
<span class="pf-v6-c-button__text">Action</span>
|
|
649
|
+
</button>
|
|
626
650
|
</div>
|
|
627
651
|
</div>
|
|
628
652
|
</div>
|
|
@@ -641,8 +665,10 @@ cssPrefix: pf-v6-c-form
|
|
|
641
665
|
id="form-expandable-field-groups-field-group-2-toggle"
|
|
642
666
|
aria-labelledby="form-expandable-field-groups-field-group-2-title form-expandable-field-groups-field-group-2-toggle"
|
|
643
667
|
>
|
|
644
|
-
<span class="pf-v6-c-
|
|
645
|
-
<
|
|
668
|
+
<span class="pf-v6-c-button__text">
|
|
669
|
+
<span class="pf-v6-c-form__field-group-toggle-icon">
|
|
670
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
671
|
+
</span>
|
|
646
672
|
</span>
|
|
647
673
|
</button>
|
|
648
674
|
</div>
|
|
@@ -675,7 +701,9 @@ cssPrefix: pf-v6-c-form
|
|
|
675
701
|
aria-label="More information for label 1 field"
|
|
676
702
|
aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-2-label1"
|
|
677
703
|
>
|
|
678
|
-
<
|
|
704
|
+
<span class="pf-v6-c-button__text">
|
|
705
|
+
<i class="fas fa-question-circle" aria-hidden="true"></i>
|
|
706
|
+
</span>
|
|
679
707
|
</span></span>
|
|
680
708
|
</div>
|
|
681
709
|
<div class="pf-v6-c-form__group-control">
|
|
@@ -703,7 +731,9 @@ cssPrefix: pf-v6-c-form
|
|
|
703
731
|
aria-label="More information for label 2 field"
|
|
704
732
|
aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-2-label2"
|
|
705
733
|
>
|
|
706
|
-
<
|
|
734
|
+
<span class="pf-v6-c-button__text">
|
|
735
|
+
<i class="fas fa-question-circle" aria-hidden="true"></i>
|
|
736
|
+
</span>
|
|
707
737
|
</span></span>
|
|
708
738
|
</div>
|
|
709
739
|
<div class="pf-v6-c-form__group-control">
|
|
@@ -750,7 +780,9 @@ cssPrefix: pf-v6-c-form
|
|
|
750
780
|
aria-label="More information for label 1 field"
|
|
751
781
|
aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-3-label1"
|
|
752
782
|
>
|
|
753
|
-
<
|
|
783
|
+
<span class="pf-v6-c-button__text">
|
|
784
|
+
<i class="fas fa-question-circle" aria-hidden="true"></i>
|
|
785
|
+
</span>
|
|
754
786
|
</span></span>
|
|
755
787
|
</div>
|
|
756
788
|
<div class="pf-v6-c-form__group-control">
|
|
@@ -781,7 +813,9 @@ cssPrefix: pf-v6-c-form
|
|
|
781
813
|
aria-label="More information for label 2 field"
|
|
782
814
|
aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-3-label2"
|
|
783
815
|
>
|
|
784
|
-
<
|
|
816
|
+
<span class="pf-v6-c-button__text">
|
|
817
|
+
<i class="fas fa-question-circle" aria-hidden="true"></i>
|
|
818
|
+
</span>
|
|
785
819
|
</span></span>
|
|
786
820
|
</div>
|
|
787
821
|
<div class="pf-v6-c-form__group-control">
|
|
@@ -48,10 +48,9 @@ cssPrefix: pf-v6-c-hint
|
|
|
48
48
|
class="pf-v6-c-hint__body"
|
|
49
49
|
>Upgrade to Red Hat Smart Management to remediate all your systems across regions and geographies.</div>
|
|
50
50
|
<div class="pf-v6-c-hint__footer">
|
|
51
|
-
<button
|
|
52
|
-
class="pf-v6-c-
|
|
53
|
-
|
|
54
|
-
>Try it for 90 days</button>
|
|
51
|
+
<button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">
|
|
52
|
+
<span class="pf-v6-c-button__text">Try it for 90 days</span>
|
|
53
|
+
</button>
|
|
55
54
|
</div>
|
|
56
55
|
</div>
|
|
57
56
|
|
|
@@ -87,10 +86,9 @@ cssPrefix: pf-v6-c-hint
|
|
|
87
86
|
class="pf-v6-c-hint__body"
|
|
88
87
|
>Upgrade to Red Hat Smart Management to remediate all your systems across regions and geographies.</div>
|
|
89
88
|
<div class="pf-v6-c-hint__footer">
|
|
90
|
-
<button
|
|
91
|
-
class="pf-v6-c-
|
|
92
|
-
|
|
93
|
-
>Try it for 90 days</button>
|
|
89
|
+
<button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">
|
|
90
|
+
<span class="pf-v6-c-button__text">Try it for 90 days</span>
|
|
91
|
+
</button>
|
|
94
92
|
</div>
|
|
95
93
|
</div>
|
|
96
94
|
|
|
@@ -101,7 +99,9 @@ cssPrefix: pf-v6-c-hint
|
|
|
101
99
|
```html
|
|
102
100
|
<div class="pf-v6-c-hint">
|
|
103
101
|
<div class="pf-v6-c-hint__actions pf-m-no-offset">
|
|
104
|
-
<button class="pf-v6-c-button pf-m-primary" type="button">
|
|
102
|
+
<button class="pf-v6-c-button pf-m-primary" type="button">
|
|
103
|
+
<span class="pf-v6-c-button__text">Action</span>
|
|
104
|
+
</button>
|
|
105
105
|
</div>
|
|
106
106
|
<div class="pf-v6-c-hint__title">Do more with Find it Fix it capabilities</div>
|
|
107
107
|
<div
|