diff --git a/core/src/main/kotlin/eu/iamgio/quarkdown/rendering/html/QuarkdownHtmlNodeRenderer.kt b/core/src/main/kotlin/eu/iamgio/quarkdown/rendering/html/QuarkdownHtmlNodeRenderer.kt index 04501a10..f1a01d12 100644 --- a/core/src/main/kotlin/eu/iamgio/quarkdown/rendering/html/QuarkdownHtmlNodeRenderer.kt +++ b/core/src/main/kotlin/eu/iamgio/quarkdown/rendering/html/QuarkdownHtmlNodeRenderer.kt @@ -1,6 +1,7 @@ package eu.iamgio.quarkdown.rendering.html import eu.iamgio.quarkdown.ast.FunctionCallNode +import eu.iamgio.quarkdown.ast.Image import eu.iamgio.quarkdown.ast.Math import eu.iamgio.quarkdown.ast.MathSpan import eu.iamgio.quarkdown.ast.Node @@ -48,6 +49,18 @@ class QuarkdownHtmlNodeRenderer(context: Context) : BaseHtmlNodeRenderer(context // Quarkdown node rendering + // The Quarkdown flavor renders an image title as a figure caption, if present. + override fun visit(node: Image): String { + val imgTag = super.visit(node) + + return node.link.title?.let { title -> + buildTag("figure") { + +imgTag + +buildTag("figcaption", title) + } + } ?: imgTag + } + // The function was already expanded by previous stages: its output nodes are stored in its children. override fun visit(node: FunctionCallNode): CharSequence = node.children.joinToString(separator = "") { it.accept(this) } diff --git a/core/src/main/resources/render/html-wrapper.html b/core/src/main/resources/render/html-wrapper.html index ba4c952f..88e42aa3 100644 --- a/core/src/main/resources/render/html-wrapper.html +++ b/core/src/main/resources/render/html-wrapper.html @@ -42,6 +42,10 @@ width: 100%; } + figure { + text-align: center; + } + .align { width: 100%; display: flex; diff --git a/core/src/test/kotlin/eu/iamgio/quarkdown/HtmlNodeRendererTest.kt b/core/src/test/kotlin/eu/iamgio/quarkdown/HtmlNodeRendererTest.kt index 5d6c7972..3a37bbd1 100644 --- a/core/src/test/kotlin/eu/iamgio/quarkdown/HtmlNodeRendererTest.kt +++ b/core/src/test/kotlin/eu/iamgio/quarkdown/HtmlNodeRendererTest.kt @@ -42,6 +42,7 @@ import eu.iamgio.quarkdown.context.Context import eu.iamgio.quarkdown.context.MutableContext import eu.iamgio.quarkdown.document.page.cm import eu.iamgio.quarkdown.document.page.inch +import eu.iamgio.quarkdown.flavor.base.BaseMarkdownFlavor import eu.iamgio.quarkdown.flavor.quarkdown.QuarkdownFlavor import eu.iamgio.quarkdown.misc.Color import eu.iamgio.quarkdown.pipeline.PipelineOptions @@ -73,7 +74,7 @@ class HtmlNodeRendererTest { ) } - return QuarkdownFlavor.rendererFactory.html(context).nodeRenderer + return context.flavor.rendererFactory.html(context).nodeRenderer } private fun Node.render(context: Context = MutableContext(QuarkdownFlavor)) = this.accept(renderer(context)) @@ -162,6 +163,14 @@ class HtmlNodeRendererTest { height = null, ).render(), ) + assertEquals( + out.next(), + Image( + Link(label = listOf(), url = "/url", title = "Title"), + width = null, + height = null, + ).render(MutableContext(BaseMarkdownFlavor)), + ) // The figcaption appears only with the Quarkdown rendering! assertEquals( out.next(), Image( diff --git a/core/src/test/resources/rendering/inline/image.html b/core/src/test/resources/rendering/inline/image.html index ced37cdf..81aa692d 100644 --- a/core/src/test/resources/rendering/inline/image.html +++ b/core/src/test/resources/rendering/inline/image.html @@ -6,12 +6,36 @@ --- -Foo bar +
+ +
+ Title +
+
--- -Foo bar +
+ Foo bar +
+ Title +
+
--- -Foo bar \ No newline at end of file +
+ Foo bar +
+ Title +
+
+ +--- + +
+ Foo bar +
+ Title +
+
\ No newline at end of file diff --git a/core/src/test/resources/rendering/inline/refimage.html b/core/src/test/resources/rendering/inline/refimage.html index 8a2beb4a..d5960646 100644 --- a/core/src/test/resources/rendering/inline/refimage.html +++ b/core/src/test/resources/rendering/inline/refimage.html @@ -1,12 +1,27 @@ -Foo +
+ Foo +
+ Title +
+
--- -label +
+ label +
+ Title +
+
--- -label +
+ label +
+ Title +
+
---