Alerts

Easily display colorful alerts to capture your visitors attention.

Class Properties
wpex-alert
position: relative;
margin: 0 0 20px;
padding: 10px 20px;
background: map-get( $grays, '200' );
border-#{$left}: 4px solid map-get( $grays, '700' );
color: #32373c;
wpex-alert wpex-alert-info
background-color: #e5f5fa;
border-left-color: #00a0d2;
wpex-alert wpex-alert-success
background-color: #ecf7ed;
border-left-color: #46b450;
wpex-alert wpex-alert-warning
background-color: #fff8e5;
border-left-color: #ffb900;
wpex-alert wpex-alert-error
background-color: #fbeaea;
border-left-color: #dc3232;

Alert Previews

Info

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce laoreet vestibulum elit eget fringilla.

Success

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce laoreet vestibulum elit eget fringilla.

Warning

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce laoreet vestibulum elit eget fringilla.

Error

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce laoreet vestibulum elit eget fringilla.