Verified Commit deafab0f authored by Laurent Heirendt's avatar Laurent Heirendt
Browse files

WIP: fix formatting (1)

parent 4eb9cb82
......@@ -46,184 +46,53 @@ Markdown is a lightweight markup language with plain text formatting syntax whic
|:-----------------------------------|---------------------------|
|: <pre>To make a text *italic*: use *one asterisk* or _underscore_.</pre> | To make a text **italic**, use *one asterisk* or _underscore_.|
|:-----------------------------------|---------------------------|
|: Use numbers for ordered lists |
|: ^^ <pre>1. First item | ^^ 1. First item |
|: ^^1. Second item | ^^ 1. Second item |
|: ^^1. Third item | ^^ 1. Third item |
|: ^^ 1. Indented item | ^^ 1. Indented item |
|: ^^ 1. Indented item | ^^ 1. Indented item |
|: ^^1. Fourth item </pre> | ^^1. Fourth item |
|: Use numbers for ordered lists |
|: ^^<pre>1. First item | ^^ 1. First item
|: ^^1. Second item | ^^ 1. Second item
|: ^^1. Third item | ^^ 1. Third item
|: ^^ 1. Indented item | ^^ 1. Indented item
|: ^^ 1. Indented item | ^^ 1. Indented item
|: ^^1. Fourth item </pre> | ^^1. Fourth item
|:-----------------------------------|---------------------------|
|: For unordered lists use asterisk, minus or plus |
|: ^^<pre>- First item | ^^ - First item
|: ^^- Second item | ^^ - Second item
|: ^^* Third item | ^^ * Third item
|: ^^ * Indented item | ^^ * Indented item
|: ^^ + Indented item | ^^ + Indented item
|: ^^* Fourth item</pre> | ^^ * Fourth item
|:-----------------------------------|---------------------------|
|: <pre>Include links referring to a web [page](https://www.markdownguide.org/)</pre> | Include links referring to a web [page](https://www.markdownguide.org/)
|:-----------------------------------|---------------------------|
|: Include local pictures using markdown |
|: ^^<pre>![My awesome picture](img/r3_logo.png)</pre> | ^^ ![My awesome picture](img/r3_logo.png)
|: Or use HTML tag allowing you to alter the image properties (e.g. size) |
|: ^^<pre>&lt; img src="img/r3_logo.png" width="40" &gt;</pre> | ^^<img src="img/r3_logo.png" width="40">
|:-----------------------------------|---------------------------|
|: Include code blocks! |
|: ^^ <pre>\`\`\` | ^^
|: ^^def function(x): | ^^<pre>def function(x):
|: ^^ x+1 | ^^ x+1
|: ^^function(2) | ^^function(2)
|: ^^\`\`\`</pre> | ^^</pre>
|:-----------------------------------|---------------------------|
<td>
<pre style="white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word">
For unordered lists use asterisk, minus or plus
- First item
- Second item
* Third item
&nbsp;&nbsp;&nbsp;&nbsp;* Indented item
&nbsp;&nbsp;&nbsp;&nbsp;+ Indented item
* Fourth item
</pre>
</td>
<td>
For unordered lists use asterisk, minus or plus
<ul>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
<ul>
<li>Indented item</li>
<li>Indented item</li>
</ul>
<li>Fourth item</li>
</ul>
</td>
</tr>
<tr>
<td>
<pre style="white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word">
Include links referring to a web [page](https://www.markdownguide.org/)
</pre>
</td>
<td>
Include links referring to a web <a href="https://www.markdownguide.org/">page</a>
</td>
</tr>
<tr>
<td>
<pre style="white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word">
Include local pictures using markdown:
![My awesome picture](img/r3_logo.png)
</pre><br>
<pre style="white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word">
Or use HTML tag allowing you to alter the image properties (e.g. size):
&lt;img src="img/r3_logo.png" width="40"&gt;
</pre>
</td>
<td>
Include local pictures using markdown: <br>
<img src="img/r3_logo.png"> <br>
Or use HTML tag allowing you to alter the image properties (e.g. size):<br>
<img src="img/r3_logo.png" width="40">
</td>
</tr>
<tr>
<td>
<pre style="white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word">
Include code blocks!
```
def myAwesomeFunction(x):
x+1
myAwesomeFunction(2)
```
</pre>
</td>
<td>
Include code blocks! <br>
<code>
def myAwesomeFunction(x):<br>
x+1<br>
myAwesomeFunction(2)
</code>
</td>
</tr>
<tr>
<td>
<pre style="white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word">
Create table:
| Tables | Are | Cool |
|------------|:------:|:-----:|
| value one | blue | $1024 |
| value two | red | $256 |
| value three| green | $128 |
</pre>
</td>
<td>
Create table:
<div>
<table>
<thead>
<tr>
<th>
Tables
</th>
<th>
Are
</th>
<th>
Cool
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
value one
</td>
<td>
blue
</td>
<td>
$1024
</td>
</tr>
<tr>
<td>
value two
</td>
<td>
red
</td>
<td>
$256
</td>
</tr>
<tr>
<td>
value tree
</td>
<td>
green
</td>
<td>
$128
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table>
For creating tables, follow the [Jekyll Spaceship documentation](https://github.com/jeffreytse/jekyll-spaceship).
This is an overview of basic Markdown features. For more in-build features, please see various online [documentation](https://www.markdownguide.org/basic-syntax/).
### Advanced formatting
Plain syntax is usually enough. But special requirements lead to development of many of so called ["flavored" markdown syntaxes](https://github.com/commonmark/commonmark-spec/wiki/markdown-flavors) implementing more formatting functionality such as linking different sections, highlighting blocks of code, table extensions, strikethroughs, ...
Another big advantage of Markdown is that it can contain HTML tags, which makes formatting very flexible.
## When to use markdown?
* **Documentation** - Markdown is a perfect solution for description of a data package, project folder, workflow or code repository. Using Markdown ensures that the description will be accessible to everyone even after decades while still nicely structured. Guide for writing a good README is not covered by this HowTo page but you can find plenty of resources online, e.g.:
* [guide](https://data.research.cornell.edu/content/readme) from Cornell University, UK
* [GitHub page](https://github.com/mhucka/readmine) for READMEs in a software repository
* **Blogging and tutorials** - structured document with chunks of code, pictures and results of the analyses can be easily converted to HTML format and posted on personal/team websites.
* **Notes and meeting minutes** - you can use following template for simple and nicely structured meeting notes:
* **Documentation** - Markdown is a perfect solution for description of a data package, project folder, workflow or code repository. Using Markdown ensures that the description will be accessible to everyone even after decades while still nicely structured. Guide for writing a good README is not covered by this HowTo page but you can find plenty of resources online, e.g.:
* [guide](https://data.research.cornell.edu/content/readme) from Cornell University, UK
* [GitHub page](https://github.com/mhucka/readmine) for READMEs in a software repository
* **Blogging and tutorials** - structured document with chunks of code, pictures and results of the analyses can be easily converted to HTML format and posted on personal/team websites.
* **Notes and meeting minutes** - you can use following template for simple and nicely structured meeting notes:
<table>
<thead>
......@@ -271,11 +140,9 @@ Another big advantage of Markdown is that it can contain HTML tags, which makes
</tbody>
</table>
* **Analyses, reports and papers** - embedding [R markdown](https://rmarkdown.rstudio.com/) in an R project allows you to include executable code and related text in the very same document. This brings unprecedented level of consistency, shareability and reproducibility into the workflows.
* **Online discussion forums** - many scientific and non-scientific discussion forums and social networks support Markdown for formatting the content of messages (e.g. [StackOverflow](https://stackoverflow.com/editing-help), [GitHub](https://help.github.com/en/github/writing-on-github/basic-writing-and-formatting-syntax), Reddit or even Facebook)
* **Presentations** - variety of tools support Markdown-powered slide generation, e.g. [reveal.js](https://revealjs.com/#/), [HackerSlides](https://github.com/jacksingleton/hacker-slides) or [landslide](https://github.com/adamzap/landslide)
* **Analyses, reports and papers** - embedding [R markdown](https://rmarkdown.rstudio.com/) in an R project allows you to include executable code and related text in the very same document. This brings unprecedented level of consistency, shareability and reproducibility into the workflows.
* **Online discussion forums** - many scientific and non-scientific discussion forums and social networks support Markdown for formatting the content of messages (e.g. [StackOverflow](https://stackoverflow.com/editing-help), [GitHub](https://help.github.com/en/github/writing-on-github/basic-writing-and-formatting-syntax), Reddit or even Facebook)
* **Presentations** - variety of tools support Markdown-powered slide generation, e.g. [reveal.js](https://revealjs.com/#/), [HackerSlides](https://github.com/jacksingleton/hacker-slides) or [landslide](https://github.com/adamzap/landslide)
## Cases when Markdown is not easily applicable
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment