drowl87/hextra_mirror
1
0
Fork 1
mirror of https://github.com/imfing/hextra.git synced 2025-05-13 08:37:45 -04:00
Code Issues Actions Packages Projects Releases Wiki 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 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 ## 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. [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> 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" */>}} {{</* icon "your-icon" */>}}
{{</* card icon="your-icon" */>}}
``` ```
Tip: [Iconify Design](https://iconify.design/) is a great place to find SVG icons for your site.