@patternfly/patternfly 6.4.0 → 6.5.0-prerelease.10
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/images/RHAiExperienceIcon.svg +27 -0
- package/assets/images/RHAutomationsLogo.svg +96 -0
- package/assets/images/RHServerStackIcon.svg +16 -0
- package/assets/images/compass--hero-bg.png +0 -0
- package/assets/images/compass--rh-wallpaper-dark.png +0 -0
- package/assets/images/compass--rh-wallpaper-light.png +0 -0
- package/assets/images/compass--wallpaper-dark.png +0 -0
- package/assets/images/compass--wallpaper-light.png +0 -0
- package/base/patternfly-common.css +46 -0
- package/base/patternfly-common.scss +56 -0
- package/components/ActionList/action-list.css +9 -0
- package/components/ActionList/action-list.scss +12 -0
- package/components/Button/button.css +18 -0
- package/components/Button/button.scss +22 -0
- package/components/Card/card.css +6 -0
- package/components/Card/card.scss +8 -0
- package/components/Compass/compass.css +211 -0
- package/components/Compass/compass.scss +276 -0
- package/components/DataList/data-list.css +5 -1
- package/components/DataList/data-list.scss +6 -1
- package/components/Menu/menu.css +1 -1
- package/components/Menu/menu.scss +1 -1
- package/components/MenuToggle/menu-toggle.css +4 -0
- package/components/MenuToggle/menu-toggle.scss +5 -0
- package/components/Panel/panel.css +1 -1
- package/components/Panel/panel.scss +1 -1
- package/components/Spinner/spinner.css +3 -0
- package/components/Spinner/spinner.scss +5 -0
- package/components/Table/table.css +3 -0
- package/components/Table/table.scss +5 -0
- package/components/Tabs/tabs.css +17 -1
- package/components/Tabs/tabs.scss +22 -1
- package/components/_index.css +278 -4
- package/components/_index.scss +1 -0
- package/docs/components/ActionList/examples/ActionList.md +85 -0
- package/docs/components/Button/examples/Button.md +116 -0
- package/docs/components/Card/examples/Card.md +6 -4
- package/docs/components/Compass/examples/Compass.md +4608 -0
- package/docs/components/DataList/examples/DataList.md +181 -185
- package/docs/components/Drawer/examples/Drawer.md +1 -1
- package/docs/components/MenuToggle/examples/MenuToggle.md +40 -0
- package/docs/components/Progress/examples/Progress.md +3 -3
- package/docs/components/Table/examples/Table.md +88 -0
- package/docs/components/Tabs/examples/Tabs.md +188 -0
- package/docs/components/Wizard/examples/Wizard.md +15 -15
- package/docs/demos/Dashboard/examples/Dashboard.md +1 -4
- package/docs/demos/DescriptionList/examples/DescriptionList.md +31 -33
- package/docs/demos/Drawer/examples/Drawer.md +31 -33
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +127 -163
- package/docs/demos/Wizard/examples/Wizard.md +31 -34
- package/package.json +5 -5
- package/patternfly-base-no-globals.css +46 -0
- package/patternfly-base.css +46 -0
- package/patternfly-no-globals.css +324 -4
- package/patternfly.css +324 -4
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
- package/sass-utilities/namespaces-components.scss +3 -0
|
@@ -1833,6 +1833,121 @@ Sed hendrerit nisi in cursus maximus. Ut malesuada nisi turpis, in condimentum v
|
|
|
1833
1833
|
|
|
1834
1834
|
```
|
|
1835
1835
|
|
|
1836
|
+
### Circle buttons
|
|
1837
|
+
|
|
1838
|
+
```html isBeta
|
|
1839
|
+
<button
|
|
1840
|
+
class="pf-v6-c-button pf-m-circle pf-m-primary"
|
|
1841
|
+
type="button"
|
|
1842
|
+
aria-label="Add primary circle variant"
|
|
1843
|
+
>
|
|
1844
|
+
<span class="pf-v6-c-button__icon pf-m-start">
|
|
1845
|
+
<i class="fas fa-plus-circle" aria-hidden="true"></i>
|
|
1846
|
+
</span>
|
|
1847
|
+
</button>
|
|
1848
|
+
|
|
1849
|
+
<button
|
|
1850
|
+
class="pf-v6-c-button pf-m-circle pf-m-secondary"
|
|
1851
|
+
type="button"
|
|
1852
|
+
aria-label="Add secondary circle variant"
|
|
1853
|
+
>
|
|
1854
|
+
<span class="pf-v6-c-button__icon pf-m-start">
|
|
1855
|
+
<i class="fas fa-plus-circle" aria-hidden="true"></i>
|
|
1856
|
+
</span>
|
|
1857
|
+
</button>
|
|
1858
|
+
|
|
1859
|
+
<button
|
|
1860
|
+
class="pf-v6-c-button pf-m-circle pf-m-tertiary"
|
|
1861
|
+
type="button"
|
|
1862
|
+
aria-label="Add tertiary circle variant"
|
|
1863
|
+
>
|
|
1864
|
+
<span class="pf-v6-c-button__icon pf-m-start">
|
|
1865
|
+
<i class="fas fa-plus-circle" aria-hidden="true"></i>
|
|
1866
|
+
</span>
|
|
1867
|
+
</button>
|
|
1868
|
+
|
|
1869
|
+
<button
|
|
1870
|
+
class="pf-v6-c-button pf-m-circle pf-m-danger"
|
|
1871
|
+
type="button"
|
|
1872
|
+
aria-label="Add danger circle variant"
|
|
1873
|
+
>
|
|
1874
|
+
<span class="pf-v6-c-button__icon pf-m-start">
|
|
1875
|
+
<i class="fas fa-plus-circle" aria-hidden="true"></i>
|
|
1876
|
+
</span>
|
|
1877
|
+
</button>
|
|
1878
|
+
|
|
1879
|
+
<button
|
|
1880
|
+
class="pf-v6-c-button pf-m-circle pf-m-warning"
|
|
1881
|
+
type="button"
|
|
1882
|
+
aria-label="Add warning circle variant"
|
|
1883
|
+
>
|
|
1884
|
+
<span class="pf-v6-c-button__icon pf-m-start">
|
|
1885
|
+
<i class="fas fa-plus-circle" aria-hidden="true"></i>
|
|
1886
|
+
</span>
|
|
1887
|
+
</button>
|
|
1888
|
+
|
|
1889
|
+
<button
|
|
1890
|
+
class="pf-v6-c-button pf-m-circle pf-m-link"
|
|
1891
|
+
type="button"
|
|
1892
|
+
aria-label="Add link circle variant"
|
|
1893
|
+
>
|
|
1894
|
+
<span class="pf-v6-c-button__icon pf-m-start">
|
|
1895
|
+
<i class="fas fa-plus-circle" aria-hidden="true"></i>
|
|
1896
|
+
</span>
|
|
1897
|
+
</button>
|
|
1898
|
+
|
|
1899
|
+
<button
|
|
1900
|
+
class="pf-v6-c-button pf-m-circle pf-m-plain"
|
|
1901
|
+
type="button"
|
|
1902
|
+
aria-label="Remove plain circle variant"
|
|
1903
|
+
>
|
|
1904
|
+
<span class="pf-v6-c-button__icon pf-m-start">
|
|
1905
|
+
<i class="fas fa-times" aria-hidden="true"></i>
|
|
1906
|
+
</span>
|
|
1907
|
+
</button>
|
|
1908
|
+
|
|
1909
|
+
<button
|
|
1910
|
+
class="pf-v6-c-button pf-m-circle pf-m-control"
|
|
1911
|
+
type="button"
|
|
1912
|
+
aria-label="Copy control circle variant"
|
|
1913
|
+
>
|
|
1914
|
+
<span class="pf-v6-c-button__icon pf-m-start">
|
|
1915
|
+
<i class="fas fa-copy" aria-hidden="true"></i>
|
|
1916
|
+
</span>
|
|
1917
|
+
</button>
|
|
1918
|
+
|
|
1919
|
+
<button
|
|
1920
|
+
class="pf-v6-c-button pf-m-circle pf-m-plain"
|
|
1921
|
+
type="button"
|
|
1922
|
+
aria-label="Upload circle variant"
|
|
1923
|
+
>
|
|
1924
|
+
<span class="pf-v6-c-button__icon">
|
|
1925
|
+
<i class="fas fa-upload" aria-hidden="true"></i>
|
|
1926
|
+
</span>
|
|
1927
|
+
</button>
|
|
1928
|
+
|
|
1929
|
+
<button
|
|
1930
|
+
class="pf-v6-c-button pf-m-circle pf-m-in-progress pf-m-plain"
|
|
1931
|
+
type="button"
|
|
1932
|
+
>
|
|
1933
|
+
<span class="pf-v6-c-button__progress">
|
|
1934
|
+
<svg
|
|
1935
|
+
class="pf-v6-c-spinner pf-m-md"
|
|
1936
|
+
role="progressbar"
|
|
1937
|
+
viewBox="0 0 100 100"
|
|
1938
|
+
aria-label="Uploading circle variant..."
|
|
1939
|
+
>
|
|
1940
|
+
<circle class="pf-v6-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
|
|
1941
|
+
</svg>
|
|
1942
|
+
</span>
|
|
1943
|
+
|
|
1944
|
+
<span class="pf-v6-c-button__icon">
|
|
1945
|
+
<i class="fas fa-upload" aria-hidden="true"></i>
|
|
1946
|
+
</span>
|
|
1947
|
+
</button>
|
|
1948
|
+
|
|
1949
|
+
```
|
|
1950
|
+
|
|
1836
1951
|
### Counts
|
|
1837
1952
|
|
|
1838
1953
|
```html
|
|
@@ -2236,3 +2351,4 @@ Semantic buttons and links are important for usability as well as accessibility.
|
|
|
2236
2351
|
| `.pf-m-hamburger` | `.pf-v6-c-button.pf-m-plain` | Modifies a plain button to be a hamburger button. |
|
|
2237
2352
|
| `.pf-m-expand` | `.pf-v6-c-button.pf-m-hamburger` | Modifies a hamburger button to indicate that it will expand a menu. |
|
|
2238
2353
|
| `.pf-m-collapse` | `.pf-v6-c-button.pf-m-hamburger` | Modifies a hamburger button to indicate that it will collapse a menu. |
|
|
2354
|
+
| `.pf-m-circle` | `.pf-v6-c-button` | Modifies a button to have a circular shape, instead of only rounded corners or a pill shape. Intended for buttons that contain only an icon. |
|
|
@@ -230,10 +230,12 @@ cssPrefix: pf-v6-c-card
|
|
|
230
230
|
<span class="pf-v6-c-button__text">Tertiary action</span>
|
|
231
231
|
</button>
|
|
232
232
|
</div>
|
|
233
|
-
<div class="pf-v6-c-
|
|
234
|
-
<
|
|
235
|
-
|
|
236
|
-
|
|
233
|
+
<div class="pf-v6-c-card__header-main">
|
|
234
|
+
<div class="pf-v6-c-card__title">
|
|
235
|
+
<h2
|
|
236
|
+
class="pf-v6-c-card__title-text"
|
|
237
|
+
>This is a longer card title that takes up more space</h2>
|
|
238
|
+
</div>
|
|
237
239
|
</div>
|
|
238
240
|
</div>
|
|
239
241
|
<div class="pf-v6-c-card__body">This is the card body</div>
|