rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-06 04:08:22 +01:00
Code Issues Actions Packages Releases Activity

added ability to give rows in tables status classes .success .error and .info.

Browse Source
This commit is contained in:
Gavin Cooper (work) 2012-07-04 12:22:34 +01:00
parent fb29075926
commit b4125748b0
6 changed files with 201 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
docs/assets/css/bootstrap-responsive.css vendored
View File

@ -15,6 +15,7 @@
.clearfix:before, .clearfix:before,
.clearfix:after { .clearfix:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
@ -94,6 +95,7 @@
.row:before, .row:before,
.row:after { .row:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
.row:after { .row:after {
@ -187,6 +189,7 @@
.row-fluid:before, .row-fluid:before,
.row-fluid:after { .row-fluid:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
.row-fluid:after { .row-fluid:after {
@ -434,6 +437,7 @@
.row:before, .row:before,
.row:after { .row:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
.row:after { .row:after {
@ -527,6 +531,7 @@
.row-fluid:before, .row-fluid:before,
.row-fluid:after { .row-fluid:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
.row-fluid:after { .row-fluid:after {

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

@ -130,6 +130,7 @@ textarea {
.clearfix:before, .clearfix:before,
.clearfix:after { .clearfix:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
@ -181,6 +182,7 @@ a:hover {
.row:before, .row:before,
.row:after { .row:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
@ -303,6 +305,7 @@ a:hover {
.row-fluid:before, .row-fluid:before,
.row-fluid:after { .row-fluid:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
@ -515,6 +518,7 @@ a:hover {
.container:before, .container:before,
.container:after { .container:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
@ -531,6 +535,7 @@ a:hover {
.container-fluid:before, .container-fluid:before,
.container-fluid:after { .container-fluid:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
@ -1331,6 +1336,7 @@ select:focus:required:invalid:focus {
.form-actions:before, .form-actions:before,
.form-actions:after { .form-actions:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
@ -1600,6 +1606,7 @@ legend + .control-group {
.form-horizontal .control-group:before, .form-horizontal .control-group:before,
.form-horizontal .control-group:after { .form-horizontal .control-group:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
@ -1676,6 +1683,18 @@ table {
border-top: 2px solid #dddddd; 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 th,
.table-condensed td { .table-condensed td {
padding: 4px 5px; padding: 4px 5px;
@ -3468,6 +3487,7 @@ input[type="submit"].btn.btn-mini {
.nav-tabs:after, .nav-tabs:after,
.nav-pills:after { .nav-pills:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
@ -3641,6 +3661,7 @@ input[type="submit"].btn.btn-mini {
.tabbable:before, .tabbable:before,
.tabbable:after { .tabbable:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
@ -3845,6 +3866,7 @@ input[type="submit"].btn.btn-mini {
.navbar-form:before, .navbar-form:before,
.navbar-form:after { .navbar-form:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
@ -4373,6 +4395,7 @@ input[type="submit"].btn.btn-mini {
.pager:before, .pager:before,
.pager:after { .pager:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
@ -4522,6 +4545,7 @@ input[type="submit"].btn.btn-mini {
.modal-footer:before, .modal-footer:before,
.modal-footer:after { .modal-footer:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
@ -4814,6 +4838,7 @@ input[type="submit"].btn.btn-mini {
.thumbnails:before, .thumbnails:before,
.thumbnails:after { .thumbnails:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }

2
docs/assets/js/bootstrap.min.js vendored
View File

File diff suppressed because one or more lines are too long

80
docs/base-css.html
View File

@ -650,6 +650,85 @@ For example, <code>section</code> should be wrapped as inline.
<hr class="bs-docs-separator"> <hr class="bs-docs-separator">
<h2>Optional row classes</h2>
<p>Included with Bootstrap is the ability to colourize 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> <h2>Supported table markup</h2>
<p>List of supported table HTML elements and how they should be used.</p> <p>List of supported table HTML elements and how they should be used.</p>
<table class="table table-bordered table-striped"> <table class="table table-bordered table-striped">
@ -740,6 +819,7 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
&lt;/table&gt; &lt;/table&gt;
</pre> </pre>
</section> </section>

80
docs/templates/pages/base-css.mustache vendored
View File

@ -581,6 +581,85 @@
<hr class="bs-docs-separator"> <hr class="bs-docs-separator">
<h2>{{_i}}Optional row classes{{/i}}</h2>
<p>{{_i}}Included with Bootstrap is the ability to colourize 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> <h2>{{_i}}Supported table markup{{/i}}</h2>
<p>{{_i}}List of supported table HTML elements and how they should be used.{{/i}}</p> <p>{{_i}}List of supported table HTML elements and how they should be used.{{/i}}</p>
<table class="table table-bordered table-striped"> <table class="table table-bordered table-striped">
@ -671,6 +750,7 @@
&lt;/table&gt; &lt;/table&gt;
</pre> </pre>
</section> </section>

10
less/tables.less
View File

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