@patternfly/patternfly 4.177.1 → 4.178.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.
@@ -12,6 +12,7 @@ wrapperTag: div
12
12
  class="pf-c-skip-to-content pf-c-button pf-m-primary"
13
13
  href="#main-content-basic-demo"
14
14
  >Skip to content</a>
15
+
15
16
  <header class="pf-c-masthead" id="basic-demo-masthead">
16
17
  <span class="pf-c-masthead__toggle">
17
18
  <button
@@ -64,6 +65,141 @@ wrapperTag: div
64
65
  <div
65
66
  class="pf-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
66
67
  >
68
+ <div class="pf-c-toolbar__item">
69
+ <nav
70
+ class="pf-c-app-launcher"
71
+ aria-label="Application launcher"
72
+ id="basic-demo-masthead-icon-group--app-launcher"
73
+ >
74
+ <button
75
+ class="pf-c-app-launcher__toggle"
76
+ type="button"
77
+ id="-button"
78
+ aria-expanded="false"
79
+ aria-label="Application launcher"
80
+ >
81
+ <i class="fas fa-th" aria-hidden="true"></i>
82
+ </button>
83
+ <div
84
+ class="pf-c-app-launcher__menu pf-m-align-right"
85
+ hidden
86
+ >
87
+ <div class="pf-c-app-launcher__menu-search">
88
+ <input
89
+ class="pf-c-form-control"
90
+ type="search"
91
+ aria-label="Type to filter"
92
+ placeholder="Filter by name..."
93
+ id="basic-demo-masthead-application-launcher-text-input"
94
+ name="textInput1"
95
+ />
96
+ </div>
97
+ <section class="pf-c-app-launcher__group">
98
+ <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
99
+ <ul>
100
+ <li
101
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
102
+ >
103
+ <a class="pf-c-app-launcher__menu-item">
104
+ Link 1
105
+ <span
106
+ class="pf-c-app-launcher__menu-item-external-icon"
107
+ >
108
+ <i
109
+ class="fas fa-external-link-alt"
110
+ aria-hidden="true"
111
+ ></i>
112
+ </span>
113
+ <span class="pf-screen-reader">(opens new window)</span>
114
+ </a>
115
+ <button
116
+ class="pf-c-app-launcher__menu-item pf-m-action"
117
+ type="button"
118
+ aria-label="Favorite"
119
+ >
120
+ <i class="fas fa-star" aria-hidden="true"></i>
121
+ </button>
122
+ </li>
123
+ <li
124
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
125
+ >
126
+ <a class="pf-c-app-launcher__menu-item">
127
+ Link 2
128
+ <span
129
+ class="pf-c-app-launcher__menu-item-external-icon"
130
+ >
131
+ <i
132
+ class="fas fa-external-link-alt"
133
+ aria-hidden="true"
134
+ ></i>
135
+ </span>
136
+ <span class="pf-screen-reader">(opens new window)</span>
137
+ </a>
138
+ <button
139
+ class="pf-c-app-launcher__menu-item pf-m-action"
140
+ type="button"
141
+ aria-label="Favorite"
142
+ >
143
+ <i class="fas fa-star" aria-hidden="true"></i>
144
+ </button>
145
+ </li>
146
+ </ul>
147
+ </section>
148
+ <hr class="pf-c-divider" />
149
+ <section class="pf-c-app-launcher__group">
150
+ <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
151
+ <ul>
152
+ <li
153
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
154
+ >
155
+ <a class="pf-c-app-launcher__menu-item">
156
+ Link 1
157
+ <span
158
+ class="pf-c-app-launcher__menu-item-external-icon"
159
+ >
160
+ <i
161
+ class="fas fa-external-link-alt"
162
+ aria-hidden="true"
163
+ ></i>
164
+ </span>
165
+ <span class="pf-screen-reader">(opens new window)</span>
166
+ </a>
167
+ <button
168
+ class="pf-c-app-launcher__menu-item pf-m-action"
169
+ type="button"
170
+ aria-label="Favorite"
171
+ >
172
+ <i class="fas fa-star" aria-hidden="true"></i>
173
+ </button>
174
+ </li>
175
+ <li
176
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
177
+ >
178
+ <a class="pf-c-app-launcher__menu-item">
179
+ Link 2
180
+ <span
181
+ class="pf-c-app-launcher__menu-item-external-icon"
182
+ >
183
+ <i
184
+ class="fas fa-external-link-alt"
185
+ aria-hidden="true"
186
+ ></i>
187
+ </span>
188
+ <span class="pf-screen-reader">(opens new window)</span>
189
+ </a>
190
+ <button
191
+ class="pf-c-app-launcher__menu-item pf-m-action"
192
+ type="button"
193
+ aria-label="Favorite"
194
+ >
195
+ <i class="fas fa-star" aria-hidden="true"></i>
196
+ </button>
197
+ </li>
198
+ </ul>
199
+ </section>
200
+ </div>
201
+ </nav>
202
+ </div>
67
203
  <div class="pf-c-toolbar__item">
68
204
  <div class="pf-c-dropdown">
69
205
  <button
@@ -104,7 +240,7 @@ wrapperTag: div
104
240
  type="button"
105
241
  aria-label="Help"
106
242
  >
107
- <i class="pf-icon pf-icon-help" aria-hidden="true"></i>
243
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
108
244
  </button>
109
245
  <ul
110
246
  class="pf-c-dropdown__menu pf-m-align-right"
@@ -1486,6 +1622,7 @@ wrapperTag: div
1486
1622
  class="pf-c-skip-to-content pf-c-button pf-m-primary"
1487
1623
  href="#main-content-sortable-demo"
1488
1624
  >Skip to content</a>
1625
+
1489
1626
  <header class="pf-c-masthead" id="sortable-demo-masthead">
1490
1627
  <span class="pf-c-masthead__toggle">
1491
1628
  <button
@@ -1538,6 +1675,141 @@ wrapperTag: div
1538
1675
  <div
1539
1676
  class="pf-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
1540
1677
  >
1678
+ <div class="pf-c-toolbar__item">
1679
+ <nav
1680
+ class="pf-c-app-launcher"
1681
+ aria-label="Application launcher"
1682
+ id="sortable-demo-masthead-icon-group--app-launcher"
1683
+ >
1684
+ <button
1685
+ class="pf-c-app-launcher__toggle"
1686
+ type="button"
1687
+ id="-button"
1688
+ aria-expanded="false"
1689
+ aria-label="Application launcher"
1690
+ >
1691
+ <i class="fas fa-th" aria-hidden="true"></i>
1692
+ </button>
1693
+ <div
1694
+ class="pf-c-app-launcher__menu pf-m-align-right"
1695
+ hidden
1696
+ >
1697
+ <div class="pf-c-app-launcher__menu-search">
1698
+ <input
1699
+ class="pf-c-form-control"
1700
+ type="search"
1701
+ aria-label="Type to filter"
1702
+ placeholder="Filter by name..."
1703
+ id="sortable-demo-masthead-application-launcher-text-input"
1704
+ name="textInput1"
1705
+ />
1706
+ </div>
1707
+ <section class="pf-c-app-launcher__group">
1708
+ <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
1709
+ <ul>
1710
+ <li
1711
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
1712
+ >
1713
+ <a class="pf-c-app-launcher__menu-item">
1714
+ Link 1
1715
+ <span
1716
+ class="pf-c-app-launcher__menu-item-external-icon"
1717
+ >
1718
+ <i
1719
+ class="fas fa-external-link-alt"
1720
+ aria-hidden="true"
1721
+ ></i>
1722
+ </span>
1723
+ <span class="pf-screen-reader">(opens new window)</span>
1724
+ </a>
1725
+ <button
1726
+ class="pf-c-app-launcher__menu-item pf-m-action"
1727
+ type="button"
1728
+ aria-label="Favorite"
1729
+ >
1730
+ <i class="fas fa-star" aria-hidden="true"></i>
1731
+ </button>
1732
+ </li>
1733
+ <li
1734
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
1735
+ >
1736
+ <a class="pf-c-app-launcher__menu-item">
1737
+ Link 2
1738
+ <span
1739
+ class="pf-c-app-launcher__menu-item-external-icon"
1740
+ >
1741
+ <i
1742
+ class="fas fa-external-link-alt"
1743
+ aria-hidden="true"
1744
+ ></i>
1745
+ </span>
1746
+ <span class="pf-screen-reader">(opens new window)</span>
1747
+ </a>
1748
+ <button
1749
+ class="pf-c-app-launcher__menu-item pf-m-action"
1750
+ type="button"
1751
+ aria-label="Favorite"
1752
+ >
1753
+ <i class="fas fa-star" aria-hidden="true"></i>
1754
+ </button>
1755
+ </li>
1756
+ </ul>
1757
+ </section>
1758
+ <hr class="pf-c-divider" />
1759
+ <section class="pf-c-app-launcher__group">
1760
+ <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
1761
+ <ul>
1762
+ <li
1763
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
1764
+ >
1765
+ <a class="pf-c-app-launcher__menu-item">
1766
+ Link 1
1767
+ <span
1768
+ class="pf-c-app-launcher__menu-item-external-icon"
1769
+ >
1770
+ <i
1771
+ class="fas fa-external-link-alt"
1772
+ aria-hidden="true"
1773
+ ></i>
1774
+ </span>
1775
+ <span class="pf-screen-reader">(opens new window)</span>
1776
+ </a>
1777
+ <button
1778
+ class="pf-c-app-launcher__menu-item pf-m-action"
1779
+ type="button"
1780
+ aria-label="Favorite"
1781
+ >
1782
+ <i class="fas fa-star" aria-hidden="true"></i>
1783
+ </button>
1784
+ </li>
1785
+ <li
1786
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
1787
+ >
1788
+ <a class="pf-c-app-launcher__menu-item">
1789
+ Link 2
1790
+ <span
1791
+ class="pf-c-app-launcher__menu-item-external-icon"
1792
+ >
1793
+ <i
1794
+ class="fas fa-external-link-alt"
1795
+ aria-hidden="true"
1796
+ ></i>
1797
+ </span>
1798
+ <span class="pf-screen-reader">(opens new window)</span>
1799
+ </a>
1800
+ <button
1801
+ class="pf-c-app-launcher__menu-item pf-m-action"
1802
+ type="button"
1803
+ aria-label="Favorite"
1804
+ >
1805
+ <i class="fas fa-star" aria-hidden="true"></i>
1806
+ </button>
1807
+ </li>
1808
+ </ul>
1809
+ </section>
1810
+ </div>
1811
+ </nav>
1812
+ </div>
1541
1813
  <div class="pf-c-toolbar__item">
