inventory-hugo-theme
inventory-hugo-theme copied to clipboard
Admonitions appearance breaks when code blocks are included
Summary
If a theme admonition includes a fenced code block, it breaks the admonition into two containers and the fenced code block appears to sit outside of both containers. This is a negative user experience and can challenge the meaning of content as written.
How to reproduce?
Markdown
See syntax. See example page. See example page source file.
Asciidoc
See syntax. May use different CSS classes than Markdown and both markup languages should be tested.
Expected behavior
Admonition should keep the same appearance as the example page.
Actual behavior
- Keep to one container with the admonition render. Now, it appears the containers are split into two: one with the admonition type (e.g. "Tip") and one with the admonition body.
- A fenced code block seems to exist outside of the admonition instead of connected to the inside of the admonition container. This is confusing UX about whethewr the code block is part of the admonition or part of the article.
Screenshots: