@patternfly/patternfly 4.205.0 → 4.206.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (54) hide show
  1. package/base/_common.scss +9 -0
  2. package/base/patternfly-common.css +7 -0
  3. package/components/Tabs/tabs.css +4 -0
  4. package/components/Tabs/tabs.scss +8 -1
  5. package/components/TreeView/tree-view.css +6 -12
  6. package/components/TreeView/tree-view.scss +4 -8
  7. package/docs/components/AppLauncher/examples/application-launcher.md +69 -22
  8. package/docs/components/DataList/examples/DataList.md +30 -30
  9. package/docs/components/DatePicker/examples/DatePicker.md +4 -4
  10. package/docs/components/LabelGroup/examples/LabelGroup.md +19 -19
  11. package/docs/components/LogViewer/examples/LogViewer.md +46 -37
  12. package/docs/components/Masthead/examples/masthead.md +1 -1
  13. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +54 -27
  14. package/docs/components/Nav/examples/Navigation.md +12 -6
  15. package/docs/components/Pagination/examples/Pagination.md +47 -14
  16. package/docs/components/Popover/examples/Popover.md +36 -24
  17. package/docs/components/SearchInput/examples/SearchInput.md +12 -12
  18. package/docs/components/Select/examples/Select.md +8 -8
  19. package/docs/components/Table/examples/Table.md +1 -1
  20. package/docs/components/Tabs/examples/Tabs.md +67 -73
  21. package/docs/components/TextInputGroup/examples/TextInputGroup.md +60 -60
  22. package/docs/components/Tile/examples/Tile.md +0 -2
  23. package/docs/components/TreeView/examples/TreeView.md +257 -217
  24. package/docs/demos/AboutModal/examples/AboutModal.md +1 -1
  25. package/docs/demos/Alert/examples/Alert.md +3 -3
  26. package/docs/demos/BackToTop/examples/BackToTop.md +1 -1
  27. package/docs/demos/Banner/examples/Banner.md +2 -2
  28. package/docs/demos/CardView/examples/CardView.md +1 -1
  29. package/docs/demos/ContextSelector/examples/ContextSelector.md +3 -3
  30. package/docs/demos/Dashboard/examples/Dashboard.md +1 -1
  31. package/docs/demos/DataList/examples/DataList.md +4 -4
  32. package/docs/demos/DescriptionList/examples/DescriptionList.md +3 -3
  33. package/docs/demos/Drawer/examples/Drawer.md +5 -5
  34. package/docs/demos/JumpLinks/examples/JumpLinks.md +6 -6
  35. package/docs/demos/Masthead/examples/Masthead.md +2 -2
  36. package/docs/demos/Modal/examples/Modal.md +6 -6
  37. package/docs/demos/Nav/examples/Nav.md +8 -8
  38. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +5 -5
  39. package/docs/demos/Page/examples/Page.md +8 -8
  40. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +7 -7
  41. package/docs/demos/Skeleton/examples/Skeleton.md +1 -1
  42. package/docs/demos/Table/examples/Table.md +14 -14
  43. package/docs/demos/Tabs/examples/Tabs.md +8 -8
  44. package/docs/demos/Toolbar/examples/Toolbar.md +55 -37
  45. package/docs/demos/Wizard/examples/Wizard.md +8 -8
  46. package/docs/layouts/Flex/examples/Flex.md +1 -1
  47. package/docs/layouts/Grid/examples/Grid.md +1 -1
  48. package/package.json +1 -1
  49. package/patternfly-base-no-reset.css +7 -0
  50. package/patternfly-base.css +7 -0
  51. package/patternfly-no-reset.css +17 -12
  52. package/patternfly.css +17 -12
  53. package/patternfly.min.css +1 -1
  54. package/patternfly.min.css.map +1 -1
package/docs/components/Tabs/examples/Tabs.md CHANGED
@@ -196,7 +196,7 @@ cssPrefix: pf-c-tabs
196
196
  ### Horizontal overflow
197
197
 
198
198
  ```html isBeta
199
- <div class="pf-c-tabs" id="horizontal-overflow-example">
199
+ <div class="pf-c-tabs pf-m-overflow" id="horizontal-overflow-example">
200
200
  <ul class="pf-c-tabs__list">
201
201
  <li class="pf-c-tabs__item">
202
202
  <button
@@ -266,7 +266,7 @@ cssPrefix: pf-c-tabs
266
266
  ### Horizontal overflow expanded
267
267
 
268
268
  ```html isBeta
269
- <div class="pf-c-tabs" id="horizontal-overflow-expanded-example">
269
+ <div class="pf-c-tabs pf-m-overflow" id="horizontal-overflow-expanded-example">
270
270
  <ul class="pf-c-tabs__list">
271
271
  <li class="pf-c-tabs__item">
272
272
  <button
@@ -337,7 +337,7 @@ cssPrefix: pf-c-tabs
337
337
  ### Horizontal overflow selected
338
338
 
339
339
  ```html isBeta
340
- <div class="pf-c-tabs" id="horizontal-overflow-selected-example">
340
+ <div class="pf-c-tabs pf-m-overflow" id="horizontal-overflow-selected-example">
341
341
  <ul class="pf-c-tabs__list">
342
342
  <li class="pf-c-tabs__item">
343
343
  <button
@@ -1384,7 +1384,7 @@ cssPrefix: pf-c-tabs
1384
1384
  ```html
1385
1385
  <nav
1386
1386
  class="pf-c-tabs pf-m-scrollable"
1387
- aria-label="Local"
1387
+ aria-label="Tabs nav"
1388
1388
  id="default-scroll-nav-example"
1389
1389
  >
1390
1390
  <button class="pf-c-tabs__scroll-button" aria-label="Scroll left">
@@ -1461,7 +1461,7 @@ cssPrefix: pf-c-tabs
1461
1461
  ### Sub nav using the nav element
1462
1462
 
1463
1463
  ```html
1464
- <nav class="pf-c-tabs" aria-label="Local" id="primary-nav-example">
1464
+ <nav class="pf-c-tabs" aria-label="Tabs primary nav" id="primary-nav-example">
1465
1465
  <button
1466
1466
  class="pf-c-tabs__scroll-button"
1467
1467
  disabled
@@ -1528,7 +1528,7 @@ cssPrefix: pf-c-tabs
1528
1528
 
1529
1529
  <nav
1530
1530
  class="pf-c-tabs pf-m-secondary"
1531
- aria-label="Local secondary"
1531
+ aria-label="Tabs secondary nav"
1532
1532
  id="secondary-nav-example"
1533
1533
  >
1534
1534
  <button
@@ -1847,7 +1847,7 @@ cssPrefix: pf-c-tabs
1847
1847
  ```html
1848
1848
  <div
1849
1849
  class="pf-c-tabs pf-m-expandable pf-m-vertical"
1850
- id="vertical-expandable-example"
1850
+ id="vertical-expandable-legacy-example"
1851
1851
  >
1852
1852
  <div class="pf-c-tabs__toggle">
1853
1853
  <div class="pf-c-tabs__toggle-button">
@@ -1856,8 +1856,8 @@ cssPrefix: pf-c-tabs
1856
1856
  type="button"
1857
1857
  aria-label="Details"
1858
1858
  aria-expanded="false"
1859
- id="vertical-expandable-example-toggle-button"
1860
- aria-labelledby="vertical-expandable-example-toggle-text vertical-expandable-example-toggle-button"
1859
+ id="vertical-expandable-legacy-example-toggle-button"
1860
+ aria-labelledby="vertical-expandable-legacy-example-toggle-text vertical-expandable-legacy-example-toggle-button"
1861
1861
  >
1862
1862
  <span class="pf-c-tabs__toggle-icon">
1863
1863
  <i class="fas fa-angle-right" aria-hidden="true"></i>
@@ -1866,7 +1866,7 @@ cssPrefix: pf-c-tabs
1866
1866
  </div>
1867
1867
  <span
1868
1868
  class="pf-c-tabs__toggle-text"
1869
- id="vertical-expandable-example-toggle-text"
1869
+ id="vertical-expandable-legacy-example-toggle-text"
1870
1870
  >Containers</span>
1871
1871
  </div>
1872
1872
 
@@ -1874,7 +1874,7 @@ cssPrefix: pf-c-tabs
1874
1874
  <li class="pf-c-tabs__item">
1875
1875
  <button
1876
1876
  class="pf-c-tabs__link"
1877
- id="vertical-expandable-example-users-link"
1877
+ id="vertical-expandable-legacy-example-users-link"
1878
1878
  >
1879
1879
  <span class="pf-c-tabs__item-text">Users</span>
1880
1880
  </button>
