library-mirrors/tablesorter
1
0
Fork 0
mirror of https://github.com/Mottie/tablesorter.git synced 2025-01-12 15:24:21 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Docs: show actual theme names

Browse Source
This commit is contained in:
Rob Garrison 2016-01-27 21:21:49 -06:00
parent 20e76e4ec4
commit 554a135e13
2 changed files with 21 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
docs/index.html
View File

@ -1507,10 +1507,9 @@ From the example function above, you'll end up with something similar to this HT
<td>&quot;default&quot;</td>
<td>This option will add a theme css class name to the table <code>&quot;tablesorter-{theme}&quot;</code> for styling (v2.4; <span class="version updated">v2.18.0</span>).
<div class="collapsible">
<br>When changing this theme option, make sure that the appropriate css theme file has also been loaded. Included theme files include:
<br>When changing this theme option (the actual theme name is inside parentheses), make sure that the appropriate css theme file has also been loaded. Included theme files include:
<a href="themes.html" target="_blank" title="open themes in a new window">see all themes</a><br>
<iframe style="width:100%;height:300px;" src="themes.html"></iframe>
<hr>
<h3>uitheme widget</h3>
<p>You will need to use the uitheme widget to extend the theme to apply css from jQuery UI, Bootstrap or other css libraries.</p>

29
docs/themes.html
View File

@ -10,7 +10,7 @@
.minitable table {width:175px;margin:10px auto;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.minitable table th {font-size:11px;}
.minitable table td {font-size:11px;padding:4px !important;text-align:center;}
.minitable h3 {text-align:center;text-transform:capitalize;}
.minitable h3, .minitable h5 {text-align:center;margin:0;}
</style>
<!-- jQuery -->
@ -76,7 +76,8 @@ $(function() {
<div id="main">
<div class="minitable">
<h3>blackice</h3>
<h3>Blackice</h3>
<h5>(blackice)</h5>
<table class="demo tablesorter-blackice">
<thead><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></thead>
<tfoot><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></tfoot>
@ -91,7 +92,8 @@ $(function() {
</div>
<div class="minitable">
<h3>blue</h3>
<h3>Blue</h3>
<h5>(blue)</h5>
<table class="demo tablesorter-blue">
<thead><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></thead>
<tfoot><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></tfoot>
@ -106,7 +108,8 @@ $(function() {
</div>
<div class="minitable">
<h3>dark</h3>
<h3>Dark</h3>
<h5>(dark)</h5>
<table class="demo tablesorter-dark">
<thead><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></thead>
<tfoot><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></tfoot>
@ -121,7 +124,8 @@ $(function() {
</div>
<div class="minitable">
<h3>default</h3>
<h3>Default</h3>
<h5>(default)</h5>
<table class="demo tablesorter-default">
<thead><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></thead>
<tfoot><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></tfoot>
@ -136,7 +140,8 @@ $(function() {
</div>
<div class="minitable">
<h3>green</h3>
<h3>Green</h3>
<h5>(green)</h5>
<table class="demo tablesorter-green">
<thead><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></thead>
<tfoot><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></tfoot>
@ -151,7 +156,8 @@ $(function() {
</div>
<div class="minitable">
<h3>grey</h3>
<h3>Grey</h3>
<h5>(grey)</h5>
<table class="tablesorter-grey">
<thead><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></thead>
<tfoot><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></tfoot>
@ -166,7 +172,8 @@ $(function() {
</div>
<div class="minitable">
<h3>ice</h3>
<h3>Ice</h3>
<h5>(ice)</h5>
<table class="demo tablesorter-ice">
<thead><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></thead>
<tfoot><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></tfoot>
@ -182,6 +189,7 @@ $(function() {
<div class="minitable">
<h3>Bootstrap</h3>
<h5>(bootstrap)</h5>
<table class="tablesorter-bootstrap">
<thead><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></thead>
<tfoot><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></tfoot>
@ -197,6 +205,7 @@ $(function() {
<div class="minitable">
<h3>jQuery UI</h3>
<h5>(jui)</h5>
<table class="tablesorter-jui">
<thead><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></thead>
<tfoot><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></tfoot>
@ -211,7 +220,8 @@ $(function() {
</div>
<div class="minitable">
<h3>dropbox</h3>
<h3>Dropbox</h3>
<h5>(dropbox)</h5>
<table class="tablesorter-dropbox">
<thead><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></thead>
<tfoot><tr><th>A</th><th>B</th><th>C</th><th>D</th></tr></tfoot>
@ -227,6 +237,7 @@ $(function() {
<div class="minitable">
<h3>Metro Dark</h3>
<h5>(metro-dark)</h5>
<table class="tablesorter-metro-dark demo">
<thead>
<tr class="dark-row"><th class="sorter-false" colspan="4">Title</th></tr>