2017-01-04 21:40:01 +00:00
= Vimwiki =
== TODO ==
2017-01-04 23:01:47 +00:00
* [X] Commit to a repository
2017-01-04 21:40:01 +00:00
* [ ] Setup remote to host
* [ ] Setup remote to automatically `:VimwikiAll2HTML` after it's been pushed to
2017-01-04 23:01:47 +00:00
== Table tweaks ==
Tables without any styles are gross, so let's use the styles from Bootstrap. Problem is that Vimwiki doesn't provide a way to add a class to a table element, so we'll do it with JQuery:
{{{class="prettyprint"
<script>
$(document).ready(function(){
$("table").addClass("table table-condensed table-hover");
});
</script>
}}}
This adds `.table`, `.table-condensed`, and `.table-hover` classes to every table element in the whole document. Don't see why it should be any other way for the moment.
=== References ===
http://stackoverflow.com/a/39897883
http://www.w3schools.com/jquery/jquery_syntax.asp
2017-01-04 21:40:01 +00:00
== HTML Checkboxes ==
By default, there is no difference between how a non-checkbox list item, unchecked list item, and a checked list item are displayed when exported to HTML.
There are 5 states of a checkbox, 0-4, and they each represent a different level of completeness. This is mainly for checklist items with children.
Checkbox states:
2017-01-04 23:01:47 +00:00
| State # | % Complete | li class | Unicode character | Escape sequence | HTML code |
|---------|------------|----------|-------------------|-----------------|------------|
| 0 | 0% | `done0` | ◯ | `\u25EF` | `◯` |
| 1 | 1-33% | `done1` | ◔ | `\u25D4` | `◔` |
| 2 | 34-66% | `done2` | ◑ | `\u25D1` | `◑` |
| 3 | 67-99% | `done3` | ◕ | `\u25D5` | `◕` |
| 4 | 100% | `done4` | ✔ | `\u2714` | `✔` |
2017-01-04 21:40:01 +00:00
Now, in order to use these in our HTML, we just have to write a style for `ul li.doneX:before` in our header like so:
{{{class="prettyprint linenums" >
<style>
ul li.done0:before {content: '\25EF';}
ul li.done1:before {content: '\25D4';}
ul li.done2:before {content: '\25D1';}
ul li.done3:before {content: '\25D5';}
ul li.done4:before {content: '\2714';}
</style>
}}}
Now here's a few test lists:
* [ ] Unfinished item
* [X] Finished item
* [.] Parent item 1
* [X] Child item 1
* [ ] Child item 2
* [ ] Child item 3
* [ ] Child item 4
* [o] Parent item 2
* [X] Child item 1
* [X] Child item 2
* [ ] Child item 3
* [ ] Child item 4
* [O] Parent item 3
* [X] Child item 1
* [X] Child item 2
* [X] Child item 3
* [ ] Child item 4
* [X] Parent item 4
* [X] Child item 1
* [X] Child item 2
* [X] Child item 3
* [X] Child item 4
* [ ] Parent item 5
* [ ] Child item 1
* [ ] Child item 2
* [ ] Child item 3
* [ ] Child item 4