1542
1814
  <div class="pf-c-dropdown">
1543
1815
  <button
@@ -1578,7 +1850,7 @@ wrapperTag: div
1578
1850
  type="button"
1579
1851
  aria-label="Help"
1580
1852
  >
1581
- <i class="pf-icon pf-icon-help" aria-hidden="true"></i>
1853
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
1582
1854
  </button>
1583
1855
  <ul
1584
1856
  class="pf-c-dropdown__menu pf-m-align-right"
@@ -3134,6 +3406,7 @@ wrapperTag: div
3134
3406
  class="pf-c-skip-to-content pf-c-button pf-m-primary"
3135
3407
  href="#main-content-expandable-demo"
3136
3408
  >Skip to content</a>
3409
+
3137
3410
  <header class="pf-c-masthead" id="expandable-demo-masthead">
3138
3411
  <span class="pf-c-masthead__toggle">
3139
3412
  <button
@@ -3186,6 +3459,141 @@ wrapperTag: div
3186
3459
  <div
3187
3460
  class="pf-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
3188
3461
  >
3462
+ <div class="pf-c-toolbar__item">
3463
+ <nav
3464
+ class="pf-c-app-launcher"
3465
+ aria-label="Application launcher"
3466
+ id="expandable-demo-masthead-icon-group--app-launcher"
3467
+ >
3468
+ <button
3469
+ class="pf-c-app-launcher__toggle"
3470
+ type="button"
3471
+ id="-button"
3472
+ aria-expanded="false"
3473
+ aria-label="Application launcher"
3474
+ >
3475
+ <i class="fas fa-th" aria-hidden="true"></i>
3476
+ </button>
3477
+ <div
3478
+ class="pf-c-app-launcher__menu pf-m-align-right"
3479
+ hidden
3480
+ >
3481
+ <div class="pf-c-app-launcher__menu-search">
3482
+ <input
3483
+ class="pf-c-form-control"
3484
+ type="search"
3485
+ aria-label="Type to filter"
3486
+ placeholder="Filter by name..."
3487
+ id="expandable-demo-masthead-application-launcher-text-input"
3488
+ name="textInput1"
3489
+ />
3490
+ </div>
3491
+ <section class="pf-c-app-launcher__group">
3492
+ <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
3493
+ <ul>
3494
+ <li
3495
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
3496
+ >
3497
+ <a class="pf-c-app-launcher__menu-item">
3498
+ Link 1
3499
+ <span
3500
+ class="pf-c-app-launcher__menu-item-external-icon"
3501
+ >
3502
+ <i
3503
+ class="fas fa-external-link-alt"
3504
+ aria-hidden="true"
3505
+ ></i>
3506
+ </span>
3507
+ <span class="pf-screen-reader">(opens new window)</span>
3508
+ </a>
3509
+ <button
3510
+ class="pf-c-app-launcher__menu-item pf-m-action"
3511
+ type="button"
3512
+ aria-label="Favorite"
3513
+ >
3514
+ <i class="fas fa-star" aria-hidden="true"></i>
3515
+ </button>
3516
+ </li>
3517
+ <li
3518
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
3519
+ >
3520
+ <a class="pf-c-app-launcher__menu-item">
3521
+ Link 2
3522
+ <span
3523
+ class="pf-c-app-launcher__menu-item-external-icon"
3524
+ >
3525
+ <i
3526
+ class="fas fa-external-link-alt"
3527
+ aria-hidden="true"
3528
+ ></i>
3529
+ </span>
3530
+ <span class="pf-screen-reader">(opens new window)</span>
3531
+ </a>
3532
+ <button
3533
+ class="pf-c-app-launcher__menu-item pf-m-action"
3534
+ type="button"
3535
+ aria-label="Favorite"
3536
+ >
3537
+ <i class="fas fa-star" aria-hidden="true"></i>
3538
+ </button>
3539
+ </li>
3540
+ </ul>
3541
+ </section>
3542
+ <hr class="pf-c-divider" />
3543
+ <section class="pf-c-app-launcher__group">
3544
+ <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
3545
+ <ul>
3546
+ <li
3547
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
3548
+ >
3549
+ <a class="pf-c-app-launcher__menu-item">
3550
+ Link 1
3551
+ <span
3552
+ class="pf-c-app-launcher__menu-item-external-icon"
3553
+ >
3554
+ <i
3555
+ class="fas fa-external-link-alt"
3556
+ aria-hidden="true"
3557
+ ></i>
3558
+ </span>
3559
+ <span class="pf-screen-reader">(opens new window)</span>
3560
+ </a>
3561
+ <button
3562
+ class="pf-c-app-launcher__menu-item pf-m-action"
3563
+ type="button"
3564
+ aria-label="Favorite"
3565
+ >
3566
+ <i class="fas fa-star" aria-hidden="true"></i>
3567
+ </button>
3568
+ </li>
3569
+ <li
3570
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
3571
+ >
3572
+ <a class="pf-c-app-launcher__menu-item">
3573
+ Link 2
3574
+ <span
3575
+ class="pf-c-app-launcher__menu-item-external-icon"
3576
+ >
3577
+ <i
3578
+ class="fas fa-external-link-alt"
3579
+ aria-hidden="true"
3580
+ ></i>
3581
+ </span>
3582
+ <span class="pf-screen-reader">(opens new window)</span>
3583
+ </a>
3584
+ <button
3585
+ class="pf-c-app-launcher__menu-item pf-m-action"
3586
+ type="button"
3587
+ aria-label="Favorite"
3588
+ >
3589
+ <i class="fas fa-star" aria-hidden="true"></i>
3590
+ </button>
3591
+ </li>
3592
+ </ul>
3593
+ </section>
3594
+ </div>
3595
+ </nav>
3596
+ </div>
3189
3597
  <div class="pf-c-toolbar__item">
3190
3598
  <div class="pf-c-dropdown">
3191
3599
  <button
@@ -3226,7 +3634,7 @@ wrapperTag: div
3226
3634
  type="button"
3227
3635
  aria-label="Help"
3228
3636
  >
3229
- <i class="pf-icon pf-icon-help" aria-hidden="true"></i>
3637
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
3230
3638
  </button>
3231
3639
  <ul
3232
3640
  class="pf-c-dropdown__menu pf-m-align-right"
@@ -4984,6 +5392,7 @@ wrapperTag: div
4984
5392
  class="pf-c-skip-to-content pf-c-button pf-m-primary"
4985
5393
  href="#main-content-compact-demo"
4986
5394
  >Skip to content</a>
5395
+
4987
5396
  <header class="pf-c-masthead" id="compact-demo-masthead">
4988
5397
  <span class="pf-c-masthead__toggle">
4989
5398
  <button
@@ -5036,6 +5445,141 @@ wrapperTag: div
5036
5445
  <div
5037
5446
  class="pf-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
5038
5447
  >