@@ -1882,7 +1882,7 @@ cssPrefix: pf-c-tabs
1882
1882
  <li class="pf-c-tabs__item pf-m-current">
1883
1883
  <button
1884
1884
  class="pf-c-tabs__link"
1885
- id="vertical-expandable-example-containers-link"
1885
+ id="vertical-expandable-legacy-example-containers-link"
1886
1886
  >
1887
1887
  <span class="pf-c-tabs__item-text">Containers</span>
1888
1888
  </button>
@@ -1890,7 +1890,7 @@ cssPrefix: pf-c-tabs
1890
1890
  <li class="pf-c-tabs__item">
1891
1891
  <button
1892
1892
  class="pf-c-tabs__link"
1893
- id="vertical-expandable-example-database-link"
1893
+ id="vertical-expandable-legacy-example-database-link"
1894
1894
  >
1895
1895
  <span class="pf-c-tabs__item-text">Database</span>
1896
1896
  </button>
@@ -1899,7 +1899,7 @@ cssPrefix: pf-c-tabs
1899
1899
  <li class="pf-c-tabs__item">
1900
1900
  <button
1901
1901
  class="pf-c-tabs__link"
1902
- id="vertical-expandable-example-server-link"
1902
+ id="vertical-expandable-legacy-example-server-link"
1903
1903
  >
1904
1904
  <span class="pf-c-tabs__item-text">Server</span>
1905
1905
  </button>
@@ -1907,7 +1907,7 @@ cssPrefix: pf-c-tabs
1907
1907
  <li class="pf-c-tabs__item">
1908
1908
  <button
1909
1909
  class="pf-c-tabs__link"
1910
- id="vertical-expandable-example-system-link"
1910
+ id="vertical-expandable-legacy-example-system-link"
1911
1911
  >
1912
1912
  <span class="pf-c-tabs__item-text">System</span>
1913
1913
  </button>
@@ -1915,7 +1915,7 @@ cssPrefix: pf-c-tabs
1915
1915
  <li class="pf-c-tabs__item">
1916
1916
  <button
1917
1917
  class="pf-c-tabs__link"
1918
- id="vertical-expandable-example-network-wired-link"
1918
+ id="vertical-expandable-legacy-example-network-wired-link"
1919
1919
  >
1920
1920
  <span class="pf-c-tabs__item-text">Network</span>
1921
1921
  </button>
