3.1.2 atoms.alert.variant Alert variants
Alerts don't have default classes, only base and modifier classes.
A default gray alert doesn't make too much sense, so you're required
to specify a type via contextual class. Choose from success, info, warning, or danger.
.alert-success
Success
Alert title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
.alert-info
Information
Alert title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
.alert-warning
Warning
Alert title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
.alert-danger
Danger
Alert title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Markup: 02-atoms/alert/alert.twig
<div class="alert alert-dismissible fade in {{ modifier_class }}" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="{{ "Close"|t }}">
<span aria-hidden="true">×</span>
</button>
<strong>{{ title }}</strong>
{{ content }}
</div>
Source:
02-atoms/alert/alert.scss, line 3