Status Dot
Samples
This element is commonly used on Dashboard or Listings pages to let users know if a module is active or not.
| Module 1 |
| Module 2 |
| Module 3 |
This element is commonly used on Dashboard or Listings pages to let users know if a module is active or not.
| Module 1 |
| Module 2 |
| Module 3 |
| Version | ^2.3.14 | This is the minimum required version of SUI to use with this element in order for it to work properly. | ||
|---|---|---|---|---|
| Utilities | Not Apply | This will tell you if the element supports the modifier classes listed on Utilities page. | ||
| Monochrome | Supported | This will tell you if the element supports the Colour Accessible option found on our plugins' Settings page. | ||
| RTL Language | Unsupported | This will tell you if the element supports right-to-left langues. | ||
To show published status with blue dot, you have to add sui-published class to sui-status-dot, also do not forget to change tooltip text from "Draft" to "Published".
<span class="sui-status-dot sui-tooltip" data-tooltip="Draft">
<span aria-hidden="true"></span>
</span>