@patternfly/patternfly 4.179.1 → 4.180.0

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 (36) hide show
  1. package/components/Dropdown/dropdown.css +4 -2
  2. package/components/Dropdown/dropdown.scss +4 -2
  3. package/components/FormControl/form-control.scss +3 -0
  4. package/components/MenuToggle/menu-toggle.css +4 -1
  5. package/components/MenuToggle/menu-toggle.scss +4 -3
  6. package/components/SearchInput/search-input.css +1 -0
  7. package/components/SearchInput/search-input.scss +1 -0
  8. package/components/Select/select.css +3 -2
  9. package/components/Select/select.scss +4 -2
  10. package/docs/components/AppLauncher/examples/application-launcher.md +15 -8
  11. package/docs/components/ContextSelector/examples/context-selector.md +84 -102
  12. package/docs/components/DualListSelector/examples/DualListSelector.md +240 -112
  13. package/docs/components/FormControl/examples/FormControl.md +0 -11
  14. package/docs/components/InputGroup/examples/InputGroup.md +6 -22
  15. package/docs/components/LabelGroup/examples/LabelGroup.md +135 -2
  16. package/docs/components/LogViewer/examples/LogViewer.md +567 -198
  17. package/docs/components/Menu/examples/Menu.md +1908 -983
  18. package/docs/components/MenuToggle/examples/MenuToggle.md +77 -44
  19. package/docs/components/Nav/examples/Navigation.md +563 -231
  20. package/docs/components/Select/examples/Select.md +30 -14
  21. package/docs/components/Spinner/examples/Spinner.md +50 -55
  22. package/docs/components/Toolbar/examples/Toolbar.md +300 -180
  23. package/docs/components/TreeView/examples/TreeView.md +15 -7
  24. package/docs/demos/ContextSelector/examples/ContextSelector.md +515 -218
  25. package/docs/demos/DataList/examples/DataList.md +159 -114
  26. package/docs/demos/Masthead/examples/Masthead.md +482 -237
  27. package/docs/demos/Page/examples/Page.md +945 -350
  28. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +3 -3
  29. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +207 -126
  30. package/docs/demos/Table/examples/Table.md +2459 -1090
  31. package/docs/demos/Toolbar/examples/Toolbar.md +55 -55
  32. package/package.json +1 -1
  33. package/patternfly-no-reset.css +12 -5
  34. package/patternfly.css +12 -5
  35. package/patternfly.min.css +1 -1
  36. package/patternfly.min.css.map +1 -1
@@ -53,23 +53,6 @@ cssPrefix: pf-c-menu-toggle
53
53
 
54
54
  ```
55
55
 
56
- ### Icon
57
-
58
- ```html
59
- <button class="pf-c-menu-toggle" type="button" aria-expanded="false">
60
- <span class="pf-c-menu-toggle__icon">
61
- <i class="fas fa-cog" aria-hidden="true"></i>
62
- </span>
63
- <span class="pf-c-menu-toggle__text">Icon</span>
64
- <span class="pf-c-menu-toggle__controls">
65
- <span class="pf-c-menu-toggle__toggle-icon">
66
- <i class="fas fa-caret-down" aria-hidden="true"></i>
67
- </span>
68
- </span>
69
- </button>
70
-
71
- ```
72
-
73
56
  ### Count
74
57
 
75
58
  ```html
@@ -167,23 +150,6 @@ cssPrefix: pf-c-menu-toggle
167
150
  </span>
168
151
  </button>
169
152
 
170
- &nbsp;
171
- <button
172
- class="pf-c-menu-toggle pf-m-secondary"
173
- type="button"
174
- aria-expanded="false"
175
- >
176
- <span class="pf-c-menu-toggle__icon">
177
- <i class="fas fa-cog" aria-hidden="true"></i>
178
- </span>
179
- <span class="pf-c-menu-toggle__text">Icon</span>
180
- <span class="pf-c-menu-toggle__controls">
181
- <span class="pf-c-menu-toggle__toggle-icon">
182
- <i class="fas fa-caret-down" aria-hidden="true"></i>
183
- </span>
184
- </span>
185
- </button>
186
-
187
153
  &nbsp;
188
154
  <button
189
155
  class="pf-c-menu-toggle pf-m-secondary pf-m-expanded"
@@ -281,13 +247,38 @@ cssPrefix: pf-c-menu-toggle
281
247
  </span>
282
248
  </button>
283
249
 