5448
+ <div class="pf-c-toolbar__item">
5449
+ <nav
5450
+ class="pf-c-app-launcher"
5451
+ aria-label="Application launcher"
5452
+ id="compact-demo-masthead-icon-group--app-launcher"
5453
+ >
5454
+ <button
5455
+ class="pf-c-app-launcher__toggle"
5456
+ type="button"
5457
+ id="-button"
5458
+ aria-expanded="false"
5459
+ aria-label="Application launcher"
5460
+ >
5461
+ <i class="fas fa-th" aria-hidden="true"></i>
5462
+ </button>
5463
+ <div
5464
+ class="pf-c-app-launcher__menu pf-m-align-right"
5465
+ hidden
5466
+ >
5467
+ <div class="pf-c-app-launcher__menu-search">
5468
+ <input
5469
+ class="pf-c-form-control"
5470
+ type="search"
5471
+ aria-label="Type to filter"
5472
+ placeholder="Filter by name..."
5473
+ id="compact-demo-masthead-application-launcher-text-input"
5474
+ name="textInput1"
5475
+ />
5476
+ </div>
5477
+ <section class="pf-c-app-launcher__group">
5478
+ <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
5479
+ <ul>
5480
+ <li
5481
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
5482
+ >
5483
+ <a class="pf-c-app-launcher__menu-item">
5484
+ Link 1
5485
+ <span
5486
+ class="pf-c-app-launcher__menu-item-external-icon"
5487
+ >
5488
+ <i
5489
+ class="fas fa-external-link-alt"
5490
+ aria-hidden="true"
5491
+ ></i>
5492
+ </span>
5493
+ <span class="pf-screen-reader">(opens new window)</span>
5494
+ </a>
5495
+ <button
5496
+ class="pf-c-app-launcher__menu-item pf-m-action"
5497
+ type="button"
5498
+ aria-label="Favorite"
5499
+ >
5500
+ <i class="fas fa-star" aria-hidden="true"></i>
5501
+ </button>
5502
+ </li>
5503
+ <li
5504
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
5505
+ >
5506
+ <a class="pf-c-app-launcher__menu-item">
5507
+ Link 2
5508
+ <span
5509
+ class="pf-c-app-launcher__menu-item-external-icon"
5510
+ >
5511
+ <i
5512
+ class="fas fa-external-link-alt"
5513
+ aria-hidden="true"
5514
+ ></i>
5515
+ </span>
5516
+ <span class="pf-screen-reader">(opens new window)</span>
5517
+ </a>
5518
+ <button
5519
+ class="pf-c-app-launcher__menu-item pf-m-action"
5520
+ type="button"
5521
+ aria-label="Favorite"
5522
+ >
5523
+ <i class="fas fa-star" aria-hidden="true"></i>
5524
+ </button>
5525
+ </li>
5526
+ </ul>
5527
+ </section>
5528
+ <hr class="pf-c-divider" />
5529
+ <section class="pf-c-app-launcher__group">
5530
+ <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
5531
+ <ul>
5532
+ <li
5533
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
5534
+ >
5535
+ <a class="pf-c-app-launcher__menu-item">
5536
+ Link 1
5537
+ <span
5538
+ class="pf-c-app-launcher__menu-item-external-icon"
5539
+ >
5540
+ <i
5541
+ class="fas fa-external-link-alt"
5542
+ aria-hidden="true"
5543
+ ></i>
5544
+ </span>
5545
+ <span class="pf-screen-reader">(opens new window)</span>
5546
+ </a>
5547
+ <button
5548
+ class="pf-c-app-launcher__menu-item pf-m-action"
5549
+ type="button"
5550
+ aria-label="Favorite"
5551
+ >
5552
+ <i class="fas fa-star" aria-hidden="true"></i>
5553
+ </button>
5554
+ </li>
5555
+ <li
5556
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
5557
+ >
5558
+ <a class="pf-c-app-launcher__menu-item">
5559
+ Link 2
5560
+ <span
5561
+ class="pf-c-app-launcher__menu-item-external-icon"
5562
+ >
5563
+ <i
5564
+ class="fas fa-external-link-alt"
5565
+ aria-hidden="true"
5566
+ ></i>
5567
+ </span>
5568
+ <span class="pf-screen-reader">(opens new window)</span>
5569
+ </a>
5570
+ <button
5571
+ class="pf-c-app-launcher__menu-item pf-m-action"
5572
+ type="button"
5573
+ aria-label="Favorite"
5574
+ >
5575
+ <i class="fas fa-star" aria-hidden="true"></i>
5576
+ </button>
5577
+ </li>
5578
+ </ul>
5579
+ </section>
5580
+ </div>
5581
+ </nav>
5582
+ </div>
5039
5583
  <div class="pf-c-toolbar__item">
5040
5584
  <div class="pf-c-dropdown">
5041
5585
  <button
@@ -5076,7 +5620,7 @@ wrapperTag: div
5076
5620
  type="button"
5077
5621
  aria-label="Help"
5078
5622
  >
5079
- <i class="pf-icon pf-icon-help" aria-hidden="true"></i>
5623
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
5080
5624
  </button>
5081
5625
  <ul
5082
5626
  class="pf-c-dropdown__menu pf-m-align-right"
@@ -6490,6 +7034,7 @@ wrapperTag: div
6490
7034
  class="pf-c-skip-to-content pf-c-button pf-m-primary"
6491
7035
  href="#main-content-compound-expansion-demo"
6492
7036
  >Skip to content</a>
7037
+
6493
7038
  <header class="pf-c-masthead" id="compound-expansion-demo-masthead">
6494
7039
  <span class="pf-c-masthead__toggle">
6495
7040
  <button
@@ -6542,6 +7087,141 @@ wrapperTag: div
6542
7087
  <div
6543
7088
  class="pf-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
6544
7089
  >
7090
+ <div class="pf-c-toolbar__item">
7091
+ <nav
7092
+ class="pf-c-app-launcher"
7093
+ aria-label="Application launcher"
7094
+ id="compound-expansion-demo-masthead-icon-group--app-launcher"
7095
+ >
7096
+ <button
7097
+ class="pf-c-app-launcher__toggle"
7098
+ type="button"
7099
+ id="-button"
7100
+ aria-expanded="false"
7101
+ aria-label="Application launcher"
7102
+ >
7103
+ <i class="fas fa-th" aria-hidden="true"></i>
7104
+ </button>
7105
+ <div
7106
+ class="pf-c-app-launcher__menu pf-m-align-right"
7107
+ hidden
7108
+ >
7109
+ <div class="pf-c-app-launcher__menu-search">
7110
+ <input
7111
+ class="pf-c-form-control"
7112
+ type="search"
7113
+ aria-label="Type to filter"
7114
+ placeholder="Filter by name..."
7115
+ id="compound-expansion-demo-masthead-application-launcher-text-input"
7116
+ name="textInput1"
7117
+ />
7118
+ </div>
7119
+ <section class="pf-c-app-launcher__group">
7120
+ <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
7121
+ <ul>
7122
+ <li
7123
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
7124
+ >
7125
+ <a class="pf-c-app-launcher__menu-item">
7126
+ Link 1
7127
+ <span
7128
+ class="pf-c-app-launcher__menu-item-external-icon"
7129
+ >
7130
+ <i
7131
+ class="fas fa-external-link-alt"
7132
+ aria-hidden="true"
7133
+ ></i>
7134
+ </span>
7135
+ <span class="pf-screen-reader">(opens new window)</span>
7136
+ </a>
7137
+ <button
7138
+ class="pf-c-app-launcher__menu-item pf-m-action"
7139
+ type="button"
7140
+ aria-label="Favorite"
7141
+ >
7142
+ <i class="fas fa-star" aria-hidden="true"></i>
7143
+ </button>
7144
+ </li>
7145
+ <li
7146
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
7147
+ >
7148
+ <a class="pf-c-app-launcher__menu-item">
7149
+ Link 2
7150
+ <span
7151
+ class="pf-c-app-launcher__menu-item-external-icon"
7152
+ >
7153
+ <i
7154
+ class="fas fa-external-link-alt"
7155
+ aria-hidden="true"
7156
+ ></i>
7157
+ </span>
7158
+ <span class="pf-screen-reader">(opens new window)</span>
7159
+ </a>
7160
+ <button
7161
+ class="pf-c-app-launcher__menu-item pf-m-action"
7162
+ type="button"
7163
+ aria-label="Favorite"
7164
+ >
7165
+ <i class="fas fa-star" aria-hidden="true"></i>
7166
+ </button>
7167
+ </li>
7168
+ </ul>
7169
+ </section>
7170
+ <hr class="pf-c-divider" />
7171
+ <section class="pf-c-app-launcher__group">
7172
+ <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
7173
+ <ul>
7174
+ <li
7175
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
7176
+ >
7177
+ <a class="pf-c-app-launcher__menu-item">
7178
+ Link 1
7179
+ <span
7180
+ class="pf-c-app-launcher__menu-item-external-icon"
7181
+ >
7182
+ <i
7183
+ class="fas fa-external-link-alt"
7184
+ aria-hidden="true"
7185
+ ></i>
7186
+ </span>
7187
+ <span class="pf-screen-reader">(opens new window)</span>
7188
+ </a>
7189
+ <button
7190
+ class="pf-c-app-launcher__menu-item pf-m-action"
7191
+ type="button"
7192
+ aria-label="Favorite"
7193
+ >
7194
+ <i class="fas fa-star" aria-hidden="true"></i>
7195
+ </button>
7196
+ </li>
7197
+ <li
7198
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
7199
+ >
7200
+ <a class="pf-c-app-launcher__menu-item">
7201
+ Link 2
7202
+ <span
7203
+ class="pf-c-app-launcher__menu-item-external-icon"
7204
+ >
7205
+ <i
7206
+ class="fas fa-external-link-alt"
7207
+ aria-hidden="true"
7208
+ ></i>
7209
+ </span>
7210
+ <span class="pf-screen-reader">(opens new window)</span>
7211
+ </a>
7212
+ <button
7213
+ class="pf-c-app-launcher__menu-item pf-m-action"
7214
+ type="button"
7215
+ aria-label="Favorite"
7216
+ >
7217
+ <i class="fas fa-star" aria-hidden="true"></i>
7218
+ </button>
7219
+ </li>
7220
+ </ul>
7221
+ </section>
7222
+ </div>
7223
+ </nav>
7224
+ </div>
6545
7225
  <div class="pf-c-toolbar__item">
6546
7226
  <div class="pf-c-dropdown">
6547
7227
  <button
@@ -6582,7 +7262,7 @@ wrapperTag: div
6582
7262
  type="button"
6583
7263
  aria-label="Help"
6584
7264
  >