@@ -1930,7 +1930,7 @@ cssPrefix: pf-c-tabs
1930
1930
  ```html
1931
1931
  <div
1932
1932
  class="pf-c-tabs pf-m-expandable pf-m-expanded pf-m-vertical"
1933
- id="vertical-expanded-example"
1933
+ id="vertical-expanded-legacy-example"
1934
1934
  >
1935
1935
  <div class="pf-c-tabs__toggle">
1936
1936
  <div class="pf-c-tabs__toggle-button">
@@ -1939,8 +1939,8 @@ cssPrefix: pf-c-tabs
1939
1939
  type="button"
1940
1940
  aria-label="Details"
1941
1941
  aria-expanded="true"
1942
- id="vertical-expanded-example-toggle-button"
1943
- aria-labelledby="vertical-expanded-example-toggle-text vertical-expanded-example-toggle-button"
1942
+ id="vertical-expanded-legacy-example-toggle-button"
1943
+ aria-labelledby="vertical-expanded-legacy-example-toggle-text vertical-expanded-legacy-example-toggle-button"
1944
1944
  >
1945
1945
  <span class="pf-c-tabs__toggle-icon">
1946
1946
  <i class="fas fa-angle-right" aria-hidden="true"></i>
@@ -1949,20 +1949,23 @@ cssPrefix: pf-c-tabs
1949
1949
  </div>
1950
1950
  <span
1951
1951
  class="pf-c-tabs__toggle-text"
1952
- id="vertical-expanded-example-toggle-text"
1952
+ id="vertical-expanded-legacy-example-toggle-text"
1953
1953
  >Containers</span>
1954
1954
  </div>
1955
1955
 
1956
1956
  <ul class="pf-c-tabs__list">
1957
1957
  <li class="pf-c-tabs__item">
1958
- <button class="pf-c-tabs__link" id="vertical-expanded-example-users-link">
1958
+ <button
1959
+ class="pf-c-tabs__link"
1960
+ id="vertical-expanded-legacy-example-users-link"
1961
+ >
1959
1962
  <span class="pf-c-tabs__item-text">Users</span>
1960
1963
  </button>
1961
1964
  </li>
1962
1965
  <li class="pf-c-tabs__item pf-m-current">
1963
1966
  <button
1964
1967
  class="pf-c-tabs__link"
1965
- id="vertical-expanded-example-containers-link"
1968
+ id="vertical-expanded-legacy-example-containers-link"
1966
1969
  >
1967
1970
  <span class="pf-c-tabs__item-text">Containers</span>
1968
1971
  </button>
@@ -1970,7 +1973,7 @@ cssPrefix: pf-c-tabs
1970
1973
  <li class="pf-c-tabs__item">
1971
1974
  <button
1972
1975
  class="pf-c-tabs__link"
1973
- id="vertical-expanded-example-database-link"
1976
+ id="vertical-expanded-legacy-example-database-link"
1974
1977
  >
1975
1978
  <span class="pf-c-tabs__item-text">Database</span>
1976
1979
  </button>
@@ -1979,7 +1982,7 @@ cssPrefix: pf-c-tabs
1979
1982
  <li class="pf-c-tabs__item">
1980
1983
  <button
1981
1984
  class="pf-c-tabs__link"
1982
- id="vertical-expanded-example-server-link"
1985
+ id="vertical-expanded-legacy-example-server-link"
1983
1986
  >
1984
1987
  <span class="pf-c-tabs__item-text">Server</span>
1985
1988
  </button>
@@ -1987,7 +1990,7 @@ cssPrefix: pf-c-tabs
1987
1990
  <li class="pf-c-tabs__item">
1988
1991
  <button
1989
1992
  class="pf-c-tabs__link"
1990
- id="vertical-expanded-example-system-link"
1993
+ id="vertical-expanded-legacy-example-system-link"
1991
1994
  >
1992
1995
  <span class="pf-c-tabs__item-text">System</span>
1993
1996
  </button>
@@ -1995,7 +1998,7 @@ cssPrefix: pf-c-tabs
1995
1998
  <li class="pf-c-tabs__item">
1996
1999
  <button
1997
2000
  class="pf-c-tabs__link"
1998
- id="vertical-expanded-example-network-wired-link"
2001
+ id="vertical-expanded-legacy-example-network-wired-link"
1999
2002
  >
2000
2003
  <span class="pf-c-tabs__item-text">Network</span>
2001
2004
  </button>
@@ -2010,7 +2013,7 @@ cssPrefix: pf-c-tabs
2010
2013
  ```html
2011
2014
  <div
2012
2015
  class="pf-c-tabs pf-m-expandable pf-m-vertical pf-m-non-expandable-on-md pf-m-expandable-on-lg pf-m-non-expandable-on-xl"
2013
- id="vertical-expandable-responsive-example"
2016
+ id="vertical-expandable-responsive-legacy-example"
2014
2017
  >
2015
2018
  <div class="pf-c-tabs__toggle">
2016
2019
  <div class="pf-c-tabs__toggle-button">
@@ -2019,8 +2022,8 @@ cssPrefix: pf-c-tabs
2019
2022
  type="button"
2020
2023
  aria-label="Details"
2021
2024
  aria-expanded="false"
2022
- id="vertical-expandable-responsive-example-toggle-button"
2023
- aria-labelledby="vertical-expandable-responsive-example-toggle-text vertical-expandable-responsive-example-toggle-button"
2025
+ id="vertical-expandable-responsive-legacy-example-toggle-button"
2026
+ aria-labelledby="vertical-expandable-responsive-legacy-example-toggle-text vertical-expandable-responsive-legacy-example-toggle-button"
2024
2027
  >
2025
2028
  <span class="pf-c-tabs__toggle-icon">
2026
2029
  <i class="fas fa-angle-right" aria-hidden="true"></i>
@@ -2029,7 +2032,7 @@ cssPrefix: pf-c-tabs
2029
2032
  </div>
2030
2033
  <span
2031
2034
  class="pf-c-tabs__toggle-text"
2032
- id="vertical-expandable-responsive-example-toggle-text"
2035
+ id="vertical-expandable-responsive-legacy-example-toggle-text"
2033
2036
  >Containers</span>
2034
2037
  </div>
2035
2038
 
@@ -2037,7 +2040,7 @@ cssPrefix: pf-c-tabs
2037
2040
  <li class="pf-c-tabs__item">
