atst/templates/components/alert.html.to
2018-07-20 15:17:00 -04:00

36 lines
788 B
Plaintext

{% set role = 'alertdialog' if actions else 'alert' %}
{% set levels = {
'warning': {
'icon': 'alert',
'tone': 'assertive'
},
'error': {
'icon': 'alert',
'tone': 'assertive'
},
'info': {
'icon': 'info',
'tone': 'polite'
},
'success': {
'icon': 'ok',
'tone': 'polite'
}
} %}
<div class='alert alert--{{level}}' role='{{role}}' aria-live='{{levels.get(level).get('tone')}}'>
{% module Icon(levels.get(level).get('icon'), classes='alert__icon icon--large') %}
<div class='alert__content'>
<h2 class='alert__title'>{{title}}</h2>
{% if message %}
<div class='alert__message'>{% raw message %}</div>
{% end %}
{% if actions %}
<div class='alert__actions'>{% raw actions %}</div>
{% end %}
</div>
</div>