Fix #9008: consolidate `.alert-block` styles into `.alert`

This commit is contained in:
Mark Otto 2013-08-02 09:32:58 -07:00
parent 21be3efad3
commit d0b94ead9a
5 changed files with 21 additions and 51 deletions

View File

@ -85,7 +85,6 @@
<a href="#alerts">Alerts</a>
<ul class="nav">
<li><a href="#alerts-default">Default alert</a></li>
<li><a href="#alerts-block">Block alerts</a></li>
<li><a href="#alerts-alternatives">Contextual alternatives</a></li>
<li><a href="#alerts-links">Links in alerts</a></li>
</ul>

View File

@ -1813,23 +1813,6 @@ body { padding-bottom: 70px; }
<button type="button" class="close" data-dismiss="alert">&times;</button>
<strong>Warning!</strong> Best check yo self, you're not looking too good.
</div>
{% endhighlight %}
<h3 id="alerts-block">Block alerts</h3>
<p>For longer messages, increase the padding on the top and bottom of the alert wrapper by adding <code>.alert-block</code>.</p>
<div class="bs-example">
<div class="alert alert-block">
<button type="button" class="close" data-dismiss="alert">&times;</button>
<h4>Warning!</h4>
<p>Best check yo self, you're not looking too good. Nulla vitae elit libero, a pharetra augue. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
</div>
</div>
{% highlight html %}
<div class="alert alert-block">
<button type="button" class="close" data-dismiss="alert">&times;</button>
<h4>Warning!</h4>
<p>...</p>
</div>
{% endhighlight %}
<h3 id="alerts-alternatives">Contextual alternatives</h3>

View File

@ -3751,7 +3751,7 @@ button.close {
}
.alert {
padding: 10px 35px 10px 15px;
padding: 15px 35px 15px 15px;
margin-bottom: 20px;
color: #c09853;
background-color: #fcf8e3;
@ -3780,6 +3780,15 @@ button.close {
color: inherit;
}
.alert > p,
.alert > ul {
margin-bottom: 0;
}
.alert > p + p {
margin-top: 5px;
}
.alert-success {
color: #468847;
background-color: #dff0d8;
@ -3822,20 +3831,6 @@ button.close {
color: #2d6987;
}
.alert-block {
padding-top: 15px;
padding-bottom: 15px;
}
.alert-block > p,
.alert-block > ul {
margin-bottom: 0;
}
.alert-block p + p {
margin-top: 5px;
}
.thumbnail,
.img-thumbnail {
padding: 4px;

File diff suppressed because one or more lines are too long

View File

@ -7,7 +7,7 @@
// -------------------------
.alert {
padding: 10px 35px 10px 15px;
padding: 15px 35px 15px 15px;
margin-bottom: @line-height-computed;
color: @alert-text;
background-color: @alert-bg;
@ -37,6 +37,15 @@
right: -21px;
color: inherit;
}
// Improve alignment and spacing of inner content
> p,
> ul {
margin-bottom: 0;
}
> p + p {
margin-top: 5px;
}
}
// Alternate styles
@ -51,19 +60,3 @@
.alert-info {
.alert-variant(@alert-info-bg, @alert-info-border, @alert-info-text);
}
// Block alerts
// -------------------------
.alert-block {
padding-top: 15px;
padding-bottom: 15px;
> p,
> ul {
margin-bottom: 0;
}
p + p {
margin-top: 5px;
}
}