# Alerts
Component name: <v-alerts> + <v-alert>
Alerts are present on subpages and are used for contextual information that relates to the currently navigated topic.
Each alert is wrapped in a v-alerts group to highlight the alert type.
Multiple alerts can be shown in the same alerts group.
# Examples
# Info alerts
# Error alerts
# Global alerts
# Dismissible alerts
By adding the dismissible property, alerts can be permanently dismissed (state is saved in the browser's local storage). Dismissible alerts must be given a dismissible-id which uniquely identifies the alert.
# Components
# v-alerts
Wrapper component for alerts.
# API
| Name | Type | Description | Default |
|---|---|---|---|
| info | Boolean | Use 'info' styling | true |
| error | Boolean | Use 'error' styling | false |
| global | [Boolean] | Show global alerts | false |
| global-target | [String] | The portal to show alerts in | alerts |
| interval | [Number] | Seconds between alert rotations | 6 |
| expanded | Boolean | Whether to start in the expanded state | false |
| dismissible | Boolean | Whether the alerts should be dismissible | false |
| dismissible-id | String | Unique identifier for the group of alerts. Used together with dismissible | - |
# v-alert
# API
| Name | Type | Description | Default |
|---|---|---|---|
| active | Boolean | Whether or not the alert is active | false |
Notice
All other properties that are not defined above, will be passed to the component as html attributes. This is especially useful for adding the class attribute.