generators/hugo/layouts/_markup/render-image: Deprecate image shortcodes

Add render image hook and carefully slip figures into content.
Image shortcodes can now be replaced with markdown and eventually
removed.

3 files changed, 27 insertions, 7 deletions

diff --git a/generators/hugo/themes/tdro/layouts/_default/_markup/render-image.html b/generators/hugo/themes/tdro/layouts/_default/_markup/render-image.html
new file mode 100644
index 0000000..b5deec5
--- /dev/null
+++ b/generators/hugo/themes/tdro/layouts/_default/_markup/render-image.html
@@ -0,0 +1,18 @@
+{{ $imageFile := print "public" (.Destination | safeURL) }}
+{{ $image := imageConfig $imageFile }}
+{{- /* This comment removes trailing newlines. */ -}}
+<figure>
+  <a href="{{ .Destination | safeURL }}" onclick="return false;">
+    <img data-image-zoom
+      src="{{ .Destination | safeURL }}"
+      alt="{{ $.Text }}"
+      title="{{ $.Text }}"
+      width="{{ $image.Width }}"
+      height="{{ $image.Height }}"
+    />
+  </a>
+  <figcaption class="has-text-centered has-text-grey-dark">
+    {{ $.Title | markdownify }}
+  </figcaption>
+</figure>
+{{- /* This comment removes trailing newlines. */ -}}
diff --git a/generators/hugo/themes/tdro/layouts/_default/single.html b/generators/hugo/themes/tdro/layouts/_default/single.html
index 572b90a..df33970 100644
--- a/generators/hugo/themes/tdro/layouts/_default/single.html
+++ b/generators/hugo/themes/tdro/layouts/_default/single.html
@@ -21,7 +21,14 @@
 
           {{- partial "page-status.html" . -}}
 
-          {{- .Content | replaceRE "<p>" "<p class=\"serif is-size-serif\">" | replaceRE "<h2" "<h2 class=\"serif\"" | replaceRE "<h3" "<h3 class=\"serif\"" | safeHTML }}
+          {{- .Content |
+            replaceRE "<p>\n<figure>" "<figure>" |
+            replaceRE "</figure></p>" "</figure>" |
+            replaceRE "<p>" "<p class=\"serif is-size-serif\">" |
+            replaceRE "<h2" "<h2 class=\"serif\"" |
+            replaceRE "<h3" "<h3 class=\"serif\"" |
+            safeHTML
+          -}}
         </article>
       </div>
     </div>
diff --git a/public/css/tdro.css b/public/css/tdro.css
index a0c2753..9df79df 100644
--- a/public/css/tdro.css
+++ b/public/css/tdro.css
@@ -505,11 +505,6 @@ ul {
   text-align: center;
 }
 
-.content figure a {
-  display: inline-block;
-  width: 100%;
-}
-
 .content sup,
 .content sub {
   font-size: 75%;
@@ -1425,7 +1420,7 @@ ol li:before {
   position: absolute;
 }
 
-figure a,
+figure > a,
 .navbar-item,
 .webring a,
 .article__more__content a,