From 0df39e5be1128b1ef11107254d42041c0f5dd0b9 Mon Sep 17 00:00:00 2001
From: =?utf8?q?Vladim=C3=ADr=20Vondru=C5=A1?= <mosra@centrum.cz>
Date: Wed, 1 Nov 2017 17:48:37 +0100
Subject: [PATCH] m.htmlsanity: figure legend shouldn't be wrapped in a <div>.

The <div> element is not allowed inside <figure> in the HTML5 standard.
---
 doc/css/components.rst          | 6 +++---
 doc/plugins/htmlsanity.rst      | 3 ++-
 pelican-plugins/m/htmlsanity.py | 8 ++++++++
 3 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/doc/css/components.rst b/doc/css/components.rst
index a948367a..1ddcd5db 100644
--- a/doc/css/components.rst
+++ b/doc/css/components.rst
@@ -521,7 +521,7 @@ Use the HTML5 :html:`<figure>` tag together with :css:`.m-figure` to style it.
 As with plain image, it's by default centered, slightly rounded and has a
 border around the caption and description. The caption is expected to be in the
 :html:`<figcaption>` element. The description is optional, but should be
-wrapped in some tag as well (for example a :html:`<div>`). The
+wrapped in some tag as well (for example a :html:`<span>`). The
 :css:`.m-fullwidth` class works here too and you can also wrap the
 :html:`<img>` element in an :html:`<a>` tag to make it clickable.
 
@@ -536,7 +536,7 @@ the border is distracting, apply the :css:`.m-flat` class to hide it.
         <figure class="m-figure">
           <img src="ship.jpg" alt="Ship" />
           <figcaption>A Ship</figcaption>
-          <div>Photo © <a href="http://blog.mosra.cz/">The Author</a></div>
+          <span>Photo © <a href="http://blog.mosra.cz/">The Author</a></span>
         </figure>
 
     .. raw:: html
@@ -544,7 +544,7 @@ the border is distracting, apply the :css:`.m-flat` class to hide it.
         <figure class="m-figure">
           <img src="{filename}/static/ship-small.jpg" alt="Ship" />
           <figcaption>A Ship</figcaption>
-          <div>Photo © <a href="http://blog.mosra.cz/">The Author</a></div>
+          <span>Photo © <a href="http://blog.mosra.cz/">The Author</a></span>
         </figure>
 
 `Image grid`_
diff --git a/doc/plugins/htmlsanity.rst b/doc/plugins/htmlsanity.rst
index a2fb2977..c6f6bad8 100644
--- a/doc/plugins/htmlsanity.rst
+++ b/doc/plugins/htmlsanity.rst
@@ -66,7 +66,8 @@ horrible, right?) with a custom HTML5 writer derived from
     specified otherwise
 -   Figures are using HTML5 :html:`<figure>` tag instead of
     :html:`<div class="figure">`, figure caption is using HTML5 :html:`<figcaption>`
-    instead of :html:`<p class="caption">`
+    instead of :html:`<p class="caption">` and figure legend is just a :html:`<span>`
+    as :html:`<div>` is not allowed inside :html:`<figure>`
 -   Drops *a lot of* useless classes from elements such as :html:`<div class="docutils">`
 -   Makes it possible to have :html:`<a>` elements with block contents (allowed
     in HTML5)
diff --git a/pelican-plugins/m/htmlsanity.py b/pelican-plugins/m/htmlsanity.py
index 6bf4f318..24dc5fb6 100644
--- a/pelican-plugins/m/htmlsanity.py
+++ b/pelican-plugins/m/htmlsanity.py
@@ -286,6 +286,14 @@ class SaneHtmlTranslator(HTMLTranslator):
         self.section_level -= 1
         self.body.append('</section>\n')
 
+    # Legend inside figure -- print as <span> (instead of <div class="legend">,
+    # as that's not valid inside HTML5 <figure> element)
+    def visit_legend(self, node):
+        self.body.append(self.starttag(node, 'span'))
+
+    def depart_legend(self, node):
+        self.body.append('</span>\n')
+
     # Literal -- print as <code> (instead of some <span>)
     def visit_literal(self, node):
         self.body.append(self.starttag(node, 'code', ''))
-- 
2.30.2