Genius/hextra
1
0
Fork 0
forked from drowl87/hextra_mirror
Code Pull Requests Activity

docs: improve icon shortcode documentation (#149)

Browse Source
This commit is contained in:
Xin 2023-10-25 15:50:15 -04:00 committed by GitHub
parent 97e6945c04
commit e135f5a6b4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
exampleSite/content/docs/guide/shortcodes/icon.md
View File

@ -8,7 +8,9 @@ To use this shortcode inline, inline shortcode needs to be enabled in the config
enableInlineShortcodes: true
```
The list of available icons can be found in `data/icons.yaml`.
List of available icons can be found in [`data/icons.yaml`](https://github.com/imfing/hextra/blob/main/data/icons.yaml).
<!--more-->
## Example
@ -25,14 +27,20 @@ The list of available icons can be found in `data/icons.yaml`.
[Heroicons](https://v1.heroicons.com/) v1 outline icons are available out of the box.
You can also add your own icons by adding them to `data/icon.yaml`:
### How to add your own icons
```yaml {filename="data/icon.yaml"}
Create `data/icons.yaml` file, then add your own SVG icons in the following format:
```yaml {filename="data/icons.yaml"}
your-icon: <svg>your icon svg content</svg>
```
which can then be used like this:
It then can be used in the shortcode like this:
```
{{</* icon "your-icon" */>}}
{{</* card icon="your-icon" */>}}
```
Tip: [Iconify Design](https://iconify.design/) is a great place to find SVG icons for your site.