michael/blowfish
1
0
Fork 0
mirror of https://github.com/nunocoracao/blowfish.git synced 2025-02-02 03:22:33 -06:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Add docs.

Browse source
This commit is contained in:
Mircea-Pavel ANTON 2023-01-16 08:21:51 +00:00
parent f919b29fc5
commit 973de66ff6
1 changed files with 20 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
exampleSite/content/docs/shortcodes/index.md
View file

@ -167,6 +167,26 @@ Blowfish also supports automatic conversion of images included using standard Ma
{{< figure src="abstract.jpg" alt="Abstract purple artwork" caption="Photo by [Jr Korpa](https://unsplash.com/@jrkorpa) on [Unsplash](https://unsplash.com/)" >}} {{< figure src="abstract.jpg" alt="Abstract purple artwork" caption="Photo by [Jr Korpa](https://unsplash.com/@jrkorpa) on [Unsplash](https://unsplash.com/)" >}}
## Gallery
`gallery` allows you to showcase multiple images at once, in a responsive manner with more varied and interesting layouts.
In order to add images to the gallery, proceed as you normally would with `{{< figure >}}` shortcodes, but made sure to add the extra `class="grid-item grid-wXY"` in order for the gallery to properly pick the images up. The widths available by default start at 10% and go all the way to 100% in 5% increments. For example, to set the width to 65%, set the class to `grid-w65`.
**Example:**
```md
{{</* gallery */>}}
{{</* figure src="abstract.jpg" alt="Abstract purple artwork" caption="Photo by [Jr Korpa](https://unsplash.com/@jrkorpa) on [Unsplash](https://unsplash.com/)" class="grid-item grid-w15"*/>}}
{{</* figure src="featured.png" class="grid-item grid-w15"*/>}}
{{</* /gallery */>}}
```
{{< gallery >}}
{{< figure src="abstract.jpg" alt="Abstract purple artwork" caption="Photo by [Jr Korpa](https://unsplash.com/@jrkorpa) on [Unsplash](https://unsplash.com/)" class="grid-item grid-w75">}}
{{< figure src="featured.png" class="grid-item grid-w15" >}}
{{< /gallery >}}
## Icon ## Icon
`icon` outputs an SVG icon and takes the icon name as its only parameter. The icon is scaled to match the current text size. `icon` outputs an SVG icon and takes the icon name as its only parameter. The icon is scaled to match the current text size.