mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-17 21:49:09 +01:00
Code Issues Releases Wiki Activity

Fixes #8452: adds .active to table classes

Browse Source
This commit is contained in:
Mark Otto 2013-07-18 00:10:22 -07:00
parent 87adbf7aa4
commit 79a10feb7a
3 changed files with 63 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
docs/assets/css/bootstrap.css vendored
View File

@ -1249,6 +1249,12 @@ table th[class^="col-"] {
float: none;
}
.table > tbody > tr > td.active,
.table > tbody > tr > th.active,
.table > tbody > tr.active > td {
background-color: #f5f5f5;
}
.table > tbody > tr > td.success,
.table > tbody > tr > th.success,
.table > tbody > tr.success > td {

76
docs/css.html
View File

@ -1048,8 +1048,8 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<h2 id="tables-row-classes">Optional row classes</h2>
<p>Use contextual classes to color table rows.</p>
<h2 id="tables-row-classes">Contextual table classes</h2>
<p>Use contextual classes to color table rows or individual cells.</p>
<table class="table table-bordered table-striped">
<colgroup>
<col class="col-lg-1">
@ -1066,19 +1066,25 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<td>
<code>.success</code>
</td>
<td>Indicates a successful or positive action.</td>
<td>Indicates a successful or positive action</td>
</tr>
<tr>
<td>
<code>.danger</code>
</td>
<td>Indicates a dangerous or potentially negative action.</td>
<td>Indicates a dangerous or potentially negative action</td>
</tr>
<tr>
<td>
<code>.warning</code>
</td>
<td>Indicates a warning that might need attention.</td>
<td>Indicates a warning that might need attention</td>
</tr>
<tr>
<td>
<code>.active</code>
</td>
<td>Applies the hover color to a particular row or cell</td>
</tr>
</tbody>
</table>
@ -1087,42 +1093,64 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<thead>
<tr>
<th>#</th>
<th>Product</th>
<th>Payment Taken</th>
<th>Status</th>
<th>Column heading</th>
<th>Column heading</th>
<th>Column heading</th>
</tr>
</thead>
<tbody>
<tr class="success">
<td>1</td>
<td>TB - Monthly</td>
<td>01/04/2012</td>
<td>Approved</td>
<td>Column content</td>
<td>Column content</td>
<td>Column content</td>
</tr>
<tr>
<td>2</td>
<td>Column content</td>
<td>Column content</td>
<td>Column content</td>
</tr>
<tr class="danger">
<td>2</td>
<td>TB - Monthly</td>
<td>02/04/2012</td>
<td>Declined</td>
<td>3</td>
<td>Column content</td>
<td>Column content</td>
<td>Column content</td>
</tr>
<tr>
<td>4</td>
<td>Column content</td>
<td>Column content</td>
<td>Column content</td>
</tr>
<tr class="warning">
<td>3</td>
<td>TB - Monthly</td>
<td>03/04/2012</td>
<td>Pending</td>
<td>5</td>
<td>Column content</td>
<td>Column content</td>
<td>Column content</td>
</tr>
<tr>
<td>6</td>
<td>Column content</td>
<td>Column content</td>
<td>Column content</td>
</tr>
<tr class="active">
<td>7</td>
<td>Column content</td>
<td>Column content</td>
<td>Column content</td>
</tr>
</tbody>
</table>
</div><!-- /example -->
{% highlight html %}
...
<tr class="success">
<td>1</td>
<td>TB - Monthly</td>
<td>01/04/2012</td>
<td>Approved</td>
<td>Column content</td>
<td>Column content</td>
<td>Column content</td>
</tr>
...
{% endhighlight %}
</div>

5
less/tables.less
View File

@ -219,6 +219,11 @@ table {
// Exact selectors below required to override .table-striped
.table > tbody > tr {
> td.active,
> th.active,
&.active > td {
background-color: @table-bg-hover;
}
> td.success,
> th.success,
&.success > td {