diff options
| -rw-r--r-- | sass/_partial/_post.scss | 7 | ||||
| -rw-r--r-- | templates/page.html | 24 |
2 files changed, 31 insertions, 0 deletions
diff --git a/sass/_partial/_post.scss b/sass/_partial/_post.scss index ed556af..3ce5ef9 100644 --- a/sass/_partial/_post.scss +++ b/sass/_partial/_post.scss @@ -74,6 +74,13 @@ box-sizing: content-box; width: 100%; } + .img-caption { + display: block; + text-align: center; + margin: 0.5em 0 1em 0; + font-size: 0.9em; + opacity: 0.8; + } .shk { margin: 1em 0; } diff --git a/templates/page.html b/templates/page.html index ec3116d..f795876 100644 --- a/templates/page.html +++ b/templates/page.html @@ -50,4 +50,28 @@ {% endif %} {% endblock %} </div> + +{% if page.extra.enable_img_caption %} +<script> + const images = document.querySelectorAll(".post-content img"); + images.forEach((img) => { + if (img.alt && img.alt.trim() !== "") { + const caption = document.createElement("div"); + caption.className = "img-caption"; + caption.textContent = img.alt; + + let insertionPoint = img; + if (img.parentElement.tagName === "A") { + insertionPoint = img.parentElement; + } + + insertionPoint.parentNode.insertBefore( + caption, + insertionPoint.nextSibling, + ); + } + }); +</script> +{% endif %} + {% endblock %} |