Documentation

This commit is contained in:
squidfunk 2022-05-08 18:37:08 +02:00
parent f9e6b94aea
commit a4d0f137a9
2 changed files with 21 additions and 3 deletions

View File

@ -19,15 +19,18 @@ following lines to `mkdocs.yml`:
``` yaml ``` yaml
markdown_extensions: markdown_extensions:
- abbr - abbr
- attr_list
- pymdownx.snippets - pymdownx.snippets
``` ```
See additional configuration options: See additional configuration options:
- [Abbreviations] - [Abbreviations]
- [Attribute Lists]
- [Snippets] - [Snippets]
[Abbreviations]: ../setup/extensions/python-markdown.md#abbreviations [Abbreviations]: ../setup/extensions/python-markdown.md#abbreviations
[Attribute Lists]: ../setup/extensions/python-markdown.md#attribute-lists
[Snippets]: ../setup/extensions/python-markdown-extensions.md#snippets [Snippets]: ../setup/extensions/python-markdown-extensions.md#snippets
### Improved tooltips ### Improved tooltips
@ -60,9 +63,9 @@ Now, tooltips will be rendered for the following elements:
The [Markdown syntax] allows to specify a `title` for each link, which will The [Markdown syntax] allows to specify a `title` for each link, which will
render as a beautiful tooltip when [improved tooltips] are enabled. Add a render as a beautiful tooltip when [improved tooltips] are enabled. Add a
tooltip to an link with the following lines: tooltip to a link with the following lines:
``` markdown title="Link with title, inline syntax" ``` markdown title="Link with tooltip, inline syntax"
[Hover me](https://example.com "I'm a tooltip!") [Hover me](https://example.com "I'm a tooltip!")
``` ```
@ -74,7 +77,7 @@ tooltip to an link with the following lines:
Tooltips can also be added to link references: Tooltips can also be added to link references:
``` markdown title="Link with title, reference syntax" ``` markdown title="Link with tooltip, reference syntax"
[Hover me][example] [Hover me][example]
[example]: https://example.com "I'm a tooltip!" [example]: https://example.com "I'm a tooltip!"
@ -84,6 +87,19 @@ Tooltips can also be added to link references:
[Hover me](https://example.com "I'm a tooltip!") [Hover me](https://example.com "I'm a tooltip!")
</div>
For all other elements, a `title` can be added by using the [Attribute Lists]
extension:
``` markdown title="Icon with tooltip"
:material-information-outline:{ title="Important information" }
```
<div class="result" markdown>
:material-information-outline:{ title="Important information" }
</div> </div>
[Markdown syntax]: https://daringfireball.net/projects/markdown/syntax#link [Markdown syntax]: https://daringfireball.net/projects/markdown/syntax#link

View File

@ -84,6 +84,7 @@ No configuration options are available. See reference for usage:
- [Using annotations] - [Using annotations]
- [Using grids] - [Using grids]
- [Adding buttons] - [Adding buttons]
- [Adding tooltips]
- [Using icons with colors] - [Using icons with colors]
- [Using icons with animations] - [Using icons with animations]
- [Image alignment] - [Image alignment]
@ -94,6 +95,7 @@ No configuration options are available. See reference for usage:
[Attribute Lists limitations]: https://python-markdown.github.io/extensions/attr_list/#limitations [Attribute Lists limitations]: https://python-markdown.github.io/extensions/attr_list/#limitations
[Using grids]: ../../reference/grids.md#using-grids [Using grids]: ../../reference/grids.md#using-grids
[Adding buttons]: ../../reference/buttons.md#adding-buttons [Adding buttons]: ../../reference/buttons.md#adding-buttons
[Adding tooltips]: ../../reference/tooltips.md#adding-tooltips
[Using icons with colors]: ../../reference/icons-emojis.md#with-colors [Using icons with colors]: ../../reference/icons-emojis.md#with-colors
[Using icons with animations]: ../../reference/icons-emojis.md#with-animations [Using icons with animations]: ../../reference/icons-emojis.md#with-animations
[Image alignment]: ../../reference/images.md#image-alignment [Image alignment]: ../../reference/images.md#image-alignment