2038
2041
  <button
2039
2042
  class="pf-c-tabs__link"
2040
- id="vertical-expandable-responsive-example-users-link"
2043
+ id="vertical-expandable-responsive-legacy-example-users-link"
2041
2044
  >
2042
2045
  <span class="pf-c-tabs__item-text">Users</span>
2043
2046
  </button>
@@ -2045,7 +2048,7 @@ cssPrefix: pf-c-tabs
2045
2048
  <li class="pf-c-tabs__item pf-m-current">
2046
2049
  <button
2047
2050
  class="pf-c-tabs__link"
2048
- id="vertical-expandable-responsive-example-containers-link"
2051
+ id="vertical-expandable-responsive-legacy-example-containers-link"
2049
2052
  >
2050
2053
  <span class="pf-c-tabs__item-text">Containers</span>
2051
2054
  </button>
@@ -2053,7 +2056,7 @@ cssPrefix: pf-c-tabs
2053
2056
  <li class="pf-c-tabs__item">
2054
2057
  <button
2055
2058
  class="pf-c-tabs__link"
2056
- id="vertical-expandable-responsive-example-database-link"
2059
+ id="vertical-expandable-responsive-legacy-example-database-link"
2057
2060
  >
2058
2061
  <span class="pf-c-tabs__item-text">Database</span>
2059
2062
  </button>
@@ -2062,7 +2065,7 @@ cssPrefix: pf-c-tabs
2062
2065
  <li class="pf-c-tabs__item">
2063
2066
  <button
2064
2067
  class="pf-c-tabs__link"
2065
- id="vertical-expandable-responsive-example-server-link"
2068
+ id="vertical-expandable-responsive-legacy-example-server-link"
2066
2069
  >
2067
2070
  <span class="pf-c-tabs__item-text">Server</span>
2068
2071
  </button>
@@ -2070,7 +2073,7 @@ cssPrefix: pf-c-tabs
2070
2073
  <li class="pf-c-tabs__item">
2071
2074
  <button
2072
2075
  class="pf-c-tabs__link"
2073
- id="vertical-expandable-responsive-example-system-link"
2076
+ id="vertical-expandable-responsive-legacy-example-system-link"
2074
2077
  >
2075
2078
  <span class="pf-c-tabs__item-text">System</span>
2076
2079
  </button>
@@ -2078,7 +2081,7 @@ cssPrefix: pf-c-tabs
2078
2081
  <li class="pf-c-tabs__item">
2079
2082
  <button
2080
2083
  class="pf-c-tabs__link"
2081
- id="vertical-expandable-responsive-example-network-wired-link"
2084
+ id="vertical-expandable-responsive-legacy-example-network-wired-link"
2082
2085
  >
2083
2086
  <span class="pf-c-tabs__item-text">Network</span>
2084
2087
  </button>
@@ -3157,13 +3160,13 @@ cssPrefix: pf-c-tabs
3157
3160
  ### Add tab button
3158
3161
 
