0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-28 20:52:21 +01:00

Merge branch '2.1.0-wip' of https://github.com/gcoop/bootstrap into gcoop-2.1.0-wip

Conflicts:
	docs/base-css.html
	docs/templates/pages/base-css.mustache
This commit is contained in:
Mark Otto 2012-07-17 23:14:58 -07:00
commit cb1a59caa0
4 changed files with 182 additions and 0 deletions

View File

@ -1728,6 +1728,18 @@ table {
border-top: 2px solid #dddddd;
}
.table .success td {
background-color: #dff0d8;
}
.table .error td {
background-color: #f2dede;
}
.table .info td {
background-color: #d9edf7;
}
.table-condensed th,
.table-condensed td {
padding: 4px 5px;

View File

@ -645,6 +645,85 @@ For example, <code>section</code> should be wrapped as inline.
<hr class="bs-docs-separator">
<h2>Optional row classes</h2>
<p>Use contextual classes to color table rows.</p>
<table class="table table-bordered table-striped">
<colgroup>
<col class="span1">
<col class="span7">
</colgroup>
<thead>
<tr>
<th>Class</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<code>.success</code>
</td>
<td>Indicates a successful or positive action.</td>
</tr>
<tr>
<td>
<code>.error</code>
</td>
<td>Indicates a dangerous or potentially negative action.</td>
</tr>
<tr>
<td>
<code>.info</code>
</td>
<td>Used as an alternative to the default styles.</td>
</tr>
</tbody>
</table>
<div class="bs-docs-example">
<table class="table">
<thead>
<tr>
<th>#</th>
<th>Product</th>
<th>Payment Taken</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr class="success">
<td>1</td>
<td>TB - Monthly</td>
<td>01/04/2012</td>
<td>Approved</td>
</tr>
<tr class="error">
<td>2</td>
<td>TB - Monthly</td>
<td>02/04/2012</td>
<td>Declined</td>
</tr>
<tr class="info">
<td>3</td>
<td>TB - Monthly</td>
<td>03/04/2012</td>
<td>Pending</td>
</tr>
</tbody>
</table>
</div>
<pre class="prettyprint linenums">
&lt;tr class="success"&gt;
&lt;td&gt;1&lt;/td&gt;
&lt;td&gt;TB - Monthly&lt;/td&gt;
&lt;td&gt;01/04/2012&lt;/td&gt;
&lt;td&gt;Approved&lt;/td&gt;
&lt;/tr&gt;
</pre>
<hr class="bs-docs-separator">
<h2>Supported table markup</h2>
<p>List of supported table HTML elements and how they should be used.</p>
<table class="table table-bordered table-striped">

View File

@ -582,6 +582,87 @@
<hr class="bs-docs-separator">
<h2>{{_i}}Optional row classes{{/i}}</h2>
<p>{{_i}}Use contextual classes to color table rows.{{/i}}</p>
<table class="table table-bordered table-striped">
<colgroup>
<col class="span1">
<col class="span7">
</colgroup>
<thead>
<tr>
<th>{{_i}}Class{{/i}}</th>
<th>{{_i}}Description{{/i}}</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<code>.success</code>
</td>
<td>{{_i}}Indicates a successful or positive action.{{/i}}</td>
</tr>
<tr>
<td>
<code>.error</code>
</td>
<td>{{_i}}Indicates a dangerous or potentially negative action.{{/i}}</td>
</tr>
<tr>
<td>
<code>.info</code>
</td>
<td>{{_i}}Used as an alternative to the default styles.{{/i}}</td>
</tr>
</tbody>
</table>
<div class="bs-docs-example">
<table class="table">
<thead>
<tr>
<th>#</th>
<th>{{_i}}Product{{/i}}</th>
<th>{{_i}}Payment Taken{{/i}}</th>
<th>{{_i}}Status{{/i}}</th>
</tr>
</thead>
<tbody>
<tr class="success">
<td>1</td>
<td>TB - Monthly</td>
<td>01/04/2012</td>
<td>Approved</td>
</tr>
<tr class="error">
<td>2</td>
<td>TB - Monthly</td>
<td>02/04/2012</td>
<td>Declined</td>
</tr>
<tr class="info">
<td>3</td>
<td>TB - Monthly</td>
<td>03/04/2012</td>
<td>Pending</td>
</tr>
</tbody>
</table>
</div>{{! /example }}
<pre class="prettyprint linenums">
...
&lt;tr class="success"&gt;
&lt;td&gt;1&lt;/td&gt;
&lt;td&gt;TB - Monthly&lt;/td&gt;
&lt;td&gt;01/04/2012&lt;/td&gt;
&lt;td&gt;Approved&lt;/td&gt;
&lt;/tr&gt;
...
</pre>
<hr class="bs-docs-separator">
<h2>{{_i}}Supported table markup{{/i}}</h2>
<p>{{_i}}List of supported table HTML elements and how they should be used.{{/i}}</p>
<table class="table table-bordered table-striped">

View File

@ -48,6 +48,16 @@ table {
tbody + tbody {
border-top: 2px solid @tableBorder;
}
.success td {
background-color: @successBackground;
}
.error td {
background-color: @errorBackground;
}
.info td {
background-color: @infoBackground;
}
}