250
+ ```
251
+
252
+ ### With icon/image and text
253
+
254
+ ```html
255
+ <button
256
+ class="pf-c-menu-toggle pf-m-secondary"
257
+ type="button"
258
+ aria-expanded="false"
259
+ >
260
+ <span class="pf-c-menu-toggle__icon">
261
+ <i class="fas fa-cog" aria-hidden="true"></i>
262
+ </span>
263
+ <span class="pf-c-menu-toggle__text">Icon</span>
264
+ <span class="pf-c-menu-toggle__controls">
265
+ <span class="pf-c-menu-toggle__toggle-icon">
266
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
267
+ </span>
268
+ </span>
269
+ </button>
270
+
284
271
  &nbsp;
285
272
  <button
286
- class="pf-c-menu-toggle pf-m-plain pf-m-text pf-m-expanded"
273
+ class="pf-c-menu-toggle pf-m-secondary"
287
274
  type="button"
288
- aria-expanded="true"
275
+ aria-expanded="false"
276
+ disabled
289
277
  >
290
- <span class="pf-c-menu-toggle__text">Custom text (expanded)</span>
278
+ <span class="pf-c-menu-toggle__icon">
279
+ <i class="fas fa-cog" aria-hidden="true"></i>
280
+ </span>
281
+ <span class="pf-c-menu-toggle__text">Icon</span>
291
282
  <span class="pf-c-menu-toggle__controls">
292
283
  <span class="pf-c-menu-toggle__toggle-icon">
293
284
  <i class="fas fa-caret-down" aria-hidden="true"></i>
@@ -297,15 +288,58 @@ cssPrefix: pf-c-menu-toggle
297
288
 
298
289
  ```
299
290
 
300
- ### With image and text
291
+ ### With avatar and text
301
292
 
302
293
  ```html
303
294
  <button class="pf-c-menu-toggle" type="button" aria-expanded="false">
304
- <span class="pf-c-menu-toggle__image">
295
+ <span class="pf-c-menu-toggle__icon">
296
+ <img
297
+ class="pf-c-avatar pf-m-light"
298
+ src="/assets/images/img_avatar-light.svg"
299
+ alt="Avatar image light"
300
+ />
301
+ </span>
302
+ <span class="pf-c-menu-toggle__text">Ned Username</span>
303
+ <span class="pf-c-menu-toggle__controls">
304
+ <span class="pf-c-menu-toggle__toggle-icon">
305
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
306
+ </span>
307
+ </span>
308
+ </button>
309
+
310
+ &nbsp;
311
+ <button
312
+ class="pf-c-menu-toggle pf-m-expanded"
313
+ type="button"
314
+ aria-expanded="true"
315
+ >
316
+ <span class="pf-c-menu-toggle__icon">
317
+ <img
318
+ class="pf-c-avatar pf-m-light"
319
+ src="/assets/images/img_avatar-light.svg"
320
+ alt="Avatar image light"
321
+ />
322
+ </span>
323
+ <span class="pf-c-menu-toggle__text">Ned Username</span>
324
+ <span class="pf-c-menu-toggle__controls">
325
+ <span class="pf-c-menu-toggle__toggle-icon">
326
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
327
+ </span>
328
+ </span>
329
+ </button>
330
+
331
+ &nbsp;
332
+ <button
333
+ class="pf-c-menu-toggle"
334
+ type="button"
335
+ aria-expanded="false"
336
+ disabled
337
+ >
338
+ <span class="pf-c-menu-toggle__icon">
305
339
  <img
306
- class="pf-c-avatar"
307
- src="/assets/images/img_avatar.svg"
308
- alt="Avatar image"
340
+ class="pf-c-avatar pf-m-light"
341
+ src="/assets/images/img_avatar-light.svg"
342
+ alt="Avatar image light"
309
343
  />
310
344
  </span>
311
345
  <span class="pf-c-menu-toggle__text">Ned Username</span>
@@ -350,8 +384,7 @@ cssPrefix: pf-c-menu-toggle
350
384
  | Class | Applied | Outcome |
351
385
  | -------------------------------- | ------------------- | --------------------------------------------------------------- |
352
386
  | `.pf-c-menu-toggle` | `<button>` | Initiates the menu toggle component. |
353
- | `.pf-c-menu-toggle__icon` | `<span>` | Defines the menu toggle component icon. |
354
- | `.pf-c-menu-toggle__image` | `<span>` | Defines the menu toggle component image. |
387
+ | `.pf-c-menu-toggle__icon` | `<span>` | Defines the menu toggle component icon/image. |
355
388
  | `.pf-c-menu-toggle__text` | `<span>` | Defines the menu toggle component text. |
356
389
  | `.pf-c-menu-toggle__count` | `<span>` | Defines the menu toggle component count. |
357
390
  | `.pf-c-menu-toggle__controls` | `<span>` | Defines the menu toggle component controls. |