add support for captions on feature images

.eleventy.js

@@ -85,6 +85,10 @@ module.exports = function (eleventyConfig) {
     return str.split('/').map(part => encodeURI(part)).join('/')
   });
 
+  eleventyConfig.addFilter('md_inline', async str => {
+    return md.renderInline(str);
+  });
+
   // TODO: possibly turn this into a post processing step instead of a filter (or at least make it a shortcode)
   eleventyConfig.addFilter("related", async function(obj) {
     const post = this.ctx;

src/_includes/layouts/post.njk

@@ -6,7 +6,14 @@ subhead: blog
     <article>
         <header class="article_header">
             {% if feature_image %}
-                <img src="{{ feature_image }}" alt="{{ feature_alt if feature_alt else "feature image for '" + title + "'" }}" style="padding-bottom: 10px;" height="auto" width="75%" layout="responsive"/>
+            <figure id="feature">
+                <div>
+                    <img src="{{ feature_image }}" alt="{{ feature_alt if feature_alt else "feature image for '" + title + "'" }}"/>
+                </div>
+                {% if feature_caption %}
+                    <figcaption>{{ feature_caption | md_inline | safe }}</figcaption>
+                {% endif %}
+            </figure>
             {% endif %}
             <div class="byline">
                 <time datetime="{{date | date_to_datetime }}">{{ date | date_formatted }}</time>