SpinnerMacro
Редактировал(а) Вячеслав Мясоед 2024-12-06 11:52
Todos
Add message for screen readers when loaded ok.
The spinner macro displays a spinner within its container when this container uses attribute aria-busy to reflect its content loading state. The spinner is displayed/hidden automatically when the attribute aria-busy of its container is set to true / respectively to false. See also the documentation of the aria-busy and aria-live attributes.
Example
spinner.loading
(% aria-busy="true" %)(((
{{spinner color="@brand-primary"
thickness="3px" size="30px" top="10px"/}}
)))
{{spinner color="@brand-primary"
thickness="3px" size="30px" top="10px"/}}
)))
Macro Parameters
| Name | Description | Mandatory | Default value |
|---|---|---|---|
| thickness | Thickness of the spinner | no | 3px |
| size | Size of the spinner | no | 25px |
| color | Color of the spinner | no | @brand-primary |
| top | Position of the spinner relatively to the top of its container | no | 0 |
| left | Position of the spinner relatively to the left of its container | no | 50% |
Limitations
At the moment, having several spinners on the same page with different styles is not supported. The styling needs to be set manually in this case, until it becomes possible in XWiki to include several times the same SSX page with different query parameters.