rev/bootstrap
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Change up link alerts

Browse source 
* No more children selectors to set all links in alerts as a special color because buttons and more wrongly inherited color
* Adds .alert-link for easy styling in any alert
This commit is contained in:
Mark Otto 2013-05-16 20:53:59 -07:00
parent 0f4b4acce1
commit 9762f95bde
5 changed files with 39 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

28
docs/components.html
View file

@ -1905,6 +1905,34 @@ body { padding-bottom: 70px; }
<div class="alert alert-danger">...</div>
<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">&times;</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">&times;</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">&times;</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>