Alert Component
A component to display an alert consisting of an icon, title and description. Different styles based on severities are supported, as well as a number of different layout options.
Currently the following severities are available:
Info
Success
Warning
Error Specifying a severity will change the alert's color scheme based on the colors defined in the application theme as well as the icon displayed. If no severity is specified, 'info' will be used by default. The alert's icon can manually be set via the 'icon'-property in which case the severity's icon will be ignored.
Additionally, a number of different layout options are available. These are:
'subtle': A subtle style using different shades of the severity's base color defined in the application theme.
'solid': A solid style using the severity's color from the application theme and a solid white color for the icon, text and decorations.
'Top-Accent': A variation of the 'subtle' variant with a decoration element at the top.
'Left-Accent': A variation of the 'subtle' variant with a decoration element on the left. If no variant is specified, 'solid' is used by default.
Usage examples:
alert {
title("Alert")
content("This is an alert.")
severity { info }
}
alert {
title("Alert")
content("This is an alert.")
severity { error }
variant { leftAccent }
}