# Alerts and warnings

We operate with four types of information: Info, Warning, Danger and Success. Here they are represented in alerts:

![Alert message](https://3101502904-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LZdybBvJaAboIV6zNHC%2F-LZo11WZvNq_81cRVPJ9%2F-LZo12i04gil81OKMxoG%2Falerts.PNG?generation=1551356149358342\&alt=media)

```markup
<div class="alert alert-info">
    <button type="button" class="close"><i class="icon-close"></i></button>
    <p>Alert message <a href="#" class="alert-link">with link</a>.</p>
</div>
<div class="alert alert-warning">
    <button type="button" class="close"><i class="icon-close"></i></button>
    <p>Alert message <a href="#" class="alert-link">with link</a>.</p>
</div>
<div class="alert alert-danger">
    <button type="button" class="close"><i class="icon-close"></i></button>
    <p>Alert message <a href="#" class="alert-link">with link</a>.</p>
</div>
<div class="alert alert-success">
    <button type="button" class="close"><i class="icon-close"></i></button>
    <p>Alert message <a href="#" class="alert-link">with link</a>.</p>
</div>
```

Here they are represented in font color:

![Font text colors](https://3101502904-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LZdybBvJaAboIV6zNHC%2F-LZo1RSHYrovyAq-UEDf%2F-LZo1S4K7teOaIfbNg_9%2Falerts_text.PNG?generation=1551356255506656\&alt=media)

```markup
<p class="text-info">Info text.</p>
<p class="text-warning">Warning text.</p>
<p class="text-danger">Danger text.</p>
<p class="text-success">Success text.</p>
```

Here they are represented in background color on lines:

![Font background colors.](https://3101502904-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LZdybBvJaAboIV6zNHC%2F-LZo1RSHYrovyAq-UEDf%2F-LZo1S4MqevjI4U8_-Qk%2Falerts_lines.PNG?generation=1551356255674032\&alt=media)

```markup
<p class="bg-info">Info line.</p>
<p class="bg-warning">Warning line.</p>
<p class="bg-danger">Danger line.</p>
<p class="bg-success">Success line.</p>
```

Also panels can represent these types:

![Panel colors](https://3101502904-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LZdybBvJaAboIV6zNHC%2F-LZo1RSHYrovyAq-UEDf%2F-LZo1S4O-p06Lh39tH8a%2Falerts_panels.PNG?generation=1551356255321985\&alt=media)

```markup
<section class="panel panel-info">
    <header class="panel-heading">
        <h2 class="panel-title">[Panel title]</h2>
    </header>
    <div class="panel-body">
        [Content]
    </div>
</section>
<section class="panel panel-warning">
    ...
</section>
<section class="panel panel-danger">
    ...
</section>
<section class="panel panel-success">
    ...
</section>
```