mirror of
https://github.com/gethinode/hinode.git
synced 2025-10-16 22:43:13 +00:00
1.2 KiB
1.2 KiB
author, title, date, description, group, layout
| author | title | date | description | group | layout |
|---|---|---|---|---|---|
| Mark Dumay | Spinner | 2023-01-05 | Use the spinner shortcode to indicate the loading state of a component or page. | components | docs |
Overview
Use the spinner shortcode to indicate the loading state of a component or page. The inner content is used as alternative description.
Arguments
The shortcode supports the following arguments:
| Argument | Required | Description |
|---|---|---|
| color | No | Optional theme color of the spinner, either "primary" (default), "secondary", "success", "danger", "warning", "info", "light", "dark", "white" or "black". |
| grow | No | Optional flag to indicate the spinner is growing instead of rotating, defaults to false. |
| class | No | Optional class attribute of the spinner wrapping element, e.g. “text-center”. |
| {.table} |
Example
As an example, the following shortcode displays a centered spinner.
{{</* spinner color="info" class="text-center" */>}}
Loading...
{{</* /spinner */>}}
The result looks like this: {{< spinner color="info" class="text-center" >}} Loading... {{< /spinner >}}