6585
- <i class="pf-icon pf-icon-help" aria-hidden="true"></i>
7265
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
6586
7266
  </button>
6587
7267
  <ul
6588
7268
  class="pf-c-dropdown__menu pf-m-align-right"
@@ -11210,6 +11890,7 @@ wrapperTag: div
11210
11890
  class="pf-c-skip-to-content pf-c-button pf-m-primary"
11211
11891
  href="#main-content-loading-state-demo"
11212
11892
  >Skip to content</a>
11893
+
11213
11894
  <header class="pf-c-masthead" id="loading-state-demo-masthead">
11214
11895
  <span class="pf-c-masthead__toggle">
11215
11896
  <button
@@ -11263,10 +11944,145 @@ wrapperTag: div
11263
11944
  class="pf-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
11264
11945
  >
11265
11946
  <div class="pf-c-toolbar__item">
11266
- <div class="pf-c-dropdown">
11947
+ <nav
11948
+ class="pf-c-app-launcher"
11949
+ aria-label="Application launcher"
11950
+ id="loading-state-demo-masthead-icon-group--app-launcher"
11951
+ >
11267
11952
  <button
11268
- class="pf-c-dropdown__toggle pf-m-plain"
11269
- id="loading-state-demo-masthead-settings-button"
11953
+ class="pf-c-app-launcher__toggle"
11954
+ type="button"
11955
+ id="-button"
11956
+ aria-expanded="false"
11957
+ aria-label="Application launcher"
11958
+ >
11959
+ <i class="fas fa-th" aria-hidden="true"></i>
11960
+ </button>
11961
+ <div
11962
+ class="pf-c-app-launcher__menu pf-m-align-right"
11963
+ hidden
11964
+ >
11965
+ <div class="pf-c-app-launcher__menu-search">
11966
+ <input
11967
+ class="pf-c-form-control"
11968
+ type="search"
11969
+ aria-label="Type to filter"
11970
+ placeholder="Filter by name..."
11971
+ id="loading-state-demo-masthead-application-launcher-text-input"
11972
+ name="textInput1"
11973
+ />
11974
+ </div>
11975
+ <section class="pf-c-app-launcher__group">
11976
+ <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
11977
+ <ul>
11978
+ <li
11979
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
11980
+ >
11981
+ <a class="pf-c-app-launcher__menu-item">
11982
+ Link 1
11983
+ <span
11984
+ class="pf-c-app-launcher__menu-item-external-icon"
11985
+ >
11986
+ <i
11987
+ class="fas fa-external-link-alt"
11988
+ aria-hidden="true"
11989
+ ></i>
11990
+ </span>
11991
+ <span class="pf-screen-reader">(opens new window)</span>
11992
+ </a>
11993
+ <button
11994
+ class="pf-c-app-launcher__menu-item pf-m-action"
11995
+ type="button"
11996
+ aria-label="Favorite"
11997
+ >
11998
+ <i class="fas fa-star" aria-hidden="true"></i>
11999
+ </button>
12000
+ </li>
12001
+ <li
12002
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
12003
+ >
12004
+ <a class="pf-c-app-launcher__menu-item">
12005
+ Link 2
12006
+ <span
12007
+ class="pf-c-app-launcher__menu-item-external-icon"
12008
+ >
12009
+ <i
12010
+ class="fas fa-external-link-alt"
12011
+ aria-hidden="true"
12012
+ ></i>
12013
+ </span>
12014
+ <span class="pf-screen-reader">(opens new window)</span>
12015
+ </a>
12016
+ <button
12017
+ class="pf-c-app-launcher__menu-item pf-m-action"
12018
+ type="button"
12019
+ aria-label="Favorite"
12020
+ >
12021
+ <i class="fas fa-star" aria-hidden="true"></i>
12022
+ </button>
12023
+ </li>
12024
+ </ul>
12025
+ </section>
12026
+ <hr class="pf-c-divider" />
12027
+ <section class="pf-c-app-launcher__group">
12028
+ <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
12029
+ <ul>
12030
+ <li
12031
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
12032
+ >
12033
+ <a class="pf-c-app-launcher__menu-item">
12034
+ Link 1
12035
+ <span
12036
+ class="pf-c-app-launcher__menu-item-external-icon"
12037
+ >
12038
+ <i
12039
+ class="fas fa-external-link-alt"
12040
+ aria-hidden="true"
12041
+ ></i>
12042
+ </span>
12043
+ <span class="pf-screen-reader">(opens new window)</span>
12044
+ </a>
12045
+ <button
12046
+ class="pf-c-app-launcher__menu-item pf-m-action"
12047
+ type="button"
12048
+ aria-label="Favorite"
12049
+ >
12050
+ <i class="fas fa-star" aria-hidden="true"></i>
12051
+ </button>
12052
+ </li>
12053
+ <li
12054
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
12055
+ >
12056
+ <a class="pf-c-app-launcher__menu-item">
12057
+ Link 2
12058
+ <span
12059
+ class="pf-c-app-launcher__menu-item-external-icon"
12060
+ >
12061
+ <i
12062
+ class="fas fa-external-link-alt"
12063
+ aria-hidden="true"
12064
+ ></i>
12065
+ </span>
12066
+ <span class="pf-screen-reader">(opens new window)</span>
12067
+ </a>
12068
+ <button
12069
+ class="pf-c-app-launcher__menu-item pf-m-action"
12070
+ type="button"
12071
+ aria-label="Favorite"
12072
+ >
12073
+ <i class="fas fa-star" aria-hidden="true"></i>
12074
+ </button>
12075
+ </li>
12076
+ </ul>
12077
+ </section>
12078
+ </div>
12079
+ </nav>
12080
+ </div>
12081
+ <div class="pf-c-toolbar__item">
12082
+ <div class="pf-c-dropdown">
12083
+ <button
12084
+ class="pf-c-dropdown__toggle pf-m-plain"
12085
+ id="loading-state-demo-masthead-settings-button"
11270
12086
  aria-expanded="false"
11271
12087
  type="button"
11272
12088
  aria-label="Settings"
@@ -11302,7 +12118,7 @@ wrapperTag: div
11302
12118
  type="button"
11303
12119
  aria-label="Help"
11304
12120
  >
11305
- <i class="pf-icon pf-icon-help" aria-hidden="true"></i>
12121
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
11306
12122
  </button>
11307
12123
  <ul
11308
12124
  class="pf-c-dropdown__menu pf-m-align-right"
@@ -11933,6 +12749,7 @@ wrapperTag: div
11933
12749
  class="pf-c-skip-to-content pf-c-button pf-m-primary"
11934
12750
  href="#main-content-empty-state-demo"
11935
12751
  >Skip to content</a>
12752
+
11936
12753
  <header class="pf-c-masthead" id="empty-state-demo-masthead">
11937
12754
  <span class="pf-c-masthead__toggle">
11938
12755
  <button
@@ -11985,6 +12802,141 @@ wrapperTag: div
11985
12802
  <div
11986
12803
  class="pf-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
11987
12804
  >
12805
+ <div class="pf-c-toolbar__item">
12806
+ <nav
12807
+ class="pf-c-app-launcher"
12808
+ aria-label="Application launcher"
12809
+ id="empty-state-demo-masthead-icon-group--app-launcher"
12810
+ >
12811
+ <button
12812
+ class="pf-c-app-launcher__toggle"
12813
+ type="button"
12814
+ id="-button"
12815
+ aria-expanded="false"
12816
+ aria-label="Application launcher"
12817
+ >
12818
+ <i class="fas fa-th" aria-hidden="true"></i>
12819
+ </button>
12820
+ <div
12821
+ class="pf-c-app-launcher__menu pf-m-align-right"
12822
+ hidden
12823
+ >
12824
+ <div class="pf-c-app-launcher__menu-search">
12825
+ <input
12826
+ class="pf-c-form-control"
12827
+ type="search"
12828
+ aria-label="Type to filter"
12829
+ placeholder="Filter by name..."
12830
+ id="empty-state-demo-masthead-application-launcher-text-input"
12831
+ name="textInput1"
12832
+ />
12833
+ </div>
12834
+ <section class="pf-c-app-launcher__group">
12835
+ <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
12836
+ <ul>
12837
+ <li
12838
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
12839
+ >
12840
+ <a class="pf-c-app-launcher__menu-item">
12841
+ Link 1
12842
+ <span
12843
+ class="pf-c-app-launcher__menu-item-external-icon"
12844
+ >
12845
+ <i
12846
+ class="fas fa-external-link-alt"
12847
+ aria-hidden="true"
12848
+ ></i>
12849
+ </span>
12850
+ <span class="pf-screen-reader">(opens new window)</span>
12851
+ </a>
12852
+ <button
12853
+ class="pf-c-app-launcher__menu-item pf-m-action"
12854
+ type="button"
12855
+ aria-label="Favorite"
12856
+ >
12857
+ <i class="fas fa-star" aria-hidden="true"></i>
12858
+ </button>
12859
+ </li>
12860
+ <li
12861
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
12862
+ >
12863
+ <a class="pf-c-app-launcher__menu-item">
12864
+ Link 2
12865
+ <span
12866
+ class="pf-c-app-launcher__menu-item-external-icon"
12867
+ >
12868
+ <i
12869
+ class="fas fa-external-link-alt"
12870
+ aria-hidden="true"
12871
+ ></i>
12872
+ </span>
12873
+ <span class="pf-screen-reader">(opens new window)</span>
12874
+ </a>
12875
+ <button
12876
+ class="pf-c-app-launcher__menu-item pf-m-action"
12877
+ type="button"
12878
+ aria-label="Favorite"
12879
+ >
12880
+ <i class="fas fa-star" aria-hidden="true"></i>
12881
+ </button>
12882
+ </li>
12883
+ </ul>
12884
+ </section>
12885
+ <hr class="pf-c-divider" />
12886
+ <section class="pf-c-app-launcher__group">
12887
+ <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
12888
+ <ul>
12889
+ <li
12890
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
12891
+ >
12892
+ <a class="pf-c-app-launcher__menu-item">
12893
+ Link 1
12894
+ <span
12895
+ class="pf-c-app-launcher__menu-item-external-icon"
12896
+ >
12897
+ <i
12898
+ class="fas fa-external-link-alt"
12899
+ aria-hidden="true"
12900
+ ></i>
12901
+ </span>
12902
+ <span class="pf-screen-reader">(opens new window)</span>
12903
+ </a>
12904
+ <button
12905
+ class="pf-c-app-launcher__menu-item pf-m-action"
12906
+ type="button"
12907
+ aria-label="Favorite"
12908
+ >
12909
+ <i class="fas fa-star" aria-hidden="true"></i>
12910
+ </button>
12911
+ </li>
12912
+ <li
12913
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
12914
+ >
12915
+ <a class="pf-c-app-launcher__menu-item">
12916
+ Link 2
12917
+ <span
12918
+ class="pf-c-app-launcher__menu-item-external-icon"
12919
+ >
12920
+ <i
12921
+ class="fas fa-external-link-alt"
12922
+ aria-hidden="true"
12923
+ ></i>
12924
+ </span>
12925
+ <span class="pf-screen-reader">(opens new window)</span>
12926
+ </a>
12927
+ <button
12928
+ class="pf-c-app-launcher__menu-item pf-m-action"
12929
+ type="button"
12930
+ aria-label="Favorite"
12931
+ >
12932
+ <i class="fas fa-star" aria-hidden="true"></i>
12933
+ </button>
12934
+ </li>
12935
+ </ul>
12936
+ </section>
12937
+ </div>
12938
+ </nav>
12939
+ </div>
11988
12940
  <div class="pf-c-toolbar__item">
