Alerts exist in four base variant and will consume the entire width of the parent container.
If you alert needs icons, make sure to use the has-icons modifier class on the ui-alert. This will add the necessary padding for the icons.
+alert('error').has-icon.has-close
.ui-alert-icon
+icon('lg', 'warning')
+sprite('web', 'warning-white')
.ui-alert-content Dorothy did not know what to say to this, for all the people seemed to think her a witch, and she knew very well she was only an ordinary little girl who had come by the chance of a cyclone into a strange land.
+alert-close()
+icon('lg', 'x')
+sprite('web', 'x-white')
br
+alert('error')
.ui-alert-content 'Please would you tell me,' said Alice, a little timidly, for she was not quite sure whether it was good manners for her to speak first, 'why your cat grins like that?'
+alert('success', null, true)
.ui-alert-content This is a success alert.