3159
3162
  ```html
3160
- <div class="pf-c-tabs pf-m-scrollable" id="close-default-example">
3163
+ <div class="pf-c-tabs pf-m-scrollable" id="add-default-example">
3161
3164
  <button class="pf-c-tabs__scroll-button" disabled aria-label="Scroll left">
3162
3165
  <i class="fas fa-angle-left" aria-hidden="true"></i>
3163
3166
  </button>
3164
3167
  <ul class="pf-c-tabs__list">
3165
3168
  <li class="pf-c-tabs__item pf-m-action">
3166
- <button class="pf-c-tabs__link" id="close-default-example-users-link">
3169
+ <button class="pf-c-tabs__link" id="add-default-example-users-link">
3167
3170
  <span class="pf-c-tabs__item-text">Users</span>
3168
3171
  </button>
3169
3172
  <span class="pf-c-tabs__item-close">
@@ -3179,10 +3182,7 @@ cssPrefix: pf-c-tabs
3179
3182
  </span>
3180
3183
  </li>
3181
3184
  <li class="pf-c-tabs__item pf-m-current pf-m-action">
3182
- <button
3183
- class="pf-c-tabs__link"
3184
- id="close-default-example-containers-link"
3185
- >
3185
+ <button class="pf-c-tabs__link" id="add-default-example-containers-link">
3186
3186
  <span class="pf-c-tabs__item-text">Containers</span>
3187
3187
  </button>
3188
3188
  <span class="pf-c-tabs__item-close">
@@ -3198,7 +3198,7 @@ cssPrefix: pf-c-tabs
3198
3198
  </span>
3199
3199
  </li>
3200
3200
  <li class="pf-c-tabs__item pf-m-action">
3201
- <button class="pf-c-tabs__link" id="close-default-example-database-link">
3201
+ <button class="pf-c-tabs__link" id="add-default-example-database-link">
3202
3202
  <span class="pf-c-tabs__item-text">Database</span>
3203
3203
  </button>
3204
3204
  <span class="pf-c-tabs__item-close">
@@ -3215,7 +3215,7 @@ cssPrefix: pf-c-tabs
3215
3215
  </li>
3216
3216
 
3217
3217
  <li class="pf-c-tabs__item pf-m-action">
3218
- <button class="pf-c-tabs__link" id="close-default-example-server-link">
3218
+ <button class="pf-c-tabs__link" id="add-default-example-server-link">
3219
3219
  <span class="pf-c-tabs__item-text">Server</span>
3220
3220
  </button>
3221
3221
  <span class="pf-c-tabs__item-close">
@@ -3231,7 +3231,7 @@ cssPrefix: pf-c-tabs
3231
3231
  </span>
3232
3232
  </li>
3233
3233
  <li class="pf-c-tabs__item pf-m-action">
3234
- <button class="pf-c-tabs__link" id="close-default-example-system-link">
3234
+ <button class="pf-c-tabs__link" id="add-default-example-system-link">
3235
3235
  <span class="pf-c-tabs__item-text">System</span>
3236
3236
  </button>
3237
3237
  <span class="pf-c-tabs__item-close">
@@ -3249,7 +3249,7 @@ cssPrefix: pf-c-tabs
3249
3249
  <li class="pf-c-tabs__item pf-m-action">
3250
3250
  <button
3251
3251
  class="pf-c-tabs__link"
3252
- id="close-default-example-network-wired-link"
3252
+ id="add-default-example-network-wired-link"
3253
3253
  >
3254
3254
  <span class="pf-c-tabs__item-text">Network</span>
3255
3255
  </button>
@@ -3278,14 +3278,14 @@ cssPrefix: pf-c-tabs
3278
3278
  </div>
3279
3279
  <div
3280
3280
  class="pf-c-tabs pf-m-secondary pf-m-scrollable"
3281
- id="close-secondary-example"
3281
+ id="add-secondary-example"
3282
3282
  >
3283
3283
  <button class="pf-c-tabs__scroll-button" disabled aria-label="Scroll left">
3284
3284
  <i class="fas fa-angle-left" aria-hidden="true"></i>
3285
3285
  </button>
3286
3286
  <ul class="pf-c-tabs__list">
3287
3287
  <li class="pf-c-tabs__item pf-m-action">
3288
- <button class="pf-c-tabs__link" id="close-secondary-example-users-link">
3288
+ <button class="pf-c-tabs__link" id="add-secondary-example-users-link">
3289
3289
  <span class="pf-c-tabs__item-text">Users</span>
3290
3290
  </button>
3291
3291
  <span class="pf-c-tabs__item-close">
@@ -3303,7 +3303,7 @@ cssPrefix: pf-c-tabs
3303
3303
  <li class="pf-c-tabs__item pf-m-current pf-m-action">
3304
3304
  <button
3305
3305
  class="pf-c-tabs__link"
3306
- id="close-secondary-example-containers-link"
3306
+ id="add-secondary-example-containers-link"
3307
3307
  >
3308
3308
  <span class="pf-c-tabs__item-text">Containers</span>
3309
3309
  </button>
@@ -3320,10 +3320,7 @@ cssPrefix: pf-c-tabs
3320
3320
  </span>
3321
3321
  </li>
3322
3322
  <li class="pf-c-tabs__item pf-m-action">
3323
- <button
3324
- class="pf-c-tabs__link"
3325
- id="close-secondary-example-database-link"
3326
- >
3323
+ <button class="pf-c-tabs__link" id="add-secondary-example-database-link">
3327
3324
  <span class="pf-c-tabs__item-text">Database</span>
3328
3325
  </button>
3329
3326
  <span class="pf-c-tabs__item-close">
@@ -3340,7 +3337,7 @@ cssPrefix: pf-c-tabs
3340
3337
  </li>
3341
3338
 
3342
3339
  <li class="pf-c-tabs__item pf-m-action">
3343
- <button class="pf-c-tabs__link" id="close-secondary-example-server-link">
3340
+ <button class="pf-c-tabs__link" id="add-secondary-example-server-link">
3344
3341
  <span class="pf-c-tabs__item-text">Server</span>
3345
3342
  </button>
3346
3343
  <span class="pf-c-tabs__item-close">
@@ -3356,7 +3353,7 @@ cssPrefix: pf-c-tabs
3356
3353
  </span>
3357
3354
  </li>
3358
3355
  <li class="pf-c-tabs__item pf-m-action">
3359
- <button class="pf-c-tabs__link" id="close-secondary-example-system-link">
3356
+ <button class="pf-c-tabs__link" id="add-secondary-example-system-link">
3360
3357
  <span class="pf-c-tabs__item-text">System</span>
3361
3358
  </button>
3362
3359
  <span class="pf-c-tabs__item-close">
@@ -3374,7 +3371,7 @@ cssPrefix: pf-c-tabs
3374
3371
  <li class="pf-c-tabs__item pf-m-action">
3375
3372
  <button
3376
3373
  class="pf-c-tabs__link"
3377
- id="close-secondary-example-network-wired-link"
3374
+ id="add-secondary-example-network-wired-link"
3378
3375
  >
3379
3376
  <span class="pf-c-tabs__item-text">Network</span>
3380
3377
  </button>
@@ -3405,13 +3402,13 @@ cssPrefix: pf-c-tabs
3405
3402
  <br />
3406
3403
  <br />
3407
3404
 
3408
- <div class="pf-c-tabs pf-m-box pf-m-scrollable" id="close-box-example">
3405
+ <div class="pf-c-tabs pf-m-box pf-m-scrollable" id="add-box-example">
3409
3406
  <button class="pf-c-tabs__scroll-button" disabled aria-label="Scroll left">
3410
3407
  <i class="fas fa-angle-left" aria-hidden="true"></i>
3411
3408
  </button>
3412
3409
  <ul class="pf-c-tabs__list">
3413
3410
  <li class="pf-c-tabs__item pf-m-action">
3414
- <button class="pf-c-tabs__link" id="close-box-example-users-link">
3411
+ <button class="pf-c-tabs__link" id="add-box-example-users-link">
3415
3412
  <span class="pf-c-tabs__item-text">Users</span>
3416
3413
  </button>
3417
3414
  <span class="pf-c-tabs__item-close">
@@ -3427,7 +3424,7 @@ cssPrefix: pf-c-tabs
3427
3424
  </span>
3428
3425
  </li>
3429
3426
  <li class="pf-c-tabs__item pf-m-current pf-m-action">
3430
- <button class="pf-c-tabs__link" id="close-box-example-containers-link">
3427
+ <button class="pf-c-tabs__link" id="add-box-example-containers-link">
3431
3428
  <span class="pf-c-tabs__item-text">Containers</span>
3432
3429
  </button>
3433
3430
  <span class="pf-c-tabs__item-close">
@@ -3443,7 +3440,7 @@ cssPrefix: pf-c-tabs
3443
3440
  </span>
3444
3441
  </li>
3445
3442
  <li class="pf-c-tabs__item pf-m-action">
3446
- <button class="pf-c-tabs__link" id="close-box-example-database-link">
3443
+ <button class="pf-c-tabs__link" id="add-box-example-database-link">
3447
3444
  <span class="pf-c-tabs__item-text">Database</span>
3448
3445
  </button>
3449
3446
  <span class="pf-c-tabs__item-close">
@@ -3460,7 +3457,7 @@ cssPrefix: pf-c-tabs
3460
3457
  </li>
3461
3458
 
3462
3459
  <li class="pf-c-tabs__item pf-m-action">
3463
- <button class="pf-c-tabs__link" id="close-box-example-server-link">
3460
+ <button class="pf-c-tabs__link" id="add-box-example-server-link">
3464
3461
  <span class="pf-c-tabs__item-text">Server</span>
3465
3462
  </button>
3466
3463
  <span class="pf-c-tabs__item-close">
@@ -3476,7 +3473,7 @@ cssPrefix: pf-c-tabs
3476
3473
  </span>
3477
3474
  </li>
3478
3475
  <li class="pf-c-tabs__item pf-m-action">
3479
- <button class="pf-c-tabs__link" id="close-box-example-system-link">
3476
+ <button class="pf-c-tabs__link" id="add-box-example-system-link">
3480
3477
  <span class="pf-c-tabs__item-text">System</span>
3481
3478
  </button>
3482
3479
  <span class="pf-c-tabs__item-close">
@@ -3492,7 +3489,7 @@ cssPrefix: pf-c-tabs
3492
3489
  </span>
3493
3490
  </li>
3494
3491
  <li class="pf-c-tabs__item pf-m-action">
3495
- <button class="pf-c-tabs__link" id="close-box-example-network-wired-link">
3492
+ <button class="pf-c-tabs__link" id="add-box-example-network-wired-link">
3496
3493
  <span class="pf-c-tabs__item-text">Network</span>
3497
3494
  </button>
3498
3495
  <span class="pf-c-tabs__item-close">
@@ -3524,17 +3521,14 @@ cssPrefix: pf-c-tabs
3524
3521
 
3525
3522
  <div
3526
3523
  class="pf-c-tabs pf-m-box pf-m-color-scheme--light-300 pf-m-scrollable"
3527
- id="close-box-light-300-example"
3524
+ id="add-box-light-300-example"
3528
3525
  >
3529
3526
  <button class="pf-c-tabs__scroll-button" disabled aria-label="Scroll left">
3530
3527
  <i class="fas fa-angle-left" aria-hidden="true"></i>
3531
3528
  </button>
3532
3529
  <ul class="pf-c-tabs__list">
3533
3530
  <li class="pf-c-tabs__item pf-m-action">
3534
- <button
3535
- class="pf-c-tabs__link"
3536
- id="close-box-light-300-example-users-link"
3537
- >
3531
+ <button class="pf-c-tabs__link" id="add-box-light-300-example-users-link">
3538
3532
  <span class="pf-c-tabs__item-text">Users</span>
3539
3533
  </button>
3540
3534
  <span class="pf-c-tabs__item-close">
@@ -3552,7 +3546,7 @@ cssPrefix: pf-c-tabs
3552
3546
  <li class="pf-c-tabs__item pf-m-current pf-m-action">
3553
3547
  <button
3554
3548
  class="pf-c-tabs__link"
3555
- id="close-box-light-300-example-containers-link"
3549
+ id="add-box-light-300-example-containers-link"
3556
3550
  >
3557
3551
  <span class="pf-c-tabs__item-text">Containers</span>
3558
3552
  </button>
@@ -3571,7 +3565,7 @@ cssPrefix: pf-c-tabs
3571
3565
  <li class="pf-c-tabs__item pf-m-action">
3572
3566
  <button
3573
3567
  class="pf-c-tabs__link"
3574
- id="close-box-light-300-example-database-link"
3568
+ id="add-box-light-300-example-database-link"
3575
3569
  >
3576
3570
  <span class="pf-c-tabs__item-text">Database</span>
3577
3571
  </button>
@@ -3591,7 +3585,7 @@ cssPrefix: pf-c-tabs
3591
3585
  <li class="pf-c-tabs__item pf-m-action">
3592
3586
  <button
3593
3587
  class="pf-c-tabs__link"
3594
- id="close-box-light-300-example-server-link"
3588
+ id="add-box-light-300-example-server-link"
3595
3589
  >
3596
3590
  <span class="pf-c-tabs__item-text">Server</span>
3597
3591
  </button>
@@ -3610,7 +3604,7 @@ cssPrefix: pf-c-tabs
3610
3604
  <li class="pf-c-tabs__item pf-m-action">
3611
3605
  <button
3612
3606
  class="pf-c-tabs__link"
3613
- id="close-box-light-300-example-system-link"
3607
+ id="add-box-light-300-example-system-link"
3614
3608
  >
3615
3609
  <span class="pf-c-tabs__item-text">System</span>
3616
3610
  </button>
@@ -3629,7 +3623,7 @@ cssPrefix: pf-c-tabs
3629
3623
  <li class="pf-c-tabs__item pf-m-action">
3630
3624
  <button
3631
3625
  class="pf-c-tabs__link"
3632
- id="close-box-light-300-example-network-wired-link"
3626
+ id="add-box-light-300-example-network-wired-link"
3633
3627
  >
3634
3628
  <span class="pf-c-tabs__item-text">Network</span>
3635
3629
  </button>