11989
12941
  <div class="pf-c-dropdown">
11990
12942
  <button
@@ -12025,7 +12977,7 @@ wrapperTag: div
12025
12977
  type="button"
12026
12978
  aria-label="Help"
12027
12979
  >
12028
- <i class="pf-icon pf-icon-help" aria-hidden="true"></i>
12980
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
12029
12981
  </button>
12030
12982
  <ul
12031
12983
  class="pf-c-dropdown__menu pf-m-align-right"
@@ -12659,6 +13611,7 @@ wrapperTag: div
12659
13611
  class="pf-c-skip-to-content pf-c-button pf-m-primary"
12660
13612
  href="#main-content-static-bottom-pagination-demo"
12661
13613
  >Skip to content</a>
13614
+
12662
13615
  <header class="pf-c-masthead" id="static-bottom-pagination-demo-masthead">
12663
13616
  <span class="pf-c-masthead__toggle">
12664
13617
  <button
@@ -12711,6 +13664,141 @@ wrapperTag: div
12711
13664
  <div
12712
13665
  class="pf-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
12713
13666
  >
13667
+ <div class="pf-c-toolbar__item">
13668
+ <nav
13669
+ class="pf-c-app-launcher"
13670
+ aria-label="Application launcher"
13671
+ id="static-bottom-pagination-demo-masthead-icon-group--app-launcher"
13672
+ >
13673
+ <button
13674
+ class="pf-c-app-launcher__toggle"
13675
+ type="button"
13676
+ id="-button"
13677
+ aria-expanded="false"
13678
+ aria-label="Application launcher"
13679
+ >
13680
+ <i class="fas fa-th" aria-hidden="true"></i>
13681
+ </button>
13682
+ <div
13683
+ class="pf-c-app-launcher__menu pf-m-align-right"
13684
+ hidden
13685
+ >
13686
+ <div class="pf-c-app-launcher__menu-search">
13687
+ <input
13688
+ class="pf-c-form-control"
13689
+ type="search"
13690
+ aria-label="Type to filter"
13691
+ placeholder="Filter by name..."
13692
+ id="static-bottom-pagination-demo-masthead-application-launcher-text-input"
13693
+ name="textInput1"
13694
+ />
13695
+ </div>
13696
+ <section class="pf-c-app-launcher__group">
13697
+ <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
13698
+ <ul>
13699
+ <li
13700
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
13701
+ >
13702
+ <a class="pf-c-app-launcher__menu-item">
13703
+ Link 1
13704
+ <span
13705
+ class="pf-c-app-launcher__menu-item-external-icon"
13706
+ >
13707
+ <i
13708
+ class="fas fa-external-link-alt"
13709
+ aria-hidden="true"
13710
+ ></i>
13711
+ </span>
13712
+ <span class="pf-screen-reader">(opens new window)</span>
13713
+ </a>
13714
+ <button
13715
+ class="pf-c-app-launcher__menu-item pf-m-action"
13716
+ type="button"
13717
+ aria-label="Favorite"
13718
+ >
13719
+ <i class="fas fa-star" aria-hidden="true"></i>
13720
+ </button>
13721
+ </li>
13722
+ <li
13723
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
13724
+ >
13725
+ <a class="pf-c-app-launcher__menu-item">
13726
+ Link 2
13727
+ <span
13728
+ class="pf-c-app-launcher__menu-item-external-icon"
13729
+ >
13730
+ <i
13731
+ class="fas fa-external-link-alt"
13732
+ aria-hidden="true"
13733
+ ></i>
13734
+ </span>
13735
+ <span class="pf-screen-reader">(opens new window)</span>
13736
+ </a>
13737
+ <button
13738
+ class="pf-c-app-launcher__menu-item pf-m-action"
13739
+ type="button"
13740
+ aria-label="Favorite"
13741
+ >
13742
+ <i class="fas fa-star" aria-hidden="true"></i>
13743
+ </button>
13744
+ </li>
13745
+ </ul>
13746
+ </section>
13747
+ <hr class="pf-c-divider" />
13748
+ <section class="pf-c-app-launcher__group">
13749
+ <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
13750
+ <ul>
13751
+ <li
13752
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
13753
+ >
13754
+ <a class="pf-c-app-launcher__menu-item">
13755
+ Link 1
13756
+ <span
13757
+ class="pf-c-app-launcher__menu-item-external-icon"
13758
+ >
13759
+ <i
13760
+ class="fas fa-external-link-alt"
13761
+ aria-hidden="true"
13762
+ ></i>
13763
+ </span>
13764
+ <span class="pf-screen-reader">(opens new window)</span>
13765
+ </a>
13766
+ <button
13767
+ class="pf-c-app-launcher__menu-item pf-m-action"
13768
+ type="button"
13769
+ aria-label="Favorite"
13770
+ >
13771
+ <i class="fas fa-star" aria-hidden="true"></i>
13772
+ </button>
13773
+ </li>
13774
+ <li
13775
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
13776
+ >
13777
+ <a class="pf-c-app-launcher__menu-item">
13778
+ Link 2
13779
+ <span
13780
+ class="pf-c-app-launcher__menu-item-external-icon"
13781
+ >
13782
+ <i
13783
+ class="fas fa-external-link-alt"
13784
+ aria-hidden="true"
13785
+ ></i>
13786
+ </span>
13787
+ <span class="pf-screen-reader">(opens new window)</span>
13788
+ </a>
13789
+ <button
13790
+ class="pf-c-app-launcher__menu-item pf-m-action"
13791
+ type="button"
13792
+ aria-label="Favorite"
13793
+ >
13794
+ <i class="fas fa-star" aria-hidden="true"></i>
13795
+ </button>
13796
+ </li>
13797
+ </ul>
13798
+ </section>
13799
+ </div>
13800
+ </nav>
13801
+ </div>
12714
13802
  <div class="pf-c-toolbar__item">
12715
13803
  <div class="pf-c-dropdown">
12716
13804
  <button
@@ -12751,7 +13839,7 @@ wrapperTag: div
12751
13839
  type="button"
12752
13840
  aria-label="Help"
12753
13841
  >
12754
- <i class="pf-icon pf-icon-help" aria-hidden="true"></i>
13842
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
12755
13843
  </button>
12756
13844
  <ul
12757
13845
  class="pf-c-dropdown__menu pf-m-align-right"
@@ -14305,6 +15393,7 @@ wrapperTag: div
14305
15393
  class="pf-c-skip-to-content pf-c-button pf-m-primary"
14306
15394
  href="#main-content-column-management-demo"
14307
15395
  >Skip to content</a>
15396
+
14308
15397
  <header class="pf-c-masthead" id="column-management-demo-masthead">
14309
15398
  <span class="pf-c-masthead__toggle">
14310
15399
  <button
@@ -14357,6 +15446,141 @@ wrapperTag: div
14357
15446
  <div
14358
15447
  class="pf-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
14359
15448
  >
