@patternfly/patternfly 4.179.2 → 4.180.1

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 (45) 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 +10 -7
  5. package/components/MenuToggle/menu-toggle.scss +11 -9
  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/LogViewer/examples/LogViewer.md +567 -198
  16. package/docs/components/Menu/examples/Menu.md +1908 -983
  17. package/docs/components/MenuToggle/examples/MenuToggle.md +77 -44
  18. package/docs/components/Nav/examples/Navigation.md +563 -231
  19. package/docs/components/Page/examples/Page.md +11 -2
  20. package/docs/components/Select/examples/Select.md +30 -14
  21. package/docs/components/Table/examples/Table.md +8 -0
  22. package/docs/components/Toolbar/examples/Toolbar.md +300 -180
  23. package/docs/components/TreeView/examples/TreeView.md +15 -7
  24. package/docs/components/Wizard/examples/Wizard.md +6 -6
  25. package/docs/demos/Alert/examples/Alert.md +20 -40
  26. package/docs/demos/BackToTop/examples/BackToTop.md +149 -249
  27. package/docs/demos/ContextSelector/examples/ContextSelector.md +595 -378
  28. package/docs/demos/DataList/examples/DataList.md +159 -114
  29. package/docs/demos/Drawer/examples/Drawer.md +60 -120
  30. package/docs/demos/JumpLinks/examples/JumpLinks.md +80 -31
  31. package/docs/demos/Masthead/examples/Masthead.md +622 -517
  32. package/docs/demos/Nav/examples/Nav.md +203 -343
  33. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +100 -200
  34. package/docs/demos/Page/examples/Page.md +1522 -1475
  35. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +3 -3
  36. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +207 -126
  37. package/docs/demos/Table/examples/Table.md +2459 -1090
  38. package/docs/demos/Tabs/examples/Tabs.md +11 -19
  39. package/docs/demos/Toolbar/examples/Toolbar.md +55 -55
  40. package/docs/demos/Wizard/examples/Wizard.md +6 -2
  41. package/package.json +1 -1
  42. package/patternfly-no-reset.css +18 -11
  43. package/patternfly.css +18 -11
  44. package/patternfly.min.css +1 -1
  45. package/patternfly.min.css.map +1 -1
package/docs/components/MenuToggle/examples/MenuToggle.md CHANGED
@@ -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. |