Jingga/cssOMS
1
0
Fork 0
mirror of https://github.com/Karaka-Management/cssOMS.git synced 2026-01-11 11:18:39 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity
1021e185e7
cssOMS/tests/app/tables.php
Dennis Eichhorn 1021e185e7 Improve layouts
2019-01-13 21:37:36 +01:00

576 lines
21 KiB
PHP
Raw Blame History

<div class="row">
<div class="col-xs-12 col-md-6">
<div class="box wf-100">
<table class="table green" id="table1">
<caption>Table Title</caption>
<thead>
<tr>
<td>Col1 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col2 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col3 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col4 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
</tr>
</thead>
<tbody>
<tr>
<td>Col2</td>
<td>Col1</td>
<td>Col4</td>
<td>Col3</td>
</tr>
<tr>
<td>Col4</td>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
<td>Col4</td>
</tr>
<tr>
<td>Col2</td>
<td>Col1</td>
<td>Col3</td>
<td>Col4</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">
<label>Results: 4</label>
<select>
<option>25</option>
<option>50</option>
<option>100</option>
<option>500</option>
</select>
<ul class="pagination">
<li><a href="#" class="active">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li>...</li>
<li><a href="#">20</a></li>
</ul>
</td>
</tr>
</tfoot>
</table>
</div>
</div>
<div class="col-xs-12 col-md-6">
<div class="box wf-100">
<table class="table blue" id="table2">
<caption>Table Title</caption>
<thead>
<tr>
<td>Col1 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col2 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col3 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col4 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
</tr>
</thead>
<tbody>
<tr>
<td>Col3</td>
<td>Col4</td>
<td>Col2</td>
<td>Col1</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col4</td>
<td>Col3</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
<td>Col4</td>
</tr>
<tr>
<td>Col4</td>
<td>Col2</td>
<td>Col1</td>
<td>Col3</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">
<label>Results: 4</label>
<select>
<option>25</option>
<option>50</option>
<option>100</option>
<option>500</option>
</select>
<ul class="pagination">
<li><a href="#" class="active">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li>...</li>
<li><a href="#">20</a></li>
</ul>
</td>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<div class="box wf-100">
<table class="table darkred">
<caption>Table Title</caption>
<thead>
<tr>
<td>Col1 Title</td>
<td>Col2 Title</td>
<td>Col3 Title</td>
<td>Col4 Title</td>
</tr>
</thead>
<tbody>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
<td>Col4</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
<td>Col4</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
<td>Col4</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
<td>Col4</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">
<label>Results: 4</label>
<select>
<option>25</option>
<option>50</option>
<option>100</option>
<option>500</option>
</select>
<ul class="pagination">
<li><a href="#" class="active">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li>...</li>
<li><a href="#">20</a></li>
</ul>
</td>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-6">
<div class="box wf-100">
<table class="table purple" id="table1">
<caption>Table Title</caption>
<thead>
<tr>
<td>Col1 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col2 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col3 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col4 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
</tr>
</thead>
<tbody>
<tr>
<td>Col2</td>
<td>Col1</td>
<td>Col4</td>
<td>Col3</td>
</tr>
<tr>
<td>Col4</td>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
<td>Col4</td>
</tr>
<tr>
<td>Col2</td>
<td>Col1</td>
<td>Col3</td>
<td>Col4</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">
<label>Results: 4</label>
<select>
<option>25</option>
<option>50</option>
<option>100</option>
<option>500</option>
</select>
<ul class="pagination">
<li><a href="#" class="active">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li>...</li>
<li><a href="#">20</a></li>
</ul>
</td>
</tr>
</tfoot>
</table>
</div>
</div>
<div class="col-xs-12 col-md-6">
<div class="box wf-100">
<table class="table lightblue" id="table2">
<caption>Table Title</caption>
<thead>
<tr>
<td>Col1 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col2 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col3 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col4 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
</tr>
</thead>
<tbody>
<tr>
<td>Col3</td>
<td>Col4</td>
<td>Col2</td>
<td>Col1</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col4</td>
<td>Col3</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
<td>Col4</td>
</tr>
<tr>
<td>Col4</td>
<td>Col2</td>
<td>Col1</td>
<td>Col3</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">
<label>Results: 4</label>
<select>
<option>25</option>
<option>50</option>
<option>100</option>
<option>500</option>
</select>
<ul class="pagination">
<li><a href="#" class="active">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li>...</li>
<li><a href="#">20</a></li>
</ul>
</td>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-6">
<div class="box wf-100">
<table class="table darkgreen" id="table1">
<caption>Table Title</caption>
<thead>
<tr>
<td>Col1 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col2 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col3 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col4 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
</tr>
</thead>
<tbody>
<tr>
<td>Col2</td>
<td>Col1</td>
<td>Col4</td>
<td>Col3</td>
</tr>
<tr>
<td>Col4</td>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
<td>Col4</td>
</tr>
<tr>
<td>Col2</td>
<td>Col1</td>
<td>Col3</td>
<td>Col4</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">
<label>Results: 4</label>
<select>
<option>25</option>
<option>50</option>
<option>100</option>
<option>500</option>
</select>
<ul class="pagination">
<li><a href="#" class="active">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li>...</li>
<li><a href="#">20</a></li>
</ul>
</td>
</tr>
</tfoot>
</table>
</div>
</div>
<div class="col-xs-12 col-md-6">
<div class="box wf-100">
<table class="table darkblue" id="table2">
<caption>Table Title</caption>
<thead>
<tr>
<td>Col1 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col2 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col3 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col4 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
</tr>
</thead>
<tbody>
<tr>
<td>Col3</td>
<td>Col4</td>
<td>Col2</td>
<td>Col1</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col4</td>
<td>Col3</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
<td>Col4</td>
</tr>
<tr>
<td>Col4</td>
<td>Col2</td>
<td>Col1</td>
<td>Col3</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">
<label>Results: 4</label>
<select>
<option>25</option>
<option>50</option>
<option>100</option>
<option>500</option>
</select>
<ul class="pagination">
<li><a href="#" class="active">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li>...</li>
<li><a href="#">20</a></li>
</ul>
</td>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-6">
<div class="box wf-100">
<table class="table orange" id="table1">
<caption>Table Title</caption>
<thead>
<tr>
<td>Col1 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col2 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col3 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col4 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
</tr>
</thead>
<tbody>
<tr>
<td>Col2</td>
<td>Col1</td>
<td>Col4</td>
<td>Col3</td>
</tr>
<tr>
<td>Col4</td>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
<td>Col4</td>
</tr>
<tr>
<td>Col2</td>
<td>Col1</td>
<td>Col3</td>
<td>Col4</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">
<label>Results: 4</label>
<select>
<option>25</option>
<option>50</option>
<option>100</option>
<option>500</option>
</select>
<ul class="pagination">
<li><a href="#" class="active">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li>...</li>
<li><a href="#">20</a></li>
</ul>
</td>
</tr>
</tfoot>
</table>
</div>
</div>
<div class="col-xs-12 col-md-6">
<div class="box wf-100">
<table class="table yellow" id="table2">
<caption>Table Title</caption>
<thead>
<tr>
<td>Col1 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col2 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col3 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
<td>Col4 Title<i class="sort-asc fa fa-chevron-up"></i><i class="sort-desc fa fa-chevron-down"></i></td>
</tr>
</thead>
<tbody>
<tr>
<td>Col3</td>
<td>Col4</td>
<td>Col2</td>
<td>Col1</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col4</td>
<td>Col3</td>
</tr>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
<td>Col4</td>
</tr>
<tr>
<td>Col4</td>
<td>Col2</td>
<td>Col1</td>
<td>Col3</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">
<label>Results: 4</label>
<select>
<option>25</option>
<option>50</option>
<option>100</option>
<option>500</option>
</select>
<ul class="pagination">
<li><a href="#" class="active">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li>...</li>
<li><a href="#">20</a></li>
</ul>
</td>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
Reference in New Issue View Git Blame Copy Permalink