15449
+ <div class="pf-c-toolbar__item">
15450
+ <nav
15451
+ class="pf-c-app-launcher"
15452
+ aria-label="Application launcher"
15453
+ id="column-management-demo-masthead-icon-group--app-launcher"
15454
+ >
15455
+ <button
15456
+ class="pf-c-app-launcher__toggle"
15457
+ type="button"
15458
+ id="-button"
15459
+ aria-expanded="false"
15460
+ aria-label="Application launcher"
15461
+ >
15462
+ <i class="fas fa-th" aria-hidden="true"></i>
15463
+ </button>
15464
+ <div
15465
+ class="pf-c-app-launcher__menu pf-m-align-right"
15466
+ hidden
15467
+ >
15468
+ <div class="pf-c-app-launcher__menu-search">
15469
+ <input
15470
+ class="pf-c-form-control"
15471
+ type="search"
15472
+ aria-label="Type to filter"
15473
+ placeholder="Filter by name..."
15474
+ id="column-management-demo-masthead-application-launcher-text-input"
15475
+ name="textInput1"
15476
+ />
15477
+ </div>
15478
+ <section class="pf-c-app-launcher__group">
15479
+ <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
15480
+ <ul>
15481
+ <li
15482
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
15483
+ >
15484
+ <a class="pf-c-app-launcher__menu-item">
15485
+ Link 1
15486
+ <span
15487
+ class="pf-c-app-launcher__menu-item-external-icon"
15488
+ >
15489
+ <i
15490
+ class="fas fa-external-link-alt"
15491
+ aria-hidden="true"
15492
+ ></i>
15493
+ </span>
15494
+ <span class="pf-screen-reader">(opens new window)</span>
15495
+ </a>
15496
+ <button
15497
+ class="pf-c-app-launcher__menu-item pf-m-action"
15498
+ type="button"
15499
+ aria-label="Favorite"
15500
+ >
15501
+ <i class="fas fa-star" aria-hidden="true"></i>
15502
+ </button>
15503
+ </li>
15504
+ <li
15505
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
15506
+ >
15507
+ <a class="pf-c-app-launcher__menu-item">
15508
+ Link 2
15509
+ <span
15510
+ class="pf-c-app-launcher__menu-item-external-icon"
15511
+ >
15512
+ <i
15513
+ class="fas fa-external-link-alt"
15514
+ aria-hidden="true"
15515
+ ></i>
15516
+ </span>
15517
+ <span class="pf-screen-reader">(opens new window)</span>
15518
+ </a>
15519
+ <button
15520
+ class="pf-c-app-launcher__menu-item pf-m-action"
15521
+ type="button"
15522
+ aria-label="Favorite"
15523
+ >
15524
+ <i class="fas fa-star" aria-hidden="true"></i>
15525
+ </button>
15526
+ </li>
15527
+ </ul>
15528
+ </section>
15529
+ <hr class="pf-c-divider" />
15530
+ <section class="pf-c-app-launcher__group">
15531
+ <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
15532
+ <ul>
15533
+ <li
15534
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
15535
+ >
15536
+ <a class="pf-c-app-launcher__menu-item">
15537
+ Link 1
15538
+ <span
15539
+ class="pf-c-app-launcher__menu-item-external-icon"
15540
+ >
15541
+ <i
15542
+ class="fas fa-external-link-alt"
15543
+ aria-hidden="true"
15544
+ ></i>
15545
+ </span>
15546
+ <span class="pf-screen-reader">(opens new window)</span>
15547
+ </a>
15548
+ <button
15549
+ class="pf-c-app-launcher__menu-item pf-m-action"
15550
+ type="button"
15551
+ aria-label="Favorite"
15552
+ >
15553
+ <i class="fas fa-star" aria-hidden="true"></i>
15554
+ </button>
15555
+ </li>
15556
+ <li
15557
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
15558
+ >
15559
+ <a class="pf-c-app-launcher__menu-item">
15560
+ Link 2
15561
+ <span
15562
+ class="pf-c-app-launcher__menu-item-external-icon"
15563
+ >
15564
+ <i
15565
+ class="fas fa-external-link-alt"
15566
+ aria-hidden="true"
15567
+ ></i>
15568
+ </span>
15569
+ <span class="pf-screen-reader">(opens new window)</span>
15570
+ </a>
15571
+ <button
15572
+ class="pf-c-app-launcher__menu-item pf-m-action"
15573
+ type="button"
15574
+ aria-label="Favorite"
15575
+ >
15576
+ <i class="fas fa-star" aria-hidden="true"></i>
15577
+ </button>
15578
+ </li>
15579
+ </ul>
15580
+ </section>
15581
+ </div>
15582
+ </nav>
15583
+ </div>
14360
15584
  <div class="pf-c-toolbar__item">
14361
15585
  <div class="pf-c-dropdown">
14362
15586
  <button
@@ -14397,7 +15621,7 @@ wrapperTag: div
14397
15621
  type="button"
14398
15622
  aria-label="Help"
14399
15623
  >
14400
- <i class="pf-icon pf-icon-help" aria-hidden="true"></i>
15624
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
14401
15625
  </button>
14402
15626
  <ul
14403
15627
  class="pf-c-dropdown__menu pf-m-align-right"
@@ -16031,6 +17255,7 @@ wrapperTag: div
16031
17255
  class="pf-c-skip-to-content pf-c-button pf-m-primary"
16032
17256
  href="#main-content-sticky-header-demo"
16033
17257
  >Skip to content</a>
17258
+
16034
17259
  <header class="pf-c-masthead" id="sticky-header-demo-masthead">
16035
17260
  <span class="pf-c-masthead__toggle">
16036
17261
  <button
@@ -16083,6 +17308,141 @@ wrapperTag: div
16083
17308
  <div
16084
17309
  class="pf-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
16085
17310
  >
17311
+ <div class="pf-c-toolbar__item">
17312
+ <nav
17313
+ class="pf-c-app-launcher"
17314
+ aria-label="Application launcher"
17315
+ id="sticky-header-demo-masthead-icon-group--app-launcher"
17316
+ >
17317
+ <button
17318
+ class="pf-c-app-launcher__toggle"
17319
+ type="button"
17320
+ id="-button"
17321
+ aria-expanded="false"
17322
+ aria-label="Application launcher"
17323
+ >
17324
+ <i class="fas fa-th" aria-hidden="true"></i>
17325
+ </button>
17326
+ <div
17327
+ class="pf-c-app-launcher__menu pf-m-align-right"
17328
+ hidden
17329
+ >
17330
+ <div class="pf-c-app-launcher__menu-search">
17331
+ <input
17332
+ class="pf-c-form-control"
17333
+ type="search"
17334
+ aria-label="Type to filter"
17335
+ placeholder="Filter by name..."
17336
+ id="sticky-header-demo-masthead-application-launcher-text-input"
17337
+ name="textInput1"
17338
+ />
17339
+ </div>
17340
+ <section class="pf-c-app-launcher__group">
17341
+ <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
17342
+ <ul>
17343
+ <li
17344
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
17345
+ >
17346
+ <a class="pf-c-app-launcher__menu-item">
17347
+ Link 1
17348
+ <span
17349
+ class="pf-c-app-launcher__menu-item-external-icon"
17350
+ >
17351
+ <i
17352
+ class="fas fa-external-link-alt"
17353
+ aria-hidden="true"
17354
+ ></i>
17355
+ </span>
17356
+ <span class="pf-screen-reader">(opens new window)</span>
17357
+ </a>
17358
+ <button
17359
+ class="pf-c-app-launcher__menu-item pf-m-action"
17360
+ type="button"
17361
+ aria-label="Favorite"
17362
+ >
17363
+ <i class="fas fa-star" aria-hidden="true"></i>
17364
+ </button>
17365
+ </li>
17366
+ <li
17367
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
17368
+ >
17369
+ <a class="pf-c-app-launcher__menu-item">
17370
+ Link 2
17371
+ <span
17372
+ class="pf-c-app-launcher__menu-item-external-icon"
17373
+ >
17374
+ <i
17375
+ class="fas fa-external-link-alt"
17376
+ aria-hidden="true"
17377
+ ></i>
17378
+ </span>
17379
+ <span class="pf-screen-reader">(opens new window)</span>
17380
+ </a>
17381
+ <button
17382
+ class="pf-c-app-launcher__menu-item pf-m-action"
17383
+ type="button"
17384
+ aria-label="Favorite"
17385
+ >
17386
+ <i class="fas fa-star" aria-hidden="true"></i>
17387
+ </button>
17388
+ </li>
17389
+ </ul>
17390
+ </section>
17391
+ <hr class="pf-c-divider" />
17392
+ <section class="pf-c-app-launcher__group">
17393
+ <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
17394
+ <ul>
17395
+ <li
17396
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
17397
+ >
17398
+ <a class="pf-c-app-launcher__menu-item">
17399
+ Link 1
17400
+ <span
17401
+ class="pf-c-app-launcher__menu-item-external-icon"
17402
+ >
17403
+ <i
17404
+ class="fas fa-external-link-alt"
17405
+ aria-hidden="true"
17406
+ ></i>
17407
+ </span>
17408
+ <span class="pf-screen-reader">(opens new window)</span>
17409
+ </a>
17410
+ <button
17411
+ class="pf-c-app-launcher__menu-item pf-m-action"
17412
+ type="button"
17413
+ aria-label="Favorite"
17414
+ >
17415
+ <i class="fas fa-star" aria-hidden="true"></i>
17416
+ </button>
17417
+ </li>
17418
+ <li
17419
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
17420
+ >
17421
+ <a class="pf-c-app-launcher__menu-item">
17422
+ Link 2
17423
+ <span
17424
+ class="pf-c-app-launcher__menu-item-external-icon"
17425
+ >
17426
+ <i
17427
+ class="fas fa-external-link-alt"
17428
+ aria-hidden="true"
17429
+ ></i>
17430
+ </span>
17431
+ <span class="pf-screen-reader">(opens new window)</span>
17432
+ </a>
17433
+ <button
17434
+ class="pf-c-app-launcher__menu-item pf-m-action"
17435
+ type="button"
17436
+ aria-label="Favorite"
17437
+ >
17438
+ <i class="fas fa-star" aria-hidden="true"></i>
17439
+ </button>
17440
+ </li>
17441
+ </ul>
17442
+ </section>
17443
+ </div>
17444
+ </nav>
17445
+ </div>
16086
17446
  <div class="pf-c-toolbar__item">
