diff options
Diffstat (limited to 'docs/components.html')
| -rw-r--r-- | docs/components.html | 28 |
1 files changed, 28 insertions, 0 deletions
diff --git a/docs/components.html b/docs/components.html index ea87a7e22..20fdd70dd 100644 --- a/docs/components.html +++ b/docs/components.html @@ -1906,6 +1906,34 @@ body { padding-bottom: 70px; } <div class="alert alert-success">...</div> <div class="alert alert-info">...</div> {% endhighlight %} + + <h3 id="alerts-links">Links in alerts</h3> + <p>Use the <code>.alert-link</code> utility class to quickly provide matching colored links within any alert.</p> + <div class="bs-example"> + <div class="alert alert-danger"> + <button type="button" class="close" data-dismiss="alert">×</button> + <strong>Oh snap!</strong> <a href="#" class="alert-link">Change a few things up</a> and try submitting again. + </div> + <div class="alert alert-success"> + <button type="button" class="close" data-dismiss="alert">×</button> + <strong>Well done!</strong> You successfully read <a href="#" class="alert-link">this important alert message</a>. + </div> + <div class="alert alert-info"> + <button type="button" class="close" data-dismiss="alert">×</button> + <strong>Heads up!</strong> This <a href="#" class="alert-link">alert needs your attention</a>, but it's not super important. + </div> + </div> +{% highlight html %} +<div class="alert alert-danger"> + <a href="#" class="alert-link">...</a> +</div> +<div class="alert alert-success"> + <a href="#" class="alert-link">...</a> +</div> +<div class="alert alert-info"> + <a href="#" class="alert-link">...</a> +</div> +{% endhighlight %} </div> |