Repo containing the official documentation for πtagtog.
The latest stable documentation is hosted at docs.tagtog.net.
Please report any issues here or contact us at [email protected]
git clone https://github.com/tagtog/tagtog-doc.git
cd tagtog-doc
Just run:
./dev.sh
NOTE: live reloading might not work
Just run:
./docker-dev.sh
-
Create a markdown
.md
file and add the frontmatter.--- layout: page title: Multi-user annotation sidebar_link: true id: collaboration ---
Choose an
id
and atitle
. Change the flagsidebar_link
appropriately if you want a link to appear in the sidebar. -
If the item is to appear in the side bar, add it to the
_config.yml
varsidebar_toc
. -
Follow the style guide below.
Documentation theme is based on https://fongandrew.github.io/hydeout/
The documentation content is displayed in a two columns layout.
You are free to decide when to use these columns. You can use a single column design (two-third-column
) or a two-columns design (two-third-column
and one-third-column
).
<div class="two-third-column">
Main content
</div>
<div class="one-third-column">
Display messages, figures, etc.
</div>
Use messages only on the right column of the layout one-third-column
. Display tips, tricks and other interesting stuff.
Template message.html
:
{% include message.html message="your tips and tricks"%}
Combine CSS classes numbered-item
and number-x
, where x
is the order in the list. Currently the style is limited to the first 6 items. You decide the values for the ordered list, it can be numbers (1,2,3 ...), letters (A, B, C ...), etc. You can choose the order (e.g. 3, 2, 1).
<p class="numbered-item"><span class="number-1">1</span>Description 1.</p>
<p class="numbered-item"><span class="number-2">2</span>Description 2.</p>
<p class="numbered-item"><span class="number-3">3</span>Description 3.</p>
Combine CSS classes list-item
and list-item-x
, where x
is the order in the list. Currently the style is limited to the first 6 items.
<p class="list-item"><span class="list-item-1"></span>Description.</p>
<p class="list-item"><span class="list-item-2"></span>Description.</p>
<p class="list-item"><span class="list-item-3"></span>Description.</p>
Use it to display images. Optionally you can set the width
and the caption
.
Template image.html
:
{% include image.html name="editor-import.png" caption="Upload box where you can select how to import text" %}
Use it to display an image within the text. You can optionally set the width
to adjust the size of the image.
Template inline-image.html
:
{% include inline-image.html name="image-inline.png" width="70" %}
To mention tagtog features that will be ready soon or have been temporarily disabled, use the CSS class soon
. The content will be faded
<div class="soon">
Text streams coming soon
</div>
<div markdown="1">
Your markdown
</div>
You can use https://gist.github.com/rxaviers/7360908 , e.g. :bookmark_tabs:
π