<!-- {"notolog.app": {"created": "2024-03-26 00:19:36.466439", "updated": "2024-11-19 19:26:13.521180"}} -->
# Markdown syntax

## Headings

Keep space between the `#` sign and the heading itself.

# Header 1
## Header 2
### Header 3
#### Header 4
##### Header 5
###### Header 6

*No alternate syntax supported for the headings at the moment.*

## Tables

Markdown table syntax is supported, complete with column alignment options to enhance readability and presentation.

A Markdown table is composed of rows of data, divided by pipes (`|`). The first row is typically the header, followed by a separator line, and then the data rows.

| Item                  | In Stock | Price |
| :-------------------- | :------: | ----: |
| Unicorn Bubble Tea    | Yes      | 7.99  |
| Dragon's Breath Chili | No       | 23.99 |
| Fairy Dust Tiramisu   | Yes      | 17.99 |
| Wizard's Cloak Hoodie | No       | 42.99 |

### Alignment Operands

To align the content within your table cells, you can use colons (`:`) in the separator line:

* Left-aligned: Use `:--` or `:---` (colon on the left side)
* Center-aligned: Use `:--:` or `:---:` (colons on both sides)
* Right-aligned: Use `--:` or `---:` (colon on the right side)


## Images

### Image with path

![Notolog](../notolog/assets/notolog-example-image.png)

Code looks like: `![Alt text](notolog/assets/notolog-example-image.png)`.

### Image with base64 data

![Notolog inline logo](data:image/png;base64, )

To get base64 image code from the real image use this example in Python (*Learn more about code blocks below*):

```py
file_path = 'example.png';
with open(file_path, 'rb', encoding='utf-8') as image_file:
    image_data = image_file.read()
    base64_encoded_data = base64.b64encode(image_data)
    base64_decoded_data = base64_encoded_data.decode('utf-8')
    print(base64_decoded_data)
```

Then you can place the printed code to this template, put it instead of `CODE` below:

`![Alt text](data:image/png;base64,CODE)`


## B-I-U-S

**B**old-**I**talic-**U**nderline-**S**trikethrough

### Bold

Some **bold** text here A
Some __bold__ text here B

When using bold text markdown avoid an __underscores__ which are not surrounded with spaces,
use a**n asterix syntax ins**tead.

Also, the multiline syntax is supported, __so please
fell free__ to use it whenever you may **find it helpful,
or whenever it gets you** in other ways.

### Italic

Some *lorem ipsum* text here A
Some _lorem ipsum_ text here B

Also, multiline syntax is supported, _so please
feel free_ to use it whenever *you find it helpful
or whenever it benefits you* in other ways.

### Bold `+` Italic

Some ***lorem ipsum*** text here A
Some ___lorem ipsum___ text here B

Also, multiline syntax is supported, ___so please
fell free___ to use it whenever ***you find it helpful
or whenever it benefits you*** in other ways.

### Underline

Some <u>lorem ipsum</u> text here.

Also, multiline syntax is supported, <u>so please
fell free to use it</u> whenever you find it helpful.

### Strikethrough

Some ~~lorem ipsum~~ text here.

Also, multiline syntax is supported, ~~so please
feel free to use it~~ whenever you find it helpful.


## Lists

* Some
    * Random
        * Text

- List1
- List2
- List3

1. One
	2. Two
		3. Three


## Footnotes

This is a part of the extended Markdown syntax. Handful for creating footnotes at the bottom of the pages.

Footnotes[^1] have a label[^somenote-id] which is an id and the footnote's content can be seen by following the footnote's link.

*Footnote notations themselves are not visible if rendered correctly.*

[^1]: This is a footnote number **1**, do not forget to click a link to return →
[^somenote-id]: A footnote with the label **somenote-id** is also here.

Double check a footnote label (id) is corresponding with the footnote's notation written in a square brakets, like in example above.


## Blockquote

> Also, multiline syntax is supported, so please
feel free to use it whenever you find it helpful.

### Nested blockquote

> Also, multiline syntax is supported, so please
>> feel free to use it whenever you find it helpful
>>> or whenever it benefits you in other ways.

### More elements within blockquote

> #### Also, multiline syntax is supported
>
> * So please feel free to use it whenever you find it helpful.
> * Or whenever it benefits you in other ways.
>
* Any other `inline` *elements* are also **supported** here as well.


## Code

### Multi-line blocks

Code block within fences:

```python
# My first code
print('Hello World!')
```

Code block with colons example:

	::::py
	# My first code
	print('Hello World!')

*New line is required at the end of the block.*

``` {.html}
<html>
<p>HTML Document</p>
</html>
```

Code blocks are perfect for monospace text, such as ASCII art:

```
███╗   ██╗ ██████╗ ████████╗ ██████╗ ██╗      ██████╗  ██████╗ 
████╗  ██║██╔═══██╗╚══██╔══╝██╔═══██╗██║     ██╔═══██╗██╔════╝ 
██╔██╗ ██║██║   ██║   ██║   ██║   ██║██║     ██║   ██║██║  ███╗
██║╚██╗██║██║   ██║   ██║   ██║   ██║██║     ██║   ██║██║   ██║
██║ ╚████║╚██████╔╝   ██║   ╚██████╔╝███████╗╚██████╔╝╚██████╔╝
╚═╝  ╚═══╝ ╚═════╝    ╚═╝    ╚═════╝ ╚══════╝ ╚═════╝  ╚═════╝ 
```

### One-line blocks

One-line code within fences

`pip3 install notolog`

One-line code within fences, another example

```ls -la ```

This case is also correct, just do not forget spaces between the tokens

` ```pip3 install notolog``` `

Or

``` `pip3 install notolog` ```


## Horizontal line

As simple as at least three hyphens.

---


## TODOs

Some tasks take time to complete, and breaking them down into simpler tasks can help in getting them sorted efficiently.
To assist in keeping all records on track, we have introduced a @todo token, available in both code and text formats.


## Abbreviations

The text contains abbreviation (hover mouse on it):

* The HTML is a hyper-text markup language
* Find more info about it at WWW

*The abbreviation notations themselves are not visible when have been rendered correctly.*

*[HTML]: Hyper Text Markup Language
*[WWW]:  World Wide Web


## Details and Summary

<details>
    <summary>Clickable Summary for Description</summary>
    This block contains additional information and conceals it beneath an expandable short summary.
    <details>
        <summary>Nested blocks support</summary>
        This feature is experimental, and some nested syntax highlighting may not function entirely as expected. Nonetheless, it proves helpful in condensing lengthy content into expandable links. Support for this block will be expanded in the future.
    </details>
</details>

---
_This README.md file has been carefully crafted and edited using the Notolog editor itself._