Add paige/figure shortcode

README.md

@@ -449,6 +449,33 @@ title: Search
 ---
 ```
 
+## Figures
+
+The `paige/figure` shortcode provides a figure with a centered image and an optional centered caption.
+The image and caption can optionally be displayed inline instead of centered.
+The image has optional alt, title, width, and height attributes,
+and can optionally be wrapped in an anchor. Only the image source parameter is required.
+
+These are the named parameters with positions, listed in the order of their positions:
+
+```go
+{{< paige/figure
+    src="https://imgs.xkcd.com/comics/sandwich.png"
+    link="https://xkcd.com/149"
+    caption="My caption"
+    alt="My alt"
+    title="My title" >}}
+```
+
+These are the rest of the named parameters:
+
+```go
+{{< paige/figure
+    height=500
+    inline=false
+    width=500 >}}
+```
+
 ## Customization
 
 If `partials/paige-head-last.html` exists in the site, it is included at the end of the head tag.

layouts/shortcodes/paige/figure.html

@@ -0,0 +1,13 @@
+<figure {{ if eq (.Get `inline`) true }} class="figure"{{ else }} class="align-items-center d-flex flex-column"{{ end }}>
+    {{ $link := .Get 1 | default (.Get `link`) }}
+    {{ with $link }}
+    <a href="{{ . }}">
+    {{ end }}
+    <img{{ with (.Get 3 | default (.Get `alt`)) }} alt="{{ . }}"{{ end }} class="figure-img img-fluid"{{ with .Get `height` }} height="{{ . }}"{{ end }} src="{{ .Get 0 | default (.Get `src`) }}"{{ with (.Get 4 | default (.Get `title`)) }} title="{{ . }}"{{ end }}{{ with .Get `width` }} width="{{ . }}"{{ end }}>
+    {{ if $link }}
+    </a>
+    {{ end }}
+    {{ with (.Get 2 | default (.Get `caption`)) }}
+    <figcaption class="figure-caption">{{ . }}</figcaption>
+    {{ end }}
+</figure>