16087
17447
  <div class="pf-c-dropdown">
16088
17448
  <button
@@ -16123,7 +17483,7 @@ wrapperTag: div
16123
17483
  type="button"
16124
17484
  aria-label="Help"
16125
17485
  >
16126
- <i class="pf-icon pf-icon-help" aria-hidden="true"></i>
17486
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
16127
17487
  </button>
16128
17488
  <ul
16129
17489
  class="pf-c-dropdown__menu pf-m-align-right"
@@ -17677,6 +19037,7 @@ wrapperTag: div
17677
19037
  class="pf-c-skip-to-content pf-c-button pf-m-primary"
17678
19038
  href="#main-content-sticky-first-column-demo"
17679
19039
  >Skip to content</a>
19040
+
17680
19041
  <header class="pf-c-masthead" id="sticky-first-column-demo-masthead">
17681
19042
  <span class="pf-c-masthead__toggle">
17682
19043
  <button
@@ -17729,6 +19090,141 @@ wrapperTag: div
17729
19090
  <div
17730
19091
  class="pf-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
17731
19092
  >
19093
+ <div class="pf-c-toolbar__item">
19094
+ <nav
19095
+ class="pf-c-app-launcher"
19096
+ aria-label="Application launcher"
19097
+ id="sticky-first-column-demo-masthead-icon-group--app-launcher"
19098
+ >
19099
+ <button
19100
+ class="pf-c-app-launcher__toggle"
19101
+ type="button"
19102
+ id="-button"
19103
+ aria-expanded="false"
19104
+ aria-label="Application launcher"
19105
+ >
19106
+ <i class="fas fa-th" aria-hidden="true"></i>
19107
+ </button>
19108
+ <div
19109
+ class="pf-c-app-launcher__menu pf-m-align-right"
19110
+ hidden
19111
+ >
19112
+ <div class="pf-c-app-launcher__menu-search">
19113
+ <input
19114
+ class="pf-c-form-control"
19115
+ type="search"
19116
+ aria-label="Type to filter"
19117
+ placeholder="Filter by name..."
19118
+ id="sticky-first-column-demo-masthead-application-launcher-text-input"
19119
+ name="textInput1"
19120
+ />
19121
+ </div>
19122
+ <section class="pf-c-app-launcher__group">
19123
+ <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
19124
+ <ul>
19125
+ <li
19126
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
19127
+ >
19128
+ <a class="pf-c-app-launcher__menu-item">
19129
+ Link 1
19130
+ <span
19131
+ class="pf-c-app-launcher__menu-item-external-icon"
19132
+ >
19133
+ <i
19134
+ class="fas fa-external-link-alt"
19135
+ aria-hidden="true"
19136
+ ></i>
19137
+ </span>
19138
+ <span class="pf-screen-reader">(opens new window)</span>
19139
+ </a>
19140
+ <button
19141
+ class="pf-c-app-launcher__menu-item pf-m-action"
19142
+ type="button"
19143
+ aria-label="Favorite"
19144
+ >
19145
+ <i class="fas fa-star" aria-hidden="true"></i>
19146
+ </button>
19147
+ </li>
19148
+ <li
19149
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
19150
+ >
19151
+ <a class="pf-c-app-launcher__menu-item">
19152
+ Link 2
19153
+ <span
19154
+ class="pf-c-app-launcher__menu-item-external-icon"
19155
+ >
19156
+ <i
19157
+ class="fas fa-external-link-alt"
19158
+ aria-hidden="true"
19159
+ ></i>
19160
+ </span>
19161
+ <span class="pf-screen-reader">(opens new window)</span>
19162
+ </a>
19163
+ <button
19164
+ class="pf-c-app-launcher__menu-item pf-m-action"
19165
+ type="button"
19166
+ aria-label="Favorite"
19167
+ >
19168
+ <i class="fas fa-star" aria-hidden="true"></i>
19169
+ </button>
19170
+ </li>
19171
+ </ul>
19172
+ </section>
19173
+ <hr class="pf-c-divider" />
19174
+ <section class="pf-c-app-launcher__group">
19175
+ <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
19176
+ <ul>
19177
+ <li
19178
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
19179
+ >
19180
+ <a class="pf-c-app-launcher__menu-item">
19181
+ Link 1
19182
+ <span
19183
+ class="pf-c-app-launcher__menu-item-external-icon"
19184
+ >
19185
+ <i
19186
+ class="fas fa-external-link-alt"
19187
+ aria-hidden="true"
19188
+ ></i>
19189
+ </span>
19190
+ <span class="pf-screen-reader">(opens new window)</span>
19191
+ </a>
19192
+ <button
19193
+ class="pf-c-app-launcher__menu-item pf-m-action"
19194
+ type="button"
19195
+ aria-label="Favorite"
19196
+ >
19197
+ <i class="fas fa-star" aria-hidden="true"></i>
19198
+ </button>
19199
+ </li>
19200
+ <li
19201
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
19202
+ >
19203
+ <a class="pf-c-app-launcher__menu-item">
19204
+ Link 2
19205
+ <span
19206
+ class="pf-c-app-launcher__menu-item-external-icon"
19207
+ >
19208
+ <i
19209
+ class="fas fa-external-link-alt"
19210
+ aria-hidden="true"
19211
+ ></i>
19212
+ </span>
19213
+ <span class="pf-screen-reader">(opens new window)</span>
19214
+ </a>
19215
+ <button
19216
+ class="pf-c-app-launcher__menu-item pf-m-action"
19217
+ type="button"
19218
+ aria-label="Favorite"
19219
+ >
19220
+ <i class="fas fa-star" aria-hidden="true"></i>
19221
+ </button>
19222
+ </li>
19223
+ </ul>
19224
+ </section>
19225
+ </div>
19226
+ </nav>
19227
+ </div>
17732
19228
  <div class="pf-c-toolbar__item">
17733
19229
  <div class="pf-c-dropdown">
17734
19230
  <button
@@ -17769,7 +19265,7 @@ wrapperTag: div
17769
19265
  type="button"
17770
19266
  aria-label="Help"
17771
19267
  >
17772
- <i class="pf-icon pf-icon-help" aria-hidden="true"></i>
19268
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
17773
19269
  </button>
17774
19270
  <ul
17775
19271
  class="pf-c-dropdown__menu pf-m-align-right"
@@ -19249,6 +20745,7 @@ wrapperTag: div
19249
20745
  class="pf-c-skip-to-content pf-c-button pf-m-primary"
19250
20746
  href="#main-content-sticky-multiple-columns-demo"
19251
20747
  >Skip to content</a>
20748
+
19252
20749
  <header class="pf-c-masthead" id="sticky-multiple-columns-demo-masthead">
19253
20750
  <span class="pf-c-masthead__toggle">
19254
20751
  <button
@@ -19301,6 +20798,141 @@ wrapperTag: div
19301
20798
  <div
19302
20799
  class="pf-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
19303
20800
  >
