Alerts Styles
Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages.
Examples - Default Style
Alerts are available for any length of text. Use
.alert-{state} with
.alert to create alert messages.
| Class Reference | Details |
|---|---|
.alert-{state} |
Use {state} as
primary, secondary, success, info, warning,
danger, gray, light
|
.alert-icon |
Use with .alert class for proper
icon style.
|
.alert-fill |
Use with .alert class for fill
base style.
|
.alert-dismissible |
Use with .alert class for
dismissible alert.
|
Code Example
<div class="alert alert-icon alert-primary" role="alert">
<em class="icon ni ni-alert-circle"></em>
<strong>Order has been placed</strong>. Your will be redirect for make your payment.
</div>
Code Example
<div class="alert alert-fill alert-icon alert-primary" role="alert">
<em class="icon ni ni-alert-circle"></em>
<strong>Order has been placed</strong>. Your will be redirect for make your payment.
</div>
Examples - Style Pro
For following style, You can use the
.alert-pro class with
.alert class.
Your Order Placed
Your order has been successfully placed for diposit. Your will be redirect for make your payment.
Your Order Placed
Your order has been successfully placed for diposit. Your will be redirect for make your payment.
Payment Successfully Made
Thanks for your deposit. Now you can see your transaction history. Your account has been updated accordingly.
Your Order Placed
Your order has been successfully placed for diposit. Your will be redirect for make your payment.
Payment Information
Sorry! your credit card already expired. Please enter a valid & up-to-date credit card for make deposit.
Order Cancelled
Your order has been cancelled due to received your payment.
Your Order Placed
Your order has been successfully placed for diposit. Your will be redirect for make your payment.
Your Order Placed
Your order has been successfully placed for diposit. Your will be redirect for make your payment.
Code Example
<div class="alert alert-pro alert-primary">
<div class="alert-text">
<h6>Your Order Placed</h6>
<p>Your order has been successfully placed for diposit. Your will be redirect for make your payment. </p>
</div>
</div>
