Permalink
Browse files

Further refactoring and cleanup. Simplify.

  • Loading branch information...
1 parent 1837f5d commit c3de93ffe7b2c7efb4dd5f2c00ed145f24e1bc48 @kflorence committed Mar 8, 2011
File renamed without changes
File renamed without changes
View
@@ -6,8 +6,9 @@
<title>jQuery Tabulate Plugin</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="../src/jquery.tabulate.js"></script>
+
<link type="text/css" rel="stylesheet" href="../themes/default/styles.css" />
- <style type="text/css">a.api { color: #000; margin-top: 10px; }</style>
+ <link type="text/css" rel="stylesheet" href="styles.css" />
<script type="text/javascript">
jQuery(function($) {
@@ -56,24 +57,20 @@
<p><a href="../jsdoc/" class="api">Documentation</a></p>
<h2>Tabulate via AJAX request</h2>
- <div id="tabulate-ajax"></div>
- <ul class="tabulate-navigation clearfix">
- <li class="tabulate-partition tabulate-partition-first tabulate-pagination">
- <span class="tabulate-prev" />
- page <input class="tabulate-current-page" type="text" />
- of <span class="tabulate-total-pages"></span>
- <span class="tabulate-next" />
- </li>
- <li class="tabulate-partition tabulate-partition-no-input">
- <span class="tabulate-count">0</span> total results
- </li>
- <li class="tabulate-partition tabulate-partition-no-input">
- <div class="tabulate-loading"><span>Loading...</span></div>
- </li>
- <li class="tabulate-partition tabulate-partition-last">
- <select class="tabulate-results-per-page"></select> results per page
- </li>
- </ul>
+ <div id="tabulate-ajax">
+ <ul class="navigation clearfix">
+ <li class="first">
+ <ul class="pagination clearfix">
+ <li class="previous"><img src="images/previous.png" alt="Previous" title="Previous" /></li>
+ <li>page <input class="current-page" type="text" value="1" /> of <span class="total-pages">1</span></li>
+ <li class="next"><img src="images/next.png" alt="Next" title="Next" /></li>
+ </ul>
+ </li>
+ <li class="no-input"><span class="count">0</span> total results</li>
+ <li class="no-input"><div class="status"><span>status</span></div></li>
+ <li class="last"><select class="results-per-page"></select> results per page</li>
+ </ul>
+ </div>
<h2>Tabulate via static JSON</h2>
<div id="tabulate-json"></div>
View
@@ -0,0 +1,110 @@
+/*------------------------------------------------------------------------------
+ Navigation
+------------------------------------------------------------------------------*/
+
+.navigation {
+ margin: 0;
+ padding: 0;
+ font-size: 10px;
+ list-style: none;
+ border: solid 1px #bad9ff;
+ background-color: #ebf4ff;
+}
+
+.navigation > li {
+ float: left;
+ padding: 2px 5px;
+ white-space: nowrap;
+ border-left: solid 1px #bad9ff;
+}
+
+.navigation > li.no-input {
+ padding: 5px;
+ padding-top: 6px;
+}
+
+.navigation > li.first {
+ border-left: 0;
+}
+
+.navigation > li.last {
+ float: right;
+ border-right: 0;
+}
+
+.navigation > li select {
+ padding: 0;
+ font-size: 10px;
+ width: 48px;
+}
+
+.navigation > li .current-page {
+ padding: 1px 0;
+ margin: 0 2px;
+ font-size: 10px;
+ text-align: right;
+ width: 24px;
+ vertical-align: middle;
+}
+
+/*------------------------------------------------------------------------------
+ Pagination
+------------------------------------------------------------------------------*/
+
+.pagination {
+ margin: 0;
+ padding: 0;
+ list-style: none;
+}
+
+.pagination > li {
+ float: left;
+}
+
+.pagination .next, .pagination .previous {
+ margin-top: 2px;
+ cursor: pointer;
+}
+
+.pagination .previous {
+ margin-right: 5px;
+}
+
+.pagination .next {
+ margin-left: 5px;
+}
+
+/*------------------------------------------------------------------------------
+ Misc
+------------------------------------------------------------------------------*/
+
+.navigation .loading {
+ background: transparent url(images/loading.gif) left center no-repeat;
+}
+
+.navigation .status span {
+ visibility: hidden;
+}
+
+.no-results {
+ padding: 5px;
+ font-size: 10px;
+ text-align: center;
+ vertical-align: middle;
+ border: solid 1px #ebf4ff;
+}
+
+/*------------------------------------------------------------------------------
+ Clearfix
+------------------------------------------------------------------------------*/
+
+.clearfix:before, .clearfix:after {
+ content: "\0020";
+ display: block;
+ height: 0;
+ visibility: hidden;
+}
+
+.clearfix:after {
+ clear: both;
+}
Oops, something went wrong.

0 comments on commit c3de93f

Please sign in to comment.