commit: 61a1256a3a98878c5421dbb4e33292b2d72ae19e
parent: deb0f7f770e2020b1d69003a88c4d8bf535f9ef5
Author: Haelwenn (lanodan) Monnier <contact@hacktivis.me>
Date: Thu, 17 May 2018 06:59:51 +0200
sorttable: Add index
Diffstat:
2 files changed, 94 insertions(+), 0 deletions(-)
diff --git a/common.css b/common.css
@@ -0,0 +1,33 @@
+:root {
+ font-family: serif;
+ text-rendering: optimizelegibility;
+ font-kerning: normal;
+}
+main {
+ margin: 0 auto;
+ padding: 0 5em;
+ width: 90em;
+}
+code { font-family: monospace; }
+h1,h2,h3,h4,h5,h6 {
+ font-family: sans;
+ font-kerning: auto;
+}
+code {
+ background: #002b36;
+ color: #788b8e;
+ padding: .8pt;
+}
+code .comment { color: #6a830b; }
+pre code { display: table; }
+form.rows {
+ display: flex;
+ flex-direction: column;
+}
+header {
+ display: table;
+ margin: 0 auto;
+}
+header pre {
+ text-align:center;
+}
diff --git a/sorttable/index.html b/sorttable/index.html
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html lang=en>
+<head>
+ <meta charset="utf-8"/>
+ <title>SortTable — Web demos</title>
+ <link rel="stylesheet" href="../common.css">
+ <link rel="stylesheet" href="sorttable.css"/>
+</head>
+<body>
+<!-- http://knowyourmeme.com/memes/born-to-die-world-is-a-fuck-kill-em-all-1989-i-am-trash-man-410757864530-dead-cops -->
+ <header title="I hope there is not actually that much dead code online…">
+<pre><strong>BORN TO DIE()</strong>
+WORLD IS A `FSCK`
+鬼神 Kill Em All 1989
+I am trash main()
+410,757,864,530 DEAD CODES</pre>
+ </header>
+ <nav><a rel="up" href="..">Homepage</a></nav>
+ <main>
+ <h1>SortTable</h1>
+ <h2>Sources</h2>
+ <ul>
+ <li><a href="sorttable.js">sorttable.js</a> (3397B, 1412B gzip’ed)</li>
+ <li><a href="sorttable.min.js">sorttable.min.js</a> (1491B, 613B gzip’ed)</li>
+ <li><a href="sorttable.css">sorttable.css</a> (468B)</li>
+ </ul>
+ <h2>Usage</h2>
+ <ol>
+ <li>Add <code><script src="sorttable.js"></script></code> (or <code>sorttable.min.js</code>) at the end of your <abbr title="HyperText Markup Language">HTML</abbr> pages</li>
+ <li>Add <code><link rel="stylesheet" href="sorttable.css"/></code> to the <code>head</code> of your <abbr title="HyperText Markup Language">HTML</abbr> pages</li>
+ </ol>
+ <p>To override a cell(<code>td</code>) value ou can pass the well used <code>data-value</code> attribute to it. Also please note that the sorting may not be <a href="https://en.wikipedia.org/wiki/Sorting_algorithm#Stability">stable</a>.</p>
+ <h2>Demo</h2>
+ <table class="sortable">
+ <thead>
+ <tr><th>Date</th><th>Name</th><th>Value</th></tr>
+ </thead>
+ <tbody>
+ <tr><td>1958-10-22</td><td>Anime</td><td>9000</td></tr>
+ <tr><td>-8000</td><td>life</td><td data-value="0042">42</td></tr>
+ <tr><td>1970-01-01</td><td>Geek</td><td>1337</td></tr>
+ </tbody>
+ <tfoot>
+ <tr><th></th><th></th><th>Total: Too much!</th></tr>
+ </tfoot>
+ </table>
+ <table class="sortable">
+ <thead>
+ <tr><th class="sorttable_sorted">File</th><th>Size</th><th>Size gzip’ed</th></tr>
+ </thead>
+ <tbody>
+ <tr><td><a href="sorttable.min.js">sorttable.min.js</a></td><td>1491</td><td data-value="0613">613</td></tr
+ <tr><td><a href="sorttable.js">sorttable.js</a></td><td>3397</td><td>1412</td></tr>
+ <tr><td><a href="sorttable.css">sorttable.css</a></td><td data-value="0468">468</td><td data-value="0170">170</td></tr>
+ </tbody>
+ </table>
+ <script src="sorttable.min.js"></script>
+ </main>
+ <footer>Copyright 2018 Haelwenn (lanodan) Monnier. Distributed under the <a href="http://creativecommons.org/licenses/by/4.0/">CC-BY 4.0 License</a>. Obviously, this demoset agrees that <a href="http://simpleweb.iscute.ovh/">simple web is cute</a>.</footer>
+</body>
+<html>
