---
class: css
state: needs-love
---
# flash-message
CSS component for styling our flash messages
```hbs preview-template
<div class="flash-message">
<p
role="alert"
class={{or this.type 'success'}}
>
<strong>
{{capitalize (or this.type 'success')}}!
</strong>
</p>
</div>
<figure>
<figcaption>Provide a widget to change the <code>class</code></figcaption>
<select
onchange={{action (mut this.type) value="target.value"}}
>
<option>success</option>
<option>warning</option>
<option>error</option>
<option>exists</option>
</select>
</figure>
```
6d8dc8a09b