@patternfly/patternfly 4.184.3 → 4.185.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.
- package/assets/icons/iconUnicodes.json +1 -0
- package/assets/pficon/pficon.scss +6 -0
- package/assets/pficon/pficon.woff +0 -0
- package/assets/pficon/pficon.woff2 +0 -0
- package/base/patternfly-icons.css +5 -1
- package/base/patternfly-pf-icons.css +5 -1
- package/components/Masthead/masthead.css +1 -1
- package/components/Masthead/masthead.scss +1 -1
- package/components/Menu/menu.css +1 -0
- package/components/Menu/menu.scss +1 -0
- package/docs/demos/AboutModal/examples/AboutModal.md +916 -1
- package/docs/demos/Alert/examples/Alert.md +2484 -490
- package/docs/demos/BackToTop/examples/BackToTop.md +785 -140
- package/docs/demos/Banner/examples/Banner.md +2074 -1466
- package/docs/demos/Button/examples/Button.md +33 -21
- package/docs/demos/CardView/examples/CardView.md +1065 -260
- package/docs/demos/ContextSelector/examples/ContextSelector.md +1580 -1638
- package/docs/demos/Dashboard/examples/Dashboard.md +40 -6
- package/docs/demos/DataList/examples/DataList.md +3777 -1553
- package/docs/demos/DescriptionList/examples/DescriptionList.md +55 -61
- package/docs/demos/Drawer/examples/Drawer.md +2554 -439
- package/docs/demos/JumpLinks/examples/JumpLinks.md +3223 -596
- package/docs/demos/Masthead/examples/Masthead.md +9 -20
- package/docs/demos/Modal/examples/Modal.md +5521 -34
- package/docs/demos/Nav/examples/Nav.md +6453 -1201
- package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +4036 -940
- package/docs/demos/Page/examples/Page.md +14 -35
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +6003 -1512
- package/docs/demos/Skeleton/examples/Skeleton.md +831 -149
- package/docs/demos/Table/examples/Table.md +26 -65
- package/docs/demos/Tabs/examples/Tabs.md +10149 -4897
- package/docs/demos/Toolbar/examples/Toolbar.md +797 -149
- package/docs/demos/Wizard/examples/Wizard.md +3418 -288
- package/docs/pages/icons.md +1 -0
- package/icons/pf-icons.json +1 -0
- package/package.json +1 -1
- package/patternfly-base-no-reset.css +5 -1
- package/patternfly-base.css +5 -1
- package/patternfly-no-reset.css +7 -2
- package/patternfly.css +7 -2
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
|
@@ -1758,164 +1758,812 @@ section: components
|
|
|
1758
1758
|
### Toolbar pagination management on mobile
|
|
1759
1759
|
|
|
1760
1760
|
```html isFullscreen
|
|
1761
|
-
<div class="pf-c-page" id="toolbar-pagination-management">
|
|
1761
|
+
<div class="pf-c-page" id="toolbar-pagination-management-example">
|
|
1762
1762
|
<a
|
|
1763
1763
|
class="pf-c-skip-to-content pf-c-button pf-m-primary"
|
|
1764
|
-
href="#main-content-toolbar-pagination-management"
|
|
1764
|
+
href="#main-content-toolbar-pagination-management-example"
|
|
1765
1765
|
>Skip to content</a>
|
|
1766
|
-
<header
|
|
1767
|
-
|
|
1768
|
-
|
|
1769
|
-
|
|
1770
|
-
|
|
1771
|
-
|
|
1772
|
-
|
|
1773
|
-
|
|
1774
|
-
|
|
1775
|
-
|
|
1766
|
+
<header
|
|
1767
|
+
class="pf-c-masthead"
|
|
1768
|
+
id="toolbar-pagination-management-example-masthead"
|
|
1769
|
+
>
|
|
1770
|
+
<span class="pf-c-masthead__toggle">
|
|
1771
|
+
<button
|
|
1772
|
+
class="pf-c-button pf-m-plain"
|
|
1773
|
+
type="button"
|
|
1774
|
+
aria-label="Global navigation"
|
|
1775
|
+
>
|
|
1776
|
+
<i class="fas fa-bars" aria-hidden="true"></i>
|
|
1777
|
+
</button>
|
|
1778
|
+
</span>
|
|
1779
|
+
<div class="pf-c-masthead__main">
|
|
1780
|
+
<a class="pf-c-masthead__brand" href="#">
|
|
1781
|
+
<picture
|
|
1782
|
+
class="pf-c-brand pf-m-picture"
|
|
1783
|
+
style="--pf-c-brand--Width: 180px; --pf-c-brand--Width-on-md: 180px; --pf-c-brand--Width-on-2xl: 220px;"
|
|
1776
1784
|
>
|
|
1777
|
-
<
|
|
1778
|
-
|
|
1779
|
-
|
|
1780
|
-
|
|
1781
|
-
|
|
1782
|
-
|
|
1783
|
-
|
|
1784
|
-
|
|
1785
|
-
|
|
1785
|
+
<source
|
|
1786
|
+
media="(min-width: 768px)"
|
|
1787
|
+
srcset="/assets/images/logo__pf--reverse-on-md.svg"
|
|
1788
|
+
/>
|
|
1789
|
+
<source srcset="/assets/images/logo__pf--reverse--base.svg" />
|
|
1790
|
+
<img
|
|
1791
|
+
src="/assets/images/logo__pf--reverse--base.png"
|
|
1792
|
+
alt="Fallback patternFly default logo"
|
|
1793
|
+
/>
|
|
1794
|
+
</picture>
|
|
1786
1795
|
</a>
|
|
1787
1796
|
</div>
|
|
1788
|
-
<div class="pf-c-
|
|
1789
|
-
<div
|
|
1790
|
-
|
|
1791
|
-
|
|
1792
|
-
|
|
1793
|
-
|
|
1794
|
-
|
|
1795
|
-
|
|
1796
|
-
|
|
1797
|
-
>
|
|
1798
|
-
<i class="fas fa-cog" aria-hidden="true"></i>
|
|
1799
|
-
</button>
|
|
1800
|
-
</div>
|
|
1801
|
-
<div
|
|
1802
|
-
class="pf-c-page__header-tools-item pf-m-hidden pf-m-visible-on-lg"
|
|
1803
|
-
>
|
|
1804
|
-
<button
|
|
1805
|
-
class="pf-c-button pf-m-plain"
|
|
1806
|
-
type="button"
|
|
1807
|
-
aria-label="Help"
|
|
1808
|
-
>
|
|
1809
|
-
<i class="fas fa-question-circle" aria-hidden="true"></i>
|
|
1810
|
-
</button>
|
|
1811
|
-
</div>
|
|
1812
|
-
</div>
|
|
1813
|
-
<div class="pf-c-page__header-tools-group">
|
|
1814
|
-
<div class="pf-c-page__header-tools-item pf-m-hidden-on-lg">
|
|
1815
|
-
<div class="pf-c-dropdown">
|
|
1816
|
-
<button
|
|
1817
|
-
class="pf-c-dropdown__toggle pf-m-plain"
|
|
1818
|
-
id="toolbar-pagination-management-dropdown-kebab-1-button"
|
|
1819
|
-
aria-expanded="false"
|
|
1820
|
-
type="button"
|
|
1821
|
-
aria-label="Actions"
|
|
1822
|
-
>
|
|
1823
|
-
<i class="fas fa-ellipsis-v" aria-hidden="true"></i>
|
|
1824
|
-
</button>
|
|
1825
|
-
<ul
|
|
1826
|
-
class="pf-c-dropdown__menu pf-m-align-right"
|
|
1827
|
-
aria-labelledby="toolbar-pagination-management-dropdown-kebab-1-button"
|
|
1828
|
-
hidden
|
|
1797
|
+
<div class="pf-c-masthead__content">
|
|
1798
|
+
<div
|
|
1799
|
+
class="pf-c-toolbar pf-m-full-height pf-m-static"
|
|
1800
|
+
id="toolbar-pagination-management-example-masthead-toolbar"
|
|
1801
|
+
>
|
|
1802
|
+
<div class="pf-c-toolbar__content">
|
|
1803
|
+
<div class="pf-c-toolbar__content-section">
|
|
1804
|
+
<div
|
|
1805
|
+
class="pf-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
|
|
1829
1806
|
>
|
|
1830
|
-
<
|
|
1831
|
-
<a class="pf-c-dropdown__menu-item" href="#">Link</a>
|
|
1832
|
-
</li>
|
|
1833
|
-
<li>
|
|
1834
|
-
<button class="pf-c-dropdown__menu-item" type="button">Action</button>
|
|
1835
|
-
</li>
|
|
1836
|
-
<li>
|
|
1837
|
-
<a
|
|
1838
|
-
class="pf-c-dropdown__menu-item pf-m-disabled"
|
|
1839
|
-
href="#"
|
|
1840
|
-
aria-disabled="true"
|
|
1841
|
-
tabindex="-1"
|
|
1842
|
-
>Disabled link</a>
|
|
1843
|
-
</li>
|
|
1844
|
-
<li>
|
|
1807
|
+
<div class="pf-c-toolbar__item">
|
|
1845
1808
|
<button
|
|
1846
|
-
class="pf-c-
|
|
1809
|
+
class="pf-c-button pf-m-plain"
|
|
1847
1810
|
type="button"
|
|
1848
|
-
|
|
1849
|
-
>
|
|
1850
|
-
|
|
1851
|
-
|
|
1852
|
-
|
|
1853
|
-
|
|
1854
|
-
</
|
|
1855
|
-
|
|
1856
|
-
|
|
1857
|
-
|
|
1858
|
-
|
|
1859
|
-
|
|
1860
|
-
|
|
1861
|
-
|
|
1862
|
-
|
|
1863
|
-
|
|
1864
|
-
|
|
1865
|
-
|
|
1866
|
-
|
|
1867
|
-
|
|
1868
|
-
|
|
1869
|
-
|
|
1870
|
-
|
|
1871
|
-
|
|
1872
|
-
|
|
1873
|
-
|
|
1874
|
-
|
|
1875
|
-
|
|
1876
|
-
|
|
1877
|
-
|
|
1878
|
-
|
|
1879
|
-
|
|
1880
|
-
|
|
1881
|
-
|
|
1882
|
-
|
|
1883
|
-
|
|
1884
|
-
|
|
1885
|
-
|
|
1886
|
-
|
|
1887
|
-
|
|
1888
|
-
|
|
1889
|
-
|
|
1890
|
-
|
|
1891
|
-
|
|
1892
|
-
|
|
1811
|
+
aria-label="Notifications"
|
|
1812
|
+
>
|
|
1813
|
+
<span class="pf-c-notification-badge">
|
|
1814
|
+
<i class="pf-icon-bell" aria-hidden="true"></i>
|
|
1815
|
+
</span>
|
|
1816
|
+
</button>
|
|
1817
|
+
</div>
|
|
1818
|
+
<div
|
|
1819
|
+
class="pf-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
|
|
1820
|
+
>
|
|
1821
|
+
<div class="pf-c-toolbar__item">
|
|
1822
|
+
<nav
|
|
1823
|
+
class="pf-c-app-launcher"
|
|
1824
|
+
aria-label="Application launcher"
|
|
1825
|
+
id="toolbar-pagination-management-example-masthead-icon-group--app-launcher"
|
|
1826
|
+
>
|
|
1827
|
+
<button
|
|
1828
|
+
class="pf-c-app-launcher__toggle"
|
|
1829
|
+
type="button"
|
|
1830
|
+
id="toolbar-pagination-management-example-masthead-icon-group--app-launcher-button"
|
|
1831
|
+
aria-expanded="false"
|
|
1832
|
+
aria-label="Application launcher"
|
|
1833
|
+
>
|
|
1834
|
+
<i class="fas fa-th" aria-hidden="true"></i>
|
|
1835
|
+
</button>
|
|
1836
|
+
<div
|
|
1837
|
+
class="pf-c-app-launcher__menu pf-m-align-right"
|
|
1838
|
+
hidden
|
|
1839
|
+
>
|
|
1840
|
+
<div class="pf-c-app-launcher__menu-search">
|
|
1841
|
+
<div class="pf-c-search-input">
|
|
1842
|
+
<div class="pf-c-search-input__bar">
|
|
1843
|
+
<span class="pf-c-search-input__text">
|
|
1844
|
+
<span class="pf-c-search-input__icon">
|
|
1845
|
+
<i
|
|
1846
|
+
class="fas fa-search fa-fw"
|
|
1847
|
+
aria-hidden="true"
|
|
1848
|
+
></i>
|
|
1849
|
+
</span>
|
|
1850
|
+
<input
|
|
1851
|
+
class="pf-c-search-input__text-input"
|
|
1852
|
+
type="text"
|
|
1853
|
+
placeholder="Filter by name"
|
|
1854
|
+
aria-label="Filter by name"
|
|
1855
|
+
/>
|
|
1856
|
+
</span>
|
|
1857
|
+
</div>
|
|
1858
|
+
</div>
|
|
1859
|
+
</div>
|
|
1860
|
+
<section class="pf-c-app-launcher__group">
|
|
1861
|
+
<h1 class="pf-c-app-launcher__group-title">Favorites</h1>
|
|
1862
|
+
<ul>
|
|
1863
|
+
<li
|
|
1864
|
+
class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
|
|
1865
|
+
>
|
|
1866
|
+
<a class="pf-c-app-launcher__menu-item">
|
|
1867
|
+
Link 1
|
|
1868
|
+
<span
|
|
1869
|
+
class="pf-c-app-launcher__menu-item-external-icon"
|
|
1870
|
+
>
|
|
1871
|
+
<i
|
|
1872
|
+
class="fas fa-external-link-alt"
|
|
1873
|
+
aria-hidden="true"
|
|
1874
|
+
></i>
|
|
1875
|
+
</span>
|
|
1876
|
+
<span class="pf-screen-reader">(opens new window)</span>
|
|
1877
|
+
</a>
|
|
1878
|
+
<button
|
|
1879
|
+
class="pf-c-app-launcher__menu-item pf-m-action"
|
|
1880
|
+
type="button"
|
|
1881
|
+
aria-label="Favorite"
|
|
1882
|
+
>
|
|
1883
|
+
<i class="fas fa-star" aria-hidden="true"></i>
|
|
1884
|
+
</button>
|
|
1885
|
+
</li>
|
|
1886
|
+
<li
|
|
1887
|
+
class="pf-c-app-launcher__menu-wrapper pf-m-external"
|
|
1888
|
+
>
|
|
1889
|
+
<a class="pf-c-app-launcher__menu-item">
|
|
1890
|
+
Link 2
|
|
1891
|
+
<span
|
|
1892
|
+
class="pf-c-app-launcher__menu-item-external-icon"
|
|
1893
|
+
>
|
|
1894
|
+
<i
|
|
1895
|
+
class="fas fa-external-link-alt"
|
|
1896
|
+
aria-hidden="true"
|
|
1897
|
+
></i>
|
|
1898
|
+
</span>
|
|
1899
|
+
<span class="pf-screen-reader">(opens new window)</span>
|
|
1900
|
+
</a>
|
|
1901
|
+
<button
|
|
1902
|
+
class="pf-c-app-launcher__menu-item pf-m-action"
|
|
1903
|
+
type="button"
|
|
1904
|
+
aria-label="Favorite"
|
|
1905
|
+
>
|
|
1906
|
+
<i class="fas fa-star" aria-hidden="true"></i>
|
|
1907
|
+
</button>
|
|
1908
|
+
</li>
|
|
1909
|
+
</ul>
|
|
1910
|
+
</section>
|
|
1911
|
+
<hr class="pf-c-divider" />
|
|
1912
|
+
<section class="pf-c-app-launcher__group">
|
|
1913
|
+
<h1 class="pf-c-app-launcher__group-title">Group 1</h1>
|
|
1914
|
+
<ul>
|
|
1915
|
+
<li
|
|
1916
|
+
class="pf-c-app-launcher__menu-wrapper pf-m-external"
|
|
1917
|
+
>
|
|
1918
|
+
<a class="pf-c-app-launcher__menu-item">
|
|
1919
|
+
Link 1
|
|
1920
|
+
<span
|
|
1921
|
+
class="pf-c-app-launcher__menu-item-external-icon"
|
|
1922
|
+
>
|
|
1923
|
+
<i
|
|
1924
|
+
class="fas fa-external-link-alt"
|
|
1925
|
+
aria-hidden="true"
|
|
1926
|
+
></i>
|
|
1927
|
+
</span>
|
|
1928
|
+
<span class="pf-screen-reader">(opens new window)</span>
|
|
1929
|
+
</a>
|
|
1930
|
+
<button
|
|
1931
|
+
class="pf-c-app-launcher__menu-item pf-m-action"
|
|
1932
|
+
type="button"
|
|
1933
|
+
aria-label="Favorite"
|
|
1934
|
+
>
|
|
1935
|
+
<i class="fas fa-star" aria-hidden="true"></i>
|
|
1936
|
+
</button>
|
|
1937
|
+
</li>
|
|
1938
|
+
<li
|
|
1939
|
+
class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
|
|
1940
|
+
>
|
|
1941
|
+
<a class="pf-c-app-launcher__menu-item">
|
|
1942
|
+
Link 2
|
|
1943
|
+
<span
|
|
1944
|
+
class="pf-c-app-launcher__menu-item-external-icon"
|
|
1945
|
+
>
|
|
1946
|
+
<i
|
|
1947
|
+
class="fas fa-external-link-alt"
|
|
1948
|
+
aria-hidden="true"
|
|
1949
|
+
></i>
|
|
1950
|
+
</span>
|
|
1951
|
+
<span class="pf-screen-reader">(opens new window)</span>
|
|
1952
|
+
</a>
|
|
1953
|
+
<button
|
|
1954
|
+
class="pf-c-app-launcher__menu-item pf-m-action"
|
|
1955
|
+
type="button"
|
|
1956
|
+
aria-label="Favorite"
|
|
1957
|
+
>
|
|
1958
|
+
<i class="fas fa-star" aria-hidden="true"></i>
|
|
1959
|
+
</button>
|
|
1960
|
+
</li>
|
|
1961
|
+
</ul>
|
|
1962
|
+
</section>
|
|
1963
|
+
</div>
|
|
1964
|
+
</nav>
|
|
1965
|
+
</div>
|
|
1966
|
+
<div class="pf-c-toolbar__item">
|
|
1967
|
+
<div class="pf-c-dropdown">
|
|
1968
|
+
<button
|
|
1969
|
+
class="pf-c-dropdown__toggle pf-m-plain"
|
|
1970
|
+
id="toolbar-pagination-management-example-masthead-settings-button"
|
|
1971
|
+
aria-expanded="false"
|
|
1972
|
+
type="button"
|
|
1973
|
+
aria-label="Settings"
|
|
1974
|
+
>
|
|
1975
|
+
<i class="fas fa-cog" aria-hidden="true"></i>
|
|
1976
|
+
</button>
|
|
1977
|
+
<ul
|
|
1978
|
+
class="pf-c-dropdown__menu pf-m-align-right"
|
|
1979
|
+
aria-labelledby="toolbar-pagination-management-example-masthead-settings-button"
|
|
1980
|
+
hidden
|
|
1981
|
+
>
|
|
1982
|
+
<li>
|
|
1983
|
+
<button
|
|
1984
|
+
class="pf-c-dropdown__menu-item"
|
|
1985
|
+
type="button"
|
|
1986
|
+
>Settings</button>
|
|
1987
|
+
</li>
|
|
1988
|
+
<li>
|
|
1989
|
+
<button
|
|
1990
|
+
class="pf-c-dropdown__menu-item"
|
|
1991
|
+
type="button"
|
|
1992
|
+
>Use the beta release</button>
|
|
1993
|
+
</li>
|
|
1994
|
+
</ul>
|
|
1995
|
+
</div>
|
|
1996
|
+
</div>
|
|
1997
|
+
<div class="pf-c-toolbar__item">
|
|
1998
|
+
<div class="pf-c-dropdown">
|
|
1999
|
+
<button
|
|
2000
|
+
class="pf-c-dropdown__toggle pf-m-plain"
|
|
2001
|
+
id="toolbar-pagination-management-example-masthead-help-button"
|
|
2002
|
+
aria-expanded="false"
|
|
2003
|
+
type="button"
|
|
2004
|
+
aria-label="Help"
|
|
2005
|
+
>
|
|
2006
|
+
<i class="fas fa-question-circle" aria-hidden="true"></i>
|
|
2007
|
+
</button>
|
|
2008
|
+
<ul
|
|
2009
|
+
class="pf-c-dropdown__menu pf-m-align-right"
|
|
2010
|
+
aria-labelledby="toolbar-pagination-management-example-masthead-help-button"
|
|
2011
|
+
hidden
|
|
2012
|
+
>
|
|
2013
|
+
<li>
|
|
2014
|
+
<button
|
|
2015
|
+
class="pf-c-dropdown__menu-item"
|
|
2016
|
+
type="button"
|
|
2017
|
+
>Support options</button>
|
|
2018
|
+
</li>
|
|
2019
|
+
<li>
|
|
2020
|
+
<button
|
|
2021
|
+
class="pf-c-dropdown__menu-item"
|
|
2022
|
+
type="button"
|
|
2023
|
+
>Open support case</button>
|
|
2024
|
+
</li>
|
|
2025
|
+
<li>
|
|
2026
|
+
<button
|
|
2027
|
+
class="pf-c-dropdown__menu-item"
|
|
2028
|
+
type="button"
|
|
2029
|
+
>API documentation</button>
|
|
2030
|
+
</li>
|
|
2031
|
+
</ul>
|
|
2032
|
+
</div>
|
|
2033
|
+
</div>
|
|
2034
|
+
</div>
|
|
2035
|
+
<div class="pf-c-toolbar__item pf-m-hidden-on-lg">
|
|
2036
|
+
<div class="pf-c-dropdown">
|
|
2037
|
+
<button
|
|
2038
|
+
class="pf-c-menu-toggle pf-m-plain"
|
|
2039
|
+
type="button"
|
|
2040
|
+
aria-expanded="false"
|
|
2041
|
+
aria-label="Actions"
|
|
2042
|
+
>
|
|
2043
|
+
<i class="fas fa-ellipsis-v" aria-hidden="true"></i>
|
|
2044
|
+
</button>
|
|
2045
|
+
<div class="pf-c-menu pf-m-drilldown pf-m-align-right" hidden>
|
|
2046
|
+
<div class="pf-c-menu__content">
|
|
2047
|
+
<section class="pf-c-menu__group pf-m-hidden-on-sm">
|
|
2048
|
+
<ul class="pf-c-menu__list" role="menu">
|
|
2049
|
+
<li
|
|
2050
|
+
class="pf-c-menu__list-item pf-m-disabled"
|
|
2051
|
+
role="none"
|
|
2052
|
+
>
|
|
2053
|
+
<button
|
|
2054
|
+
class="pf-c-menu__item"
|
|
2055
|
+
type="button"
|
|
2056
|
+
disabled
|
|
2057
|
+
role="menuitem"
|
|
2058
|
+
>
|
|
2059
|
+
<span class="pf-c-menu__item-description">
|
|
2060
|
+
<div class="pf-u-font-size-sm">Username:</div>
|
|
2061
|
+
<div class="pf-u-font-size-md">ned_username</div>
|
|
2062
|
+
</span>
|
|
2063
|
+
</button>
|
|
2064
|
+
</li>
|
|
2065
|
+
<li
|
|
2066
|
+
class="pf-c-menu__list-item pf-m-disabled"
|
|
2067
|
+
role="none"
|
|
2068
|
+
>
|
|
2069
|
+
<button
|
|
2070
|
+
class="pf-c-menu__item"
|
|
2071
|
+
type="button"
|
|
2072
|
+
disabled
|
|
2073
|
+
role="menuitem"
|
|
2074
|
+
>
|
|
2075
|
+
<span class="pf-c-menu__item-description">
|
|
2076
|
+
<div class="pf-u-font-size-sm">Account number:</div>
|
|
2077
|
+
<div class="pf-u-font-size-md">123456789</div>
|
|
2078
|
+
</span>
|
|
2079
|
+
</button>
|
|
2080
|
+
</li>
|
|
2081
|
+
<li class="pf-c-divider" role="separator"></li>
|
|
2082
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2083
|
+
<button
|
|
2084
|
+
class="pf-c-menu__item"
|
|
2085
|
+
type="button"
|
|
2086
|
+
role="menuitem"
|
|
2087
|
+
>
|
|
2088
|
+
<span class="pf-c-menu__item-main">
|
|
2089
|
+
<span class="pf-c-menu__item-text">My profile</span>
|
|
2090
|
+
</span>
|
|
2091
|
+
</button>
|
|
2092
|
+
</li>
|
|
2093
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2094
|
+
<button
|
|
2095
|
+
class="pf-c-menu__item"
|
|
2096
|
+
type="button"
|
|
2097
|
+
role="menuitem"
|
|
2098
|
+
>
|
|
2099
|
+
<span class="pf-c-menu__item-main">
|
|
2100
|
+
<span
|
|
2101
|
+
class="pf-c-menu__item-text"
|
|
2102
|
+
>User management</span>
|
|
2103
|
+
</span>
|
|
2104
|
+
</button>
|
|
2105
|
+
</li>
|
|
2106
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2107
|
+
<button
|
|
2108
|
+
class="pf-c-menu__item"
|
|
2109
|
+
type="button"
|
|
2110
|
+
role="menuitem"
|
|
2111
|
+
>
|
|
2112
|
+
<span class="pf-c-menu__item-main">
|
|
2113
|
+
<span class="pf-c-menu__item-text">Logout</span>
|
|
2114
|
+
</span>
|
|
2115
|
+
</button>
|
|
2116
|
+
</li>
|
|
2117
|
+
</ul>
|
|
2118
|
+
</section>
|
|
2119
|
+
<hr class="pf-c-divider pf-m-hidden-on-sm" />
|
|
2120
|
+
<section class="pf-c-menu__group">
|
|
2121
|
+
<ul class="pf-c-menu__list" role="menu">
|
|
2122
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2123
|
+
<button
|
|
2124
|
+
class="pf-c-menu__item"
|
|
2125
|
+
type="button"
|
|
2126
|
+
role="menuitem"
|
|
2127
|
+
aria-expanded="false"
|
|
2128
|
+
>
|
|
2129
|
+
<span class="pf-c-menu__item-main">
|
|
2130
|
+
<span class="pf-c-menu__item-icon">
|
|
2131
|
+
<i
|
|
2132
|
+
class="fas fa-fw fa-cog"
|
|
2133
|
+
aria-hidden="true"
|
|
2134
|
+
></i>
|
|
2135
|
+
</span>
|
|
2136
|
+
<span class="pf-c-menu__item-text">Settings</span>
|
|
2137
|
+
<span class="pf-c-menu__item-toggle-icon">
|
|
2138
|
+
<i class="fas fa-angle-right"></i>
|
|
2139
|
+
</span>
|
|
2140
|
+
</span>
|
|
2141
|
+
</button>
|
|
2142
|
+
<div class="pf-c-menu" hidden>
|
|
2143
|
+
<div class="pf-c-menu__content">
|
|
2144
|
+
<ul class="pf-c-menu__list" role="menu">
|
|
2145
|
+
<li
|
|
2146
|
+
class="pf-c-menu__list-item pf-m-drill-up"
|
|
2147
|
+
role="none"
|
|
2148
|
+
>
|
|
2149
|
+
<button
|
|
2150
|
+
class="pf-c-menu__item"
|
|
2151
|
+
type="button"
|
|
2152
|
+
role="menuitem"
|
|
2153
|
+
>
|
|
2154
|
+
<span class="pf-c-menu__item-main">
|
|
2155
|
+
<span
|
|
2156
|
+
class="pf-c-menu__item-toggle-icon"
|
|
2157
|
+
>
|
|
2158
|
+
<i class="fas fa-angle-left"></i>
|
|
2159
|
+
</span>
|
|
2160
|
+
<span class="pf-c-menu__item-icon">
|
|
2161
|
+
<i
|
|
2162
|
+
class="fas fa-fw fa-cog"
|
|
2163
|
+
aria-hidden="true"
|
|
2164
|
+
></i>
|
|
2165
|
+
</span>
|
|
2166
|
+
<span
|
|
2167
|
+
class="pf-c-menu__item-text"
|
|
2168
|
+
>Settings</span>
|
|
2169
|
+
</span>
|
|
2170
|
+
</button>
|
|
2171
|
+
</li>
|
|
2172
|
+
<li class="pf-c-divider" role="separator"></li>
|
|
2173
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2174
|
+
<a
|
|
2175
|
+
class="pf-c-menu__item"
|
|
2176
|
+
href="#"
|
|
2177
|
+
role="menuitem"
|
|
2178
|
+
>
|
|
2179
|
+
<span class="pf-c-menu__item-main">
|
|
2180
|
+
<span
|
|
2181
|
+
class="pf-c-menu__item-text"
|
|
2182
|
+
>Customer support</span>
|
|
2183
|
+
</span>
|
|
2184
|
+
</a>
|
|
2185
|
+
</li>
|
|
2186
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2187
|
+
<a
|
|
2188
|
+
class="pf-c-menu__item"
|
|
2189
|
+
href="#"
|
|
2190
|
+
role="menuitem"
|
|
2191
|
+
>
|
|
2192
|
+
<span class="pf-c-menu__item-main">
|
|
2193
|
+
<span class="pf-c-menu__item-text">About</span>
|
|
2194
|
+
</span>
|
|
2195
|
+
</a>
|
|
2196
|
+
</li>
|
|
2197
|
+
</ul>
|
|
2198
|
+
</div>
|
|
2199
|
+
</div>
|
|
2200
|
+
</li>
|
|
2201
|
+
|
|
2202
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2203
|
+
<button
|
|
2204
|
+
class="pf-c-menu__item"
|
|
2205
|
+
type="button"
|
|
2206
|
+
role="menuitem"
|
|
2207
|
+
aria-expanded="false"
|
|
2208
|
+
>
|
|
2209
|
+
<span class="pf-c-menu__item-main">
|
|
2210
|
+
<span class="pf-c-menu__item-icon">
|
|
2211
|
+
<i
|
|
2212
|
+
class="fas fa-fw fa-pf-icon pf-icon-help"
|
|
2213
|
+
aria-hidden="true"
|
|
2214
|
+
></i>
|
|
2215
|
+
</span>
|
|
2216
|
+
<span class="pf-c-menu__item-text">Help</span>
|
|
2217
|
+
<span class="pf-c-menu__item-toggle-icon">
|
|
2218
|
+
<i class="fas fa-angle-right"></i>
|
|
2219
|
+
</span>
|
|
2220
|
+
</span>
|
|
2221
|
+
</button>
|
|
2222
|
+
<div class="pf-c-menu" hidden>
|
|
2223
|
+
<div class="pf-c-menu__content">
|
|
2224
|
+
<ul class="pf-c-menu__list" role="menu">
|
|
2225
|
+
<li
|
|
2226
|
+
class="pf-c-menu__list-item pf-m-drill-up"
|
|
2227
|
+
role="none"
|
|
2228
|
+
>
|
|
2229
|
+
<button
|
|
2230
|
+
class="pf-c-menu__item"
|
|
2231
|
+
type="button"
|
|
2232
|
+
role="menuitem"
|
|
2233
|
+
>
|
|
2234
|
+
<span class="pf-c-menu__item-main">
|
|
2235
|
+
<span
|
|
2236
|
+
class="pf-c-menu__item-toggle-icon"
|
|
2237
|
+
>
|
|
2238
|
+
<i class="fas fa-angle-left"></i>
|
|
2239
|
+
</span>
|
|
2240
|
+
<span class="pf-c-menu__item-icon">
|
|
2241
|
+
<i
|
|
2242
|
+
class="fas fa-fw fa-pf-icon pf-icon-help"
|
|
2243
|
+
aria-hidden="true"
|
|
2244
|
+
></i>
|
|
2245
|
+
</span>
|
|
2246
|
+
<span class="pf-c-menu__item-text">Help</span>
|
|
2247
|
+
</span>
|
|
2248
|
+
</button>
|
|
2249
|
+
</li>
|
|
2250
|
+
<li class="pf-c-divider" role="separator"></li>
|
|
2251
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2252
|
+
<a
|
|
2253
|
+
class="pf-c-menu__item"
|
|
2254
|
+
href="#"
|
|
2255
|
+
role="menuitem"
|
|
2256
|
+
>
|
|
2257
|
+
<span class="pf-c-menu__item-main">
|
|
2258
|
+
<span
|
|
2259
|
+
class="pf-c-menu__item-text"
|
|
2260
|
+
>Support options</span>
|
|
2261
|
+
</span>
|
|
2262
|
+
</a>
|
|
2263
|
+
</li>
|
|
2264
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2265
|
+
<a
|
|
2266
|
+
class="pf-c-menu__item"
|
|
2267
|
+
href="#"
|
|
2268
|
+
role="menuitem"
|
|
2269
|
+
>
|
|
2270
|
+
<span class="pf-c-menu__item-main">
|
|
2271
|
+
<span
|
|
2272
|
+
class="pf-c-menu__item-text"
|
|
2273
|
+
>Open support case</span>
|
|
2274
|
+
</span>
|
|
2275
|
+
</a>
|
|
2276
|
+
</li>
|
|
2277
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2278
|
+
<a
|
|
2279
|
+
class="pf-c-menu__item"
|
|
2280
|
+
href="#"
|
|
2281
|
+
role="menuitem"
|
|
2282
|
+
>
|
|
2283
|
+
<span class="pf-c-menu__item-main">
|
|
2284
|
+
<span
|
|
2285
|
+
class="pf-c-menu__item-text"
|
|
2286
|
+
>API documentation</span>
|
|
2287
|
+
</span>
|
|
2288
|
+
</a>
|
|
2289
|
+
</li>
|
|
2290
|
+
</ul>
|
|
2291
|
+
</div>
|
|
2292
|
+
</div>
|
|
2293
|
+
</li>
|
|
2294
|
+
|
|
2295
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2296
|
+
<button
|
|
2297
|
+
class="pf-c-menu__item"
|
|
2298
|
+
type="button"
|
|
2299
|
+
role="menuitem"
|
|
2300
|
+
>
|
|
2301
|
+
<span class="pf-c-menu__item-main">
|
|
2302
|
+
<span class="pf-c-menu__item-icon">
|
|
2303
|
+
<i class="fas fa-fw fa-th" aria-hidden="true"></i>
|
|
2304
|
+
</span>
|
|
2305
|
+
<span
|
|
2306
|
+
class="pf-c-menu__item-text"
|
|
2307
|
+
>Application launcher</span>
|
|
2308
|
+
<span class="pf-c-menu__item-toggle-icon">
|
|
2309
|
+
<i class="fas fa-angle-right"></i>
|
|
2310
|
+
</span>
|
|
2311
|
+
</span>
|
|
2312
|
+
</button>
|
|
2313
|
+
<div class="pf-c-menu" hidden>
|
|
2314
|
+
<div class="pf-c-menu__header">
|
|
2315
|
+
<button
|
|
2316
|
+
class="pf-c-menu__item"
|
|
2317
|
+
type="button"
|
|
2318
|
+
role="menuitem"
|
|
2319
|
+
>
|
|
2320
|
+
<span class="pf-c-menu__item-main">
|
|
2321
|
+
<span class="pf-c-menu__item-toggle-icon">
|
|
2322
|
+
<i class="fas fa-angle-left"></i>
|
|
2323
|
+
</span>
|
|
2324
|
+
<span class="pf-c-menu__item-icon">
|
|
2325
|
+
<i
|
|
2326
|
+
class="fas fa-fw fa-th"
|
|
2327
|
+
aria-hidden="true"
|
|
2328
|
+
></i>
|
|
2329
|
+
</span>
|
|
2330
|
+
<span
|
|
2331
|
+
class="pf-c-menu__item-text"
|
|
2332
|
+
>Application launcher</span>
|
|
2333
|
+
</span>
|
|
2334
|
+
</button>
|
|
2335
|
+
</div>
|
|
2336
|
+
<div class="pf-c-menu__search">
|
|
2337
|
+
<div class="pf-c-menu__search-input">
|
|
2338
|
+
<div class="pf-c-search-input">
|
|
2339
|
+
<div class="pf-c-search-input__bar">
|
|
2340
|
+
<span class="pf-c-search-input__text">
|
|
2341
|
+
<span class="pf-c-search-input__icon">
|
|
2342
|
+
<i
|
|
2343
|
+
class="fas fa-search fa-fw"
|
|
2344
|
+
aria-hidden="true"
|
|
2345
|
+
></i>
|
|
2346
|
+
</span>
|
|
2347
|
+
<input
|
|
2348
|
+
class="pf-c-search-input__text-input"
|
|
2349
|
+
type="text"
|
|
2350
|
+
placeholder="Search"
|
|
2351
|
+
aria-label="Search"
|
|
2352
|
+
/>
|
|
2353
|
+
</span>
|
|
2354
|
+
</div>
|
|
2355
|
+
</div>
|
|
2356
|
+
</div>
|
|
2357
|
+
</div>
|
|
2358
|
+
<hr class="pf-c-divider" />
|
|
2359
|
+
<section class="pf-c-menu__group">
|
|
2360
|
+
<h1 class="pf-c-menu__group-title">Favorites</h1>
|
|
2361
|
+
<ul class="pf-c-menu__list" role="menu">
|
|
2362
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2363
|
+
<a
|
|
2364
|
+
class="pf-c-menu__item"
|
|
2365
|
+
href="#"
|
|
2366
|
+
role="menuitem"
|
|
2367
|
+
>
|
|
2368
|
+
<span class="pf-c-menu__item-main">
|
|
2369
|
+
<span
|
|
2370
|
+
class="pf-c-menu__item-text"
|
|
2371
|
+
>Link 1</span>
|
|
2372
|
+
</span>
|
|
2373
|
+
</a>
|
|
2374
|
+
<button
|
|
2375
|
+
class="pf-c-menu__item-action pf-m-favorite pf-m-favorited"
|
|
2376
|
+
type="button"
|
|
2377
|
+
aria-label="Starred"
|
|
2378
|
+
>
|
|
2379
|
+
<span class="pf-c-menu__item-action-icon">
|
|
2380
|
+
<i
|
|
2381
|
+
class="fas fa-star"
|
|
2382
|
+
aria-hidden="true"
|
|
2383
|
+
></i>
|
|
2384
|
+
</span>
|
|
2385
|
+
</button>
|
|
2386
|
+
</li>
|
|
2387
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2388
|
+
<a
|
|
2389
|
+
class="pf-c-menu__item"
|
|
2390
|
+
href="#"
|
|
2391
|
+
role="menuitem"
|
|
2392
|
+
target="_blank"
|
|
2393
|
+
>
|
|
2394
|
+
<span class="pf-c-menu__item-main">
|
|
2395
|
+
<span
|
|
2396
|
+
class="pf-c-menu__item-text"
|
|
2397
|
+
>Link 2</span>
|
|
2398
|
+
<span
|
|
2399
|
+
class="pf-c-menu__item-external-icon"
|
|
2400
|
+
>
|
|
2401
|
+
<i
|
|
2402
|
+
class="fas fa-external-link-alt"
|
|
2403
|
+
aria-hidden="true"
|
|
2404
|
+
></i>
|
|
2405
|
+
</span>
|
|
2406
|
+
<span
|
|
2407
|
+
class="pf-screen-reader"
|
|
2408
|
+
>(opens new window)</span>
|
|
2409
|
+
</span>
|
|
2410
|
+
</a>
|
|
2411
|
+
<button
|
|
2412
|
+
class="pf-c-menu__item-action pf-m-favorite"
|
|
2413
|
+
type="button"
|
|
2414
|
+
aria-label="Not starred"
|
|
2415
|
+
>
|
|
2416
|
+
<span class="pf-c-menu__item-action-icon">
|
|
2417
|
+
<i
|
|
2418
|
+
class="fas fa-star"
|
|
2419
|
+
aria-hidden="true"
|
|
2420
|
+
></i>
|
|
2421
|
+
</span>
|
|
2422
|
+
</button>
|
|
2423
|
+
</li>
|
|
2424
|
+
</ul>
|
|
2425
|
+
</section>
|
|
2426
|
+
<hr class="pf-c-divider" />
|
|
2427
|
+
<section class="pf-c-menu__group">
|
|
2428
|
+
<h1 class="pf-c-menu__group-title">Group 1</h1>
|
|
2429
|
+
<ul class="pf-c-menu__list" role="menu">
|
|
2430
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2431
|
+
<a
|
|
2432
|
+
class="pf-c-menu__item"
|
|
2433
|
+
href="#"
|
|
2434
|
+
role="menuitem"
|
|
2435
|
+
>
|
|
2436
|
+
<span class="pf-c-menu__item-main">
|
|
2437
|
+
<span
|
|
2438
|
+
class="pf-c-menu__item-text"
|
|
2439
|
+
>Link 1</span>
|
|
2440
|
+
</span>
|
|
2441
|
+
</a>
|
|
2442
|
+
<button
|
|
2443
|
+
class="pf-c-menu__item-action pf-m-favorite"
|
|
2444
|
+
type="button"
|
|
2445
|
+
aria-label="Not starred"
|
|
2446
|
+
>
|
|
2447
|
+
<span class="pf-c-menu__item-action-icon">
|
|
2448
|
+
<i
|
|
2449
|
+
class="fas fa-star"
|
|
2450
|
+
aria-hidden="true"
|
|
2451
|
+
></i>
|
|
2452
|
+
</span>
|
|
2453
|
+
</button>
|
|
2454
|
+
</li>
|
|
2455
|
+
<li class="pf-c-menu__list-item" role="none">
|
|
2456
|
+
<a
|
|
2457
|
+
class="pf-c-menu__item"
|
|
2458
|
+
href="#"
|
|
2459
|
+
role="menuitem"
|
|
2460
|
+
target="_blank"
|
|
2461
|
+
>
|
|
2462
|
+
<span class="pf-c-menu__item-main">
|
|
2463
|
+
<span
|
|
2464
|
+
class="pf-c-menu__item-text"
|
|
2465
|
+
>Link 2</span>
|
|
2466
|
+
<span
|
|
2467
|
+
class="pf-c-menu__item-external-icon"
|
|
2468
|
+
>
|
|
2469
|
+
<i
|
|
2470
|
+
class="fas fa-external-link-alt"
|
|
2471
|
+
aria-hidden="true"
|
|
2472
|
+
></i>
|
|
2473
|
+
</span>
|
|
2474
|
+
<span
|
|
2475
|
+
class="pf-screen-reader"
|
|
2476
|
+
>(opens new window)</span>
|
|
2477
|
+
</span>
|
|
2478
|
+
</a>
|
|
2479
|
+
<button
|
|
2480
|
+
class="pf-c-menu__item-action pf-m-favorite pf-m-favorited"
|
|
2481
|
+
type="button"
|
|
2482
|
+
aria-label="Starred"
|
|
2483
|
+
>
|
|
2484
|
+
<span class="pf-c-menu__item-action-icon">
|
|
2485
|
+
<i
|
|
2486
|
+
class="fas fa-star"
|
|
2487
|
+
aria-hidden="true"
|
|
2488
|
+
></i>
|
|
2489
|
+
</span>
|
|
2490
|
+
</button>
|
|
2491
|
+
</li>
|
|
2492
|
+
</ul>
|
|
2493
|
+
</section>
|
|
2494
|
+
</div>
|
|
2495
|
+
</li>
|
|
2496
|
+
</ul>
|
|
2497
|
+
</section>
|
|
2498
|
+
</div>
|
|
2499
|
+
</div>
|
|
2500
|
+
</div>
|
|
2501
|
+
</div>
|
|
2502
|
+
</div>
|
|
2503
|
+
<div class="pf-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
|
|
2504
|
+
<div
|
|
2505
|
+
class="pf-c-dropdown pf-m-full-height"
|
|
2506
|
+
style="--pf-c-dropdown--MaxWidth: 20ch;"
|
|
2507
|
+
>
|
|
1893
2508
|
<button
|
|
1894
|
-
class="pf-c-
|
|
2509
|
+
class="pf-c-dropdown__toggle"
|
|
2510
|
+
id="toolbar-pagination-management-example-masthead-profile-button"
|
|
2511
|
+
aria-expanded="false"
|
|
1895
2512
|
type="button"
|
|
1896
|
-
|
|
1897
|
-
|
|
1898
|
-
|
|
1899
|
-
|
|
1900
|
-
|
|
1901
|
-
|
|
1902
|
-
|
|
1903
|
-
|
|
2513
|
+
>
|
|
2514
|
+
<span class="pf-c-dropdown__toggle-image">
|
|
2515
|
+
<img
|
|
2516
|
+
class="pf-c-avatar"
|
|
2517
|
+
src="/assets/images/img_avatar.svg"
|
|
2518
|
+
alt="Avatar image"
|
|
2519
|
+
/>
|
|
2520
|
+
</span>
|
|
2521
|
+
<span class="pf-c-dropdown__toggle-text">Ned Username</span>
|
|
2522
|
+
<span class="pf-c-dropdown__toggle-icon">
|
|
2523
|
+
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
2524
|
+
</span>
|
|
2525
|
+
</button>
|
|
2526
|
+
<div class="pf-c-dropdown__menu" hidden>
|
|
2527
|
+
<section class="pf-c-dropdown__group">
|
|
2528
|
+
<div class="pf-c-dropdown__menu-item pf-m-text">
|
|
2529
|
+
<div class="pf-u-font-size-sm">Account number:</div>
|
|
2530
|
+
<div>123456789</div>
|
|
2531
|
+
</div>
|
|
2532
|
+
<div class="pf-c-dropdown__menu-item pf-m-text">
|
|
2533
|
+
<div class="pf-u-font-size-sm">Username:</div>
|
|
2534
|
+
<div>mshaksho@redhat.com</div>
|
|
2535
|
+
</div>
|
|
2536
|
+
</section>
|
|
2537
|
+
<hr class="pf-c-divider" />
|
|
2538
|
+
<section class="pf-c-dropdown__group">
|
|
2539
|
+
<ul>
|
|
2540
|
+
<li>
|
|
2541
|
+
<a class="pf-c-dropdown__menu-item" href="#">My profile</a>
|
|
2542
|
+
</li>
|
|
2543
|
+
<li>
|
|
2544
|
+
<a
|
|
2545
|
+
class="pf-c-dropdown__menu-item"
|
|
2546
|
+
href="#"
|
|
2547
|
+
>User management</a>
|
|
2548
|
+
</li>
|
|
2549
|
+
<li>
|
|
2550
|
+
<a class="pf-c-dropdown__menu-item" href="#">Logout</a>
|
|
2551
|
+
</li>
|
|
2552
|
+
</ul>
|
|
2553
|
+
</section>
|
|
2554
|
+
</div>
|
|
2555
|
+
</div>
|
|
2556
|
+
</div>
|
|
1904
2557
|
</div>
|
|
1905
2558
|
</div>
|
|
1906
2559
|
</div>
|
|
1907
|
-
<img
|
|
1908
|
-
class="pf-c-avatar"
|
|
1909
|
-
src="/assets/images/img_avatar.svg"
|
|
1910
|
-
alt="Avatar image"
|
|
1911
|
-
/>
|
|
1912
2560
|
</div>
|
|
1913
2561
|
</header>
|
|
1914
2562
|
<div class="pf-c-page__sidebar">
|
|
1915
2563
|
<div class="pf-c-page__sidebar-body">
|
|
1916
2564
|
<nav
|
|
1917
2565
|
class="pf-c-nav"
|
|
1918
|
-
id="toolbar-pagination-management-primary-nav"
|
|
2566
|
+
id="toolbar-pagination-management-example-primary-nav"
|
|
1919
2567
|
aria-label="Global"
|
|
1920
2568
|
>
|
|
1921
2569
|
<ul class="pf-c-nav__list">
|
|
@@ -1945,7 +2593,7 @@ section: components
|
|
|
1945
2593
|
<main
|
|
1946
2594
|
class="pf-c-page__main"
|
|
1947
2595
|
tabindex="-1"
|
|
1948
|
-
id="main-content-toolbar-pagination-management"
|
|
2596
|
+
id="main-content-toolbar-pagination-management-example"
|
|
1949
2597
|
>
|
|
1950
2598
|
<section class="pf-c-page__main-breadcrumb pf-m-limit-width">
|
|
1951
2599
|
<div class="pf-c-page__main-body">
|
|
@@ -1994,7 +2642,7 @@ section: components
|
|
|
1994
2642
|
<section class="pf-c-page__main-section">
|
|
1995
2643
|
<div
|
|
1996
2644
|
class="pf-c-toolbar pf-m-nowrap"
|
|
1997
|
-
id="toolbar-pagination-management-
|
|
2645
|
+
id="toolbar-pagination-management-example-toolbar"
|
|
1998
2646
|
>
|
|
1999
2647
|
<div class="pf-c-toolbar__content">
|
|
2000
2648
|
<div class="pf-c-toolbar__content-section pf-m-nowrap">
|
|
@@ -2005,7 +2653,7 @@ section: components
|
|
|
2005
2653
|
type="button"
|
|
2006
2654
|
aria-label="Show filters"
|
|
2007
2655
|
aria-expanded="false"
|
|
2008
|
-
aria-controls="toolbar-pagination-management-
|
|
2656
|
+
aria-controls="toolbar-pagination-management-example-toolbar-expandable-content"
|
|
2009
2657
|
>
|
|
2010
2658
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
2011
2659
|
</button>
|
|
@@ -2015,17 +2663,17 @@ section: components
|
|
|
2015
2663
|
<div class="pf-c-input-group">
|
|
2016
2664
|
<div class="pf-c-select" style="width: 175px">
|
|
2017
2665
|
<span
|
|
2018
|
-
id="toolbar-pagination-management-
|
|
2666
|
+
id="toolbar-pagination-management-example-toolbar-select-name-label"
|
|
2019
2667
|
hidden
|
|
2020
2668
|
>Choose one</span>
|
|
2021
2669
|
|
|
2022
2670
|
<button
|
|
2023
2671
|
class="pf-c-select__toggle"
|
|
2024
2672
|
type="button"
|
|
2025
|
-
id="toolbar-pagination-management-
|
|
2673
|
+
id="toolbar-pagination-management-example-toolbar-select-name-toggle"
|
|
2026
2674
|
aria-haspopup="true"
|
|
2027
2675
|
aria-expanded="false"
|
|
2028
|
-
aria-labelledby="toolbar-pagination-management-
|
|
2676
|
+
aria-labelledby="toolbar-pagination-management-example-toolbar-select-name-label toolbar-pagination-management-example-toolbar-select-name-toggle"
|
|
2029
2677
|
>
|
|
2030
2678
|
<div class="pf-c-select__toggle-wrapper">
|
|
2031
2679
|
<span class="pf-c-select__toggle-icon">
|
|
@@ -2041,7 +2689,7 @@ section: components
|
|
|
2041
2689
|
<ul
|
|
2042
2690
|
class="pf-c-select__menu"
|
|
2043
2691
|
role="listbox"
|
|
2044
|
-
aria-labelledby="toolbar-pagination-management-
|
|
2692
|
+
aria-labelledby="toolbar-pagination-management-example-toolbar-select-name-label"
|
|
2045
2693
|
hidden
|
|
2046
2694
|
style="width: 175px"
|
|
2047
2695
|
>
|
|
@@ -2105,14 +2753,14 @@ section: components
|
|
|
2105
2753
|
<div class="pf-c-toolbar__item pf-m-overflow-menu">
|
|
2106
2754
|
<div
|
|
2107
2755
|
class="pf-c-overflow-menu"
|
|
2108
|
-
id="toolbar-pagination-management-
|
|
2756
|
+
id="toolbar-pagination-management-example-toolbar-overflow-menu"
|
|
2109
2757
|
>
|
|
2110
2758
|
<div class="pf-c-overflow-menu__control">
|
|
2111
2759
|
<div class="pf-c-dropdown">
|
|
2112
2760
|
<button
|
|
2113
2761
|
class="pf-c-button pf-c-dropdown__toggle pf-m-plain"
|
|
2114
2762
|
type="button"
|
|
2115
|
-
id="toolbar-pagination-management-
|
|
2763
|
+
id="toolbar-pagination-management-example-toolbar-overflow-menu-dropdown-toggle"
|
|
2116
2764
|
aria-label="Overflow menu"
|
|
2117
2765
|
aria-expanded="false"
|
|
2118
2766
|
>
|
|
@@ -2120,7 +2768,7 @@ section: components
|
|
|
2120
2768
|
</button>
|
|
2121
2769
|
<ul
|
|
2122
2770
|
class="pf-c-dropdown__menu"
|
|
2123
|
-
aria-labelledby="toolbar-pagination-management-
|
|
2771
|
+
aria-labelledby="toolbar-pagination-management-example-toolbar-overflow-menu-dropdown-toggle"
|
|
2124
2772
|
hidden
|
|
2125
2773
|
>
|
|
2126
2774
|
<li>
|
|
@@ -2217,7 +2865,7 @@ section: components
|
|
|
2217
2865
|
</div>
|
|
2218
2866
|
<div
|
|
2219
2867
|
class="pf-c-toolbar__expandable-content pf-m-hidden"
|
|
2220
|
-
id="toolbar-pagination-management-
|
|
2868
|
+
id="toolbar-pagination-management-example-toolbar-expandable-content"
|
|
2221
2869
|
hidden
|
|
2222
2870
|
></div>
|
|
2223
2871
|
</div>
|