eWars Siren RTU Ladang Bayu

Basic

Alerts are available for any length of text, as well as an optional dismiss button. For proper styling, use one of the eight required contextual classes

Solid

Use .alert-{color} to apply these variants

Primary
Secondary
Info
Warning
Danger
Success
Dark
Light

Outline

Use .alert-outline-{color} to apply these variants

Primary
Secondary
Info
Warning
Danger
Success
Dark
Light

Label

Use .alert-label-{color} to apply these variants

Primary
Secondary
Info
Warning
Danger
Success
Dark
Light

Links

Use the .alert-link utility class to quickly provide matching colored links within any alert.

A simple primary alert with an example link. Give it a click if you like.
A simple primary alert with an example link. Give it a click if you like.
A simple primary alert with an example link. Give it a click if you like.

Additional content

Alerts can also contain additional HTML elements like headings, paragraphs and dividers.

Well done!

Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.

Well done!

Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.


Whenever you need to, be sure to use margin utilities to keep things nice and tidy.

Icon

You can insert an icon to an alert element. Put your icon into .alert-icon and your content into .alert-content class.

A simple light alert with an example link. Give it a click if you like.
A simple light alert with an example link. Give it a click if you like.
A simple light alert with an example link. Give it a click if you like.

Dismissible alert

Using the alert javascript plugin, it’s possible to dismiss any alert inline. Enable dismissal of an alert via javascript: $('.alert').alert()

Holy guacamole! You should check in on some of those fields below.
Holy guacamole! You should check in on some of those fields below.

Well done!

Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.


Whenever you need to, be sure to use margin utilities to keep things nice and tidy.

May 14, 2020

Upcoming events

12:00

Donec laoreet fringilla justo a pellentesque

13:20

Nunc quis massa nec enim

14:00

Praesent sit amet

Settings

Performance

CPU Load
60%
CPU Temparature
42°
RAM Usage
6,532 MB

Customer care

Reports

Projects

Dashboard

Dashboard 1

Dashboard 2

Dashboard 3

Dashboard 4

Dashboard 5

Dashboard 6

Dashboard 7

Dashboard 8

Email

Criptocurrency

Chatting

Navigation