- images are put in <figure> tags and title is added as caption.

Miguel Barão
1 parent 717aa0b3
Showing 1 changed file with 12 additions and 1 deletions Show diff stats
tools.py
@@ -102,7 +102,18 @@ class HighlightRenderer(mistune.Renderer):
     def image(self, src, title, alt):
         alt = mistune.escape(alt, quote=True)
         title = mistune.escape(title or '', quote=True)
-        return f'<img src="/file/{src}" class="img-fluid mx-auto d-block" alt="{alt}" title="{title}">'
+        if title:
+            caption = f'<figcaption class="figure-caption">{title}</figcaption>'
+        else:
+            caption = ''
+
+        return f'''
+            <figure class="figure">
+            <img src="/file/{src}" class="figure-img img-fluid rounded" alt="{alt}" title="{title}">
+            {caption}
+            </figure>
+            '''
+        # return f'<img src="/file/{src}" class="img-fluid mx-auto d-block" alt="{alt}" title="{title}">'
  
     # Pass math through unaltered - mathjax does the rendering in the browser
     def block_math(self, text):
...	...	@@ -102,7 +102,18 @@ class HighlightRenderer(mistune.Renderer):
102	102	def image(self, src, title, alt):
103	103	alt = mistune.escape(alt, quote=True)
104	104	title = mistune.escape(title or '', quote=True)
105		- return f'<img src="/file/{src}" class="img-fluid mx-auto d-block" alt="{alt}" title="{title}">'
	105	+ if title:
	106	+ caption = f'<figcaption class="figure-caption">{title}</figcaption>'
	107	+ else:
	108	+ caption = ''
	109	+
	110	+ return f'''
	111	+ <figure class="figure">
	112	+ <img src="/file/{src}" class="figure-img img-fluid rounded" alt="{alt}" title="{title}">
	113	+ {caption}
	114	+ </figure>
	115	+ '''
	116	+ # return f'<img src="/file/{src}" class="img-fluid mx-auto d-block" alt="{alt}" title="{title}">'
106	117
107	118	# Pass math through unaltered - mathjax does the rendering in the browser
108	119	def block_math(self, text):
...	...