20801
+ <div class="pf-c-toolbar__item">
20802
+ <nav
20803
+ class="pf-c-app-launcher"
20804
+ aria-label="Application launcher"
20805
+ id="sticky-multiple-columns-demo-masthead-icon-group--app-launcher"
20806
+ >
20807
+ <button
20808
+ class="pf-c-app-launcher__toggle"
20809
+ type="button"
20810
+ id="-button"
20811
+ aria-expanded="false"
20812
+ aria-label="Application launcher"
20813
+ >
20814
+ <i class="fas fa-th" aria-hidden="true"></i>
20815
+ </button>
20816
+ <div
20817
+ class="pf-c-app-launcher__menu pf-m-align-right"
20818
+ hidden
20819
+ >
20820
+ <div class="pf-c-app-launcher__menu-search">
20821
+ <input
20822
+ class="pf-c-form-control"
20823
+ type="search"
20824
+ aria-label="Type to filter"
20825
+ placeholder="Filter by name..."
20826
+ id="sticky-multiple-columns-demo-masthead-application-launcher-text-input"
20827
+ name="textInput1"
20828
+ />
20829
+ </div>
20830
+ <section class="pf-c-app-launcher__group">
20831
+ <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
20832
+ <ul>
20833
+ <li
20834
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
20835
+ >
20836
+ <a class="pf-c-app-launcher__menu-item">
20837
+ Link 1
20838
+ <span
20839
+ class="pf-c-app-launcher__menu-item-external-icon"
20840
+ >
20841
+ <i
20842
+ class="fas fa-external-link-alt"
20843
+ aria-hidden="true"
20844
+ ></i>
20845
+ </span>
20846
+ <span class="pf-screen-reader">(opens new window)</span>
20847
+ </a>
20848
+ <button
20849
+ class="pf-c-app-launcher__menu-item pf-m-action"
20850
+ type="button"
20851
+ aria-label="Favorite"
20852
+ >
20853
+ <i class="fas fa-star" aria-hidden="true"></i>
20854
+ </button>
20855
+ </li>
20856
+ <li
20857
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
20858
+ >
20859
+ <a class="pf-c-app-launcher__menu-item">
20860
+ Link 2
20861
+ <span
20862
+ class="pf-c-app-launcher__menu-item-external-icon"
20863
+ >
20864
+ <i
20865
+ class="fas fa-external-link-alt"
20866
+ aria-hidden="true"
20867
+ ></i>
20868
+ </span>
20869
+ <span class="pf-screen-reader">(opens new window)</span>
20870
+ </a>
20871
+ <button
20872
+ class="pf-c-app-launcher__menu-item pf-m-action"
20873
+ type="button"
20874
+ aria-label="Favorite"
20875
+ >
20876
+ <i class="fas fa-star" aria-hidden="true"></i>
20877
+ </button>
20878
+ </li>
20879
+ </ul>
20880
+ </section>
20881
+ <hr class="pf-c-divider" />
20882
+ <section class="pf-c-app-launcher__group">
20883
+ <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
20884
+ <ul>
20885
+ <li
20886
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
20887
+ >
20888
+ <a class="pf-c-app-launcher__menu-item">
20889
+ Link 1
20890
+ <span
20891
+ class="pf-c-app-launcher__menu-item-external-icon"
20892
+ >
20893
+ <i
20894
+ class="fas fa-external-link-alt"
20895
+ aria-hidden="true"
20896
+ ></i>
20897
+ </span>
20898
+ <span class="pf-screen-reader">(opens new window)</span>
20899
+ </a>
20900
+ <button
20901
+ class="pf-c-app-launcher__menu-item pf-m-action"
20902
+ type="button"
20903
+ aria-label="Favorite"
20904
+ >
20905
+ <i class="fas fa-star" aria-hidden="true"></i>
20906
+ </button>
20907
+ </li>
20908
+ <li
20909
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
20910
+ >
20911
+ <a class="pf-c-app-launcher__menu-item">
20912
+ Link 2
20913
+ <span
20914
+ class="pf-c-app-launcher__menu-item-external-icon"
20915
+ >
20916
+ <i
20917
+ class="fas fa-external-link-alt"
20918
+ aria-hidden="true"
20919
+ ></i>
20920
+ </span>
20921
+ <span class="pf-screen-reader">(opens new window)</span>
20922
+ </a>
20923
+ <button
20924
+ class="pf-c-app-launcher__menu-item pf-m-action"
20925
+ type="button"
20926
+ aria-label="Favorite"
20927
+ >
20928
+ <i class="fas fa-star" aria-hidden="true"></i>
20929
+ </button>
20930
+ </li>
20931
+ </ul>
20932
+ </section>
20933
+ </div>
20934
+ </nav>
20935
+ </div>
19304
20936
  <div class="pf-c-toolbar__item">
19305
20937
  <div class="pf-c-dropdown">
19306
20938
  <button
@@ -19341,7 +20973,7 @@ wrapperTag: div
19341
20973
  type="button"
19342
20974
  aria-label="Help"
19343
20975
  >
19344
- <i class="pf-icon pf-icon-help" aria-hidden="true"></i>
20976
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
19345
20977
  </button>
19346
20978
  <ul
19347
20979
  class="pf-c-dropdown__menu pf-m-align-right"
@@ -20840,6 +22472,7 @@ wrapperTag: div
20840
22472
  class="pf-c-skip-to-content pf-c-button pf-m-primary"
20841
22473
  href="#main-content-sticky-header-and-multiple columns-demo"
20842
22474
  >Skip to content</a>
22475
+
20843
22476
  <header
20844
22477
  class="pf-c-masthead"
20845
22478
  id="sticky-header-and-multiple columns-demo-masthead"
@@ -20895,6 +22528,141 @@ wrapperTag: div
20895
22528
  <div
20896
22529
  class="pf-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
20897
22530
  >
22531
+ <div class="pf-c-toolbar__item">
22532
+ <nav
22533
+ class="pf-c-app-launcher"
22534
+ aria-label="Application launcher"
22535
+ id="sticky-header-and-multiple columns-demo-masthead-icon-group--app-launcher"
22536
+ >
22537
+ <button
22538
+ class="pf-c-app-launcher__toggle"
22539
+ type="button"
22540
+ id="-button"
22541
+ aria-expanded="false"
22542
+ aria-label="Application launcher"
22543
+ >
22544
+ <i class="fas fa-th" aria-hidden="true"></i>
22545
+ </button>
22546
+ <div
22547
+ class="pf-c-app-launcher__menu pf-m-align-right"
22548
+ hidden
22549
+ >
22550
+ <div class="pf-c-app-launcher__menu-search">
22551
+ <input
22552
+ class="pf-c-form-control"
22553
+ type="search"
22554
+ aria-label="Type to filter"
22555
+ placeholder="Filter by name..."
22556
+ id="sticky-header-and-multiple columns-demo-masthead-application-launcher-text-input"
22557
+ name="textInput1"
22558
+ />
22559
+ </div>
22560
+ <section class="pf-c-app-launcher__group">
22561
+ <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
22562
+ <ul>
22563
+ <li
22564
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
22565
+ >
22566
+ <a class="pf-c-app-launcher__menu-item">
22567
+ Link 1
22568
+ <span
22569
+ class="pf-c-app-launcher__menu-item-external-icon"
22570
+ >
22571
+ <i
22572
+ class="fas fa-external-link-alt"
22573
+ aria-hidden="true"
22574
+ ></i>
22575
+ </span>
22576
+ <span class="pf-screen-reader">(opens new window)</span>
22577
+ </a>
22578
+ <button
22579
+ class="pf-c-app-launcher__menu-item pf-m-action"
22580
+ type="button"
22581
+ aria-label="Favorite"
22582
+ >
22583
+ <i class="fas fa-star" aria-hidden="true"></i>
22584
+ </button>
22585
+ </li>
22586
+ <li
22587
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
22588
+ >
22589
+ <a class="pf-c-app-launcher__menu-item">
22590
+ Link 2
22591
+ <span
22592
+ class="pf-c-app-launcher__menu-item-external-icon"
22593
+ >
22594
+ <i
22595
+ class="fas fa-external-link-alt"
22596
+ aria-hidden="true"
22597
+ ></i>
22598
+ </span>
22599
+ <span class="pf-screen-reader">(opens new window)</span>
22600
+ </a>
22601
+ <button
22602
+ class="pf-c-app-launcher__menu-item pf-m-action"
22603
+ type="button"
22604
+ aria-label="Favorite"
22605
+ >
22606
+ <i class="fas fa-star" aria-hidden="true"></i>
22607
+ </button>
22608
+ </li>
22609
+ </ul>
22610
+ </section>
22611
+ <hr class="pf-c-divider" />
22612
+ <section class="pf-c-app-launcher__group">
22613
+ <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
22614
+ <ul>
22615
+ <li
22616
+ class="pf-c-app-launcher__menu-wrapper pf-m-external"
22617
+ >
22618
+ <a class="pf-c-app-launcher__menu-item">
22619
+ Link 1
22620
+ <span
22621
+ class="pf-c-app-launcher__menu-item-external-icon"
22622
+ >
22623
+ <i
22624
+ class="fas fa-external-link-alt"
22625
+ aria-hidden="true"
22626
+ ></i>
22627
+ </span>
22628
+ <span class="pf-screen-reader">(opens new window)</span>
22629
+ </a>
22630
+ <button
22631
+ class="pf-c-app-launcher__menu-item pf-m-action"
22632
+ type="button"
22633
+ aria-label="Favorite"
22634
+ >
22635
+ <i class="fas fa-star" aria-hidden="true"></i>
22636
+ </button>
22637
+ </li>
22638
+ <li
22639
+ class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
22640
+ >
22641
+ <a class="pf-c-app-launcher__menu-item">
22642
+ Link 2
22643
+ <span
22644
+ class="pf-c-app-launcher__menu-item-external-icon"
22645
+ >
22646
+ <i
22647
+ class="fas fa-external-link-alt"
22648
+ aria-hidden="true"
22649
+ ></i>
22650
+ </span>
22651
+ <span class="pf-screen-reader">(opens new window)</span>
22652
+ </a>
22653
+ <button
22654
+ class="pf-c-app-launcher__menu-item pf-m-action"
22655
+ type="button"
22656
+ aria-label="Favorite"
22657
+ >
22658
+ <i class="fas fa-star" aria-hidden="true"></i>
22659
+ </button>
22660
+ </li>
22661
+ </ul>
22662
+ </section>
22663
+ </div>
22664
+ </nav>
22665
+ </div>
20898
22666
  <div class="pf-c-toolbar__item">
20899
22667
  <div class="pf-c-dropdown">
20900
22668
  <button
@@ -20935,7 +22703,7 @@ wrapperTag: div
20935
22703
  type="button"
20936
22704
  aria-label="Help"
20937
22705
  >
20938
- <i class="pf-icon pf-icon-help" aria-hidden="true"></i>
22706
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
20939
22707
  </button>
20940
22708
  <ul
20941
22709
  class="pf-c-dropdown__menu pf-m-align-right"